<?xml version="1.0" encoding="utf-8"?>
<bindings xmlns="http://www.mozilla.org/xbl" 
          xmlns:xbl="http://www.mozilla.org/xbl" 
          xmlns:html="http://www.w3.org/1999/xhtml" 
          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<binding id="whole_text">
  	<implementation>
  	   <field name="reset">false</field>
		<field name="toFind">0</field>
		<constructor>
			var tn = document.createTextNode('Choisissez un texte dans la liste ci-contre...');
			this.appendChild(tn);
		</constructor>
		<method name="mask">
			<parameter name="type"/>
			<body>
				document.getElementById('desc_group').collapsed = type;
			</body>
		</method>
		<method name="cleanup">
		  <body>
	 	    while (this.hasChildNodes())
  	        	this.removeChild(this.firstChild);
  	       this.mask(false);
  	       var rg = document.getElementById('exercises');
  	       try {rg.selectedIndex = -1;
  	       } catch(e){}
  	       this.toFind = 0;
		  </body>
		</method>
		<method name="addToFind">
			<body>
				this.toFind++;
			</body>
		</method>
		<method name="subToFind">
			<body>
				this.toFind--;
				if (this.toFind == 0){
					if (!this.reset)
				   {
						document.getElementById('smile').smile(true);
						document.getElementById('list_texts').selectedItem.
						     setAttribute('style','background:LightGreen');
						this.mask(true);
					}					
				}
				
			</body>
		</method>
    	<method name="setTitle">
      	<parameter name="title"/>
			<body><![CDATA[
			this.parentNode.parentNode.childNodes[0].label = title ;
			]]></body>
    	</method>
    	<method name="setText">
      	<parameter name="text"/>
      	<body><![CDATA[
	 this.cleanup();
	 
    /* regular expression to split word */
    var exp = /[^a-zA-Z0-9çÇûôêöäÜÔÊéëêèÉÈËîïÏÎæÆàÀâÂù_]/;

    var to_split;
    var word, box1, box2;
    
    to_split =  text;
    
    while (to_split.length > 0){
      var match = exp.exec(to_split);
    
      //alert (to_split + ' :' + match + ':');
      if (!match){
        if (to_split.length > 0)
	  word = to_split;
	else
	  break;
      } else
        word = RegExp.leftContext;

      if (match)
	to_split = RegExp.rightContext;
      else
	to_split = "";
	
      if (word.length > 0){
         /* add a span for the word */
     		box1 = document.createElement('span');
			box1.setAttribute('class','element');
	 
			this.appendChild(box1);
	 
			box1.setText(word);
			box1.elementType='word';

		}
      if (match)
			if (/\S/.test(match)) {
				/* add a span for the ponctuation */
	   		box2 = document.createElement('span');
	   		box2.setAttribute('class','element');

	   		this.appendChild(box2);

	   		box2.setText(match);
	   		box2.elementType='ponctuation';
			} else {
				/* spaces are directly append in the description element */
	  			var textnode = document.createTextNode(match);
	  			this.appendChild(textnode);
			}

    }
    ]]></body>
    </method>

    <method name="setExercise">
      <parameter name="type"/>
	<body><![CDATA[
      if (type == 'texte'){
      	try {
			document.getElementById('exercises').selectedIndex = -1;
			} catch(e) {}
			if (this.toFind > 0) 
				this.reset = true;
			}
		this.mask(false);

		for (var i=0; i < this.childNodes.length; i++)
				if (this.childNodes[i].setExercise){
					this.childNodes[i].setWord(true);
					if (type != 'texte')
						this.childNodes[i].setExercise(type);
				}
		this.reset = false;
		
	]]></body>
    </method>

  </implementation>
</binding>

<binding id="element">
  <implementation>
    	<field name="elementData"/>
    	<field name="elementType"/>
    	<field name="elementSpan"/>
    	<field name="elementBox"/>
    	<field name="okValue">true</field>
    	<property name="ok">
    		<getter>
    			return this.okValue;
    		</getter>
    		<setter>
				if (val == this.okValue)
					return;
				this.okValue = val;
				if (val)
					this.parentNode.subToFind();
				else
					this.parentNode.addToFind();
    		</setter>
    	</property>
    	<field name="modeValue">'word'</field>
    	<property name="mode">
    		<getter>
    			return this.modeValue;
    		</getter>
    		<setter>
    			if (val == this.modeValue)
    				return true;
    			if (val=='box'){
    				this.setTextBox();
    				this.modeValue = 'box';
    				return true;
    				}
    			if (val=='word'){
    				this.setWord(false);
    				this.modeValue = 'word';
    				return true;
    				}
    			return false;
    		</setter>
    	</property>
    				 
    	<method name="setTextBox">
			<body><![CDATA[
			this.elementSpan = this.removeChild(this.elementSpan);
			this.appendChild(this.elementBox);
			this.elementBox = this.firstChild;
			this.removeAttribute('style');
			this.ok = false;
			]]></body>
		</method>
    	<method name="setWord">
    		<parameter name="reset"/>
			<body><![CDATA[
			if (reset){
				this.removeAttribute('style');
    			this.ok = true;
    			this.elementSpan.data = this.elementData;
				}
				
			if (this.modeValue == 'word')
				return;
				
			this.elementBox = this.removeChild(this.elementBox);
			this.appendChild(this.elementSpan);
			this.elementSpan = this.firstChild;
			
			if (reset){
    			this.modeValue = 'word';
    			}

			]]></body>
		</method>
    	
    	<method name="setExercise">
      <parameter name="type"/>
			<body><![CDATA[
	   		if (type == 'ponctuation'){
	      		if (this.elementType != 'ponctuation')
	          		return;
	      		else
	          		this.mode = 'box';
	          	}
	          if (type == 'articles'){
		 			if (/^(([Ll][ea])|([uU]n)|([Uu]ne)|([Dd]es)|([lL]es))$/.test(this.elementData))
		 				this.mode = 'box'
		 			else
		 				return;
		 			}
		 		 if (type == 'mots'){
		 		 	if (this.elementType != 'word')
		 		 		return;
		 		 	else
		 		 		this.mode = 'box';
		 		 }
			]]></body>
    	</method>
    		
    	<method name="setText">
      	<parameter name="word"/>
      	<body><![CDATA[
      		this.elementData = word;
      
      		//var span = document.createElement('span');
      		var textnode = document.createTextNode(this.elementData);

      		//span.appendChild(textnode); 
      		this.appendChild(textnode);
      		//this.appendChild(span);
      		
      		this.elementSpan = textnode;
      		
 				this.elementBox = document.createElement('textbox');
				this.elementBox.setAttribute('size',this.elementData.length);
				
				//this.appendChild(this.elementBox);
				//this.elementBox.setAttribute('collapsed',true);
				//this.elementSpan.setAttribute('style','background:red');
      	]]></body>
  		</method>
  		<method name="checkText">
  			<body><![CDATA[
  			if (this.elementBox.value == this.elementData){
  				this.setAttribute('style','background:LightGreen');
  				this.elementSpan.data = this.elementData ;
  				this.ok = true;
  			} else {
  				this.elementSpan.data = 	this.elementBox.value;
  				this.setAttribute('style','background:LightCoral');
  				this.ok = false;
  			}  				
			this.mode = 'word';
  			]]></body>
  		</method>
  		<method name="clickText">
  			<body><![CDATA[
			if (this.mode != 'word')
				return;
				
  			if (this.elementSpan.data == this.elementData)
  				return;
  			
  			this.mode = 'box';
  			]]></body>
  		</method>
  </implementation>
  <handlers>
    <!-- <handler event="click" button="0" action="alert('click');"/> -->
    <handler event="change" action="checkText();"/>
    <handler event="click" button="0" action="clickText();"/>
  </handlers>
</binding>

<binding id="menu_text" extends="chrome://global/content/bindings/listbox.xml#listbox" >
  <implementation>
    <field name="filename"/>
    <field name="doc"/>
    <field name="delai"/>

    <method name="changeText">
      <body><![CDATA[
	   if (!this.selectedItem){
	      return;
	      }

 		this.filename = this.selectedItem.getAttribute('filename');

     	var  main_file = document.location.href;

      var splitted = main_file.split('/');

      var src = "";
      for (var i = 0; i < splitted.length-1; i++)
         src += splitted[i]+'/';

      src += this.filename;
      
		var desc = document.getElementById('main_description');
		desc.cleanup();
		desc.appendChild(document.createTextNode('Chargement du texte '
							+ this.selectedItem.label + '...'));
     	this.selectedItem.setAttribute('style','background:LightCoral');
		
		/* Asynchrone XmlHTTPRequest */
	   this.doc = new XMLHttpRequest;
   	this.doc.open("GET", encodeURI(src), true);
      this.doc.overrideMimeType('text/xml');
	   this.doc.myData = this;	
      this.doc.onload = this.insertText;
      this.doc.send(null);

	]]>
      </body>	
    </method>
    <method name="insertText">
    <parameter name="event"/>
    <body><![CDATA[
    	/* WARNING */
      /* callback in xmlhttprequest */
      /* in this case 'this' pointer is not passed correctly */
      /* see this_obj */
	   var self = event.target;
	   var this_obj = self.myData;

	   var texte = this_obj.doc.responseXML.firstChild.firstChild.data;

	   if (texte.length == 0){
    		return;
 		}

	   var desc = document.getElementById('main_description');
      desc.setText(texte);
     	desc.setTitle(this_obj.selectedItem.getAttribute('label'));
     	//this_obj.selectedItem.setAttribute('style','background:LightGreen');
	]]>
      </body>	
    </method>
  </implementation>
  <handlers>
    <handler event="select" action="changeText();"/>
  </handlers>
</binding>

<binding id="radio_exercise" extends="chrome://global/content/bindings/radio.xml#radiogroup">
  <implementation>
    <method name="setExercise">
    <parameter name="event"/>
      <body><![CDATA[
      var exercise = this.selectedItem.getAttribute('exercise');
      
      document.getElementById('main_description').setExercise(exercise);
      ]]></body>
  </method>
  </implementation>
  <handlers>
    <handler event="command" action="setExercise(event);"/>
  </handlers>
</binding>

</bindings>
