Add JavaFX to Web Pages with Applets - JavaFX: Developing Rich Internet Applications - page 254

to the JavaFX applet would be with that code, as in "document.myApplet" . The
HTML for this is shown in Listing 9.12.

Listing 9.12 HTML - Define Applet “id”

<script>
javafx(
{
codebase: "./dist",
archive: "NasaImageBrowser.jar",
draggable: true,
width: 500,
height: 500,
name: "app",
id: "app",
title: "Nasa Image Browser - JavaScript - JavaFX"
}, {
isApplet: "true"
} );
</script>

Next, we will define a JavaScript function, setIndex() , to set the current index
from the currentIndex <input> field that we previously defined in the HTML
page. This function calls a script function on the JavaFX applet, passing in the
value taken from the currentIndex <input> field. The JavaFX function then takes
this value and sets the current index, and the display updates. The public script
variables and functions are then accessed using the script keyword "document
.app.script" . The JavaScript code for this is in Listing 9.13.

Listing 9.13 HTML - JavaScript

<script>
function setIndex () {
document.app.script.setCurrentPic (
document.Form1.currentIndex.value);
}
</script>

The JavaFX code for the setCurrentPic function is in Listing 9.14. Notice that
it is necessary to use the javafx.lang.FX.defAction() function. This makes sure
that the changes to the JavaFX classes are done on the JavaFX Main processing
thread. Without this, you can expect erratic behavior and possibly exceptions.