#969 Images tree: lists are used for show tree and context menues.

6 files changed, 481 insertions, 38 deletions

diff --git a/admin/WebConsole/estilos.css b/admin/WebConsole/estilos.css
index c53747c2..e0d2ecb7 100644
--- a/admin/WebConsole/estilos.css
+++ b/admin/WebConsole/estilos.css
@@ -448,3 +448,80 @@ A.tabla_listados_sin:link{
 .consejo > div {
     text-align: center;
 }
+
+/* menú árboles provisional */
+#menu_arbol { margin-left:-60px; }
+#menu_arbol * {
+   list-style:none;
+   font-family:sans-serif;
+   font-size:11px;
+   vertical-align:middle;
+   margin-left:4px;
+   padding-left:2px;
+}
+#menu_arbol li{ line-height:80%;}
+#menu_arbol li a{color:#222; text-decoration:none;}
+#menu_arbol li a:before{ content:"\025b8"; color:#ddd; margin-right:4px;}
+#menu_arbol input[name="list"] {
+	position: absolute;
+	left: -1000em;
+	}
+#menu_arbol label:before{ content:"\025b8"; margin-right:4px;}
+#menu_arbol input:checked ~ label:before{ content:"\025be";}
+#menu_arbol .interior{display: none;}
+#menu_arbol input:checked ~ ul{display:block;}
+
+/*menú contextual provisional */
+ul[id^='menu-'] {
+   display:none;
+   background:#d4d0c8;
+   border: 2px solid #ffffff;
+   border-right-color: #808080;
+   border-bottom-color: #808080;
+   font-family:Verdana, Arial, Helvetica, sans-serif;
+   font-size:11px;
+   color:black;
+   letter-spacing:-1px;
+   padding:0px;
+}
+
+ul[id^='menu-'] ul {
+   display:none;
+   background:white;
+   font-family:Verdana, Arial, Helvetica, sans-serif;
+   font-size:11px;
+   color:black;
+   padding:2px 9px 2px 2px;
+}
+
+ul[id^='menu-'] li:hover {
+   background:rgb(10, 38, 106);
+   word-wrap:break-word;
+   overflow:hidden;
+   color:#FFF;
+}
+
+ul[id^='menu-'] li:hover > ul {
+    display:block;
+}
+
+.separador {
+   border-bottom:1px solid #ccc;
+}
+
+ul[id^='menu-'] li > img {
+    background:#d4d0c8;
+    padding:1px;
+   vertical-align:middle;
+}
+
+
+span {
+   float: 'right';
+   marginRight: '12px';
+}
+
+.menu_icono {
+    width:"16px";
+    height:"16px";
+}
diff --git a/admin/WebConsole/includes/constantes.php b/admin/WebConsole/includes/constantes.php
index 9291b355..db962e65 100644
--- a/admin/WebConsole/includes/constantes.php
+++ b/admin/WebConsole/includes/constantes.php
@@ -161,6 +161,8 @@ $msk_imagen=0x08;
 $msk_perfil=0x10;
 $msk_cache=0x12;
 
+// Número de tipos de imágenes
+$NUM_TIPOS_IMAGENES=3;
 // Tipos de imágenes
 $IMAGENES_MONOLITICAS=0x01;
 $IMAGENES_BASICAS=0x02;
diff --git a/admin/WebConsole/jscripts/comunes.js b/admin/WebConsole/jscripts/comunes.js
index 09bf1d9d..09b66b7a 100644
--- a/admin/WebConsole/jscripts/comunes.js
+++ b/admin/WebConsole/jscripts/comunes.js
@@ -24,8 +24,25 @@ var NS=(navigator.appName=="Netscape");
 //	Inserta un nuevo grupo 
 //________________________________________________________________________________________________________
 function insertar_grupos(tipo,literaltipo,swi,idu){
-	reset_contextual(-1,-1); // Oculta menu contextual
-	var identificador=currentNodo.toma_identificador();
+	console.log(literaltipo);
+	// si tipo = 0 nuevos menús contextuales
+	if (literaltipo == LITAMBITO_GRUPOSIMAGENES) {
+		var id = $("[id^='menu-groups']").attr('id');
+		if (! id.includes("_")) {
+			var id = $("[id^='menu-tipes']").attr('id');
+		}
+		var datos = id.split("_");
+
+		// El tipo de grupo de imagenes son 70, 71 y 72 correspondiendo al tipo de imagen 1, 2 y 3
+		var tipo=parseInt(datos[1]) + 69;
+		literaltipo=literaltipo+littipo[datos[1]];
+		identificador=datos[2];
+
+		ocultar_menu('menu-groups');
+	} else {
+	    reset_contextual(-1,-1); // Oculta menu contextual
+	    var identificador=currentNodo.toma_identificador();
+	}
 	if(swi!=null && swi==1) identificador=0;
 	if(identificador==null) identificador=0;
 
@@ -60,10 +77,20 @@ function resultado_insertar_grupos(resul,descrierror,nwid,tablanodo){
 //	
 //	Modifica el nombre de un grupo
 //________________________________________________________________________________________________________
-function modificar_grupos(){
-	reset_contextual(-1,-1); // Oculta menu contextual
-	var identificador=currentNodo.toma_identificador();
-	var literaltipo=currentNodo.toma_sufijo();
+function modificar_grupos(literaltipo=""){
+	if (literaltipo == LITAMBITO_GRUPOSIMAGENES) {
+	    var id = $("[id^='menu-groups']").attr('id');
+            var datos = id.split("_");
+
+            literaltipo=literaltipo+littipo[datos[1]];
+            identificador=datos[2];
+
+            ocultar_menu('menu-groups');
+	} else {
+	    reset_contextual(-1,-1); // Oculta menu contextual
+	    var identificador=currentNodo.toma_identificador();
+	    var literaltipo=currentNodo.toma_sufijo();
+	}
 	wurl="../propiedades/propiedades_grupos.php?opcion="+op_modificacion+"&idgrupo="+identificador+"&literaltipo="+literaltipo;
 	window.open(wurl,"frame_contenidos")
 }
@@ -87,14 +114,30 @@ function resultado_modificar_grupos(resul,descrierror,lit){
 //	
 //	Elimina un grupo
 //________________________________________________________________________________________________________
-function eliminar_grupos(){
-	reset_contextual(-1,-1); // Oculta menu contextual
-	if (currentNodo.TieneHijos()){
-		var resul=window.confirm(CTbMsg[0]);
-		if (!resul)return;
+function eliminar_grupos(literaltipo=""){
+	if (literaltipo == LITAMBITO_GRUPOSIMAGENES) {
+                var id = $("[id^='menu-groups']").attr('id');
+                var datos = id.split("_");
+
+                literaltipo=literaltipo+littipo[datos[1]];
+                identificador=datos[2];
+
+		// eliminamos grupo del arbol.
+		var elemento=document.getElementById("grupo_"+datos[2]);
+		var padre = elemento.parentNode;
+		padre.removeChild(elemento);
+		console.log("grupo");
+
+                ocultar_menu('menu-groups');
+        } else {
+	    reset_contextual(-1,-1); // Oculta menu contextual
+	    if (currentNodo.TieneHijos()){
+		    var resul=window.confirm(CTbMsg[0]);
+		    if (!resul)return;
+	    }
+	    var identificador=currentNodo.toma_identificador();
+	    var literaltipo=currentNodo.toma_sufijo();
 	}
-	var identificador=currentNodo.toma_identificador();
-	var literaltipo=currentNodo.toma_sufijo();
 	wurl="../propiedades/propiedades_grupos.php?opcion="+op_eliminacion+"&idgrupo="+identificador+"&literaltipo="+literaltipo;
 	window.open(wurl,"frame_contenidos");
 }
@@ -107,10 +150,13 @@ function eliminar_grupos(){
 //			- id: Identificador del registro
 //________________________________________________________________________________________________________
 function resultado_eliminar_grupos(resul,descrierror,id){
+	console.log("comunes");
+	console.log("id: "+id);
 	if (!resul){
 		alert(descrierror);
 		return
 	}
+	console.log(currentNodo);
 	var nvp=currentNodo.PapaNodo();
 	var ncel=nvp.CeldaVista;
 	EliminaNodo(currentNodo); // Elimina el nodo del árbol
@@ -242,29 +288,57 @@ function resultado_eliminar(resul,descrierror,id){
 //		Copia al buffer un nodo para moverlo posteriormente
 //________________________________________________________________________________________________________
 function mover(tipo){
-	reset_contextual(-1,-1);
-	corte_currentNodo=currentNodo;
-	currentTipo=tipo
+	var id = $("[id^='menu-images']").attr('id');
+        if (id.includes("_")) {
+            var datos = id.split("_");
+            currentTipo=datos[1];
+	    corte_currentNodo=datos[2];
+        } else {
+	    reset_contextual(-1,-1);
+	    corte_currentNodo=currentNodo;
+	    currentTipo=tipo
+	}
+	    console.log("tipo: "+currentTipo);
+	    console.log(corte_currentNodo);
 }
 //________________________________________________________________________________________________________
 //	
 //	Mueve de sitio un nodo desde un grupo a otro o a la raiz
 //________________________________________________________________________________________________________
 function colocar(pages,tipo){
-	reset_contextual(-1,-1);
+	// Tomamo el identificador del grupo y del tipo
+	var id = $("[id^='menu-groups']").attr('id');
+        if (! id.includes("_")) {
+            var id = $("[id^='menu-tipes']").attr('id');
+        }
+        var datos = id.split("_");
+
+        tipo=parseInt(datos[1]);
+        var identificadorgrupo=datos[2];
+
 	if (!corte_currentNodo || tipo!=currentTipo) {
 		alert(CTbMsg[7]);
 		corte_currentNodo=null;
 		currentTipo=null;
 		return
 	}
-	var identificadorgrupo=currentNodo.toma_identificador();
-	if (!identificadorgrupo) identificadorgrupo=0;
-	var identificador=corte_currentNodo.toma_identificador();
-	if (!identificador) identificador=0; // Se trata de la raiz
+
 	var wurl=pages;
-	var prm="opcion="+op_movida+"&grupoid="+identificadorgrupo+"&identificador="+identificador;
-	CallPage(wurl,prm,"retornoColocar","POST");
+	if (identificadorgrupo) {
+	    var identificador=corte_currentNodo;
+	    //var prm='{opcion: "'+op_movida+'", grupoid:"'+identificadorgrupo+'", identificador="'+identificador+'}';
+	    //$.post(wurl,prm,"retornoColocar","frame_contenidos");
+	} else {
+	    reset_contextual(-1,-1);
+	    var identificadorgrupo=currentNodo.toma_identificador();
+	    if (!identificadorgrupo) identificadorgrupo=0;
+	    var identificador=corte_currentNodo.toma_identificador();
+	    if (!identificador) identificador=0; // Se trata de la raiz
+	}
+	    var prm="opcion="+op_movida+"&grupoid="+identificadorgrupo+"&identificador="+identificador;
+	//    CallPage(wurl,prm,"retornoColocar","POST");
+	console.log("url: "+wurl+"?"+prm);
+	window.open(wurl+"?"+prm,"frame_contenidos");
 }
 //______________________________________________________________________________________________________
 function retornoColocar(iHTML){
diff --git a/admin/WebConsole/jscripts/constantes.js b/admin/WebConsole/jscripts/constantes.js
index 33d35675..fb468eb3 100644
--- a/admin/WebConsole/jscripts/constantes.js
+++ b/admin/WebConsole/jscripts/constantes.js
@@ -45,6 +45,12 @@ var AMBITO_GRUPOSSERVIDORESDHCP=0x41;
 var AMBITO_GRUPOSSOFTINCREMENTAL=0x43;
 var AMBITO_GRUPOSRESERVAS=0x44;
 
+// En la base de datos el id de los tipos de los grupos son
+// tipo=65 -> grupos de repositorios
+// tipo=70 -> grupos de imágenes monoliticas
+// tipo=71 -> grupos de imágenes básicas
+// tipo=72 -> grupos de imágenes incrementales
+
 // Literales de los ambitos
 var LITAMBITO_CENTROS="centros";
 var LITAMBITO_AULAS="aulas";
@@ -122,3 +128,9 @@ var MSG_INFORMACION=0x05; // Envío de cualquier información sin espera de conf
 var IMAGENES_MONOLITICAS=0x01;
 var IMAGENES_BASICAS=0x02;
 var IMAGENES_INCREMENTALES=0x03;
+
+// Relación tipos de imágenes con literales del tipo
+var littipo = Array;
+littipo[1]="monoliticas";
+littipo[2]="basicas";
+littipo[3]="incrementales";
diff --git a/admin/WebConsole/jscripts/imagenes.js b/admin/WebConsole/jscripts/imagenes.js
index 1e154951..393fd0ca 100644
--- a/admin/WebConsole/jscripts/imagenes.js
+++ b/admin/WebConsole/jscripts/imagenes.js
@@ -9,11 +9,11 @@
 //	Muestra información sobre las imágenes
 //___________________________________________________________________________________________________________
 function muestra_informacion(){
-	reset_contextual(-1,-1);
-	var identificador=currentNodo.toma_identificador();
-	var descripcionimagen=currentNodo.toma_infonodo();
-	var whref="../varios/informacion_imagenes.php?idimagen="+identificador+"&descripcionimagen="+descripcionimagen;
+	var id = $("[id^='menu-images']").attr('id');
+	var datos = id.split("_");
+	var whref="../varios/informacion_imagenes.php?idimagen="+datos[2]+"&descripcionimagen="+"descripcionimagen";
 	window.open(whref,"frame_contenidos")
+	ocultar_menu();
 }
 //________________________________________________________________________________________________________
 //	
@@ -33,32 +33,89 @@ function insertar_imagenincremental(){
 //
 function insertar_imagen(litamb,tipoimg)
 {
-	reset_contextual(-1,-1); // Oculta menu contextual
-	var identificador=currentNodo.toma_identificador();
+	if (tipoimg == 0) {
+            var id = $("[id^='menu-groups']").attr('id');
+	    if (! id.includes("_")) {
+                        var id = $("[id^='menu-tipes']").attr('id');
+            }
+		console.log(id);
+	    var datos = id.split("_");
+	    tipoimg=datos[1]
+	    litamb=litamb+littipo[datos[1]];
+	    identificador=datos[2];
+	} else {
+	    reset_contextual(-1,-1); // Oculta menu contextual
+	    var identificador=currentNodo.toma_identificador();
+        }
 	var whref="../propiedades/propiedades_imagenes.php?opcion="+op_alta+"&grupoid="+identificador+"&litamb="+litamb+"&tipoimg="+tipoimg;
 	window.open(whref,"frame_contenidos");
+	ocultar_menu();
 }
 //________________________________________________________________________________________________________
 //	
 //	Modificar datos de imagen
 //________________________________________________________________________________________________________
 //
-function modificar_imagen(tipoimg)
+function modificar_imagen()
 {
-	reset_contextual(-1,-1); // Oculta menu contextual
-	var identificador=currentNodo.toma_identificador();
-	var whref="../propiedades/propiedades_imagenes.php?opcion="+op_modificacion+"&tipoimg="+tipoimg+"&identificador="+identificador;
+	var id = $("[id^='menu-images']").attr('id');
+	var datos = id.split("_");
+	var whref="../propiedades/propiedades_imagenes.php?opcion="+op_modificacion+"&tipoimg="+datos[1]+"&identificador="+datos[2];
 	window.open(whref,"frame_contenidos");
+	ocultar_menu();
 }
 //________________________________________________________________________________________________________
 //	
 //	Eliminar una imagen
 //________________________________________________________________________________________________________
 //
-function eliminar_imagen(tipoimg)
+function eliminar_imagen()
 {
-	reset_contextual(-1,-1); // Oculta menu contextual
-	var identificador=currentNodo.toma_identificador();
-	var whref="../propiedades/propiedades_imagenes.php?opcion="+op_eliminacion+"&tipoimg="+tipoimg+"&identificador="+identificador;
+	var id = $("[id^='menu-images']").attr('id');
+	var datos = id.split("_");
+	// eliminamos del árbol
+	var img=document.getElementById("img_"+datos[2]);
+	var ul_grupo=img.parentNode;
+	ul_grupo.removeChild(img);
+
+
+	//console.log(img);
+	console.log(ul_grupo);
+
+	var whref="../propiedades/propiedades_imagenes.php?opcion="+op_eliminacion+"&tipoimg="+datos[1]+"&identificador="+datos[2];
 	window.open(whref,"frame_contenidos");
+	ocultar_menu();
+}
+
+// provisional menú contextual //
+function mostrar_menu(event, tipo, id, menu_id) {
+   var posX, posY, span; // Declaracion de variables
+
+   posX = event.pageX; // Obtenemos pocision X del cursor
+   posY = event.pageY; // Obtenemos pocision Y del cursor
+
+   // Flecha que indica submenues
+   //span = $('#' + menu_id + " span");
+   //span.html("»");
+
+   // Editando el codigo CSS para ciertos elementos
+
+   $('#' + menu_id).css({position: 'absolute',display: 'block',top: posY,left: posX,cursor: 'default',width: '200px',height: 'auto',padding: '2px 9px 2px 2px',listStyle: 'none',listStyleType: 'none'});
+$('#' + menu_id + " li ul").css({listStyle:'none',listStyleType:'none',cursor:'default',position:'absolute',left:'212px',marginTop:'-20px',width:'200px',height:'auto',padding:'2px 9px 2px 2px'});
+
+	 console.log($('#' + menu_id));
+  // Incluyo el tipo de imagen y el id en el ientificador
+  $('#' + menu_id ).attr("id", menu_id + "_" + tipo + "_" + id);
+
+	 console.log($('#' + menu_id+ "_" + tipo + "_" + id));
+  }
+
+function ocultar_menu() {
+	console.log("ocultar menu");
+   $("[id^='menu-images']").attr("id",'menu-images');
+   $("[id^='menu-groups']").attr("id",'menu-groups');
+   $("[id^='menu-tipes']").attr("id",'menu-tipes');
+   $("#menu-images").css({display: 'none'});
+   $("#menu-groups").css({display: 'none'});
+   $("#menu-tipes").css({display: 'none'});
 }
diff --git a/admin/WebConsole/principal/imagenes.php b/admin/WebConsole/principal/imagenes.php
index 553979db..98475405 100644
--- a/admin/WebConsole/principal/imagenes.php
+++ b/admin/WebConsole/principal/imagenes.php
@@ -42,11 +42,13 @@ $arbol=new ArbolVistaXML($arbolXML,0,$baseurlimg,$clasedefault,1,0,5);
 	<SCRIPT language="javascript" src="../jscripts/opciones.js"></SCRIPT>
 	<SCRIPT language="javascript" src="../jscripts/constantes.js"></SCRIPT>
 	<SCRIPT language="javascript" src="../jscripts/comunes.js"></SCRIPT>	
+	<SCRIPT language="javascript" src="../api/jquery.js"></SCRIPT>
 	<SCRIPT language="javascript" src="../clases/jscripts/HttpLib.js"></SCRIPT>
 	<?php echo '<SCRIPT language="javascript" src="../idiomas/javascripts/'.$idioma.'/comunes_'.$idioma.'.js"></SCRIPT>'?>
 	<?php echo '<SCRIPT language="javascript" src="../idiomas/javascripts/'.$idioma.'/imagenes_'.$idioma.'.js"></SCRIPT>'?>
 </HEAD>
-<BODY OnContextMenu="return false">
+<BODY onclick="ocultar_menu('menu-contextual');" >
+
 <?php
 //________________________________________________________________________________________________________
 
@@ -111,7 +113,57 @@ $XMLcontextual=CreacontextualXMLImagen($AMBITO_IMAGENESINCREMENTALES,
 					$LITAMBITO_IMAGENESINCREMENTALES,
 					$IMAGENES_INCREMENTALES);
 echo $flotante->CreaMenuContextual($XMLcontextual);											
+        echo "<br><br><br>";
+        echo "<br><br><br>";
+$Repos=repos();
+$imagenes=img($Repos);
+$grupos_hijos= grupos();
+listaImg($imagenes,$grupos_hijos);
+
+// Tipos de menús contextuales:
+// id="TipoImagen_1"
+// id="TipoImagen_2"
+// id="TipoImagen_3"
+// id="flo_gruposimagenesmonoliticas"
+// id="flo_gruposimagenesbasicas"
+// id="flo_gruposimagenesincrementales"
+// id="flo_imagenesmonoliticas"
+// id="flo_imagenesbasicas"
+// id="flo_imagenesincrementales"
+// En realidas son tres : tipos imagenes, grupos e imagenes.
+
 ?>
+
+
+ <ul id="menu-tipes" name="menu-tipes" oncontextmenu="return false;">
+  <li onclick="insertar_grupos(0,'<?php echo $LITAMBITO_GRUPOSIMAGENES ?>');"><img class="menu-icono" src="../images/iconos/carpeta.gif"> Nuevo grupo de imágenes</li>
+  <li class="separador" onclick="insertar_imagen('<?php echo $LITAMBITO_IMAGENES ?>',0);"><img class="menu-icono" src="../images/iconos/imagen.gif"> Definir nueva imagen</li>
+  <li onclick="mover()"><img class="menu-icono" src="../images/iconos/colocar.gif"> Colocar imagen</li>
+ </ul>
+
+ <ul id="menu-groups" name="menu-groups" oncontextmenu="return false;">
+ <li onclick="insertar_grupos(0,'<?php echo $LITAMBITO_GRUPOSIMAGENES ?>');"><img class="menu-icono" src="../images/iconos/carpeta.gif"><span class="menu-texto"> Nuevo grupo de imágenes</span></li>
+  <li class="separador" onclick="insertar_imagen('<?php echo $LITAMBITO_IMAGENES ?>',0);"><img class="menu-icono" src="../images/iconos/imagen.gif">Definir nueva imagen</li>
+  <li class="separador" onclick="colocar('../gestores/gestor_imagenes.php',0)"><img class="menu-icono" src="../images/iconos/colocar.gif"> Colocar imagen</li>
+  <li onclick="modificar_grupos('<?php echo $LITAMBITO_GRUPOSIMAGENES ?>');"><img class="menu-icono" src="../images/iconos/modificar.gif"> Propiedades</li>
+  <li onclick="eliminar_grupos('<?php echo $LITAMBITO_GRUPOSIMAGENES ?>');"><img class="menu-icono" src="../images/iconos/eliminar.gif"> Eliminar grupo de imágenes</li>
+ </ul>
+
+ <ul id="menu-images" name="menu-images" oncontextmenu="return false;">
+  <li class="separador" onclick="muestra_informacion();"><img class="menu-icono" src="../images/iconos/informacion.gif"> Imagen información</li>
+  <li class="separador" onclick="mover()"><img class="menu-icono" src="../images/iconos/mover.gif"> Mover Imagen</li>
+  <li onclick="modificar_imagen();"><img class="menu-icono" src="../images/iconos/propiedades.gif"> Propiedades</li>
+  <li onclick="eliminar_imagen();"><img class="menu-icono" src="../images/iconos/eliminar.gif"> Eliminar imagen</li>
+  <!-- li>Comandos prueba <span>»</span>
+   <ul>
+    <li onclick="location.href='http://frikiblogeeo.blogspot.com'">Friki Bloggeo</li>
+    <li onclick="location.href='http://blogger.com'">Blogger</li>
+    <li onclick="location.href='http://gmail.com'">Gmail</li>
+   </ul>
+  </li -->
+  </ul>
+
+ <!-- div id="outer-wrapper" onclick="ocultar_menu();" oncontextmenu="mostrarMenu(event, this.id, 'menu-contextual');return false;"> </div -->
 </BODY>
 </HTML>
 <?php
@@ -411,5 +463,174 @@ function CreacontextualXMLImagen($amb,$litamb,$tipo)
 	$layerXML.='</MENUCONTEXTUAL>';
 	return($layerXML);
 }
+
+// Descripción. Devuelve un array con los nombres de los repositorios
+// Parámetros: ninguno
+// Devuelve un array con los nombres de los repositorios
+function repos(){
+        global $TbMsg;
+        global $cmd;
+        global $idcentro;
+
+        $repositorios=Array();
+        $rs=new Recordset;
+        $cmd->texto="SELECT idrepositorio, nombrerepositorio FROM repositorios;";
+        $rs->Comando=&$cmd;
+        if (!$rs->Abrir()) return($repositorios);
+
+        $rs->Primero();
+        while (!$rs->EOF){
+                $repositorios[$rs->campos["idrepositorio"]] = $rs->campos["nombrerepositorio"];
+                $rs->Siguiente();
+        }
+        return($repositorios);
+}
+
+// Descripción: Devuelve un array de grupos de imágenes. Ordenados por tipos de imágenes y grupo padre
+// Parámetros: ninguno
+// devuelve: array de grupos.
+function grupos(){
+	global $cmd;
+	global $idcentro;
+
+	$grupos_hijos=Array();
+	$rs=new Recordset;
+	$cmd->texto="SELECT idgrupo, nombregrupo, grupos.grupoid AS grupopadre, tipo
+		       FROM grupos
+		      WHERE idcentro=$idcentro AND tipo IN (70, 71, 72)
+                   ORDER BY tipo, grupopadre, grupoid;";
+	$rs->Comando=&$cmd;
+	if (!$rs->Abrir()) return($grupos_hijos);
+
+        $rs->Primero();
+	$oldgrupopadre=0;
+	$num=-1;
+        while (!$rs->EOF){
+		$grupopadre=$rs->campos["grupopadre"];
+		$nombregrupo=$rs->campos["nombregrupo"];
+
+		$idgrupo=$rs->campos["idgrupo"];
+                // El tipo de grupo de imagenes son 70, 71 y 72 correspondiendo al tipo de imagen 1, 2 y 3
+		$tipo=$rs->campos["tipo"] - 69;
+		if ($oldgrupopadre != $grupopadre) {
+			$oldgrupopadre=$grupopadre;
+		        // Cuando cambio de grupo pongo el orden del array a cero
+			$num=0;
+		} else {
+			$num++;
+	        }
+		$grupos_hijos[$tipo][$grupopadre][$num]["id"] = $idgrupo;
+		$grupos_hijos[$tipo][$grupopadre][$num]["nombre"] = $nombregrupo;
+
+		$rs->Siguiente();
+	}
+	return ($grupos_hijos);
+
+}
+
+// Descripción: Devuelve un array de las imágenes ordenadas por tipo y grupo al que pertenecen.
+// Parámetros: repositorios
+// array repositorios: array con los nombres del repositorio, para usarlo en la descripción de la imagen.
+// Devuelve: array de imágenes
+function img($repositorios){
+        global $TbMsg;
+        global $cmd;
+        global $idcentro;
+
+        $imagenes=Array();
+        $grupos_hijos=Array();
+        $rs=new Recordset;
+	$cmd->texto="SELECT DISTINCT imagenes.idimagen,imagenes.descripcion, imagenes.tipo, imagenes.grupoid,
+			     IF(imagenes.idrepositorio=0,basica.idrepositorio,imagenes.idrepositorio)  AS repo
+                       FROM  imagenes
+                  LEFT JOIN imagenes AS basica  ON imagenes.imagenid=basica.idimagen
+                      WHERE imagenes.idcentro=$idcentro ORDER BY imagenes.tipo, grupoid;";
+
+        $rs->Comando=&$cmd;
+        if (!$rs->Abrir()) return(Array($imagenes));
+
+        $rs->Primero();
+        $ordenImg=-1;
+        $oldgrupoid=(isset($rs->campos["grupoid"]))? $rs->campos["grupoid"] : 0;
+        while (!$rs->EOF){
+                $tipo=$rs->campos["tipo"];
+                $idimagen=$rs->campos["idimagen"];
+                $descripcion=$rs->campos["descripcion"];
+                $idrepo=$rs->campos["repo"];
+                // Las imágenes de un grupo son un array. Cuando cambio de grupo pongo el orden a cero:
+                $grupoid=(isset($rs->campos["grupoid"]))? $rs->campos["grupoid"] : 0;
+                if ($oldgrupoid != $grupoid) {
+                        $oldgrupoid=$grupoid;
+                        $ordenImg=0;
+                } else {
+                        $ordenImg=$ordenImg+1;
+                }
+
+                $imagenes[$tipo][$grupoid][$ordenImg]["descripcion"]=$descripcion." (".$repositorios[$idrepo].")";
+                $imagenes[$tipo][$grupoid][$ordenImg]["id"]=$idimagen;
+                $rs->Siguiente();
+        }
+
+        return($imagenes);
+}
+
+// Descripción: Comienza el árbol de imágenes en froma de lista.
+// Parámetros: imágenes grupos_hijos
+// array imágenes: Array con las imágenes según tipo y grupo al que pertenecen.
+// array grupos_hijos: array de los grupos hijos de cada grupo.
+// Devuelve: nada
+function listaImg ($imagenes, $grupos_hijos){
+        global $TbMsg;
+        global $NUM_TIPOS_IMAGENES;
+        $orden=0;
+        echo '<ul id="menu_arbol">'."\n";
+        echo '  <li><input type="checkbox" name="list" id="nivel1-1"><label for="nivel1-1"><img class="menu-icono" src="../images/iconos/imagenes.gif">'.str_replace ('"','',$TbMsg[9]).'</label>'."\n";
+        for ($tipo = 1; $tipo <= $NUM_TIPOS_IMAGENES; $tipo++) {
+                // Recorremos los grupos hijos desde el cero
+		echo '    <ul>'."\n";
+		echo '       <li id="grupo_'.$tipo.'_0" oncontextmenu="mostrar_menu(event, '. $tipo.', 0, \'menu-tipes\');return false;">'."\n";
+		echo '          <input type="checkbox" name="list" id="nivel2-'.$tipo.'"><label for="nivel2-'.$tipo.'"><img class="menu-icono" src="../images/iconos/carpeta.gif"> '.str_replace ('"','',$TbMsg[10+$tipo]).'</label>'."\n";
+		$orden=listaGrupo($tipo,0,2,$orden,$imagenes,$grupos_hijos);
+		$orden=$orden+1;
+		echo '       </li>'."\n";
+		echo '    </ul>'."\n";
+        }
+        echo "  </li>"."\n";
+        echo "</ul>"."\n";
+}
+
+// Descripción: Construye la parte del árbol correspondiente a un grupo de imágenes: lista sus imágenes y sus grupos hijos.
+// Parametros: tipo idgrupo nivel orden imagenes grupos_hijos
+// int tipo: tipo de imágenes (moniliticas, básicas, )
+// int idgrupo: identificador del grupo
+// int nivel: nivel de la lista
+// int orden: orden de la lista
+// array imagenes: array con info de la imagen
+// array grupos_hijos: array de grupos hijos
+// Devuelve: el orden de la lista del último elemento.
+function listaGrupo($tipo,$idgrupo,$nivel,$orden,$imagenes,$grupos_hijos){
+        $nivel=$nivel+1;
+        echo '    <ul class="interior">'."\n";
+        // si existen grupos hijos del actual creo la lista con la función listaGrupo.
+        if (isset ($grupos_hijos[$tipo][$idgrupo])){
+            foreach ($grupos_hijos[$tipo][$idgrupo] as $hijo) {
+                $orden=$orden+1;
+                echo '      <li id="grupo_'.$hijo["id"].'" oncontextmenu="mostrar_menu(event,'. $tipo.', '.$hijo["id"].', \'menu-groups\');return false;"><input type="checkbox" name="list" id="nivel'.$nivel.'-'.$orden.'"><label for="nivel'.$nivel.'-'.$orden.'"><img class="menu_icono" src="../images/iconos/carpeta.gif">'.$hijo["nombre"].'</label>'."\n";
+                //echo '      <li oncontextmenu="mostrar_menu(event,'. $tipo.', '.$hijo["id"].', \'menu-groups\');return false;"><input type="checkbox" name="list" id="nivel'.$nivel.'-'.$hijo["id"].'"><label for="nivel'.$nivel.'-'.$hijo["id"].'"><img class="menu_icono" src="../images/iconos/carpeta.gif">'.$hijo["nombre"].'</label>'."\n";
+
+                $orden=listaGrupo($tipo,$hijo["id"],$nivel,$orden,$imagenes,$grupos_hijos);
+            }
+            echo "      </li>"."\n";
+	}
+	// creo la lista de las imágenes dentro del grupo (si existen).
+	if (isset ($imagenes[$tipo][$idgrupo])){
+	    foreach ($imagenes[$tipo][$idgrupo] as $img){
+		echo '      <li id="img_'.$img["id"].'" oncontextmenu="ocultar_menu(); mostrar_menu(event,'. $tipo.', '.$img["id"].', \'menu-images\');return false;"><a href="#r"><img class="menu_icono" src="../images/iconos/imagen.gif"> '.$img["descripcion"].'</a></li>'."\n";
+	    }
+	}
+        echo "    </ul>"."\n";
+	return($orden);
+}
+
 ?>