Drawing a user interface based on preferences

Question

I want to use the built-in preference system for my xulrunner (Firefox) application. But I can't figure out how to easily drive the user interface based on preferences.

The user can specify a list of home pages, and each home page will show up in a different tab. Because the tabs are in the presentation layer, I'd like to create them using a template in the xul code. Is this possible?

I haven't seen a way to do this with xul templates. Is there an alternative templating system that would allow me to change the UI based on user preferences?

Answer 1

No, templating in XUL is not powerful enough, so you're stuck with writing JavaScript code that reads the preferences and opens the needed tabs.

Answer 2

XML.prototype.function::domNode = function domNode() {
    function addPrefix(prefix, name) {
     if (typeof(prefix) == "undefined" || prefix == null || prefix == "") {
      return name;
     } else {
      return prefix + ":" + name;
     }
    }

    function recurse(xml) {
     var domNode = document.createElementNS(xml.namespace().uri, addPrefix(xml.namespace().prefix, xml.localName()));

     for each (let attr in xml.@*::*) {
      let attrNode = document.createAttributeNS(attr.namespace().uri, addPrefix(attr.namespace().prefix, attr.localName()));
      attrNode.nodeValue = attr;
      domNode.setAttributeNode(attrNode);
     }
     if (xml.hasComplexContent()) {
      for each (let node in xml.*) {
       domNode.appendChild(recurse(node));
      }
     } else if (xml.hasSimpleContent()) {
      domNode.appendChild(document.createTextNode(xml));
     }
     return domNode;
    }

    return recurse(this);
};

var name = "example"
var xml = {name};

document.querySelector("#example-statusbar-panel").appendChild(xml.domNode());

works as a charm, there's some minor glitches with namespaces though.

You could always convert dom back to XML with

var str = serializer.serializeToString( xml.domNode() );