/*    Variables Requeridas
 *    idSitio = <?php echo $view->idSitio?>
 *    linkAddWidget
 *    linkUpdateIndex
 *    baseUrl
 */

  var editorHtmlWidget = false;
$(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);
            }
        });

        //Se comento la siguiente linea ya que evita la edicion en los widgets de rss y de twitter
        //$("#sortable").disableSelection();

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


function initializeCodeMirror(contentIni)
{
    //Elimina los bloques anteriores de codigo, para que siempre se inicializa segun el id y contenido
    $('.CodeMirror-wrapping').each(function()
    {
        $(this).remove();
    });

    //Elimina los avisos anteriores acerca de las acciones realizadas
    $('#erroresWidgetHTML').html('');

    editorHtmlWidget = CodeMirror.fromTextArea('textAreaModal', {
            parserfile: linkParserHtmlJs,
            stylesheet: linkXmlColor,
            path: linkBaseJs,
            height: "300px",
            width: "350px",
            continuousScanning: 500,
            lineNumbers: true,
            content: contentIni
        });
}

function saveCodeWidgetHTML(id, url, tipo)
{
    //En ralacion a los del
    var strHtml,idShowMsgError,strHtmlTrim;
    idShowMsgError = 'erroresWidgetHTML';

    strHtml = editorHtmlWidget.getCode();
    strHtmlTrim = $.trim(strHtml);
    if(strHtmlTrim.length)
    {
        $('#input_'+id).val(strHtml);

        $.post(url,{
            id:id,
            content:strHtml
        },function(data){
            if(data == 'true')
            {
                $('#'+idShowMsgError).html('<div class="success error_widget">Cambio realizado</div>');

                //Se guardo correctamente, se deben de mostrar los botones iniciales
                reeditarBotonesInicio(id);
            }
            else
            {
                $('#'+idShowMsgError).html('<div class="error error_widget">'+data+'</div>');

                //Hubo un error al guardar, mostrar el boton adicional de guardado sin validacion
                reeditarBotones(id);
            }
        });
    }
    else
    {
        $('#'+idShowMsgError).html('<div class="error error_widget">Introduce la información</div>');
        $('#'+idShowMsgError).show('slow');
    }
}


function save(id,tipo)
{
    var idShowMsgError = '';
        idShowMsgError = 'errors_'+id;


    var content = $('#input_'+id).val();
    var contentTrim = $.trim(content);
    if(contentTrim.length)
    {
        $('#'+idShowMsgError).html('<div style="text-align:center;"><img src="'+baseUrl+'/images/ui/loading_24.gif"/></div>');
        $('#'+idShowMsgError).show();
        $.post(linkConfigWidget,{
            id:id,
            content:content
        },function(data){
            if(data == 1)
            {
                $('#'+idShowMsgError).html('<div class="success error_widget">Cambio realizado</div>')
            }
            else
            {
                $('#'+idShowMsgError).html('<div class="error error_widget">'+data+'</div>')
            }
        });
    }
    else
    {
        $('#'+idShowMsgError).html('<div class="error error_widget">Introduce la información</div>');
        $('#'+idShowMsgError).show('slow');
    }
}

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

function configura(id, tipo)
{
    if(tipo == 7)  //Si es un widget de tipo HTML
    {
        showFormWidgetHTML(id);
    }
    else
    {
        $('#config_'+id).show('slow');
    }
}

function showFormWidgetHTML(id)
{
    $('#widgetHTMLDIV').dialog(
    {
        modal:true,
        resizable:false,
        width:750,
        height:500,
        draggable: true,
        buttons:
        {
            Guardar: function()
            {
                var url = $('#urlValidaHtml').val();
                saveCodeWidgetHTML(id, url, 10);
            },

            Cerrar: function()
            {
                $( this ).dialog( "close" );
            }
        }
    });

    //Inicializa el text area con el code mirror y el texto inicial
    initializeCodeMirror($('#input_'+id).val());
}

function reeditarBotones(id)
{
    var url = 0;
    $("#widgetHTMLDIV").dialog("option",
                               "buttons",
                               {
                                   "Validar y Guardar": function()
                                                            {
                                                                url = $('#urlValidaHtml').val();
                                                                saveCodeWidgetHTML(id, url, 10);
                                                            },

                                   "Guardar sin Validar": function()
                                                            {
                                                                url = $('#urlGuardaSinValidarHtml').val();
                                                                saveCodeWidgetHTML(id, url, 10);
                                                            },

                                   "Cerrar": function()
                                                            {
                                                                $( this ).dialog( "close" );
                                                            }
                                });
}


function reeditarBotonesInicio(id)
{
    var url = 0;
    $("#widgetHTMLDIV").dialog("option",
                               "buttons",
                               {
                                   "Guardar": function()
                                                            {
                                                                url = $('#urlValidaHtml').val();
                                                                saveCodeWidgetHTML(id, url, 10);
                                                            },

                                   "Cerrar": function()
                                                            {
                                                                $( this ).dialog( "close" );
                                                            }
                                });
}

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();
    var enabledEshop = $('#enabledEshop').val();
    
//    if(tipo == 8 && enabledEshop == 0)
//    {
//        alert(tipo);
//        alert('No haz activado la tienda');
//    }
//    else
    //{
        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,posicion);
                }
                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 = '';
    //console.log('col= '+columna);
    if(parseInt(columna) == 1)
    {
        select = '2';
        nuevaColumna = 2;
    }
    //console.log('nuevaCol= '+nuevaColumna);
     
    $('#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 y HTML
        // tipo 1 = RSS
        // tipo 10 = widget html
        if(tipo === 1 || tipo === 7)
        {
            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,pos)
{
    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');    

    var url = $('#urlValidaHtml').val();
    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;
        //Twitter Profile
        case 6:
            txt = 'Twitter';
            break;
        //Widget HTML
        case 7:
            txt = 'HTML';
            break;
        case 8:
            txt = 'Catálogo';
            break;
    }


    switch(tipo)
    {
        case 1:
        case 6:
            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+', '+tipo+')"></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+', '+tipo+')" 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+', '+tipo+')"></div><div id="cambiar_'+id+'" class="cambiar" onClick="cambiaWidget('+id+','+pos+')"></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+', '+tipo+')" style="float:right;margin-top:5px;"/></div><div id="errors_'+id+'"></div></div>');
            break;

        //Calendario
        case 2:
        case 3:
        case 4:
        case 5:
        case 8:
            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 id="cambiar_'+id+'" class="cambiar" onClick="cambiaWidget('+id+','+pos+')"></div></li>');
            break;

        case 7:
            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+', '+tipo+')"></div></li><div id="config_'+id+'" class="configContainer" style="display:none;">Introduce tu codigo HTML:<img src="'+baseUrl+'/images/ui/close.png" class="closeImg" onClick="cierra('+id+')" style="float:right;"/><div><textarea id="input_'+id+'" value="" style="width:100px;"></textarea><img src="'+baseUrl+'/images/ui/ok_.png" class="saveImg" onClick="saveCodeWidgetHTML('+id+', \''+url+'\', '+tipo+')" 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+', '+tipo+')"></div><div id="cambiar_'+id+'" class="cambiar" onClick="cambiaWidget('+id+','+pos+')"></div></li><div id="config_'+id+'" class="configContainer" style="display:none;">Introduce tu codigo HTML:<img src="'+baseUrl+'/images/ui/close.png" class="closeImg" onClick="cierra('+id+')" style="float:right;"/><div><textarea id="input_'+id+'" value="" style="width:100px;"></textarea><img src="'+baseUrl+'/images/ui/ok_.png" class="saveImg" onClick="saveCodeWidgetHTML('+id+', \''+url+'\', '+tipo+')" style="float:right;margin-top:5px;"/></div><div id="errors_'+id+'"></div></div>');
            break;
    }

    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 ', ' Octubre ', ' 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=fechaMes>'+ Meses[Mes] + '</span><span class=fechaAño> '  + Year + ' </span>';
    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('');    
}