Class FWOutput

This is the super class of FWTag and FWAttribute used for creating output from Freeway. Raw output is stored as an FWAttribute.

Properties (4)

fwEnclosing

The tag or raw data that encloses this attribute. FWAttribute

fwFirst

The first item that this tag contains. String

fwLast

The last item that this tag contains. String

fwRoot

The root or the tag that ultimately encloses everything, the same as fwDocument.fwTags

Methods (17)

fwAdd(name/htmltag[,after][,hasClose])

This method will add a new tag if you pass in a string with the name of the new tag that you want to add.

Arguments:
* name/htmltag: the name of a new tag or an existing tag
* after: the tag after which it should be added
* hasClose: sets this to true if you want the tag to be closed

Example 1:
This example will add a <p></p> after the first image tag and give it contents of the image “srce”.

<page-action name="Label First Image"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
// Find the first img tag 
var firstImg = fwDocument.fwTags.fwFind("img"); 
var enclosing = firstImg.fwEnclosing; 
// add a <p> tag after the <img> tag 
var para = enclosing.fwAdd("p", firstImg, true); 
// and give the paragraph tag raw data of the image path 
para.fwAddRaw(firstImg.src.toString()); 
} 
</action-javascript> 
</page-action> 

fwAddEnclosing(tagType/content[,hasClose])->FWTag

This method adds an enclosing tag around an existing tag content either a tag or raw code. FWTag

Arguments:
* tagType/content: Either the name of a new tag to be created or an existing tag. FWTag or raw code
* hasClose: This specifies if the tag should have it’s close attribute set. Boolean

Example:
This code finds the first <img> tag on the page and adds an enclosing link tag to it. It passes true as it wants the tag to be closed i.e. a </a> to be written as well.

<page-action name="Add Dummy Link"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
// Find the first <img> tag 
var firstImg = fwDocument.fwTags.fwFind("img"); 
// add a link to it 
var linkTag = firstImg.fwAddEnclosing("a", true); 
// set the href 
linkTag.href='"#"'; 
} 
</action-javascript> 
</page-action> 

In this example the first <img> will be enclosed in a <a> tag so that it will change from <img src= ... > to <a href="#"><img src= ... ></a>

fwAddJavaScript([,after tag][string])

This is used to add JavaScript to the HTML output. You optionally specify the script name and version and Freeway will return a <script> tag. Freeway will look for a tag of the sort you request. If it finds one it will return that. If it does not it will create one. This method is very useful for adding JavaScript to a block of code. In addition to creating the tag Freeway will correctly enclose it in the correct hiding mechanism to prevent early browsers that do not understand JavaScript from having problems. It returns a <script> tag.

Arguments:
* after tag: the tag to add this after. FWTag
* string: the name of the script tag to add. String

Example:
The function below will add a piece of JavaScript stored in “action-markup” if not there:

// This appends a piece of JavaScript stored in /action-markup/ to 
a specific tag 
// This appends a piece of JavaScript stored in /action-markup/ 
to a specific tag 
function AppendJavaScript(tag, markup) 
{ 
    // Append a piece of markup if it is not already defined 
    if (!fwPage[markup]) 
    { 
        var headTag = fwDocument.fwTags.fwFind(tag); 
        if (headTag) 
        { 
            var javascript = headTag.fwAddJavaScript(); 
            javascript.fwAddRawOpt(fwMarkups[markup]); 
            fwPage[markup] = true; 
        } 
    } 
} 

fwAddRaw([text1][,after][,text2])

This returns the FWAttribute that has been created to hold the raw data.

Arguments:
* text1: If there is no text2 then this is the raw value. If there is a text2 then this denotes the name of the raw text added.
* after: This is the content object that it should be placed after. If there is no content object then it will be appended.
* text2: This is the value of the object.

Example: 1:
This will append the text “Test” as raw data after the last tag within the body.

function fwAfterEndBody() 
{ 
    var body = fwDocument.fwTags.fwFind("body"); 
    body.fwAddRaw("Test"); 
} 

Example: 2:
This action will append the text “Test” as raw data after the head tag within the HTML.

function fwAfterEndBody() 
{ 
    var html = fwDocument.fwTags.fwFind("html"); 
    var head = fwDocument.fwTags.fwFind("head"); 
    html.fwAddRaw("Test", head); 
} 

fwAddRawln[text1][,after][,text2])

As fwAddRaw but adds a carriage return.

fwAddRawOpt([text1][,after][,text2])

As fwAddRaw but adds a carriage return at the end if more readable code is set in the preferences.

fwDelete

This will delete a tag so that it will not be included in the output.

Example:
This will delete the first image on the page.

<page-action name="Delete First Image"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
// Find the first img tag 
var firstImg = fwDocument.fwTags.fwFind("img"); 
// Delete it 
firstImg.fwDelete(); 
} 
</action-javascript> 
</page-action> 

Note: Deleting this image will simply remove it from the page. The table structure, or layer that this image would have appeared in will be preserved.

fwFind([owner][after tag][type [,name [,value]]])

This method allows you to find the first occurrence of a tag that satisfies a particular criteria. It returns the tag found or null.

Arguments:
* ownerfind: a tag that was owned (created) by this element FWElement
* aftertag: find a tag after this one. FWTag
* name: find a tag with an attribute of this name
* value: find a tag that has an attribute of this valuetypename of tag (eg.”img”)

Example 1:
This finds the first <img> tag in the document

function fwAfterEndBody() 
{ 
    // find first tag 
    var firsttag = fwDocument.fwTags.fwFind("img"); 
    alert(firsttag); 
} 

Example 2:
This action finds the first <img> tag that belongs to the item onto which the Action is applied.

<item-action name="Find First Img"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
    // find first tag 
    var firsttag = fwDocument.fwTags.fwFind("img", fwItem); 
    alert(firsttag); 
} 
</action-javascript> 
</item-action> 

Example: 3:
This method will find the first <img> with a name attribute

function fwAfterEndBody() 
{ 
    // find first tag with a name parameter 
    var firsttag = fwDocument.fwTags.fwFind("img","name"); 
    alert(firsttag.name); 
} 

Example: 4:
This method will find the first <img> with a name attribute whose value is “foobar”.

function fwAfterEndBody() 
{ 
    // find first tag with a name parameter 
    var firsttag = fwDocument.fwTags.fwFind("img","name"); 
    alert(firsttag.name); 
} 

Example 5:
This method will find the first <img> with a name attribute.

function fwAfterEndBody() 
{ 
    // find first tag with a name parameter 
    var firsttag = fwDocument.fwTags.fwFind("img","name"); 
    alert(firsttag.name); 
} 

Example 6:
This method will count up all the <img> tags that appear in your document. After finding the first tag it passes the current tag to the fwFind method as the point to start the find from. This finds the first <img> tag in the document.

Note: It is more efficient to use fwFindAll for this sort of situation.

<page-action name="Find All Images"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
    // clear the counter 
    var totalImages = 0; 
    // find first <img> tag 
    var currentTag = fwDocument.fwTags.fwFind("img"); 
    while (currentTag) 
    { 
        totalImages++; 
        // find the next tag after the current tag 
        currentTag = fwDocument.fwTags.fwFind("img", currentTag); 
    } 
    alert("total <img> = ",totalImages); 
} 
</action-javascript> 
</page-action> 

fwFindAll([owner][after tag][type [,name [,value]]]

This method allows you to find all the tags that satisfy a particular criteria. If no tags are found then it will return an array with no elements. The array will contain all the tags found in the order in which they where found.

Arguments:
* owner: Finds a tag that was owned (created) by this element. FWElement
* after tag: Find a tag after this one. FWTag
* name: Find a tag with an attribute of this name. FWTag
* value: Find a tag that has an attribute with this value. FWTag

Example: 1:
This action will count up all the <img> tags that appear in your document by finding all the <img> tags

<page-action name="Find All Images"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
    // find all the <img> tags 
    var images = fwDocument.fwTags.fwFindAll("img"); 
    alert(images.length); 
} 
</action-javascript> 
</page-action> 

Example: 2:
This action will count all the <img> tags that belong to the item onto which the action is applied.

<item-action name="Find All Images"> 
<action-javascript> 
function fwAfterEndBody() 
{// find all the <img> tags that belong to this item 
    var images = fwDocument.fwTags.fwFindAll("img", 
    fwItem); 
    alert(images.length);
} 
</action-javascript> 
</item-action> 

fwFindAllContent([owner][after tag][type [,name [,value]]])

This method allows you to find all the tags that are contained within an FWOutput. It refers to an array of tags.

Example:
The following example will remove all the tags except for those that are within the <body></body>. This sort of technique can be useful for generating server-side includes and page fragments.

<page-action name="Body Contents"> 
<action-javascript> 
function fwBeforeEndHTML() 
{ 
    body = fwDocument.fwTags.fwFind("body"); 
    bodyContent = body.fwFindAllContent(); 
    html = fwDocument.fwTags.fwFind("html"); 
    html.fwDelete(); 
    fwDocument.fwTags.fwMove(bodyContent); 
} 
</action-javascript> 
</page-action> 

fwFindContent([owner][after tag][type [,name [,value]]])

This method allows you to Find the first occurrence of a tag that satisfies a particular criteria. It will only search within the tag’s contents and will not search hierarchically through the tag tree. It returns the tag found or null.

Arguments:
* owner: Finds a tag that was owned (created) by this element. FWElement
* after tag: Find a tag after this one. FWTag
* name: Find a tag with an attribute if name is FWTag. String
* value: Find a tag that has an attribute with this value. String

fwFindEnclosing(tag[,name[,value]])

This method is designed to find a tag that encloses a given tag. It returns FWTag – the tag that has been found or null if nothing has been found.

Arguments:
* tag: the tag to be found String
* name: look for a tag with this argument. string
* value: the argument has to have this value. String

Example:
The following action will look for an enclosing link <a> tag. If it does not find one it will add one. This sort of technique is useful when writing rollovers.

<page-action name="Find or Add Link"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
    // find first <img> 
    var firstImg = fwDocument.fwTags.fwFind("img"); 
    // find the link 
    var link = firstImg.fwFindEnclosing("a"); 
    // if there is no link then add one 
    if (!link) 
    { 
        link = firstImg.fwAddEnclosing("a"); 
        link.href='"#"'; 
    } 
} 
</action-javascript> 
</page-action> 

fwFindRaw([string][,after tag][,owner])

This will find raw text in the tags. All the arguments are optional. FWAttribute

If you do not specify a string then Freeway will return the first raw data that matches the other search criteria. If you specify an after tag Freeway will start looking after this tag. If you specify an owner then Freeway will only return a tag created by that particular owner. If nothing matching this criteria was found or no raw data was found it returns null.

Arguments:
* string: the text to be found.
* after tag: start looking after this tag FWTag
* owner: only find raw data with this owner FWElement

Example:
The following code appends the raw data “foobar” to the body tag. It then uses fwFindRow to search for the text “foobar” and displays what it finds in an alert.

<page-action name="foobar"> 
<action-javascript> 
function fwAfterEndBody() 
{ 
    // Find the first img tag 
    var body = fwDocument.fwTags.fwFind("body"); 
    // add the raw data "foobar" 
    body.fwAddRaw("foobar"); 
    // find it 
    var newRaw = body.fwFindRaw("foobar"); 
    // display an alert with it's value 
    alert(newRaw); 
} 
</action-javascript> 
</page-action> 

fwIndent()

This will increase the indent level if more readable code is specified in the preferences.

fwMove([htmlTag/tagArray][after tag])

This action is designed to remove the tags from a page that make it a frame-set so that you can more-easily view the NoFrames content (you do not have to set your browser preferences to check it). As the Action is doing something radical to your page it posts an alert warning you that something you probably don’t normally want to happen is going on. Generally you would never post an alert during the publishing process. The action also has a fwIsDirty method that will force the page to be republished, so that you will always get the warning. To remove the FrameSet tags the Action has to first remove the <frameset> tag. Then it has to remove the <noframes> tag. However before it removes the <noframes> tag it has to move <body> tag that is within it. It moves the body tag by calling fwMove, and passing in an existing tag (the body tag).

Example:

<page-action name="Preview NoFrames Page"> 
<action-javascript> 
function fwIsDirty() 
{ 
    return true; 
} 
function fwAfterEndBody() 
{ 
    alert('Your FrameSet has been deleted on page "',fwPage, 
    '" to allow you to preview the "','NoFrames', '" 
    content.'); 
    // find and delete the <frameset> tag 
    var getFrm = fwDocument.fwTags.fwFind("frameset"); 
    getFrm.fwDelete(); 
    // find the <body> tag 
    var getBdy = fwDocument.fwTags.fwFind("body"); 
    // find the <noframes> tag 
    var getNfm = fwDocument.fwTags.fwFind("noframes"); 
    // move the <body> so it is after the <noframes> tag 
    // and no longer enclosed by it 
    getNfm.fwEnclosing.fwMove(getBdy, getNfm); 
    // delete the noframes tag 
    getNfm.fwDelete(); 
} 
</action-javascript> 
</page-action> 

fwOutdent()

This will decrease the indent level if more readable code is specified in the preferences.

fwToHTML([efficientCode ][upperCase][newLineType])

This will convert a tag and it’s contents into a text string. This text string is the text that would be output when the tags are turned into HTML. This is particularly useful if you want to make some parts of the page generated byJavaScript within the page i.e. in the generated HTML page’s document.write.

Arguments:
* efficientCode: 0 = use document setting, readable = 1 , efficient = 2
* upperCase: 0 = use document setting, lowercase = 1, uppercase = 2
* newLineType: 0= use document setting, Macintosh = 1, UnixNewlines = 2, DOSNewlines = 3

Note: If you do not pass any arguments the document defaults will be used.

Example:
The following example will display the HTML of the item to which it is applied in an alert.

<item-action name="fwToHtml"> 
<action-javascript> 
function fwBeforeEndHTML() 
{ 
    ourTag = fwDocument.fwTags.fwFind(fwItem); 
    alert(ourTag.fwToHTML()); 
} 
</action-javascript> 
</item-action>

Register or log in to view or add comments.

FreewayCast

Learn by watching! Screencasts show you how to do it in Freeway. Visit FreewayCast today!