Javascript
From FHTML
Contents |
1 What's the same as html?
1.1 Supported APIS
Standard navigator, style, document and screen objects are supported. There are some omissions, which will be filled in before launch.
1.2 Using the event keyword to access properties of events
Use the event keyword to access properties of an event dispatched to a function:
<div onmousedown="doClick(event);" />
<script type=”text/javascript”>
//This will work
function doClick(event) {
trace(event.target);
}
//This will NOT work
function doClick(e) {
trace(e.target);
}
</script>
<script type=”text/javascript”>
//This will work
function doClick(event) {
trace(event.target);
}
//This will NOT work
function doClick(e) {
trace(e.target);
}
</script>
2 What's extra?
2.1 Compile scripts using the compiled attribute
- FluidHtml scripts are typically interpreted by a runtime interpreter. This interpreter is extremely fast, but code executed in this fashion will still run slightly slower than compiled AS3.
- For this reason, we allow you to compile your scripts if speed is of the essence.
- To compile a script, simply say
compiled="true":
<script type="text/javascript" compiled="true" >
function formatTime(seconds) {
var minutes;
seconds = Math.round(seconds);
minutes = Math.floor(seconds / 60);
minutes = (minutes >= 10) ? minutes : "0" + minutes;
seconds = Math.floor(seconds % 60);
seconds = (seconds >= 10) ? seconds : "0" + seconds;
return minutes + ":" + seconds;
}
<script>
function formatTime(seconds) {
var minutes;
seconds = Math.round(seconds);
minutes = Math.floor(seconds / 60);
minutes = (minutes >= 10) ? minutes : "0" + minutes;
seconds = Math.floor(seconds % 60);
seconds = (seconds >= 10) ? seconds : "0" + seconds;
return minutes + ":" + seconds;
}
<script>
- NOTE: FluidHtml animations always run at full AS3 speed.
2.2 Make scripts Fhtml-only using type="text/fhtml"
- FluidHtml uses javascript, but so does your browser, and all scripts are in the same page.
- The following script will be ignored by the browser but executed by Fhtml. Sometimes you want that!
<script type="text/fhtml" >
function myFunction(){
//do something!
}
</script>
function myFunction(){
//do something!
}
</script>
2.3 Execute scripts using fhtmlignore="false"
- If your script needs to be used by both the browser and fhtml (in different environments, for example), then use
type="text/javascript"and addfhtmlignore="false"to your script tag. - Of course, regular javascripts do not specify the
fhtmlignoreattribute. As a result, Fhtml will ignore them. This prevents Fhtml from ingesting and interpreting all kinds of boilerplate browser scripts.
<script type="text/javascript" fhtmlignore="false" >
function myFunction(){
if (window.isFHTML) controls.gotoAndStop('controls','hide');
else hideDiv(controls);
}
</script>
function myFunction(){
if (window.isFHTML) controls.gotoAndStop('controls','hide');
else hideDiv(controls);
}
</script>
This way you have complete control over what you expose to the browser and what you expose to FluidHtml.
2.4 Execute expressions conditionally using window.isFHTML
Use the window.isFHTML property to execute javascript conditionally in fhtml or the browser.
<script type="text/javascript">
function hideControls(){
if (window.isFHTML) controls.gotoAndStop('controls','hide');
else hideDiv(controls);
}
</script>
function hideControls(){
if (window.isFHTML) controls.gotoAndStop('controls','hide');
else hideDiv(controls);
}
</script>