// ONO (www.ono.es) - Código para capas desplegables - Octavio Molano - Sep, 2009

var info_short, info_extended; // Variables para altura de cajas info semi-cerradas y abiertas, respectivamente
var speed1 = 1000; // Velocidad para collapseContent
var speed2 = 1000; // Velocidad para collapseContentToHeight

$(function() // Inicialización de eventos jQuery
{
    initBindings();
});

function initBindings() {
    // Se ocultan las capas desplegables.
    // Con JS desactivado, se muestra todo desplegado
    $(
        '.collapse_content:not(.collapse_showbydefault), ' +    // Primer grupo de desplegables
        '.collapse_content_2:not(.collapse_showbydefault), ' +  // Segundo grupo de desplegables
        '.collapse_content_3:not(.collapse_showbydefault)'      // Tercer grupo de desplegables
    ).hide();

    // Se recogen los valores de las alturas para cajas info, si existen
    if ($('#info_short').length > 0) {
        info_short = $('#info_short').val().split(',');
        info_extended = $('#info_extended').val().split(',');
    }

    // Se ajusta la altura de los desplegables de altura específica (no se cierran del todo)
    $('[class*=collapse_content_info]:not(.collapse_showbydefault)').each(
        function() {
            var contentLayerClass = getCollapseContentClass($(this));
            var infoNum = parseInt(contentLayerClass.substr(contentLayerClass.lastIndexOf('_') + 1), 10) - 1;
            $(this).css('height', parseInt(info_short[infoNum], 10));
        }
    );

    // Se pone cursor puntero (la mano) en las cabeceras de los desplegables.
    // Se hace mediante JS en vez de mediante la hoja de estilos para que
    // no se muestre este cursor con JavaScript desactivado
    $('.collapse_header, .collapse_header_2, .collapse_header_3, [class*=collapse_header_info]').css('cursor', 'pointer');

    // Eventos
    $('.collapse_header, .collapse_header_2, .collapse_header_3').click(collapseContent);
    $("[class*=collapse_header_info]").click(collapseContentToHeight);
    $("[class*=collapse_link_info]").click(collapseContentToHeightLink);

    // Se añade el indicador de mostrar/ocultar en los bloques con esta clase (sin JS no aparece ya que está todo desplegado)
    $('.collapse_showhide_tienda').append('<span class="collapse_showhide_tienda_text">información de las tiendas</span>'); // En español
    $('.collapse_showhide').append('<span class="collapse_showhide_text">mostrar/ocultar</span>'); // En español
    $('.collapse_showhide_eng').append('<span class="collapse_showhide_text">show/hide</span>'); // En inglés
}

function collapseContent() // Función genérica para contraer/expandir
{
    var contentLayerClass = getCollapseContentClass($(this));


	
    if (contentLayerClass)
    {
        var showContent = !($(this).siblings(contentLayerClass).is(':visible'));
		$(contentLayerClass).slideUp(speed1);
	
//	    $('.collapse_showhide_tienda').append('<span class="collapse_showhide_text">mostrar tienda</span>'); // Texto ocultar								

        if (showContent) {
			$(this).siblings(contentLayerClass).slideDown(speed1);
//		    $('.collapse_showhide_tienda').append('<span class="collapse_showhide_text">ocultar tienda</span>'); // Texto ocultar
		}

    }
    return false;
}

function collapseContentToHeight() // Función para contraer/expandir hasta una altura específica
{
    var contentLayerClass = getCollapseContentClass($(this));
    if (contentLayerClass)
    {
        var infoNum = parseInt(contentLayerClass.substr(contentLayerClass.lastIndexOf('_') + 1), 10) - 1;
        var showContent = ($(this).siblings(contentLayerClass).css('height') == info_short[infoNum] + 'px');
        if (showContent) {$(this).siblings(contentLayerClass).animate({height: info_extended[infoNum] + 'px'}, speed2);}
        else {$(this).siblings(contentLayerClass).animate({height: info_short[infoNum] + 'px'}, speed2);}
    }
    return false;
}

function collapseContentToHeightLink() // Función para contraer/expandir hasta una altura específica (enlaces adicionales para desplegar)
{
    var contentLayerClass = getCollapseContentClass($(this));
    if (contentLayerClass)
    {
        var infoNum = parseInt(contentLayerClass.substr(contentLayerClass.lastIndexOf('_') + 1), 10) - 1;
        var showContent = ($(this).parent().parent().parent().css('height') == info_short[infoNum] + 'px');
        if (showContent) {$(this).parent().parent().parent().animate({height: info_extended[infoNum] + 'px'}, speed2);}
        else {$(this).parent().parent().parent().animate({height: info_short[infoNum] + 'px'}, speed2);}
    }
    return false;
}

function getCollapseContentClass(jqElement) // Función auxiliar para obtener el nombre de completo de la clase collapse_content_X
{
    var elementClasses = jqElement.attr('class').split(' ');

    for (var i = 0; i < elementClasses.length; i++)
    { 
        if (elementClasses[i].substr(0,15) == 'collapse_header' || elementClasses[i].substr(0,13) == 'collapse_link')
        {return '.collapse_content' + elementClasses[i].substr(15);}
        else if (elementClasses[i].substr(0,16) == 'collapse_content') {return '.collapse_content' + elementClasses[i].substr(16);}
    }
}