var percent=0;
var currentID=0;
var loadingLayer=false;
var showScrollTimer=null;

function showScroll(content,id)
{
    try
    {
        if(!id) id=currentID;
        
        IOLayers.getLayerById("scrollbtn").style.top=0;
        switch(id)
        {
            case 0:
            {   
                IOLayers.getLayerById("pastillas").innerHTML=content;
                percent=
                        (
                            3+IOLayers.getHeight(IOLayers.getLayerById("pastillas"))
                            -
                            IOLayers.getHeight(IOLayers.getLayerById("llistat"))
                        )
                        /
                        (
                            IOLayers.getHeight(IOLayers.getLayerById("scroll"))
                            -
                            IOLayers.getHeight(IOLayers.getLayerById("scrollbtn"))
                        )
                        ;
                if(percent<0) percent=0;
                IOLayers.setVisible(IOLayers.getLayerById("scroll"),(percent>0));
                Drag.init(IOLayers.getLayerById("scrollbtn"), 0, IOLayers.getHeight(IOLayers.getLayerById("scroll"))-IOLayers.getHeight(IOLayers.getLayerById("scrollbtn")),IOLayers.getLayerById("scroll"));
                IOLayers.getLayerById("scrollbtn").onDrag = function(y)
                {
                    IOLayers.getLayerById("pastillas").style.top = (y*percent) * (-1) +"px";
                }
                break;
            }
            case 1:
            {
                IOLayers.getLayerById("destacados").innerHTML=content;
                Drag.init(IOLayers.getLayerById("scrollbtn"), 0, IOLayers.getHeight(IOLayers.getLayerById("scroll"))-IOLayers.getHeight(IOLayers.getLayerById("scrollbtn")),IOLayers.getLayerById("scroll"));
                percent=
                        (
                            IOLayers.getHeight(IOLayers.getLayerById("destacados"))
                            -
                            IOLayers.getHeight(IOLayers.getLayerById("llistat"))
                        )
                        /
                        (
                            IOLayers.getHeight(IOLayers.getLayerById("scroll"))
                            -
                            IOLayers.getHeight(IOLayers.getLayerById("scrollbtn"))
                        )
                        ;
                if(percent<0) percent=0;
                IOLayers.setVisible(IOLayers.getLayerById("scroll"),(percent>0));
                IOLayers.getLayerById("scrollbtn").onDrag = function(y)
                {
                    IOLayers.getLayerById("destacados").style.top= (y*percent) * (-1) +"px";
                }
                break;
            }
            case 2:
            {
               IOLayers.getLayerById("channelsdiv").innerHTML="<select id=channelslist name=channelslist>"+content+"</select>";
               IOConfiguration.init("channelslist","selectedchannels");
            }
        }
        
        var a_tags=document.getElementsByTagName('a');
        for (i=0;i<a_tags.length;i++) 
        {
            a_tags[i].onfocus=blur_links;
        }
    }
    catch(ex) {};
    loadingLayer=false;
    if(showScrollTimer!=null)
    {
        try
        {
            clearTimeout(showScrollTimer);
        }
        catch(exc) {};
        showScrollTimer=null;
    }
    showScrollTimer=setTimeout("showLayer();",((id==0)?5:60)*60000); // Update update every 5 min or 60 minutes for destacados
    
}

function blur_links() { this.blur(); } 

function showLayer(id) 
{
    if(loadingLayer==true) 
    {
        if(id==null) alert("Un momento por favor");
        return;
    }
    loadingLayer=true;
    try
    {
        if(id==null) 
        {
            if(currentID!=2) id=currentID;
            else id=0;
        }
        
        currentID=id;
        
        if(isHome())
        {
            IOLayers.getLayerById("tab_ahora").className=(id==0)?"ahora":"destacados";
            IOLayers.getLayerById("tab_destacados").className=(id==1)?"ahora":"destacados";
            
            IOLayers.getLayerById("pastillas").style.display=(id==0)?"block":"none";
            IOLayers.getLayerById("pastillas").style.top=0;
        
        	IOLayers.getLayerById("destacados").style.display=(id==1)?"block":"none";
            IOLayers.getLayerById("destacados").style.top=0;
        
            IOLayers.getLayerById("content").style.display=(id!=2)?"block":"none";
        
        	IOLayers.getLayerById("configuracion").style.display=(id==2)?"block":"none";
            IOLayers.getLayerById("configuracion").style.top=0;
        
        	IOLayers.setVisible(IOLayers.getLayerById("scroll"),false);
        	switch(id)
        	{
        	    case 0:
        	        IOLayers.getLayerById("pastillas").innerHTML="<li>&nbsp;&nbsp;&nbsp;Cargando&nbsp;datos...</li>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getNowInTV&ids='+IOConfig.getParam("channels"), showScroll);
        	        break;
        	    case 1:
        	        IOLayers.getLayerById("destacados").innerHTML="<li>&nbsp;&nbsp;&nbsp;Cargando&nbsp;datos...</li>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getDestacados', showScroll);
        	        break;
        	    case 2:
        	        IOConfiguration.init(null,null);
        	        IOLayers.getLayerById("channelsdiv").innerHTML="<select id=channelslist><option>Cargando&nbsp;datos...</option></select>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getChannels', showScroll);
        	        break;
        	}
        }
        else
        {
            IOLayers.getLayerById("tab_ahora").style.display="none";
            IOLayers.getLayerById("tab_destacados").style.display="none";
            IOLayers.getLayerById("scroll").style.display="none";
            IOLayers.getLayerById("pastillas").style.display=(id!=2)?"block":"none";
        	IOLayers.getLayerById("destacados").style.display=(id!=2)?"block":"none";
            IOLayers.getLayerById("content").style.display=(id!=2)?"block":"none";
        
        	IOLayers.getLayerById("configuracion").style.display=(id==2)?"block":"none";
        
        	switch(id)
        	{
        	    case 0:
        	        IOLayers.getLayerById("pastillas").innerHTML="<li>&nbsp;&nbsp;&nbsp;Cargando&nbsp;datos...</li>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getNowInTV&ids='+IOConfig.getParam("channels"), showScroll);
        	        IOLayers.getLayerById("destacados").innerHTML="<li>&nbsp;&nbsp;&nbsp;Cargando&nbsp;datos...</li>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getDestacados', showScroll);
        	        break;
        	    case 2:
        	        IOConfiguration.init(null,null);
        	        IOLayers.getLayerById("channelsdiv").innerHTML="<select id=channelslist><option>Cargando&nbsp;datos...</option></select>";
        	        IOLayers.fecthContent('http://www.sincroguia.tv/widget//js/../info.php?action=getChannels', showScroll);
        	        break;
        	}
        }
    }
    catch(ex) 
    {
        loadingLayer=false;
    }
}

function wheel(event)
{
        var delta = 0;
        if (!event) event = window.event;
        if (event.wheelDelta) 
        {
            delta = event.wheelDelta/120;
            if (window.opera) delta = -delta;
        } 
        else if (event.detail) 
        { 
             delta = -event.detail/3;
        }
        if (delta) 
        {
            if(Drag.wheel(event,delta*(-20)))
            {
                if (event.preventDefault)
                    event.preventDefault();
	            event.returnValue = false;
            }
        }
        
       event.returnValue = true;
}

function resizeWin(event)
{
    // If no canvas size change...
    if(checkCanvas()==true)
        showLayer(currentID);
}

function initLayers()
{
    if(document.getElementById("widgetbody"))
    {
        document.getElementById("widgetbody").onscroll=function() 
        { 
            if(document.getElementById("widgetbody")) 
                document.getElementById("widgetbody").scrollTo(0,0); 
        };
    }
    IOConfig.loadConfig();
    showLayer(0);
    IODate.init("hora","dia");
        
    if (window.addEventListener)
        window.addEventListener('DOMMouseScroll', wheel, false);
    else window.onmousewheel = document.onmousewheel = wheel;

    if (window.addEventListener)
        window.addEventListener('resize', resizeWin, false);
    else window.onresize = document.onresize = resizeWin;


}

if(typeof IOLayers !="undefined")
{
    IOLayers.registerOnLoad(initLayers);
}
else 
{
    setTimeout("initLayers();",1000);
}


// CANVAS GOOGLE SWITCH ////////////////////////////////

function navigateTo(dest) 
{
    var supported_views = gadgets.views.getSupportedViews();
    gadgets.views.requestNavigateTo(supported_views[dest]);
};

function gotoCanvas() { navigateTo("canvas"); };

function gotoHome() { navigateTo("home"); };

function isHome() { return true; /*(myCanvas=="home" || myCanvas=="");*/ };

function checkCanvas()
{
            var w=0;
        if(window && window.innerWidth) w=window.innerWidth ;
        else if(document && document.documentElement && document.documentElement.clientWidth) w=document.documentElement.clientWidth;
        else if(document && document.body && document.body.clientWidth) w=document.body.clientWidth;
        var h=0;
        if(window && window.innerHeight) h=window.innerHeight ;
        else if(document && document.documentElement && document.documentElement.clientHeight) h=document.documentElement.clientHeight;
        else if(document && document.body && document.body.clientHeight) h=document.body.clientHeight;
        // If NO google canvas selected...
        if( (w>=800 && h>=400) && myCanvas=="home")
        {
            // We must redirect... to load main.js.php with new canvas
            var url=document.location.href;
            url=url.split("?");
            url[0]=url[0].replace("/widget.php","/widgetcanvas.php");
            //document.location.href=url[0]+"?cv=canvas"; // This is from where we control the canvas size change
            return false;
        } 
        else if( (w<800 || h<400) && myCanvas=="canvas")
        {
            // We must redirect... to load main.js.php with new canvas
            var url=document.location.href;
            url=url.split("?");
            url[0]=url[0].replace("/widgetcanvas.php","/widget.php");
            // document.location.href=url[0]+"?cv=home";  // This is from where we control the canvas size change
            return false;
        }
        if(myCanvas=="") myCanvas="home";
    return true;
}

// CANVAS GOOGLE SWITCH ////////////////////////////////