JavaScript Usage in the GoLive Environment
- JavaScript Objects in the GoLive Environment
- Scope of Variables and Functions
- Handling Events
- Sharing Data
- Delays and Timeouts
This chapter discusses JavaScript and ECMAScript/ExtendScript concepts and usage in GoLive, including:
- JavaScript Objects in the GoLive Environment
- Scope of Variables and Functions
- Handling Events
- Sharing Data
- Delays and Timeouts
JavaScript Objects in the GoLive Environment
GoLive provides access to data and objects in a way that JavaScript programmers will find familiar. Those new to JavaScript will discover that the GoLive environment usually provides multiple ways to access data and objects. This section describes various ways an extension’s JavaScript code can access data and objects in the GoLive environment.
Objects, elements, and properties
GoLive JavaScript objects can represent parts of a document, or GoLive components:
- When GoLive loads a markup document, it generates objects to represent the markup tree of a document. Collectively, the objects that represent portions of the markup document are known as markup objects. Markup objects can represent HTML markup elements (as defined by a tag and its attributes), and also comments, text blocks, and other types of markup such as entities or CDATA sections.
- When GoLive loads an extension definition file (that is, the Main.html file for your extension), it creates JavaScript objects to represent the GoLive components you define, such as windows, UI controls, and menu items. For example, a <jsxdialog> element in your extension definition results in a window Object (page 313).
There are various ways to obtain a reference to a JavaScript object, depending on the object’s type.
- You can retrieve most component objects by name from global properties, such as the menus and dialogs collections.
- Objects that represent HTML page content are available from the markup tree; you get the root object from the document Object (page 138) for the page (document.documentElement), and that object’s properties and methods allow you to navigate the tree.
- GoLive passes relevant objects as event-object property values to event-handling functions.
For information on retrieving a particular object, see that object’s description in the GoLive CS2 SDK Programmer’s Reference.
Accessing attribute values
The attributes of an element (whether it is a document markup element or an element in your extension definition) appear as the properties of the corresponding JavaScript object. For example, the name attribute of the element becomes the name property of the object. Access to JavaScript properties is case-sensitive; that is, the Thing attribute creates the Thing property, not the thing property. When writing JavaScript code, observe case accordingly.
JavaScript uses the symbol undefined to indicate a null state. When a property exists, but no value has been explicitly set, that property has a value of undefined. If a property has never been defined, its state (rather than its value) is undefined. To test whether a property exists in JavaScript, you must test the state (not the value), by checking whether the name has a defined type; for example:
// correct test if (typeof (myProperty) != undefined) // do something
Do not use the following test. This tests the property’s value, rather than its state, and results in a run-time error if the property does not exist:
// incorrect test if (myProperty != undefined) // if myProperty does not exist, an error occurs
When you must test a property’s value with a case-sensitive comparison, you can use the toLowerCase method of the JavaScript String object. For example, this tests an element object’s tagName property, disregarding the value’s case:
if (currElt.tagName.toLowerCase()) == (tagToGet.toLowerCase())
For element Objects (page 156), attributes are also represented by objects, which are themselves nodes in the markup tree. Use an element object’s getAttributeNode and setAttributeNode functions (page 157) to access the attribute object, rather than accessing the attribute directly by name, as a property of the element object. By using these methods, you avoid potential problems with referencing names that contain special characters, such as hyphens.
Naming objects and attributes
The value of an element’s name attribute must follow JavaScript naming conventions. If more than one element or object uses the same name, the results of name-based object retrieval are unpredictable, so you must take care to ensure that your names are unique. One way to do this is to use a unique prefix or postfix in all of your extension’s names. For example, the following element definitions begin the value of each element’s name attribute with the letters ADBE.
<jsxmenubar> // opens definition of all menus <jsxmenu name="Hello" title="Hello, GoLive!"> //Hello menu <jsxitem name="This" title="Do Something"> // menu item <jsxitem name="That" title="Do Something Else" > menu item </jsxmenu> // closes definition of Hello menu </jsxmenubar> // closes definition of all menus
When the SDK loads an extension containing these elements, it creates a menu object that appears in the JavaScript global menus collection. You can use the name to retrieve this menu from the collection:
var myMenu = menubar["ADBEHello"];
JavaScript object collections
The SDK makes commonly used objects available as the elements of array-like structures that all extensions can access. GoLive updates the contents of these structures dynamically as these objects are created and deleted.
The SDK implements many of these structures as collection Objects (page 72). This is like an array that provides access to its elements by name or index; however, collections are not actually arrays; not every collection provides numeric access to its elements, as an array object does.
Each of these global properties contains a collection object that GoLive updates dynamically:
Using the global object arrays
These examples use the menus array to illustrate how you retrieve objects from global arrays. These arraya provide access to all of the menus and menu items added to GoLive by extensions. Most of the arrays work the same way; exceptions are noted in the Programmer’s Reference, Part 2 of this book.
The following JavaScript defines a menu Sample, with one item, MyItem. The SDK creates a menu object named sample and a menuitem object named item1:
<jsxmenu name="sample" title="Sample" ...> <jsxitem name="item1" title="MyItem" ...> </jsxmenu>
The following retrieves the Sample menu from the menuCollection object in the menubar global variable, and stores the retrieved menu object in the sampleMenu variable:
var sampleMenu = menubar["sample"]
In this case, “Sample” is the title of the menu, as displayed to the user, while “sample” is the name of the menu object, which you use to access it programmatically.
The following retrieves the menu item by name from the collection in the items property the sample menu:
menubar["sample"].items["item1"]
Alternatively, you can retrieve the menu item directly, using its name as a property name of the sample menu:
menubar["sample"].item1
GoLive also makes each menu available as a JavaScript object in the global namespace. Thus, the following simple line of JavaScript retrieves the menu item from the sample menu.
sample.item1
Many collections can be accessed by numeric index as well as by name. For example, if item1 is the first menu item:
menubar["sample"].items[0] // 0-based index of first item
This is only reliable for the items, not for menus; because other extensions can also add menus, you cannot rely on the order. Some collections, like the controls collection, do not support numeric access at all. Most of the time, an object’s unique name property provides the most reliable way to retrieve it.
Comparing objects
To ascertain an object’s identity, you can compare the value of its name property to a known string, or you can compare object references directly. For example, you can test the name of a menu item in any of the following ways:
if (item.name == "item1") // compare object name to known string value if (item == menubar["sample"].items["item1"]) // compare objects if (item == sample.item1) // another object comparison example
Updating references to objects
GoLive generates objects to represent the markup tree of a document when it loads that document. It regenerates these objects if the document changes; this is know as reparsing the document. If you save a reference to an object that GoLive generated as the result of interpreting a markup tag, you must update that reference any time the document containing the tag changes. For details, see the full version of the Programmer’s Guide on the product CD.