Re: Loading a resource document from script

Cameron McCormack:
> Sorry, here's a more concrete example:

And another one that illustrates the same problem in a different
situation.  Let's say I want skinnable components, where skins are
defined by an element that responds to custom events (the actual
example I'm trying to get working).  Like this:

  <!-- myskins.svg -->
  <svg xmlns... version="1.2">

    <ex:skin id="mySkin">
      <handler ev:event="ex:skinning">
        var elt = evt.details.element;
        var st = elt.xblShadowTree;

        // if we're skinning a button...
        if (elt.localName == "button") {
          var state = evt.details.state;
          var r = st.getElementById("r");

          if (state == "normal") {
            // if the button is not highlighted, make it grey
            r.setAttributeNS(null, "fill", "#ccc");
          } else if (state == "highlight") {
            // if the button is highlighted, make it light grey
            r.setAttributeNS(null, "fill", "#eee");
          }
        }
      </handler>
    </ex:skin>
  </svg>

Let's say I defined a button component like this, getting its skin from
a URI with getURL/parseXML:

  <!-- buttons.svg -->
  <svg xmlns... version="1.2">

    <script>
      function dispatchSkinningEvent(e, st) {
        var evt = document.createEvent("CustomEvent");
        evt.initCustomEventNS(EXNS, "skinning", true, false,
                              { element: e,
                                state:   st });
        var skin = e.getUserData("skin");
        skin.dispatchEvent(evt);
      }
    </script>

    <xbl:xbl>
      <xbl:definition element="ex:button">
        <xbl:template>
          <rect id="r"/>
          <text/>
        </xbl:template>
        <xbl:handlerGroup>
          <handler ev:event="xbl:prebind">
            // get the URL and fragid
            var href = evt.target.getAttributeNS(null, "skin");
            var idx = href.indexOf("#");
            var url = href.substring(0, idx);
            var frag = href.substring(idx + 1);

            // get the referenced document
            var docFrag = getURLAndParseXML(href);

            // find the skin element
            var skinElt = findID(docFrag, frag);

            // dispatch an event to set the "normal" button appearance
            evt.target.setUserData("skin", skinElt, null);
            dispatchSkinningEvent(evt.target, "normal");
          </handler>
          <handler ev:event="mouseover">
            // highlight the button when mouseovering it
            dispatchSkinningEvent(evt.target, "highlight");
          </handler>
          <handler ev:event="mouseout">
            // unhighlight the button when mouseouting it
            dispatchSkinningEvent(evt.target, "normal");
          </handler>
        </xbl:handlerGroup>
      </xbl:definition>
    </xbl:xbl>

    <ex:button skin="skin.svg#mySkin" .../>
  </svg>

If I use getURL/parseXML to get the document containing the ex:skin
element, then it's not a real resource document, and as such isn't
"running".  This means my handler elements on it won't work.  If I could
load this document as a real resource document, I could write my
skinning ability in this way.

Thanks,

Cameron

-- 
  e-mail : cam (at) mcc.id.au    	icq : 26955922
     web : http://mcc.id.au/	        msn : cam-msn (at) aka.mcc.id.au
  office : +61399055779		     jabber : heycam (at) jabber.org

Received on Tuesday, 11 October 2005 04:30:39 UTC