A Hello World tutorial

Output “Hello World!” to your Freeway page

Actions are text files that contain a mixture of XML and JavaScript. The only tool for the job (other than Freeway Pro) is a good text editor, we recommend using one of the following:

Note, TextEdit can do the job too but you must make sure you are working in plain text mode. To convert a TextEdit document to plain text press Command-Shift-t.

To create an Action that outputs the text “Hello world!” in an item, do the following:

Create a new text document in your chosen text editor. Define the type of Action you want (a standalone Action in this case) by typing the following on the page:

<action>
</action>

All the Action code will be placed inside this element but first we need to give the Action a unique name and a title:

<action name="helloWorld" title="Hello World!">

Think of the name like a backwards web address. It’s used internally by Freeway and each Action must have a unique name. It should start with com, followed by a period, then your company name (or just your name), then another period, then the rest is up to you. At Softpress we use the following scheme, changing helloWorld with the name of the Action:

name="com.softpress.actions.helloWorld"

Save the file in the following location with the filename helloWorld.fwaction:

Home/Library/Application Support/Freeway 5/Actions/

Open Freeway, if it isn’t open already, and create a new document. Go to the Insert menu and then to Action Item, near the bottom of the list you should see your Hello World! Action. It won’t do anything yet but select to add the Action to the page. Let’s add something to the page then!

Add content using Actions is done using JavaScript, this tutorial isn’t going to teach you any JavaScript, so we recommend learning more about it at w3schools. Add the following to your Action:

<action name="helloWorld" title="Hello World!">
    <action-javascript>
        function fwBeforeEndBody()
        {
        }
    </action-javascript>
</action>

The element sets the Action up so you can use plain JavaScript, rather than the XML based syntax we’ve been using so far, inside this is a function that is run when Freeway gets to the point of creating the closing body tag of the page.

The Action has access to all the elements that have been created in the page so far (up until the point just before the closing body tag is created). To place our text inside the item the Action is applied to, we need to find the item in the tag tree. Add the following:

<action name="helloWorld" title="Hello World!">
    <action-javascript>
        function fwBeforeEndBody()
        {
            var ourItem = fwDocument.fwTags.fwFind("", fwItem);
            var pTag = ourItem.fwAdd("p", true);
            pTag.fwAddRaw("Hello World!");
        }
    </action-javascript>
</action>

The code above finds the item the Action is applied to and stores it in the ourItem variable. To do this it uses the fwFind(tag[,item]) function to look for the first occurrence of a tag inside the fwItem (which is the code for the item the Action is applied to).

Once found we generate a new paragraph tag by using the fwAdd(tag[,closingTag]) function and store it in the variable pTag. This text “Hello World!” is then added as raw text to the tag by using the fwAddRaw(string) function.


Register or log in to view or add comments.

FreewayTalk

Join the friendliest community on the Net at FreewayTalk. Ask and answer questions about Softpress Freeway, or just gather around the virtual water cooler!