The javascript action can be used to send messages to any javascript function:
<slickboard>
<!-- a button with an action that calls a javascrpt function -->
<object>
<rect x='200' y='80' width='80' height='20' fill_color='FF6600' shadow='default' state='hit' />
<text x='200' y='81' width='80' height='20' align_h='center'>Javascript</text>
<action>
<item type='javascript' call="my_function('Hello', 100)" />
</action>
</object>
<filter>
<shadow id='default' />
</filter>
</slickboard>
<HTML>
<!-- javascript in the web page -->
<SCRIPT LANGUAGE=JavaScript>
function my_function( var1, var2 ){
alert ("Argument 1: "+var1+". Argument 2: "+var2+".");
}
</script>
<BODY>
<!-- your board here -->
</BODY>
</HTML>
Done Loading
To alert javascript that the board or an individual object is done loading, set a timer that sends any message to any javascript function:
<slickboard>
<object>
<rect x='340' y='20' width='40' height='40' />
<action>
<!-- timer that sends javascript a message when the object is done loading -->
<item type='javascript' call="My_Function('done loading')" event='timer' delay='0' />
</action>
</object>
</slickboard>
Slider
To send the value of a slider (after it is released) to javascript, send a message to any function and use _slider_value_ as an argument to be replaced by the tool with an actual value between 0 and 1:
<slickboard>
<!-- slider background -->
<rect x='350' y='20' width='20' height='150' fill_color='555555' shadow='hole' />
<!-- blue circle -->
<object id='blue_circle'>
<circle x='100' y='75' radius='50' fill_color='8888ff' shadow='low' />
</object>
<!-- blue slider -->
<object>
<!-- slider handle -->
<rect x='340' y='20' width='40' height='40' fill_color='8888ff' shadow='low' state='hit' />
<!-- constrain the handle vertically -->
<constrain x='350' y='20' width='20' height='150' reflect='0' />
<action>
<!-- make the handle draggable -->
<item type='drag' />
<!-- adjust the alpha (transparency) of the blue circle when moving the slider -->
<item type='adjust_alpha' target='blue_circle' event='slider' />
<!-- send the slider value to the My_Slider javascript function -->
<!-- replace _slider_value_ with a slider's value (from 0 to 1) -->
<item type='javascript' call='My_Slider(_slider_value_)' event='drag_end' />
</action>
</object>
<filter>
<shadow id='low' distance='1' alpha='.5' blurX='5' blurY='5' />
<shadow id='hole' alpha='.5' blurX='10' blurY='10' inner='true' />
</filter>
</slickboard>
<HTML>
<!-- javascript in the web page -->
<SCRIPT LANGUAGE=JavaScript>
function My_Slider( slider_value ){
document.output.slider.value=slider_value;
}
</script>
<BODY>
<!-- your board here -->
</BODY>
</HTML>
|