// Ocultacion de elementos al cargar la pagina
(function(){
	document.documentElement.className = 'js';
})();

window.addEvent('domready', function(){
	//var instTip = new Tip();
	var instHoverRow = new HoverRow();
	var instPlayIcon = new PlayIcon();
	var instCebras = new Cebras();
	var instSinc = new ListaSincronizacion({
		variosVisiblesSimultaneamente: true // permite o no que se muestren varios temas desplegados a la vez. Por defecto false
	});
})

var Tip = new Class({
  Implements: [Options],
  options: {
    titleTemaAudio  : '#player-audio li a[title]',
    tipAudio: {
        aparicion   : 100,
        ocultacion  : 50,
        clase       : 'tooltip',
        fixed       : true
    }
  },
  initialize: function(options){
    this.setOptions(options);
    this.showTips();
  },
  showTips: function(){
    var links = $$(this.options.titleTemaAudio);
    var tooltips = new Tips(links,{
        showDelay: this.options.tipAudio.aparicion,
        hideDelay: this.options.tipAudio.ocultacion,
        className: this.options.tipAudio.clase,
        fixed: this.options.tipAudio.fixed,
        offsets: {
          'y': -10
        }
    })
  }
})


var HoverRow = new Class({
  Implements: [Options],
  options: {
    selectorFilaTabla: '.doble tr',
	selectorFilasPares: '.doble table tr:nth-child(2n)',
	claseFilasPares: 'par',
    claseHover: 'hover'
  },
  initialize: function(options){
    this.setOptions(options);
    this.hoverIE();
	this.pintaFilasPares();
  },
  hoverIE: function(){
    if(!this.isIE6()) return;
    var filaTabla = $$(this.options.selectorFilaTabla);
    filaTabla.each(function(el){
      el.addEvent('mouseover', function(){
        el.getChildren().addClass(this.options.claseHover)
      }.bind(this))
      el.addEvent('mouseout', function(){
        el.getChildren().removeClass(this.options.claseHover)
      }.bind(this))
    }.bind(this))
  },
  isIE6: function(){
    return (Browser.Engine.trident4);
  },
  pintaFilasPares: function(){
	$$(this.options.selectorFilasPares).each(function(el){
		el.addClass(this.options.claseFilasPares);
	}.bind(this))
  }
})

var Cebras = new Class({
	Implements: [Options],
	options: {
		selectorTablaTonos: '#tonos table tr:nth-child(2n)',
		claseFilasPares: 'par'
	},
	initialize: function(options){
		this.setOptions(options);
		this.pintaTabla($$(this.options.selectorTablaTonos), this.options.claseFilasPares);
	},
	pintaTabla: function(filas, clase){
		filas.addClass(clase);
	}
})

var ListaSincronizacion = new Class({
	Implements: [Options],
	options: {
		selectorTituloTema: '.sincronizacion .artista-cancion h3',
		selectorCapaColapsable: 'div.album',
		claseOculto: 'ocultojs',
		claseDesplegado: 'desplegado',
		titleLinkMostrar: 'Mostrar',
		titleLinkOcultar: 'Plegar',
		prefijoIdPlayer: 'player_',
		variosVisiblesSimultaneamente: false // permitir o no que haya varios items desplegados 
	},
	initialize: function(options){
		this.setOptions(options);
		this.alternaVisibilidad($$(this.options.selectorTituloTema));
	},
	alternaVisibilidad: function(titulo){				
		titulo.each(function(el){
			var link = new Element('a',{
				href: '#',
				title: this.options.titleLinkMostrar,
				text: el.get('text')
			})
			el.set('text', '');
			el.adopt(link);			
			link.addEvent('click', function(ev){
				if(!this.options.variosVisiblesSimultaneamente) this.ocultaTodos(titulo, link);
				link.getParent('div').toggleClass(this.options.claseDesplegado);
				link.getParent('div').getNext(this.options.selectorCapaColapsable).toggleClass(this.options.claseOculto);					
				this.alternaTextoTitle(link, link.getParent('div').getNext(this.options.selectorCapaColapsable));		
				ev.stop();
			}.bind(this))
		}.bind(this))
	},
	alternaTextoTitle: function(enlace, capaColapsable){
		capaColapsable.hasClass(this.options.claseOculto) 
		? enlace.set('title', this.options.titleLinkMostrar)
		: enlace.set('title', this.options.titleLinkOcultar)	
	},
	ocultaTodos: function(titulos, actual){
		titulos.each(function(el){
			if(el != actual.getParent('h3')){
				if(el.getParent('div').hasClass(this.options.claseDesplegado)){
					el.getParent('div').removeClass(this.options.claseDesplegado);
				}
				el.getParent('div').getNext(this.options.selectorCapaColapsable).addClass(this.options.claseOculto);
			}
			el.getElement('a').set('title', this.options.titleLinkMostrar);
		}.bind(this))
	}
})

var PlayIcon = new Class({
  Implements: [Options],
  options: {
    selectorThumbVideoPlayer  : 'div.thumbnails li a',
    selectorThumbVideoPromos  : 'div.thumbnails .imagen a',
    imgSrc                    : '/frontend/css/img/play.png',
    imgSrcIE6                 : '/frontend/css/img/play.gif',
    claseImagen               : 'play'
  },
  initialize: function(options){
    this.setOptions(options);
    this.addPlayIcon($$(this.options.selectorThumbVideoPlayer));
    this.addPlayIcon($$(this.options.selectorThumbVideoPromos));
  },
  addPlayIcon: function(elemento){
    elemento.each(function(el){
      var img = new Element('img',{alt: '', 'class':
this.options.claseImagen})
      if(!this.isIE6()){
        img.setProperty('src', this.options.imgSrc);
      }
      else{
        img.setProperty('src', this.options.imgSrcIE6);
      }
      el.grab(img);
    }.bind(this))
  },
  isIE6: function(){
    return (Browser.Engine.trident4);
  }
})
