[Sol] Borrar nodo y actualizar tree segun cambios en archivo

[Katty]

Hola!

Tengo un problema con un tree en Xul que se encuentra en un sidebar. Necesito que se pueda borrar uno de los nodos utilizando un menú contextual con la opción borrar en uno de los menu items. He probado con estos dos codigos que he encontrado en la web pero no funcionan:

Código 1:

Código: Seleccionar todo

function deleteCurrentNode(){

    if (confirm("Are you sure you want to delete this node?") == true) {
            var tree = document.getElementById("rm.sidebar.tree");
            var currentelement = tree.treeBoxObject.view.getItemAtIndex(tree.currentIndex);
            currentelement.parentNode.removeChild(currentelement);
    }
}


Código 2: (este lo vi en este foro )

Código: Seleccionar todo

function deleteCurrentNode(){
  if (confirm("Are you sure you want to delete this node?") == true) {
            var tree = document.getElementById("rm.sidebar.tree");
            var treeCh = document.getElementById("rm.sidebar.treechildren");
            var rows = treeCh.childNodes.length;
            for (var j=rows-1 ; j>=0 ; j--)
            {
                if (tree.view.selection.isSelected(j))
                {
                         treeCh.removeChild(treeCh.childNodes[j]);
                 }
            }
    }
}

En el codigo 2 me di cuenta que la variable rows es 0 por lo cual al llamar a la funcion nunca se ingresa en el lazo For.
Lo que indica que treechildren no tiene hijos, pero si los tiene, aunque se anaden al momento de mostrar el sidebar, pues la información del árbol proviene de un archivo xml, por lo que lo lleno al sobreescribir la función getCellText del view.

El codigo en Xul es el siguiente:

Código: Seleccionar todo

<popupset>
   <popup id="rm.sidebar.contextmenu"> 
      <menuitem label="&rm.sidebar.tree.contextmenu.opentab.label;" oncommand="openTab();"/>
      <menuseparator id="rm-sidebar-context-menu-separator"/>
      <menuitem label="&rm.sidebar.tree.contextmenu.removenode.label;" oncommand="deleteCurrentNode();"/>
   </popup>
</popupset>

Código: Seleccionar todo

<tree id="rm.sidebar.tree"  enableColumnDrag="true" hidecolumnpicker="true" flex="1" seltype="single" >
  <treecols>
      <treecol id="rm.sidebar.tree.col.title" label="&rm.sidebar.tree.col.title.label;" primary="true" flex="3"/>
      <treecol id="rm.sidebar.tree.col.url.label" label="&rm.sidebar.tree.col.url.label;" flex="7"/>
  </treecols>
  <treechildren id="rm.sidebar.treechildren" contextmenu="rm.sidebar.contextmenu">
   </treechildren>
</tree>

Ademas quisiera saber como puedo hacer para actualizar el arbol si el contenido de mi archivo Xml ha cambiado. Este archivo se actualiza cada cierto tiempo por lo que tendria que monitorear el archivo para cambiar la estructura del arbol, y tambien tendria que hacerlo en sentido contrario: monitorear el arbol para cambiar el contenido del archivo (esto, en el caso de borrar los nodos del arbol cuando ya resuelva ese problemita!!!). Yo creo que se puede utilizar un patron de diseno pero no estoy muy segura de como implementarlo en xul y javascript pues soy algo nueva en lo que es firefox.

De antemano, gracias!!

[JackSparrow]

El código 2 es mio =D!

Va, en realidad es de IEtab, y lo usé para mi extensión xP

En fin, el tema es así:

Código: Seleccionar todo

if (tree.view.selection.isSelected(j))

Si está seleccionado, entra al if. Ahora, la fila, está seleccionada cuando tocas eliminar?

Supongo que sí, pero antes de pasar a lo que sigue, no cuesta nada preguntar xP

Por qué no la elimina? La variable rows no puede ser 0, a menos que el tree esté vacío.

Si el tree no está vacío, y la variable es 0, hay algo mal. Capaz que cuando creas las filas se crean de una manera que no debe, o algo así, pero no se, sin tener más datos se complica.

A mi me anda ese código, por eso te digo.


Lo de actualizar el tree no se, nunca lo hice. Supongo que tendrás que usar timeout, o algo por el estilo, con el cual cada x tiempo se puede llamar a una función, o lo que sea.
Para saber si el contenido cambia tenés que guardar los datos ni bien lo abre, y despues que valla comparando lo que lee con esos datos. Si algo cambió, que actualice el tree, sino, no hace nada.

Tal vez haya una forma más eficaz de hacer eso, a mi no me gusta.

Al revés es facil. Hay muchas "cosas" disponibles, como onchange, onkeypress, o lo que sea:
http://www.xulplanet.com/references/ele ... _tree.html

Saludos.

[Katty]

Hola!
Pues si, el codigo 2 es de tu post. Gracias por el aporte
La fila si esta seleccionada cuando doy click derecho y aparece el menu contextual.
La variable rows me da 0, no se porque, no se si influye la forma en que lleno el tree. De todas formas, pongo aqui el codigo con el que lleno el tree:

Código: Seleccionar todo

var recnodes = loadXmlNodes(); //con esta funcion cargo los nodos del archivo xml en memoria
 var treeView = {
    rowCount : recnodes.length - 1,
    getCellText : function(row,column){
     
      if (column.id == "rm.sidebar.tree.col.title") {
        return recnodes[row].getElementsByTagName("titulo")[0].firstChild.nodeValue;
      }else{
        return recnodes[row].getElementsByTagName("url")[0].firstChild.nodeValue;
       }
    },
    setTree: function(treebox){ this.treebox = treebox; },
    isContainer: function(row){ return false; },
    isSeparator: function(row){ return false; },
    isSorted: function(){ return false; },
    getLevel: function(row){ return 0; },
    getImageSrc: function(row,col){
      if (col.id == "rm.sidebar.tree.col.title") {
         switch (recnodes[row].getAttribute("tipo"))
        {
          case "musica":
            return "chrome://rm/content/music.png";
         
          case "video":
            return "chrome://rm/content/film.png";
           
          case "web":
            return "chrome://rm/content/mouse.png";
           
         }
        }
    },
    getRowProperties: function(row,props){},
    getCellProperties: function(row,col,props){},
    getColumnProperties: function(colid,col,props){}
};

Y al cargar el sidebar llamo a una funcion que setea el view en el tree:

Código: Seleccionar todo

function setView() {
    document.getElementById("rm.sidebar.tree").view = treeView;
};

Código: Seleccionar todo

<page id="rm.sidebar.page" title="&rm.sidebar.title;"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
         onload="setView();" >
  <script type="application/x-javascript" src="chrome://rm/content/rm-sidebar.js"/>
 .
.
.
.

</page>

Los nodos se muestran con la informacion del archivo sin inconvenientes. El problema, es al borrar un nodo, pues no lo hace.
Gracias por la sugerencia sobre la forma de actualizar el tree segun el archivo.

[JackSparrow]

Me tengo que ir YA, así que te respondo rápido.

Así lo hice yo:
symbol es un valor de una celda.
url es otro valor.
El tree tiene 3 columnas, una con un índice, otra con symbol, y otra con url.

Código: Seleccionar todo

function addRow(symbol,url) {
    /* --------------- Adding new row --------------- */
    var treeCh = document.getElementById('dbTreeCh');
    var tItem = document.createElement("treeitem");
    var tRow = document.createElement("treerow");

    var numero = treeCh.childNodes.length + 1;

    var tCell1 = document.createElement("treecell");

    tCell1.setAttribute("label", numero);

    var tCell2 = document.createElement("treecell");
    tCell2.setAttribute("label", symbol);

    var tCell3 = document.createElement("treecell");
    tCell3.setAttribute("label", url);

    tRow.appendChild(tCell1);
    tRow.appendChild(tCell2);
    tRow.appendChild(tCell3);
    tItem.appendChild(tRow);

    treeCh.appendChild(tItem);
}

Si no entendes algo, decime así mañana te respondo.

[Katty]

Gracias! El código funcionó sin problemas