<?xml version="1.0"?>
<?xml-stylesheet href="cml.css" type="text/css"?>

<bindings xmlns="http://www.mozilla.org/xbl"
          xmlns:html="http://www.w3.org/1999/xhtml"
		  xmlns:svg="http://www.w3.org/2000/svg">

  <binding id="molecule" >
	<content>
      <svg:svg>
        <svg:g transform="translate(200,200) scale(25)" >
          <children/>
        </svg:g>
	  </svg:svg>
	</content>
	<implementation>
	  <property name="inner" readonly="true">
		<getter>
		  <![CDATA[
		  return document.getAnonymousNodes(this)[0];
		  ]]>
		</getter>
	  </property>
	</implementation>
  </binding>

  <binding id="atomArray" extends="svg:generic" >
    <content>
        <children/>
    </content>
  </binding>

  <binding id="bondArray" extends="svg:generic" >
    <content>
        <children/>
    </content>
  </binding>

  <binding id="atom" extends="svg:generic" inherits="id">
	<content>
      <svg:circle>
        <children/>
      </svg:circle>
	</content>
    
	<implementation>	 

      <!-- 'public' interface -->
	  <property name="x2" readonly="true">
		<getter>
		  <![CDATA[ 
		  return this.getChildByBuiltinAttr("x2").firstChild.nodeValue;
		  ]]>
		</getter>
	  </property>
	  <property name="y2" readonly="true">
		<getter>
		  <![CDATA[
		  return this.getChildByBuiltinAttr("y2").firstChild.nodeValue;
		  ]]>
		</getter>
	  </property>
	  <property name="elementType" readonly="true">
		<getter>
		  <![CDATA[
		  return this.getChildByBuiltinAttr("elementType").firstChild.nodeValue;
		  ]]>
		</getter>
	  </property>

      <!-- 'private' methods -->
	  <constructor>
		<![CDATA[
        this.inner.r.baseVal.value  = 0.3;
        this.inner.cx.baseVal.value = this.x2;
        this.inner.cy.baseVal.value = this.y2;

        var color = 'white';
        switch(this.elementType) {
          case 'C':
            color = 'red';
          break;
          case 'O': 
            color = 'blue';
          break;
          case 'S': 
            color = 'yellow';
          break;
          case 'N': 
            color = 'green';

          break;
          case 'Cl': 
            color = 'lightblue';
          break;
          case 'H': 
            color = 'purple';
            this.inner.r.baseVal.value = 0.2;
          break;
        }

        this.inner.setAttribute("style", "stroke:black; stroke-width:0.05; fill:"+color+";");
		]]>
	  </constructor>

      <property name="inner" readonly="true">
		<getter>
		  <![CDATA[
		  return document.getAnonymousNodes(this)[0];
		  ]]>
		</getter>
	  </property>
      <method name="getChildByBuiltinAttr">
        <parameter name="builtin"/>
        <body>
          <![CDATA[
          var children = this.getElementsByTagName("*");
          var count = children.length;
          for (var i = 0; i < count; ++i) {
            if (children[i].getAttribute("builtin") == builtin)
              return children[i];
          }
          return null;
          ]]>
        </body>
      </method>
	</implementation>

  </binding>

  <binding id="bond" extends="svg:generic">
	<content>
      <svg:path style="stroke:black; stroke-width:0.05;">
        <children/>
      </svg:path>
	</content>
    
	<implementation>	 

      <!-- 'public' interface -->
	  <property name="atomRef1" readonly="true">
		<getter>
		  <![CDATA[ 
		  return this.getAtom(this.getChildNByBuiltinAttr("atomRef",0).firstChild.nodeValue);
		  ]]>
		</getter>
	  </property>
	  <property name="atomRef2" readonly="true">
		<getter>
		  <![CDATA[
		  return this.getAtom(this.getChildNByBuiltinAttr("atomRef",1).firstChild.nodeValue);
		  ]]>
		</getter>
	  </property>

      <!-- 'private' methods -->
	  <constructor>
		<![CDATA[
        this.inner.setAttribute("d","M"+this.atomRef1.x2+","+this.atomRef1.y2+
                                    " "+this.atomRef2.x2+","+this.atomRef2.y2);
		]]>
	  </constructor>

      <property name="inner" readonly="true">
		<getter>
		  <![CDATA[
		  return document.getAnonymousNodes(this)[0];
		  ]]>
		</getter>
	  </property>

      <method name="getChildNByBuiltinAttr">
        <parameter name="builtin"/>
        <parameter name="n"/>
        <body>
          <![CDATA[ 
          var children = this.getElementsByTagName("*");
          var count = children.length;
          for (var i = 0; i < count; ++i) {
            if (children[i].getAttribute("builtin") == builtin) {
              if (n == 0) {
                return children[i];
              }
              else
                --n;
            }
          }
          return null;
          ]]>
        </body>
      </method>

      <method name="getAtom">
        <parameter name="id"/>
        <body>
          <![CDATA[ 
          var atoms = this.parentNode.parentNode.getElementsByTagName("atom");
          var count = atoms.length;
          for (var i = 0; i < count; ++i) {
            if (atoms[i].getAttribute("id") == id) {
                return atoms[i];
            }
          }
          return null;
          ]]>
        </body>
      </method>

	</implementation>

  </binding>


</bindings>
