// Define the  global variables to implement automatic slide show
// To add more panels just add to the array elements and links

var interval = 15000; // set the auto slide show speed in mSec
var extraInterval = 20000; //Allow extra time when viewer clicks a panel
var elements = new Array("element1", "element2", "element3");
var panels = new Array("panel1", "panel2", "panel3");
var formIDs = new Array("form1", "form2", "form3");
var formSyncReq = new Array(1, 1, 1);
// internal global variables for automatic slideshow.
var currPanelID = 0;
var totalPanels = panels.length;
var slideshowID = [];

//Declare the varibale name for sliding panels outside the function so it is global. 
var sp;
function InitPage()
{
sp = new Spry.Widget.SlidingPanels("ticker");
var i;
for (i=0; i<totalPanels; i++)
    {
    	
    }	
Spry.$$("#element1").addEventListener("click", function(){sp.showPanel('panel1');return false; }, false); 
Spry.$$("#element2").addEventListener("click", function(){sp.showPanel('panel2');return false; }, false); 
Spry.$$("#element3").addEventListener("click", function(){sp.showPanel('panel3');return false; }, false); 
}
Spry.Utils.addLoadListener(InitPage);


function toggle(elementID, resetRolling)
{
var i;
for (i=0; i<totalPanels; i++)
    {
    if (elements[i] == elementID)
	{
	document.getElementById(elements[i]).style.backgroundImage = 'url("images/upside_down_tabs_active.png")';
	currPanelID = i;
	if (resetRolling == 1)
	    {
	    // manual click panel will reset slide show.
	    stopSlideShow();
	    // restart with a delay so that in case of manual click user is allowed more time on the panel.
	    setTimeout("restartSlideShow()", extraInterval);
	    }
	}
    else
	{
	document.getElementById(elements[i]).style.backgroundImage = 'url("images/upside_down_tabs_inactive.png")';       
	}
    }
}

function slideshow ()
{
// rotate between panels and chnage button color.
nextPanelID = (currPanelID+1)%elements.length;

if (formSyncReq[nextPanelID] == 1)
    {
    syncFromValues(nextPanelID);
    }
    
toggle(elements[nextPanelID], 0);
sp.showPanel(panels[nextPanelID]);

// update the panel id
currPanelID = nextPanelID;
}

function syncFromValues(nextPanelID)
    {
    document.forms[formIDs[nextPanelID]].city.value = document.forms[formIDs[currPanelID]].city.value;
    document.forms[formIDs[nextPanelID]].state.value = document.forms[formIDs[currPanelID]].state.value;
    document.forms[formIDs[nextPanelID]].zip.value = document.forms[formIDs[currPanelID]].zip.value;
    }

function restartSlideShow()
{
// kill previous slide shows if any and restart new one. This will reset the timer for a manula click on panels.
stopSlideShow();
slideshowID[slideshowID.length] = setInterval("slideshow()", interval);	
}

function stopSlideShow()
{
var j;
for (j=0; j<slideshowID.length; j++)
    {
    window.clearInterval(slideshowID[j]);
    } 
}
slideshowID[0] = setInterval("slideshow()", interval);