Forums : Xul, Xbl, JS...

Bonjour, j'utilise un arbre tree comme ceci :

 <?xml version="1.0" encoding="utf-8" ?>
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

 <window onload="init();"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

 <tree id="elementList" flex="1">
   <treecols>
     <treecol id="element" label="Élément" primary="true" flex="1"/>
     <treecol id="color" label="Couleur" flex="1"/>
     <treecol id="beauty" label="Beauté" flex="1"/>
     <treecol id="price" label="Prix" flex="1"/>
   </treecols>
   <treechildren/>
 </tree>

 <script>
 <![CDATA[

 var treeView = {
   childData : {
     Bijoux: [
       ["Collier de saphirs",["bleu", "extra", "1000€"]],
       ["Boucles d'oreilles", ["or", "belles", "200€"]],
       ["Bague", ["argent", "peu apprécié", "150€"]]
     ],
     Vêtements: [
       ["Jeans", ["bleu", "cool", "30€"]],
       ["T-shirt", ["blanc", "sobre", "10€"]],
       ["chaussettes", ["multicolore", "superbe", "20€"]]
     ],
     Jouets: [
       ["Legos", ["rouge", "sympa", "80€"]],
       ["Nounours", ["marron", "attachant", "10€"]],
       ["balançoire", ["verte et jaune", "géant", "320€"]],
       ["vélo", ["gris", "très moche", "170€"]]
     ]
   },

   visibleData : [
     ["Bijoux", true, false],
     ["Vêtements", true, false],
     ["Jouets", true, false]
   ],

   colorData : [
     "",
     "",
     ""
   ],

   beautyData : [
     "",
     "",
     ""
   ],

   priceData : [
     "",
     "",
     ""
   ],

   treeBox: null,
   selection: null,

   get rowCount()                     { return this.visibleData.length; },
   setTree: function(treeBox)         { this.treeBox = treeBox; },
   getCellText: function(idx, column) {
     if(column.id == 'element'){
       return this.visibleData[idx][0];
     }
     else if(column.id == 'color'){
       return this.colorData[idx];
     }
     else if(column.id == 'beauty'){
       return this.beautyData[idx];
     }
     else if(column.id == 'price'){
       return this.priceData[idx];
     }
   },
   isContainer: function(idx)         { return this.visibleData[idx][1]; },
   isContainerOpen: function(idx)     { return this.visibleData[idx][2]; },
   isContainerEmpty: function(idx)    { return false; },
   isSeparator: function(idx)         { return false; },
   isSorted: function()               { return false; },
   isEditable: function(idx, column)  { return false; },

   getParentIndex: function(idx) {
     if (this.isContainer(idx)) return -1;
     for (var t = idx - 1; t >= 0 ; t--) {
       if (this.isContainer(t)) return t;
     }
   },
   getLevel: function(idx) {
     if (this.isContainer(idx)) return 0;
     return 1;
   },
   hasNextSibling: function(idx, after) {
     var thisLevel = this.getLevel(idx);
     for (var t = idx + 1; t < this.visibleData.length; t++) {
       var nextLevel = this.getLevel(t)
       if (nextLevel == thisLevel) return true;
       else if (nextLevel < thisLevel) return false;
     }
   },
   toggleOpenState: function(idx) {
     var item = this.visibleData[idx];
     if (!item[1]) return;

     if (item[2]){
       item[2] = false;
       var thisLevel = this.getLevel(idx);
       var deletecount = 0;
       for (var t = idx + 1; t < this.visibleData.length; t++) {
         if (this.getLevel(t) > thisLevel) deletecount++;
         else break;
       }
       if (deletecount) {
         this.visibleData.splice(idx + 1, deletecount);
         this.colorData.splice(idx + 1, deletecount);
         this.beautyData.splice(idx + 1, deletecount);
         this.priceData.splice(idx + 1, deletecount);
         this.treeBox.rowCountChanged(idx + 1, -deletecount);
       }
     }
     else {
       item[2] = true;
       var label = this.visibleData[idx][0];
       var toinsert = this.childData[label];
       for (var i = 0; i < toinsert.length; i++) {
         this.visibleData.splice(idx + i + 1, 0, [toinsert[i][0], false]);
         this.colorData.splice(idx + i + 1, 0, toinsert[i][1][0]);
         this.beautyData.splice(idx + i + 1, 0, toinsert[i][1][1]);
         this.priceData.splice(idx + i + 1, 0, toinsert[i][1][2]);
       }
       this.treeBox.rowCountChanged(idx + 1, toinsert.length);
     }
   },

   getImageSrc: function(idx, column) { return null; },
   getProgressMode : function(idx,column) {},
   getCellValue: function(idx, column) {},
   cycleHeader: function(col, elem) {},
   selectionChanged: function() {},
   cycleCell: function(idx, column) {},
   performAction: function(action) {},
   performActionOnCell: function(action, index, column) {},
   getRowProperties: function(idx, column, prop) {},
   getCellProperties: function(idx, column, prop) {},
   getColumnProperties: function(column, element, prop) {},
 };

 function test(){
   dump('test\n');
 }

 function init() {
   document.getElementById("elementList").view =  treeView;
   document.getElementById("elementList").onmousedown = function(){ test(); };
 }

 ]]></script>

 </window>

Ca marche comme je le désires, cependant j'ai 3 warnings lorsque je clique dessus :

Avertissement : reference to undefined property b.view
Fichier Source : chrome://global/content/bindings/tree.xml
Ligne : 1022

et 3 autres warnings quand je les déplies :

Avertissement : reference to undefined property this.treeBoxObject.view
Fichier Source : chrome://global/content/bindings/tree.xml
Ligne : 0

C'est assez pénible... il y aurait-il une solution pour les enrayer?