/*
 * Composicion de busqueda avanzada
 */
function objetoComposicionBusqueda(composicion,indice,tabMusica,grid){  
	
	this.composicion = composicion;
	this.indice = indice;
	this.idDiv = "composicion" + this.indice;
	this.idMasInformacion= "masInformacion" + this.indice;
	this.idCapaMasInformacion= "capaMasInformacion" + this.indice;	
	this.check01 = "check01-"+this.indice;	
	this.check02 = "check02-"+this.indice;
	this.check03 = "check03-"+this.indice;
	this.check04 = "check04-"+this.indice;
	this.check05 = "check05-"+this.indice;
	this.check06 = "check06-"+this.indice;			
	this.idComposicion = this.composicion.get('idComposicion');
	this.codigoComposicion = this.composicion.get('codigoComposicion');
	this.compositor = this.composicion.get('compositor');
	this.idImagen = 'img'+ this.codigoComposicion;
	this.textoGenero = this.composicion.get('textoGenero');
	this.textoGeneroPadre = this.composicion.get('textoGeneroPadre');
	this.duracion1 = this.composicion.get('duracionFichero1');
	this.duracion2 = this.composicion.get('duracionFichero2');
	this.duracion3 = this.composicion.get('duracionFichero3');
	this.duracion4 = this.composicion.get('duracionFichero4');		
	this.generoBase = this.composicion.get('generoBase');
	this.generoPadre = this.composicion.get('generoPadre');
	this.color = this.composicion.get('color');
	this.novedad = this.composicion.get('novedad');
	this.textoOferta = this.composicion.get('textoOferta');
	this.visNovedad = 'width: 0px; overflow:hidden;';
	this.contenidoPrincipal = null;
	this.elBotonComprarObra = null;
	this.titulo = this.composicion.get('titulo');
	this.fecha = this.composicion.get('fechaRegistroLocale');
	this.compositores = this.composicion.get('compositoresPseudonimo');
	this.interpretes = this.composicion.get('interpretesPseudonimo');
	this.generos = this.composicion.get('listaGeneros');
	this.instrumentos = this.composicion.get('instrumentos');
	this.tempo = this.composicion.get('tempo');
	this.tempoFormato = this.composicion.get('tempoFormato');
	this.notas = this.composicion.get('nota');
	this.compositorPrincipal = this.composicion.get('nombreCompositorPrincipal');
	this.logado = logado;
	this.tabMusica = tabMusica;
	this.imgPlay = "../img/player_play_portal.png";
	this.imgStop = "../img/player_stop_portal.png";
	this.reproduciendo = false;
	this.grid = grid;
	this.duracionOriginal = this.composicion.get('duracionOriginal');
	this.duracion1Formato = this.composicion.get('duracionFichero1Formato');
	this.duracion2Formato = this.composicion.get('duracionFichero2Formato');
	this.duracion3Formato = this.composicion.get('duracionFichero3Formato');
	
	this.seleccion = this.composicion.get('seleccion');
	this.carrito = this.composicion.get('carrito');
	this.duracionCarrito = this.composicion.get('duracionCarrito');
	this.licenciaCarrito = this.composicion.get('licenciaCarrito');
	
	if (this.novedad==true){
		this.visNovedad = 'width: 35px; margin-right: 20px;';
	}
	
	if (this.textoOferta==null) {
		this.visLowcost = 'visibility:hidden';
	}else{
		this.visLowcost = '';
	}	
	
 	this.htmlComposicion = '' +		 				
 				'<div id="{idDiv}" class="composicion">'+
 					'<div class="composicionc0">'+
	 					'<div class="composicionf0">'+
	 					'<div class="c0" style="background-color:{color};"><img src ="../img/punto.png" width="12" height="12"/></div>';			
	if(this.generoPadre==''){
		this.htmlComposicion += '<div class="c1"><b>{subgenero}</b></div>';
	}else{
		this.htmlComposicion += '<div class="c1"><b>{genero}<span style="margin-top: 2px; margin-right: 4px; height: 8px; width: 5px; border-right: 2px solid {color};">&nbsp;</span></b>{subgenero}</div>';
	}				
	this.htmlComposicion += '<div class="c2"><span style="position:relative;top:1px;"><img id={check01} src="../img/radio' + ((this.licenciaCarrito == 1)?"On":"Off") + '.gif" width="10" height="10"/></span><span style="position:relative;top:1px;left:5px;"><img src="../img/silverBox.jpg" width="10" height="10"/></span> <span style="position:relative;top:0px;left:5px;"> Silver </span></div>'+
	 						'<div class="c3"><span style="position:relative;top:1px;"><img id={check04} src="../img/radio' + ((this.duracionCarrito == 1)?"On":"Off") + '.gif" width="10" height="10"/></span> {duracion1Formato}</div>' +
	 						'<div class="c4comprarObra"><a href="javascript:void(0)" '+ (this.carrito?'style="color: #E4103E"':'class=""') + '><span style="position:relative;top:1px;"><img src="../img/carrito' + (this.carrito?'S':'') + '.jpg" width="16" height="13"/></span>'+localize('comprar')+'</a></div>' +
	 					'</div>'+   
						'<div class="composicionf1">'+
							'<div class="c0">&nbsp;</div>'+
							'<div class="c1"><b>{codigoComposicion}</b></div>'+
							'<div class="c2"><span style="position:relative;top:1px;"><img id={check02} src="../img/radio' + ((this.licenciaCarrito == 2)?"On":"Off") + '.gif" width="10" height="10"/></span> <span style="position:relative;top:1px;"><img src="../img/goldenBox.jpg" width="10" height="10"/></span> Gold</div>'+
							'<div class="c3"><span style="position:relative;top:1px;"><img id={check05} src="../img/radio' + ((this.duracionCarrito == 2)?"On":"Off") + '.gif" width="10" height="10"/></span> {duracion2Formato}</div>'+
							'<div class="c4selecciones"><a href="javascript:void(0)" '+ (this.seleccion?'style="color: #E4103E"':'class=""') + '><span style="position:relative;top:1px;"><img src="../img/seleccion' + (this.seleccion?'S':'') + '.jpg" width="11" height="11"/></span> '+localize('misCarpetas')+'</a></div>'+
						'</div>'+
						'<div class="composicionf2">'+
							'<div class="c0">&nbsp;</div>'+
							'<div class="c1" style="color:#dd1144;"><div style="float:left;{visNovedad}"><img src="../img/novedad.png" width="35" height="14"/></div><div class="lowcost" style="{visLowcost}"><img src="../img/lowcost.png" width="60" height="14"/></div></div>'+
							'<div class="c2"><span style="position:relative;top:1px;"><img id={check03} src="../img/radio' + ((this.licenciaCarrito == 3)?"On":"Off") + '.gif" width="10" height="10"/></span> <span style="position:relative;top:1px;"><img src="../img/platinumBox.jpg" width="10" height="10"/></span> Platinum</div>'+
							'<div class="c3"><span style="position:relative;top:1px;"><img id={check06} src="../img/radio' + ((this.duracionCarrito == 3)?"On":"Off") + '.gif" width="10" height="10"/></span> {duracion3Formato}</div>'+
							'<div class="c4masinfo" id="{idMasInformacion}"><a href="javascript:void(0)"><span style="position:relative;top:1px;"><img src="../img/mas.jpg" width="11" height="11"/> </span>'+localize('informacion')+'</a></div>'+
						'</div>'+
					'</div>'+
					'<div class="composicionc1"><a href="javascript:void(0)"><img src="../img/player_play_portal.png" id="{idImagen}" width="40" height="40"></a></div>';
	
	
	this.htmlOferta = '<div class="oferta">{textoOferta}</div>';
	this.htmlPieComposicion = '</div>';
	
	this.htmlComposicion += this.htmlPieComposicion;			
	this.htmlMasInformacion = ''+
		'<div class="composicionmasinfo">' +
			'<div class="composicionmasinfofila">'+ 
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('titulo')+'</div>'+
				'<div class="composicionmasinfoc2">{titulo}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('compositor')+'</div>'+
				'<div class="composicionmasinfoc2">{compositores}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('interprete')+'</div>'+
				'<div class="composicionmasinfoc2">{interpretes}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('generos')+'</div>'+
				'<div class="composicionmasinfoc2">{generos}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('instrumentos')+'</div>'+
				'<div class="composicionmasinfoc2">{instrumentos}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('tempo')+'</div>'+
				'<div class="composicionmasinfoc2">{tempoFormato}</div>'+
			'</div>'+
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('duracionOriginal')+'</div>'+
				'<div class="composicionmasinfoc2">{duracionOriginal}</div>'+
			'</div>'+
		'</div>';
	
	this.htmlNota = ''+			
			'<div class="composicionmasinfofila">'+
				'<div class="composicionmasinfoc0">&nbsp</div>'+
				'<div class="composicionmasinfoc1">'+localize('notas')+'</div>'+
				'<div class="composicionmasinfoc2">{notas}</div>'+
			'</div>';
	
	this.tplComposicion = new Ext.Template(this.htmlComposicion);		
	this.tplComposicion.compile();	
	
	this.tplMasInformacion = new Ext.Template(this.htmlMasInformacion);		
	this.tplMasInformacion.compile();	
	
	this.tplNota = new Ext.Template(this.htmlNota);		
	this.tplNota.compile();	
		
	this.booleanExpandido = false;
				
 	this.pintar = function(){					
 		
 		this.elComposicion = Ext.get('composicionBusqueda').createChild();
		var m = this.duracion1/60;
									
		// si ya existe ese div
		this.contenidoPrincipal = this.tplComposicion.append(this.elComposicion , {
			idDiv: this.idDiv,
			color:this.color,
			genero:this.generoPadre,
		    subgenero: this.generoBase,
		    idMasInformacion:this.idMasInformacion,
		    idCapaMasInformacion:this.idCapaMasInformacion,					    
		    codigoComposicion:this.codigoComposicion,
			duracion1Formato:this.duracion1Formato,
			duracion2Formato:this.duracion2Formato,
			duracion3Formato:this.duracion3Formato,
			check01:this.check01,
			check02:this.check02,
			check03:this.check03,
			check04:this.check04,
			check05:this.check05,
			check06:this.check06,
			compositor:this.compositor,
			idImagen:this.idImagen,
			visNovedad:this.visNovedad,
			visLowcost:this.visLowcost,
			compositorPrincipal: this.compositorPrincipal,
			indice:this.indice,
			textoOferta:this.textoOferta
		});
		
		this.elContenidoPrincipal = Ext.get(this.contenidoPrincipal);
		this.elComposicion.addClass('composicionpadre');
		var padre = this;
		
		// obra a carrito
		this.botonComprarObra = this.elContenidoPrincipal.select('div.c4comprarObra').elements[0];
		this.elBotonComprarObra = Ext.get(this.botonComprarObra);		
		this.elBotonComprarObra.on('click',function(){
			padre.addCarrito(this);
		});
		
		// mas informacion
		this.botonMasInformacion = this.elContenidoPrincipal.select('div.c4masinfo').elements[0];
		this.elBotonMasInformacion = Ext.get(this.botonMasInformacion);		
		this.elBotonMasInformacion.on('click',function(){padre.mostrarMasInformacion();});		

		this.botonPlay = this.elContenidoPrincipal.select('div.composicionc1').elements[0];
		this.elBotonPlay = Ext.get(this.botonPlay);		
		this.elBotonPlay.on('click',function(){padre.clickPlayer();});	
		
		// obra a mis selecciones
		this.botonSelecciones = this.elContenidoPrincipal.select('div.c4selecciones').elements[0];
		this.elBotonSelecciones = Ext.get(this.botonSelecciones);		
		this.elBotonSelecciones.on('click',function(){
			padre.misSelecciones();
			if (logado) {
				this.dom.getElementsByTagName("img")[0].src = '../img/seleccionS.jpg';
				this.dom.firstChild.style.color = "#E4103E";
			}
		});
		
		// elementos checks		
		this.elCheck01 = new checkComposicion(Ext.get("check01-"+this.indice),"");
		this.elCheck02 = new checkComposicion(Ext.get("check02-"+this.indice),"");	
		this.elCheck03 = new checkComposicion(Ext.get("check03-"+this.indice),"");
		this.elCheck04 = new checkComposicion(Ext.get("check04-"+this.indice),this.duracion1);
		this.elCheck05 = new checkComposicion(Ext.get("check05-"+this.indice),this.duracion2);
		this.elCheck06 = new checkComposicion(Ext.get("check06-"+this.indice),this.duracion3);
		
		this.elCheck01.setCheck2(this.elCheck02);
		this.elCheck01.setCheck3(this.elCheck03);
		this.elCheck01.init();
		
		this.elCheck02.setCheck2(this.elCheck01);
		this.elCheck02.setCheck3(this.elCheck03);		
		this.elCheck02.init();	

		this.elCheck03.setCheck2(this.elCheck01);
		this.elCheck03.setCheck3(this.elCheck02);			
		this.elCheck03.init();
		
		this.elCheck04.setCheck2(this.elCheck05);
		this.elCheck04.setCheck3(this.elCheck06);	
		this.elCheck04.init();
		
		this.elCheck05.setCheck2(this.elCheck04);
		this.elCheck05.setCheck3(this.elCheck06);			
		this.elCheck05.init();
		
		this.elCheck06.setCheck2(this.elCheck04);
		this.elCheck06.setCheck3(this.elCheck05);	
		this.elCheck06.init();
	}
	
						
	this.mostrarMasInformacion = function(){
	
		if(this.booleanExpandido==true){
			this.booleanExpandido=false;
			this.elMasInformacion.setHeight(0,true);
			this.elMasInformacion.addClass('composicionmasinfocoll');
			this.elMasInformacion.removeClass('composicionmasinfo');
			this.elMasInformacion.update();
			this.elBotonMasInformacion.child('img').dom.src = "../img/mas.jpg";
		}else{
			if(this.elMasInformacion!=null){
				this.elMasInformacion.remove();
			}
			this.booleanExpandido=true;
			this.divMasInformacion = this.tplMasInformacion.append(this.elComposicion , {titulo:this.titulo
											,compositores:this.compositores,interpretes:this.interpretes
											,generos:this.generos,instrumentos:this.instrumentos
											,tempo:this.tempo,tempoFormato:this.tempoFormato,duracionOriginal:this.duracionOriginal});
														
			this.elMasInformacion = Ext.get(this.divMasInformacion);
			
			if(this.notas!=''){
				this.divNota = this.tplNota.append(this.elMasInformacion ,{notas:this.notas});
			}	
			this.elMasInformacion.setHeight(0);
			this.elMasInformacion.autoHeight(true);
			
			this.elBotonMasInformacion.child('img').dom.src = "../img/menos.jpg";	
		}	
		
	}
		   				    	
	this.addCarrito = function(capaCarrito){
		var licencia = this.licenciaSeleccionada();
		var duracion = this.duracionSeleccionada();
		if((licencia=="")||(duracion=="")){
			Ext.MessageBox.alert(localize("addlibrary"), localize('seleccioneLicDur'));
		}else{	
			this.tabMusica.addCarrito(this.idComposicion,licencia,duracion,"titulo",capaCarrito);
		}		
	}
	
	
	this.misSelecciones = function(){
		if(this.logado==true){
			this.tabMusica.addMisSelecciones(this.idComposicion,"titulo");
		}else{
			Ext.MessageBox.alert(localize("addlibrary"), localize("soloRegist"));
		}		
	}
	
	this.duracionSeleccionada = function(){
		if(this.elCheck04.estado == "on"){
			return 1;
		}
		else if(this.elCheck05.estado == "on"){
			return 2;
		}
		else if(this.elCheck06.estado == "on"){
			return 3;
		}
		return "";
	}
	
	this.licenciaSeleccionada = function(){
		if(this.elCheck01.estado == "on"){
			return constantsAdl("silver");
		}
		else if(this.elCheck02.estado == "on"){
			return constantsAdl("gold");
		}
		else if(this.elCheck03.estado == "on"){
			return constantsAdl("platinum");
		}
		return "";
	}			
	
	this.clickPlayer = function(){
		this.grid.playall = false;
		var imagenEl = Ext.get(this.idImagen);
		if(imagenEl!=null){
			if(this.reproduciendo == false){
				this.play();
			}else{
				this.stop();
			}
		}
	}
	
	this.play = function(){		
		// si hay alguna obra reproduciendose la paramos
		this.grid.stopObraReproduccion();
		
		// Play de la obra
		var duracion = this.duracionSeleccionada();
		if(duracion==''){
			duracion = 1;
		}
		var imagenEl = Ext.get(this.idImagen);
		if(imagenEl!=null){
			this.reproduciendo = true;
			imagenEl.dom.src = this.imgStop;
			if(logado){
				cargarObraPortal(this.compositorPrincipal,this.codigoComposicion,duracion);
			}else{
				cargarObraPortal(this.compositorPrincipal,this.codigoComposicion,1);
			}
		}
		
		// marcamos la obra como obra en reproduccion
		this.grid.setObraReproduccion(this);
		// quitamos el icono de playall
		this.grid.playAllEl.dom.getElementsByTagName("img")[0].src = '../img/playall.gif';
	}
	
	this.stop = function(){
		this.grid.obraReproduccion = null;
		var imagenEl = Ext.get(this.idImagen);
		if(imagenEl!=null){
			this.reproduciendo = false;
			imagenEl.dom.src = this.imgPlay;
			stopPlayerPortal();
		}
		// quitamos el icono de playall
		this.grid.playAllEl.dom.getElementsByTagName("img")[0].src = '../img/playall.gif';
	}
}

/**
 * 	Componente Check
 */	
function checkComposicion(elemento,duracion){
	this.elemento = elemento;
	this.estado = "off";;
	this.duracion = duracion;
	this.check2 = null;
	this.check3 = null;
	
	this.init = function(){
		if(this.duracion==null){
			this.inutilizar();
		}else{
			var padre = this;
			this.elemento.on('click',function(){
				padre.clickado();
			});
		}
	}
	
	this.activar = function(){
		this.estado="on";
		this.elemento.dom.src = "../img/radioOn.gif";
		
		// desactivamos los checks afines
		if(this.check2!=null){
			this.check2.desactivar();
		}
		if(this.check3!=null){
			this.check3.desactivar();
		}
	}
	this.desactivar = function(){
		if(this.estado!="disable"){
			this.estado="off";
			this.elemento.dom.src = "../img/radioOff.gif";
		}
	}
	this.inutilizar = function(){
		this.estado="disable";
		this.elemento.dom.src = "../img/guion.jpg";
	}
	this.clickado = function (){
		if(this.estado=="on"){
			this.desactivar();
		}else{
			if(this.estado=="off"){
				this.activar();
			}
		}
	}
	this.setCheck2 = function (elCheck2){
		this.check2 = elCheck2;
	} 
	this.setCheck3 = function (elCheck3){
		this.check3 = elCheck3;
	} 
}