RSS Viewer - JavaFX to JavaScript Communication

By Rakesh Menon, December 8, 2008

This sample demonstrates how to implement JavaFX to JavaScript communication using LiveConnect Support.
The RSS feed specified in the textfield of this RSSViewer is parsed using JavaFX WebService APIs, and displayed on a browser. Yahoo! News RSS feed are parsed using JavaFX Webservice API, and displayed in the textfiled of the RSSViewer. The RSSViewer is a list displaying news feed items, including a news title, time and date. The RSSViewer can navigate the different news feeds with the forward and back button at the bottom. Upon clicking each news item on the RSSViewer, the detail news content is displayed on the default desktop browser. The interaction from JavaFX will trigger to open a browser window, and the HTML content of selected news feed is rendered on the browser.
The RSSViewer can be customized to view any RSS feeds by specifying a new RSS feed URL and click on RSS item to load the detail feed on the browser.

Understanding the Code

RSS feed specified in textfield is parsed by JavaFX WebService parser.
The parsed RSS feed is set back to HTML by invoking updateChannelData(channelData) and this function calls JavaScript method, and updates the content of HTML page.

Source Code
    
    function updateChannelData(channelData) {
        document.getElementById("ChannelData").innerHTML = channelData;
    }
    
    <div id="ChannelData" style="text-align: center;"></div>
    

Next and previous items in channel is set by invoking updateChannelData(channelData) with new set of data.

Below code shows how to invoke JavaScript method from JavaFX. JavaScript object is created from the JavaFX Applet using "netscape.javascript.JSObject" object. The content from the RSS feed are read in and parsed using JavaFX Webservice API, and passed to the JavaScript object and rendered by the browser window.

Source Code
 
    // Get the Applet instance
    var applet: Applet = FX.getArgument("javafx.applet") as Applet;
    
    // Get JSObject instance
    var window = netscape.javascript.JSObject.getWindow(applet);
    
    // Invoke JSObject.call function passing the table data as argument
    window.call("updateChannelData", ["{tableData}"]);
    

References