$(function() {
	$("#CIUDAD").autocomplete({
			source: "/suggest.phtml",
			minLength: 3
	});	
});

function cambiarTamanoWidget(clase){
	
	document.getElementById('tipoWidget').value=clase;
	
	document.getElementById('doscien').className = '';
	document.getElementById('trescien').className = '';
	
	document.getElementById(clase).className = 'current';
	if(document.getElementById('f_prevision') != null){
		var tipo = 'prevision';
		var height=325;
		if (clase == 'trescien'){
			var height=310;
		}
		document.getElementById('f_prevision').className=clase;
	}
	else if(document.getElementById('f_normal') != null){
		var tipo = 'normal';
		var height=280;
		if (clase == 'trescien'){
			var height=260;
		}
		document.getElementById('f_normal').className=clase;
	}
	else if(document.getElementById('f_basico') != null){
		var tipo = 'basico';
		var height=85;
		if (clase == 'trescien'){
			var height=60;
		}
		document.getElementById('f_basico').className=clase;
	}
	var width=174;
	if(clase=='trescien'){
		width=300;
	}
	var colorTexto = document.getElementById('texto').value;
	var colorLink = document.getElementById('link').value;
	var colorBorde = document.getElementById('borde').value;
	var colorFondo = document.getElementById('fondo').value;
	var ciudad = document.getElementById('urlCiudad').value;
	var pais = document.getElementById('urlPais').value;
	
	document.getElementById('areaTexto').style.display = 'none';
	document.getElementById('areaTexto').value = '<!--El Tiempo en '+ciudad+' '+pais+' para tu web - código HTML - el-tiempo.com --><script src="http://widgets.hispavista.com/cargarWidget.php?url=http://widgets.hispavista.com/widgets/elTiempo.xml&codWidget=6&height='+ height +'&width='+ width +'&pais='+ pais +'&ciudad='+ ciudad +'&tamano='+ clase +'&tipo='+ tipo +'&texto='+ colorTexto +'&fondo='+ colorFondo +'&borde='+ colorBorde +'&link='+ colorLink +'"></script><noscript><a class="tiempo_widget" href="http://el-tiempo.com/'+pais+'/'+ciudad+'/" style="font-size:11px; margin-left:5px" target="_blank">El tiempo en '+ciudad+'</a></noscript><!--fin del widget-->';
	
	setTimeout("document.getElementById('areaTexto').style.display = '';", 800);
	
}

function cargarWidget(tipo)
{
	var colorTexto = document.getElementById('texto').value;
	var colorLink = document.getElementById('link').value;
	var colorBorde = document.getElementById('borde').value;
	var colorFondo = document.getElementById('fondo').value;
	var tamano = document.getElementById('tipoWidget').value;
	var ciudad = document.getElementById('CIUDAD').value;
	
	var param = "TIPO=" + tipo + "&CIUDAD=" + ciudad + "&TAMANO=" + tamano + "&COLORTEXTO=" + colorTexto + "&COLORLINK=" + colorLink + "&COLORBORDE=" + colorBorde + "&COLORFONDO=" + colorFondo + "&codWidget=6";
	$.ajax({url: '/colocarWidgetTipoCiudad.phtml',
		type: 'POST',
		data: param,
		dataType: 'html',
		success: function(resultado){
			$('#superwright').fadeOut('fast', function() {
				$('#superwright').html(resultado).fadeIn('fast');
				document.getElementById('basico').className="primero";
				document.getElementById('normal').className="";
				document.getElementById('prevision').className="";
				if(tipo == 'basico'){
					document.getElementById(tipo).className="primero current";
				}
				else{
					document.getElementById(tipo).className="current";
				}
			});
		}
	});
	
} // Fin cargarWidget

function iniciarWidget(tipo, ciudad, pais){
	
	var colorTexto = document.getElementById('texto').value;
	var colorLink = document.getElementById('link').value;
	var colorBorde = document.getElementById('borde').value;
	var colorFondo = document.getElementById('fondo').value;
	var tamano = 'doscien';
	
	if(ciudad != ""){
		var ciudad = ciudad + "(" + pais + ")";
	}
	else{
		var ciudad = 'Barcelona';
	}
	
	var param = "TIPO=" + tipo + "&CIUDAD=" + ciudad + "&TAMANO=" + tamano + "&COLORTEXTO=" + colorTexto + "&COLORLINK=" + colorLink + "&COLORBORDE=" + colorBorde + "&COLORFONDO=" + colorFondo + "&codWidget=6";
	$.ajax({url: '/colocarWidgetTipoCiudad.phtml',
		type: 'POST',
		data: param,
		dataType: 'html',
		success: function(resultado){
			$('#superwright').fadeOut('fast', function() {
				$('#superwright').html(resultado).fadeIn('fast');
				document.getElementById('basico').className="primero";
				document.getElementById('normal').className="";
				document.getElementById('prevision').className="";
				if(tipo == 'basico'){
					document.getElementById(tipo).className="primero current";
				}
				else{
					document.getElementById(tipo).className="current";
				}
			});
		}
	});
	
} // Fin iniciarWidget

function cargarContenidoWidget(){
	
	if(document.getElementById('f_prevision') != null){
		var tipo = "prevision";
	}
	else if(document.getElementById('f_basico') != null){
		var tipo = "basico";
	}
	else {
		var tipo = "normal";
	}
	
	var colorTexto = document.getElementById('texto').value;
	var colorLink = document.getElementById('link').value;
	var colorBorde = document.getElementById('borde').value;
	var colorFondo = document.getElementById('fondo').value;
	var tamano = document.getElementById('tipoWidget').value;
	var ciudad = document.getElementById('CIUDAD').value;
	var param = "CIUDAD=" + ciudad + "&TIPO=" + tipo + "&TAMANO=" + tamano + "&COLORTEXTO=" + colorTexto + "&COLORLINK=" + colorLink + "&COLORBORDE=" + colorBorde + "&COLORFONDO=" + colorFondo + "&WIDTH=174&HEIGHT=300" + "&codWidget=6";
	$.ajax({url: '/colocarWidgetTipoCiudad.phtml',
		type: 'POST',
		data: param,
		dataType: 'html',
		success: function(resultado){
			$('#superwright').fadeOut('fast', function() {
				$('#superwright').html(resultado).fadeIn('fast');
			});
		}
	});
	
} // Fin cargarContenidoWidget

function pintarWidget(){

	var colorTexto = document.getElementById('texto').value;
	var colorLink = document.getElementById('link').value;
	var colorBorde = document.getElementById('borde').value;
	var colorFondo = document.getElementById('fondo').value;
	
	var tipoWidget = document.getElementById('tipoWidget').value;
	
	if(document.getElementById('f_prevision') != null){
		var elem = document.getElementById('f_prevision');
	}
	else if(document.getElementById('f_normal') != null){
		var elem = document.getElementById('f_normal');
	}
	else if(document.getElementById('f_basico') != null){
		var elem = document.getElementById('f_basico');
	}
	
	elem.style.color = '#'+colorTexto;
	elem.style.background = '#'+colorFondo;
	elem.style.border = '3px solid #'+colorBorde;
	
	document.getElementById('enlace').style.color = '#'+colorLink;
	
	if ($('#doscien').hasClass('current')){
		var clase = 'doscien';
	}
	else{
		var clase = 'trescien';
	}	
	
	if(document.getElementById('f_prevision') != null){
		var tipo = 'prevision';
		var height=325;
		if (clase == 'trescien'){
			var height=310;
		}
	}
	else if(document.getElementById('f_normal') != null){
		var tipo = 'normal';
		var height=280;
		if (clase == 'trescien'){
			var height=260;
		}
	}
	else if(document.getElementById('f_basico') != null){
		var tipo = 'basico';
		var height=85;
		if (clase == 'trescien'){
			var height=60;
		}
	}
	var width=174;
	if(clase=='trescien'){
		width=300;
	}
	var ciudad = document.getElementById('urlCiudad').value;
	var pais = document.getElementById('urlPais').value;
	
	document.getElementById('areaTexto').style.display = 'none';
	document.getElementById('areaTexto').value = '<!--El Tiempo en '+ciudad+' '+pais+' para tu web - código HTML - el-tiempo.com --><script src="http://widgets.hispavista.com/cargarWidget.php?url=http://widgets.hispavista.com/widgets/elTiempo.xml&codWidget=6&height='+ height +'&width='+ width +'&pais='+ pais +'&ciudad='+ ciudad +'&tamano='+ clase +'&tipo='+ tipo +'&texto='+ colorTexto +'&fondo='+ colorFondo +'&borde='+ colorBorde +'&link='+ colorLink +'"></script><noscript><a class="tiempo_widget" href="http://el-tiempo.com/'+pais+'/'+ciudad+'/" style="font-size:11px; margin-left:5px" target="_blank">El tiempo en '+ciudad+'</a></noscript><!--fin del widget-->';
	
	setTimeout("document.getElementById('areaTexto').style.display = '';", 800);
	
} // Fin pintarWidget
