client/tags.xml
author Mark Hammond <mhammond@skippinet.com.au>
Fri, 20 Mar 2009 16:26:49 +1100
branchtwisty
changeset 110 20979788066de01860cf050a0d0c43498d640624
parent 25 71b48845ac495f2c72b99ae8d4e353269dbbaac0
permissions -rw-r--r--
get imap and twitter working in the new world order

<?xml version="1.0" encoding="UTF-8"?>
<xbl:xbl
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:xbl="http://www.w3.org/ns/xbl">

  <xbl:binding id="tags">
    <xbl:template>
      <span id="tags"/>
      <span id="addtags" class="addtags"> add tag</span>
      <form id="formative"><input id="tagname" name="tagname" value=""/></form>
    </xbl:template>
    <xbl:resources>
      <xbl:style><![CDATA[
:bound-element .addtags { font-size: small; color: #999; }

:bound-element[adding="false"] #formative { display: none; }
:bound-element[adding="true"] .addtags { display: none; }
:bound-element[adding="true"] #formative { display: inline; }

:bound-element #tags span {
  background-color: #cfc;
  font-size: small;
  margin: 2px;
  -moz-border-radius: 0.3em; padding: 0em 0.4em;
}
      ]]></xbl:style>
    </xbl:resources>
    <xbl:implementation><![CDATA[
      ({
        setMessage: function(aMessage) {
          this.message = aMessage;
                    
          if (this.message.tags) {
            for (var i = 0; i < this.message.tags.length; i++) {
              var tagname = this.message.tags[i];
              this.addDisplayTag(tagname);
            }
          }
          
          var addNode = this.shadowTree.getElementById("addtags");
          var formNode = this.shadowTree.getElementById("formative");
          var dis = this;
          $(addNode).click(function(event) {
            console.log("add tag clicked on!", event);
            dis.boundElement.setAttribute("adding", "true");
            event.stopPropagation();
            $(formNode.tagname).focus();
          });
          $(formNode).submit(function() {
          try {
            console.log("in submit logic...", formNode);
            console.log("you wanted to add...", formNode.tagname.value);
            var tagname = formNode.tagname.value;
            dis.message.addTag(tagname);
            dis.addDisplayTag(tagname);
            dis.boundElement.setAttribute("adding", "false");
          } catch (e) {console.log("EXCEPTION", e); }
            return false;
          });
        },
        addDisplayTag: function(aTagName) {
          var tagRoot = this.shadowTree.getElementById("tags");

          var tagNode = document.createElement("span");
          tagNode.textContent = aTagName;
          tagRoot.appendChild(tagNode);        
        },
        xblBindingAttached: function() {
          this.boundElement.setAttribute("adding", "false");
        }
      })
    ]]></xbl:implementation>
    <xbl:handlers>
      <xbl:handler event="click" phase="bubble" propagate="stop"><![CDATA[
        // do nothing, we just don't want our bloody clicks escaping.
      ]]></xbl:handler>
      <xbl:handler event="blur"><![CDATA[
        this.boundElement.setAttribute("adding", "false");
        this.shadowTree.getElementById("formative").tagname.value = "";
      ]]></xbl:handler>
    </xbl:handlers>
  </xbl:binding>

</xbl:xbl>