// JScript File
$(document).ready(function() {
  
  // Hago un ciclo por las prendas para tomar las colecciones!
  var colecciones = new String() ;
  $("div.tipoPrenda").each(function(i) {
    var myColeccion = $(this).attr("class").replace(/tipoPrenda /, "") ;
    
    if (  colecciones.indexOf ( myColeccion ) == -1  ) {
      colecciones = colecciones.concat('|');
      colecciones = colecciones.concat(myColeccion);
    }

  });
  colecciones = colecciones.substr (1) ;
  
  // Verifico que si venga texto
  if  (  colecciones.length == 0   )
    return ;
  
  // Cuantas colecciones hay
  var arrColecciones = colecciones.split ("|") ;
  
  // Muestro la información/filtro de las colecciones
  if  (  arrColecciones.length == 1  )
  {
    $("h3.titulo").after("<p class='resaltado colecciones' style='margin:10px 0 0 0;'>Estas viendo la <span class='resaltado2'>" + arrColecciones [0].replace(/coleccion/, "Colección ").replace(/-/, " ") + "</span></p>" ) ;
  }
  else
  {
    $("h3.titulo").after("<p class='resaltado colecciones' style='margin:10px 0 0 0;'>Filtrar las prendas por colección: <select id='seleccionColeccones'><option value='Todas' id='Todas'>Todas</option></select></p>");
    for ( i = 0; i < arrColecciones.length; i++ )
    {
      if  ( arrColecciones [i].substring(arrColecciones [i].length-2,arrColecciones [i].length) == "-0"  )
        $("div."+arrColecciones [i]).addClass ( arrColecciones [0] ) ;
      else
        $("#seleccionColeccones").append("<option value='" + arrColecciones [i] + "' id='Todas'>" + arrColecciones [i].replace(/coleccion/, "Colección ").replace(/-/, " ") + "</option>") ;
    }
  }
  
	// Escondo o muestro las prendas de acuerdo a la seleccion
	$("#seleccionColeccones").change(function() {
		var seleccion = $("#seleccionColeccones").val();
		if (seleccion == 'Todas') {
			$("div.tipoPrenda").show () ;
		} else {
			$("div.tipoPrenda").hide () ;
			$("div."+seleccion).show () ;
		}
	});
});