webOS Templates for Full Scenes

You, too, can use the templating system for not just pieces of scenes, widgets, or dialogs. I decided to see if I could use #{variables} in my actual scene template. Unfortunately, pushScene() and swapScene() only allow you to specify the template file to use and do not give you the ability to specify an object or collection. If you have used the templating system, you know that without a way to specify an object or collection for the template to use, #{variables} do nothing.

Here is how to make it work with a single object.

  1. Create your scene's HTML in the usual way, but add some #{variables} you're interested in.
  2. When you push the scene, pass the object as an extra argument.
  3. In the scene's constructor, save a reference to the object.
  4. In the scene's activate method, call Mojo.View.render() with the object reference and the "template-style" path of the scene's HTML file. Update the contents of div id "#mojo-scene-[scene-name]" with the Mojo.View.render() output.

If you have widgets in the HTML, you have to set them up in the scene's activate method instead of setup. That means you also have to call instantiateChildWidgets() once they've been set up.