/**
 * Esta función se ejecuta al cargar la página.
 * Con esta función ocultamos todas las pestañas del widget excepto la primera.   
 */ 
$(document).ready(function(){
  var list = document.getElementsByTagName("dl");
  for (i = 0; i < list.length; i++){
    var obj = list[i];
    var id = obj.id;
    $("#"+id+" dd:not(:first)").hide();
  }
  
/**
 *  Esta función se ejecuta en el onclick de los elementos dt con link. 
 *  Mediante esta función ocultamos la pestaña que se está mostrando y mostramos 
 *  la que se ha clicado.
 */   
	$(".contenedor_widget dl dt a").click(function(){
    // recuperamos el identificador del widget que han clicado.
    var varId = $(this).parent().parent().attr('id');
    // recuperamos la clase del elemento
	  var clase = $("#"+varId).attr('class');
	  // a partir de la clase podemos saber la region donde está el widget
	  var mida = clase.substring(clase.length-2);
	  // Miramos que color tiene el widget....
	  if ($($("#"+varId)).hasClass("widget_contenedorgris_" + mida)) {
	    // en caso de que sea gris, tenemos tres opciones, que el que está desplegado 
      // sea el primero, uno de en medio, el último...
      if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajagris_up_on_"+mida)){
        // si el deplegado es el primero, modificamos las clases de la cabezera
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajagris_up_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajagris_up_off_"+mida);
      } else if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajagris_head_on_"+mida)){
        // si el desplegado es uno de enmedio, modificamos las clases de la cabezera
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajagris_head_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajagris_head_"+mida);
      } else if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajagris_last_on_"+mida)){
        // si el desplegado es el último, modificamos las clases de la cabezera
        // y de el borde inferior
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajagris_last_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajagris_last_"+mida);
        $("#"+varId+"_down").removeClass("widget_cajagris_down_on_"+mida);
        $("#"+varId+"_down").addClass("widget_cajagris_down_"+mida);
      }
      // modificamos el titulo del que esta desplegado para ponerlo como los 
      // títulos plegados
      $("#"+varId+" dd:visible").prev().children().children().removeClass("widget_titulogris_on_"+mida);
      $("#"+varId+" dd:visible").prev().children().children().addClass("widget_titulogris_"+mida);
			// ocultamos el desplegado
      $("#"+varId+" dd:visible").slideToggle();
      // mostramos el que hemos clicado
			$(this).parent().next().slideToggle();
			// modificamos la clase del título del que se va a desplegar
      $(this).children().removeClass("widget_titulogris_"+mida);
      $(this).children().addClass("widget_titulogris_on_"+mida);
      // tenemos otra vez tres casos. Si han clicado el primero, uno de enmedio 
      // o el último
			if($(this).parent().hasClass("widget_cajagris_up_off_"+mida)){
			  // en caso de que sea el primero modificamos la clase de la cabecera
        $(this).parent().removeClass("widget_cajagris_up_off_"+mida);
        $(this).parent().addClass("widget_cajagris_up_on_"+mida);
      } else if ($(this).parent().hasClass("widget_cajagris_head_"+mida)) {
        // en caso de que sea uno de enmedio modificamos la clase de la cabecera
        $(this).parent().removeClass("widget_cajagris_head_"+mida);
        $(this).parent().addClass("widget_cajagris_head_on_"+mida);
      } else if ($(this).parent().hasClass("widget_cajagris_last_"+mida)) {
        // en caso de que sea el último hemos de modificar la cabecera y mostrar 
        // el pie del widget
        $(this).parent().removeClass("widget_cajagris_last_"+mida);
        $(this).parent().addClass("widget_cajagris_last_on_"+mida);
        $("#"+varId+"_down").removeClass("widget_cajagris_down_"+mida);
        $("#"+varId+"_down").addClass("widget_cajagris_down_on_"+mida);
      }
    } else if ($($("#"+varId)).hasClass("widget_contenedorazul_" + mida)) {
      // si el widget es azul la lógica es la misma que en el anterior caso
      if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajaazul_up_on_"+mida)){
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajaazul_up_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajaazul_up_off_"+mida);
      } else if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajaazul_head_on_"+mida)){
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajaazul_head_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajaazul_head_"+mida); 
      }else if ($("#"+varId+" dd:visible").prev().hasClass("widget_cajaazul_last_on_"+mida)){
        $("#"+varId+" dd:visible").prev().removeClass("widget_cajaazul_last_on_"+mida); 
        $("#"+varId+" dd:visible").prev().addClass("widget_cajaazul_last_"+mida);
        $("#"+varId+"_down").removeClass("widget_cajaazul_down_on_"+mida);
        $("#"+varId+"_down").addClass("widget_cajaazul_down_"+mida);
      }
      $("#"+varId+" dd:visible").prev().children().children().removeClass("widget_tituloazul_on_"+mida);
      $("#"+varId+" dd:visible").prev().children().children().addClass("widget_tituloazul_"+mida);
			$("#"+varId+" dd:visible").slideToggle();
			$(this).parent().next().slideToggle();
      $(this).children().removeClass("widget_tituloazul_"+mida);
      $(this).children().addClass("widget_tituloazul_on_"+mida);
			if($(this).parent().hasClass("widget_cajaazul_up_off_"+mida)){
        $(this).parent().removeClass("widget_cajaazul_up_off_"+mida);
        $(this).parent().addClass("widget_cajaazul_up_on_"+mida);
  	  } else if ($(this).parent().hasClass("widget_cajaazul_head_"+mida)) {
        $(this).parent().removeClass("widget_cajaazul_head_"+mida);
        $(this).parent().addClass("widget_cajaazul_head_on_"+mida);
		  }else if ($(this).parent().hasClass("widget_cajaazul_last_"+mida)) {
        $(this).parent().removeClass("widget_cajaazul_last_"+mida);
        $(this).parent().addClass("widget_cajaazul_last_on_"+mida);
        $("#"+varId+"_down").removeClass("widget_cajaazul_down_"+mida);
        $("#"+varId+"_down").addClass("widget_cajaazul_down_on_"+mida);
      }
    }
   // finalmente llamamos a la función que amplia el menú de la izquierda con un 
   // timeout para permitir plegar y desplegar el widget.
   setTimeout("ampliaMenu()",800);
		return false;
	});
});

