sofTV.net Trigger Descriptions
Overview
Trigger Sources
Referencing Regions
Trigger Commands
Custom Triggers
Overview
Every web page built with sofTV.Author can handle sofTV.net trigger commands. Trigger Commands greatly enhance the dynamic nature of the web page.
For example, triggers can be used to:
- Show or Hide a sofTV region
- Change the content in a video, text, or graphic region on screen
- Seek to a specified time in a video clip
- Seek to a specified anchor tag, or piece of text in a text region
- Open a new browser window
- Cause a sofTV Region to move around on screen, or resize
- Run a user-provided JavaScript function
Some real-life examples of what you can accomplish are:
- Show a player's statistics, and picture on the web page whenever he scores,
- Show product information in sync with the video content. Allow users to purchase the clothing actors are wearing in the video,
- Create buttons on screen that allow you to jump to specific stories within an HTML file with many news stories,
- Allow users to enter search text in a box on screen, then search for the text in an HTML file,
- Pop up an advertisement in a banner ad in sync with an ad in the video stream,
- Show PowerPoint slides in sync with the video of the CEO doing an annual report,
- Allow a user to select from a number of video clips on a web page,
- Open a browser with a purchase form when a user elects to make a purchase,
Trigger Sources
Top
Trigger commands are generally embedded within the video stream, but can actually come from a number of sources.
- Microsoft or Real streaming video - Commands can be embedded in the video stream using sofTV.TriggerMaker & sofTV.LiveShow or sofTV.LiveSync, in the case of live video, or using sofTV.Playlist, in the case of pre-recorded video.
- sofTV.Author Graphics regions - on click, on mouse-enter, on mouse-exit - commands can be attached to a graphic element in a sofTV web page using the "User Commands" tab of the Graphic Region Properties. You can specify one or more commands to be executed on the web page when a graphic is clicked, for instance.
- Javascript calls attached to any web page item - It is very easy to call sofTV trigger commands from within JavaScript on the web page. If you have some simple programming ability, you can attach trigger commands to any item on the web page, or even create sofTV triggers from within Flash.
- Trigger Commands embedded in the text displayed in a sofTV.net text region - sofTV.Author allows you to create text regions on a web page, and control how content is displayed in these regions. You can embed sofTV commands within the text displayed in a text region, allowing you to have the text area control other regions of the web page. For example, if you had a text item that contained news stories, you could have a graphic area change to match the current news story.
- Time of Day Schedules on a web page - Web pages created using sofTV.Author can run Time-Of-Day schedules. The schedule file is an XML file that can define any number of schedules. Each schedule item can fire off one or more sofTV trigger commands at the specified time. For more information about scheduling, check out these notes.
To help you create triggers with the appropriate syntax, you can use our TriggerBuilder web page. This web page allows you to specify all the parameters for a sofTV trigger, then generate the HTML or JavaScript code required to embed the trigger in a web page. Of course, this is done automatically when using sofTV.Author or sofTV.Playlist.
Top
Referencing Regions
Region refers to the name given to an area on the page created by sofTV.Author. For example, the default name for a text region is "Text". To refer to that region in a script command you would supply the value of "Text" to the region parameter.
When refering to a region in a script command you may also use what is called a wild card. The wild card is denoted by the "*" character. When a wild card is used the script command will attempt to find all regions whose names match that wild card.
For example:
| Region Value |
Affected Regions |
| * |
Every region on the page. |
| Graphic* |
Every region whose name started with "Graphic". This includes "Graphic1", "GraphicBox" and "Graphic". |
| *Text |
Every region that ended with "Text". This includes "VideoText" and "Text". |
| A*X |
Every region that beings with "A" and ends with "X". This includes "ApeX" and "AX". |
Top
Trigger Commands
Table of contents
| Name |
Parameters |
Description |
Applies To |
| sofTV_ChangeSrc |
Region, URL, Frame |
Changes the document displayed in a region. |
Text, Video, Image, Frame, Window |
| sofTV_ChangeTxt |
Region, Text |
Changes the text displayed in a text region. |
Text, Static Text |
| sofTV_Hide |
Region |
Causes a region to become invisible. |
All regions |
| sofTV_Show |
Region |
Causes a previously hidden region to become visible. |
All regions |
| sofTV_Move |
Region, X, Y, Time |
Moves a region to a new position on the page. |
All regions |
| sofTV_Resize |
Region, Width, Height, Time |
Changes the dimensions of a reigon. |
All regions |
| sofTV_Restore |
Region |
Restores a region to its original size and dimensions. |
All regions |
| sofTV_Play |
Region |
Starts playing a video. |
Video |
| sofTV_Stop |
Region |
Stops a video that is currently playing. |
Video |
| sofTV_Seek |
Region, Seconds Text Anchor |
Seeks to a specific position in a video or a text region. |
Video, Text |
| sofTV_Rewind |
Region |
Moves to the previous video in the play list. |
Video |
| sofTV_Forward |
Region |
Moves to the next video in the play list. |
Video |
| sofTV_PageFlip |
URL, Target, Features |
Changes the contents of a frame or window. |
Page |
| sofTV_SchStart |
Schedule, Time |
Starts a schedule. |
Schedule |
| sofTV_SchStop |
Schedule |
Stops a schedule. |
Schedule |
| sofTV_SchGoto |
Schedule, Time |
Changes position in a schedule. |
Schedule |
| sofTV_ChangeSlide |
Slide |
Changes the slide to display in a slide show. |
Slide show |
| sofTV_NextSlide |
none |
Goes to the next slide in a slide show. |
Slide show |
| sofTV_PrevSlide |
none |
Goes to the previous slide in a slide show. |
Slide show |
| sofTV_SetSlideThumbnail |
Region |
Sets the name of the region to act as the frame around thumbnails in a slide show. |
Slide show |
| sofTV_SetSlide |
Region |
Sets the name of the region to display the current slide in. |
Slide show |
| sofTV_Script |
Script |
Executes JavaScript. |
Page |
Top
sofTV_ChangeSrc
Description, Parameters, Examples
Description
Changes the document that is to be displayed in a region. A small restriction for video is that you may only change to a document the player is capable of displaying. It can also change the contents of a frame by name. If the frame doesn't exist a new window is opened displaying the document in the URL parameter.
Parameters
| Parameter |
Description |
| Region |
The name of the region to change the source file of. |
| URL |
The url of the document to change to. |
| Frame |
The frame to change the source file of. |
Examples:
Example 1: Changing an image region
| Region: |
Graphic |
| URL: |
Highlight.jpg |
JavaScript: sendMessage( null, new sofTV_net_message( "sofTV_ChangeSrc", "Region", "Graphic", "URL", "Highlight.jpg") );
This would cause the image region named "Graphic" to display the image "Highlight.jpg".
|
Example 2: Changing a text region
| Region: |
News |
| URL: |
Stories.htm |
This would cause the text region named "News" to display the HTML document "Stories.htm".
|
Example 3: Changing a frame
| Frame: |
BottomFeeder |
| URL: |
HelloWorld.html |
This would cause the frame named "BottomFeeder" to display the HTML document "HelloWorld.html".
|
Top
Table of contents
sofTV_ChangeTxt
Description, Parameters, Examples
Description
Changes the text displayed in a text region.
Parameters
| Parameter |
Description |
| Region |
The name of the text region to change the contents of. |
| Text |
The text to be displayed in the region. This can be HTML code. |
Examples
Example 1: Displaying an important message
| Region: |
NewsFlash |
| Text: |
Dog killed in car accident. |
JavaScript: sendMessage( null, new sofTV_net_message( "sofTV_ChangeTxt", "Region", "NewsFlash", "Text", "Dog killed in car accident." ) );
This would cause the region named quot;NewsFlash" to display the text "Dog killed in car accident.".
|
Example 2: Some HTML
| Region: |
NewsFlash |
| Text: |
Dog killed in car <A HREF="FullStory.html" TARGET="Contents">accident.</A> |
This would cause the region named quot;NewsFlash" to display the text "Dog killed in car accident." with a hyperlink to the full story.
|
Table of contents
sofTV_Hide
Description, Parameters, Examples
Description
Causes a visible region to become invisible.
Parameters
| Parameter |
Description |
| Region |
The name of the region to make invisible. |
Top
Examples
| Example 1: Hiding a text region
JavaScript: sendMessage( null, new sofTV_net_message( "sofTV_Hide", "Region", "Text" ) );
This would cause the region named "Text" to become invisible.
|
Table of contents
sofTV_Show
Description, Parameters, Examples
Description
Causes a hidden region to become visible.
Parameters
| Parameter |
Description |
| Region |
The name of the region to make visible. |
Examples
| Example 1: Showing an image region
JavaScript: sendMessage( null, new sofTV_net_message( "sofTV_Show", "Region", "Graphic" ) );
This would cause the region named "Graphic" to become visible.
|
Table of contents
sofTV_Move
Description, Parameters, Examples
Description
Moves a region from one position on the page to another. This command can also have a time parameter that indicates the region is to move linearly to its new position in that many milliseconds. This can be used to create the effect of animation when moving a region.
NOTE: Move currently does not work for Windows Media Player video regions.
Top
Parameters
| Parameter |
Description |
| Region |
The name of the region to change the source file of. |
| X |
The horizontal coordinate relative to the left of the page to move to in pixels. |
| Y |
The vertical coordinate relative to the top of the page to move to in pixels. |
| Time |
Optional parameter to animate the position change over a number of milliseconds. |
Examples
Example 1: Moving a region to a new position on the page
| Region: |
Graphic |
| X: |
100 |
| Y: |
20 |
This would cause the region named "Graphic" to move from its current position to (100, 20) immediately.
|
Example 2: Creating animation by moving a region
| Region: |
Graphic |
| X: |
100 |
| Y: |
20 |
| Time: |
5000 |
This would cause the region named "Graphic" to move from its current position to (100, 20) in a linear fashion in 5 seconds.
|
Table of contents
sofTV_Resize
Description, Parameters, Examples
Description
Changes the dimensions of a region in pixels. The time parameter can be used to create animation much like the time parameter in sofTV_Move.
NOTE: Resize does not work in Netscape. The layer does get resized but it does not re-paginate itself.
Top
Parameters
| Parameter |
Description |
| Region |
The name of the region to change the dimensions of. |
| Width |
The new width of the region in pixels. Must be a positive number. |
| Height |
The new height of the region in pixels. Must be a positive number. |
| Time |
The time in milliseconds to animate the change of dimension. |
Examples
Example 1: Resizing a region
| Region: |
Graphic |
| Width: |
320 |
| Height: |
240 |
This would cause the region named "Graphic" change from its original size to (320x240) immediately.
|
Example 2: Creating an animation by resizing
| Region: |
Graphic |
| Width: |
320 |
| Height: |
240 |
| Time: |
5000 |
This would cause the region named "Graphic" change from its original size to (320x240) linearly in 5 seconds.
|
Table of contents
sofTV_Restore
Description, Parameters, Examples
Description
Sets a region to its original size, position and visibility as it was when the page was loaded.
Top
Parameters
| Parameter |
Description |
| Region |
The name of the region to restore. |
Examples
| Example 1: Restoring a region
This will cause the region named Graphic to revert to its original position, size and visibility.
|
| Example 2: Restoring all regions
Using the wild card, this will restore all regions to thier original sizes, positions and visibility.
|
Table of contents
sofTV_Play
Description, Parameters, Examples
Description
Starts a video playing in a video region.
Parameters
| Parameter |
Description |
| Region |
The name of the video region to start playing. |
Examples
| Example 1: Playing a video
This would cause the region named "Video" to start playing the video stream associated to it.
|
Table of contents
sofTV_Stop
Description, Parameters, Examples
Description
Parameters
| Parameter |
Description |
| Region |
The name of the video region to stop playing. |
Top
Examples
| Example 1: Stopping a video
This would cause the region named "Video" to stop playing the video stream associated to it.
|
Table of contents
sofTV_Seek
Description, Parameters, Examples
Description
Seeks to a new position in the video. The video must be able to seek for this command to work. For example, a video streaming over HTTP will not be able to seek.
The "Seconds", "Text" and "Anchor" parameters are all mutually exclusive.
Parameters
| Parameter |
Description |
| Region |
The name of the video region to seek. |
| Seconds |
The number of seconds to seek to from the start of the video. |
| Text |
Text string to search for in a text region. |
| Anchor |
The anchor to change to in a text region. |
Examples
Example 1: Seeking in a video
| Region: |
Video |
| Seconds: |
10 |
This would cause the video region named "Video" to seek to 10 seconds from the start of the video.
|
Example 2: Seeking to text in a text region
| Region: |
News |
| Text: |
Today's Story |
This will search the text region named "News" and find the string Today's Story, if the string is found the text region is changed to that page. If it is not found, the text region remains unchanged.
|
Example 3: Seeking to an anchor in a text region
| Region: |
Report |
| Anchor: |
TableOfContents |
This will cause the text region "Report" to display the page on which the anchor TableOfContents is found ( e.g. <A NAME="TableOfContents"> ).
|
Table of contents
sofTV_Rewind
Description, Parameters, Examples
Description
Changes to the previous video in a play list. A video must be playing some form of play list such as SMIL or ASX file.
Parameters
| Parameter |
Description |
| Region |
The name of the video region to change to the previous clip of. |
Top
Examples
| Example 1: Going to the previous clip
This would cause the video region named "Video" to go to the previous clip in its play list.
|
Table of contents
sofTV_Forward
Description, Parameters, Examples
Description
Changes to the next video in a play list. A video must be playing some form of play list such as SMIL or ASX file.
Parameters
| Parameter |
Description |
| Region |
The name of the video region to change to the next clip of. |
Examples
| Example 1: Going to the next clip
This would cause the video region named "Video" to go to the next clip in its play list.
|
Table of contents
sofTV_PageFlip
Description, Parameters, Examples
Description
Page flip can be used to change the document displayed in the current browser, frame or new window.
Target refers to the target frame or window to change. If it is omitted, the current document is changed. If the target does not exist as a frame or window, a new window will be created with the feature if the parameter is specified. Sending multiple page flip commands with the same target will only cause the open window to change its document, it won't change any of the features including width, height, top and left.
Parameters
| Parameter |
Description |
| URL |
The URL of the document to set the frame or new window to. |
| Target |
The name of the window or frame to change. _blank creates a new window. The default (if this parameter is omitted) is to change the current window. |
| Features |
A string list of all the features to be associated with this new window.
| Feature |
Description |
| width |
Width of the new window in pixels. Minimum of 100 pixels. |
| height |
Height of the new window in pixels. Minimum of 100 pixels. |
| left |
The window's horizontal position from the left of the screen in pixels. |
| top |
The window's vertical position from the top of the screen in pixels. |
| location |
"yes" or "no" value that indicates that the location address bar is to be displayed in the new window. |
| menubar |
"yes" or "no" vlaue that indicates that the menubar is to be displayed in the new window. |
| resizable |
"yes" or "no" value that indicates that the window is to be able to change its dimensions. |
| scrollbars |
"yes" or "no" value that indicates that the scroll bars are to be visible on the new window. |
| status |
"yes" or "no" value that indicates that the status bar is to be visible on the new window. |
| toolbar |
"yes" or "no" value that indicates that the tool bar is to be visible on the new window. The tool bar includes buttons such as "stop" and "refresh". |
|
Top
Examples
Example 1: Opening a new window with a specific width and height
| URL: |
http://www.softv.net |
| Target: |
_blank |
| Features: |
width=320, height=240 |
This will open up a new browser window at http://www.softv.net which is 320x240 pixels in size.
|
| Example 2: Changing the contents of a frame
This will change the document displayed in the frame LowerFrame to http://www.softv.net.
|
| Example 3: Chaning the document currently being displayed
This will change the current browser to http://www.softv.net.
|
Table of contents
sofTV_SchStart
Description, Parameters, Examples
Description
Starts playing a registered schedule.
Parameters
| Parameter |
Description |
| Schedule |
The name of the schedule to start. |
| Time |
The time offset to start at in milliseconds. |
Examples
| Example 1: Starting a schedule
This will start playing the schedule named MySchedule.
|
Table of contents
sofTV_SchStop
Description, Parameters, Examples
Description
Stops a schedule from sending messages.
Parameters
| Parameter |
Description |
| Schedule |
The name of the schedule to stop playing. |
Examples
| Example 1: Stopping a schedule
This will stop playing the schedule named MySchedule.
|
Top
Table of contents
sofTV_SchGoto
Description, Parameters, Examples
Description
Changes the time position of a schedule that³s playing.
Parameters
| Parameter |
Description |
| Schedule |
The name of the schedule to change the time of. |
| Time |
The time to set the schedule to in milliseconds. |
Examples
Example 1: Changing the time in a schedule
| Schedule: |
MySchedule |
| Time: |
2000 |
This will set the schedule named MySchedule to start sending messages starting at 2000 milliseconds.
|
Table of contents
sofTV_ChangeSlide
Description, Parameters, Examples
Description
Changes the current slide. This cause the frame around the slide thumbnail to become visible and the CurrentSlide region to be set to the image of the slide specified. Sending a slide index that does not exist will cause the slide show to display the first slide.
Parameters
| Parameter |
Description |
| Slide |
One based slide number to change to. |
Examples
| Example 1: Changing the slide
This will change the slide show to display the second slide.
|
Table of contents
sofTV_NextSlide
Description
Description
Changes to the next slide in the slide show.
Table of contents
Top
sofTV_PrevSlide
Description
Description
Changes to the previous slide in the slide show.
Table of contents
sofTV_SetSlideThumbnail
Description, Parameters, Examples
Description
Sets the base name of the frame region. For example, a base name of "Frame" would include "Frame1", "Frame2" and so on.
Parameters
| Parameter |
Description |
| Region |
The base region name for all thumbnail frames. |
Examples
| Example 1: Setting the base thumbnail frame name
This will cause all slide changes to change thumbnail frames starting with the name Frame.
|
Table of contents
sofTV_SetSlide
Description, Parameters, Examples
Description
Sets the name of the image region to display the current slide in.
Parameters
| Parameter |
Description |
| Region |
The name of the image region used to display the current slide. |
Examples
| Example 1: Setting the slide image region in a slide show
This will cause all change slides to display in the region named CurrentSlide.
|
Top
Table of contents
sofTV_Script
Description, Parameters, Examples
Description
Executes JavaScript when the command is processed.
Parameters
| Parameter |
Description |
| Script |
The JavaScript to execute. |
Examples
Example 1: Executing script
| Script: |
alert('Hello World') |
This will cause an alert box to appear on te page with the text "Hello World" inside.
|
Table of contents
Custom Triggers
(Creating your own triggers)
The simplest way to create to create custom triggers is to use the sofTV_Script command. This built-in command sofTV command allows you to call any JavaScript function.
If you need more control, you can create your own sofTV trigger commands. These could be called by web page functions, but can't be embedded within a video stream.
The following information is intended for expert developers.
Basically, triggers are names associated with functions. When a trigger is fired on a page a call to "sendMessage" is made. "sendMessage" then takes the global message listener and tells it to handle that message. The global listener takes the name of the message (like "sofTV_ChangeSrc") and looks for it in a table of functions. If a function is associated with that message, it is called with the message parameters. Creating custom messages is simply a matter of creating that function and registering it with the global listener.
A handling function must take two parameters, an origin object and an array of parameters. The origin object is not currently in use, so don³t worry about it. The array of parameters however is important. Messages have parameter lists. A parameter list is a parameter name and value pair. This name and value pair is implemented using an array as a map. For example:
var arMyParameterList = new Array();
arMyParameterList[ "NAME" ] = "Dr.Who";
arMyParameterList[ "AGE" ] = 100;
This example creates a parameter list with two parameters, name and age. The following example shows how to extract these parameters:
// Given arMyParameterList from above
alert( "Hello:" + arMyParameterList[ "NAME" ] );
alert( "You are:" + arMyParameterList[ "AGE" ] );
These parameter lists work the same way the ones in sofTV.net do. For example, in sofTV_ChangeSrc, the parameter URL is extracted from the parameter array like this:
var sURL = arArgs[ "URL" ];
Any parameters you extract should be tested to see if they are null. If a parameter is null then it wasn³t specified when the message was sent.
Once you have extracted your parameters, you can write the code to do something. For example, the following message handler multiplies two numbers and displays the result with a provided label:
function custom_Multiply( objOrigin, arArgs )
{
// Extract parameters
var x = arArgs[ "X" ];
var y = arArgs[ "Y" ];
var sLabel = arArgs[ "LABEL" ];
// Validate parameters
if( x != null && y != null && sLabel != null )
{
// Calculate and display result
var product = x * y;
alert( sLabel + product );
}
}
Once you³ve created a message handler, you need to register it with the listener. Calling the function, "registerMessageHandler" does this. From the above example, the call would be:
registerMessageHandler("custom_Multiply", custom_Multiply );
The first parameter is the name to associate with your function and the second is the function itself. You should call this method somewhere in the global scope. Be sure to call it after the include file for "Messaging.js". So, now if a video has a "custom_Multiply" trigger it will call your message handler.
|