/*    Variables Requeridas
 *    idSitio = <?php echo $view->idSitio?>
 *    linkAddWidget
 *    linkUpdateIndex
 *    baseUrl
 */
  
$(document).ready(function(){
   // if(google)
     //   google.setOnLoadCallback(init);

    $('#datepicker').datepicker({monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa']});

    if($('#elReloj'))
        ejecutarReloj();

    $(function(){
		$("#sortable").sortable({axis:'y',stop:function(event,ui){
                var lista = $('#sortable').sortable('toArray');
                updateIndex(lista);
        }});
		$("#sortable").disableSelection();

        $("#sortable2").sortable({axis:'y',stop:function(event,ui){
                var lista = $('#sortable2').sortable('toArray');
                updateIndex(lista);
        }});
		$("#sortable2").disableSelection();
	});
    
    if($('#txtCiudad').val())
        buscarCiudades();
});

function save(id)
{
    var url = $('#input_'+id).val();    
    if(url)
    {
        $('#errors_'+id).html('<div style="text-align:center;"><img src="'+baseUrl+'images/ui/loading_24.gif"/></div>');
        $('#errors_'+id).show();
        $.post(linkConfigRss,{id:id,url:url},function(data){
            if(data == 1)
            {
                $('#errors_'+id).html('<div class="success error_widget">Url almacenada</div>')
            }
            else
            {
                $('#errors_'+id).html('<div class="error error_widget">'+data+'</div>')
            }
        });
    }
    else
    {
        $('#errors_'+id).html('<div class="error error_widget">Introduce una dirección</div>');
        $('#errors_'+id).show('slow');
    }
}

function cambiaColumna(lado)
{    
    $('#columna').val(lado);
}

function configura(id)
{    
    $('#config_'+id).show('slow');
}

function cierra(id)
{
    $('#config_'+id).hide('slow');
}

function insertaWidget(tipo)
{
    var index = cuentaWidgets();
    var permiso = permitir(tipo);
    var posicion = $('#columna').val();
    var modo = $('#modo').val();

    loading('Insertando Widget');
    if(permiso === true)
    {
        $.post(linkAddWidget,{tipo:tipo,id_sitio:idSitio,index:index,columna:posicion},function(data){
            if(data != 'false')
            {
                muestraWidget(tipo,data,modo);
            }
            else
                alert('Ha ocurrido un error al insertar el widget, intenta mas tarde.');
        });
    }
    else
    {
          endLoading();
        alert(permiso);
    }
}

function updateIndex(lista)
{
   var total = lista.length;   
   for(i = 0 ; i < total ; i++ )
   {
       var aux = lista[i].split('_');       
       $.post(linkUpdateIndex,{id : aux[1], index : i+1 , columna : $('#columna').val()},function(data){});
   }
}

function cambiaWidget(id,columna)
{
     var widget = document.getElementById("widget_"+id);
     var nuevaColumna = 1;   
     var select = '';     
     if(columna == 1)
     {
        select = '2';
        nuevaColumna = 2;
     }
     
     $('#cambiar_'+id).attr('onClick','cambiaWidget('+id+','+nuevaColumna+')');    
     var clone = $(widget).clone();
     var newContainer = $('#sortable'+select);
     clone.css('display','none');
     $(widget).hide('slow',function(){      
            $(widget).remove();
            newContainer.append(clone);
            clone.show('slow');            
            var lista = $('#sortable'+select).sortable('toArray');
            var total = lista.length;            
            $.post(linkUpdateIndex,{id : id, index : total , columna : nuevaColumna},function(data)
            {
               
            });
     });
}

function permitir(tipo)
{
    //Primero verificamos que este dentro del limite de widgets
    var total = cuentaWidgets();
    if(total <= limite)
    {
        //Permiso en base a el tipo. Solo se permite repetir widgets del tipo RSS
        // tipo 1 = RSS
        if(tipo === 1)
        {
            return true;
        }
        else
        {
            var num = 0;
            $('.'+tipo).each(function(){
                num ++;
            });
            
            if(num > 0)
            {
                return 'Solo se permite insertar un widget de este tipo';                  
            }
            else
                return true;
        }
    }
    else
    {      
        return 'Has alcanzado el límite de widgets permitidos.';
    }
}

function cuentaWidgets()
{
    var num = 0;
    $('.widget').each(function(){
        num ++;
    });
    return (num + 1);
 }
function eliminaWidget(id)
{
    loading('Eliminando Widget');
    $.post(linkDeleteWidget,{id:id},function(data){
        if(data != 'false')
        {
            $('#widget_'+id).hide('slow',function(){
                // Eliminar widgets del DOM
                var widget = document.getElementById("widget_"+id);    
                widget.parentNode.removeChild(widget);

                var num = cuentaWidgets();  
                if(num - 1 <= limite)
                    $('#notices').html('');
                 endLoading();
            });            
        }
        else
        {
            endLoading();
            alert('Ha ocurrido un error al eliminar el widget, intenta mas tarde.');
        }
    });   
}

function muestraWidget(tipo,id,modo)
{
    var columna = '';
    var posicion = $('#columna').val();
    if(posicion == 2)
        columna = '2';
    var container = $('#sortable'+columna);
    var elemento = document.createElement('div');
    var txt = '';
    $(elemento).attr('class','widget '+tipo);
    $(elemento).attr('id','widget_'+id);
    $(elemento).css('display','none');    
       
    switch(tipo)
    {
        //RSS
        case 1: txt = 'RSS';
                break;
        //Calendario
        case 2: txt = 'Calendario';
                break;
        //Clima
        case 3: txt = 'Clima';
                break;
        //Reloj
        case 4: txt = 'Reloj';
                break;
        //Traductor
        case 5: txt = 'Traductor';
                break;
    }

    if(tipo != 1)
    {
        if(modo == 1)
            $(elemento).html('<li class="ui-state-default shortWidget"> '+txt+' <div class="eliminar" onClick="eliminaWidget('+id+')"></div></li>');
        else
            $(elemento).html('<li class="ui-state-default shortWidget"> '+txt+' <div class="eliminar" onClick="eliminaWidget('+id+')"></div><div class="cambiar" onClick="cambiaWidget('+id+')"></div></li>');
    }
    else
    {
        if(modo == 1)
            $(elemento).html('<li class="ui-state-default shortWidget"> '+txt+' <div class="eliminar" onClick="eliminaWidget('+id+')"></div><div class="config" onClick="configura('+id+')"></div></li><div id="config_'+id+'" class="configContainer" style="display:none;">Introduce la Url:<img src="'+baseUrl+'images/ui/close.png" class="closeImg" onClick="cierra('+id+')" style="float:right;"/><div><input type="text" id="input_'+id+'" value="" style="width:110px;"/><img src="'+baseUrl+'images/ui/ok_.png" class="saveImg" onClick="save('+id+')" style="float:right;margin-top:5px;"/></div><div id="errors_'+id+'"></div></div>');
        else
            $(elemento).html('<li class="ui-state-default shortWidget"> '+txt+' <div class="eliminar" onClick="eliminaWidget('+id+')"></div><div class="config" onClick="configura('+id+')"></div><div class="cambiar" onClick="cambiaWidget('+id+')"></div></li><div id="config_'+id+'" class="configContainer" style="display:none;">Introduce la Url:<img src="'+baseUrl+'images/ui/close.png" class="closeImg" onClick="cierra('+id+')" style="float:right;"/><div><input type="text" id="input_'+id+'" value="" style="width:110px;"/><img src="'+baseUrl+'images/ui/ok_.png" class="saveImg" onClick="save('+id+')" style="float:right;margin-top:5px;"/></div><div id="errors_'+id+'"></div></div>');
    }
    container.append(elemento);
    //mostramos el widget
    $(elemento).show('slow',  endLoading());
}

//Constantes para el reloj
var HoraActual , Dia , Horas , Min , Year;
var Dn = 'am';
var StrHora = new String();
var StrFecha = new String();
var Puntos = ':';
var Meses  = [' Enero ' , ' Febrero ' , ' Marzo ' , ' Abril ', ' Mayo ', ' Junio ', ' Julio ', ' Agosto ', ' Septiembre ', ' Obtumbre ', ' Noviembre ' , ' Diciembre' ];
var Dias = [' Lunes ',' Martes ',' Miercoles ',' Jueves ',' Viernes ',' Sabado ',' Domingo '];

function ejecutarReloj()
{

    HoraActual = new Date();
    Horas = HoraActual.getHours()
    Min = HoraActual.getMinutes();
    Sec = HoraActual.getSeconds();
    Year = HoraActual.getFullYear();
    Dia = HoraActual.getDay();
    DiaNum = HoraActual.getDate();
    Mes = HoraActual.getMonth();
    
    // Formato Hora ...
    if (Horas>= 12)
    {
      Dn='pm'; // si pasan de las 12 será PM
      Horas = Horas-12; // la hora de 0 a 12
    }
    if (Horas == 0) Horas = 12; // las 0 horas serán las  12
    if (Min <= 9) Min ='0'+ Min ; // formateamos los minutos con dos caracteres
    if (Sec <= 9) Sec ='0'+ Sec; // formateamos los segundos con dos caracteres
    // creamos el código HTML del texto
    // Parpadeo ----
    //if (Puntos == ':')  Puntos = ' ';
    //else if (Puntos = ' ')  Puntos = ':';
    // creamos el código HTML del texto
    StrHora ='<span class=relojHoras>' + Horas + '</span>' + Puntos + '<span class=relojMinutos>'+ Min + '</span>' + Puntos + '<span class=relojSegundos>' + Sec + '</span><span class=relojAmPm>'+ Dn + '</span>';
    StrFecha = '<span class=fechaDiaSemana>' + Dias[Dia-1] + '</span><span class=fechaDia>' + DiaNum+ '</span><span class=fechaDia>'+ Meses[Mes] + '</span><span class=fechaMes>'  + Year + '</span><span class=fechaAño>';
    if(document.getElementById('elReloj'))
        document.getElementById('elReloj').innerHTML = StrHora;
    if(document.getElementById('Fecha'))
        document.getElementById('Fecha').innerHTML = StrFecha;
    setTimeout('ejecutarReloj()',500);

}

function buscarCiudades()
{
    var ciudad = jQuery.trim($('#txtCiudad').val());
    if (ciudad) {
        
        //llamamos al script php mediante ajax        
        $.post(linkClimaBusqueda,{ciudad:ciudad}, function(resultado) { 
            if (resultado.error) {
                alert(resultado.mensaje);
            }
            else {
                var i=0;
                var _html = '';

                for (i=0; i<resultado.ciudades.length; i++) {
                    _html += '<option value="'+resultado.ciudades[i].localidad_id+'">'+resultado.ciudades[i].nombre+'</option>';
                }

                $('#cmbCiudades').html(_html);                
                obtenerClima();
            }
        }, 'json');
    } else {
        alert('Escribe el nombre de una ciudad');
}
}

function obtenerClima()
{
    var localidad_id = $('#cmbCiudades').val();
    if (localidad_id) {
        //llamamos al script php mediante ajax       
        $.post(linkClima,{localidad_id:localidad_id}, function(resultado) {
            if (resultado.error)
                alert(resultado.mensaje);
            else {
                var clima = resultado.clima;

                $('#lblLocalidad').html(clima.localidad);
                $('#lblFecha').html(clima.fecha);
                $('#lblEstado').html(clima.estado);
                $('#lblTemperatura').html(clima.temperatura);
                $('#imgEstado').html('<img src="'+baseUrl+'images/clima/93x93/'+clima.codigo+'.png">');
                $('#panelResultados').css('display', 'block');

                $('#imgHoy').html('<img src="'+baseUrl+'images/clima/31x31/'+clima.hoy_codigo+'.png">');
                $('#lblHoyMin').html(clima.hoy_min);
                $('#lblHoyMax').html(clima.hoy_max);

                $('#imgMan').html('<img src="'+baseUrl+'images/clima/31x31/'+clima.man_codigo+'.png">');
                $('#lblManMin').html(clima.man_min);
                $('#lblManMax').html(clima.man_max);

            }
        }, 'json');
    } else {
        alert('Selecciona una ciudad');
    }
}

/*function init() {
  var src = document.getElementById('src');
  var dst = document.getElementById('dst');
  var i=0;
  for (l in google.language.Languages) {
    var lng = l.toLowerCase();
    var lngCode = google.language.Languages[l];
    if (google.language.isTranslatable(lngCode)) {
      src.options.add(new Option(lng, lngCode));
      dst.options.add(new Option(lng, lngCode));
    }
  }

  google.language.getBranding('branding', { type : 'vertical' });

  submitChange();
}*/

function submitChange()
{
  var value = document.getElementById('source').value;
  var src = document.getElementById('src_lng').value;
  var dest = document.getElementById('dst_lng').value;
  google.language.translate(value, src, dest, translateResult);
  return false;
}

function translateResult(result)
{
  var resultBody = document.getElementById("results_body");
  if (result.translation) {
    var str = result.translation.replace('>', '&gt;').replace('<', '&lt;');
    resultBody.innerHTML = str;
  } else {
    resultBody.innerHTML = '<span style="color:red">Error Translating</span>';
  }
}

function invertir()
{
    var src = document.getElementById('src_lng').value;
    var dest = document.getElementById('dst_lng').value;
    
    $('#src_'+dest).attr('selected','selected');
    $('#dst_'+src).attr('selected','selected');
}

function loading(texto)
{
    $('#load').html('<img src="'+baseUrl+'images/ui/loading.gif" /><br/>'+texto);    
}

function endLoading()
{
    $('#load').html('');    
}