var sp1;
var quotes;
var lastTab="nutshell";

function switchTab(tab)
{
	if (tab!=lastTab)
	{
		document.getElementById(tab).className=("tabActive");
		document.getElementById(lastTab).className=("tab");
		sp2.showPanel(tab+"Panel");
		lastTab=tab;
	}
}

var lastTab2="nutshell2";

function switchTab2(tab2)
{
	if (tab2!=lastTab2)
	{
		document.getElementById(tab2).className=("tabActive2");
		document.getElementById(lastTab2).className=("tab2");
		sp2.showPanel(tab2+"Panel");
		lastTab2=tab2;
	}
}

var lastTab3="nutshell3";
function switchTab3(tab3)
{if (tab3!=lastTab3)
	{	document.getElementById(tab3).className=("tabActive3");
		document.getElementById(lastTab3).className=("tab3");
		sp2.showPanel(tab3+"Panel");
		lastTab3=tab3;}}
		
var lastTab4="nutshell4";
function switchTab4(tab4)
{if (tab4!=lastTab4)
	{	document.getElementById(tab4).className=("tabActive4");
		document.getElementById(lastTab4).className=("tab4");
		sp2.showPanel(tab4+"Panel");
		lastTab4=tab4;}}
		
var lastTab5="nutshell5";
function switchTab5(tab5)
{if (tab5!=lastTab5)
	{	document.getElementById(tab5).className=("tabActive5");
		document.getElementById(lastTab5).className=("tab5");
		sp2.showPanel(tab5+"Panel");
		lastTab5=tab5;}}
		
var lastTab6="nutshell6";
function switchTab6(tab6)
{if (tab6!=lastTab6)
	{	document.getElementById(tab6).className=("tabActive6");
		document.getElementById(lastTab6).className=("tab6");
		sp2.showPanel(tab6+"Panel");
		lastTab6=tab6;}}
		
var lastTab7="nutshell7";
function switchTab7(tab7)
{if (tab7!=lastTab7)
	{	document.getElementById(tab7).className=("tabActive7");
		document.getElementById(lastTab7).className=("tab7");
		sp2.showPanel(tab7+"Panel");
		lastTab7=tab7;}}

var lastTab8="nutshell8";
function switchTab8(tab8)
{if (tab8!=lastTab8)
	{	document.getElementById(tab8).className=("tabActive8");
		document.getElementById(lastTab8).className=("tab8");
		sp2.showPanel(tab8+"Panel");
		lastTab8=tab8;}}
		
var lastTab9="nutshell9";
function switchTab9(tab9)
{if (tab9!=lastTab9)
	{	document.getElementById(tab9).className=("tabActive9");
		document.getElementById(lastTab9).className=("tab9");
		sp2.showPanel(tab9+"Panel");
		lastTab9=tab9;}}
		
var lastTab10="nutshell10";
function switchTab10(tab10)
{if (tab10!=lastTab10)
	{	document.getElementById(tab10).className=("tabActive10");
		document.getElementById(lastTab10).className=("tab10");
		sp2.showPanel(tab10+"Panel");
		lastTab10=tab10;}}
		
var lastTab11="nutshell11";
function switchTab11(tab11)
{if (tab11!=lastTab11)
	{	document.getElementById(tab11).className=("tabActive11");
		document.getElementById(lastTab11).className=("tab11");
		sp2.showPanel(tab11+"Panel");
		lastTab11=tab11;}}

var lastTab12="nutshell12";

function switchTab12(tab12)
{
	if (tab12!=lastTab12)
	{
		document.getElementById(tab12).className=("tabActive12");
		document.getElementById(lastTab12).className=("tab12");
		sp2.showPanel(tab12+"Panel");
		lastTab12=tab12;
	}
}

var lastTab13="nutshell13";
function switchTab13(tab13)
{if (tab13!=lastTab13)
	{	document.getElementById(tab13).className=("tabActive13");
		document.getElementById(lastTab13).className=("tab13");
		sp2.showPanel(tab13+"Panel");
		lastTab13=tab13;}}
		
var lastTab14="nutshell14";
function switchTab14(tab14)
{if (tab14!=lastTab14)
	{	document.getElementById(tab14).className=("tabActive14");
		document.getElementById(lastTab14).className=("tab14");
		sp2.showPanel(tab14+"Panel");
		lastTab14=tab14;}}
		
var lastTab15="nutshell15";
function switchTab15(tab15)
{if (tab15!=lastTab15)
	{	document.getElementById(tab15).className=("tabActive15");
		document.getElementById(lastTab15).className=("tab15");
		sp2.showPanel(tab15+"Panel");
		lastTab15=tab15;}}
		
var lastTab16="nutshell16";
function switchTab16(tab16)
{if (tab16!=lastTab16)
	{	document.getElementById(tab16).className=("tabActive16");
		document.getElementById(lastTab16).className=("tab16");
		sp2.showPanel(tab16+"Panel");
		lastTab16=tab16;}}
		
var lastTab17="nutshell17";
function switchTab17(tab17)
{if (tab17!=lastTab17)
	{	document.getElementById(tab17).className=("tabActive17");
		document.getElementById(lastTab17).className=("tab17");
		sp2.showPanel(tab17+"Panel");
		lastTab17=tab17;}}

var lastTab18="nutshell18";
function switchTab18(tab18)
{if (tab18!=lastTab18)
	{	document.getElementById(tab18).className=("tabActive18");
		document.getElementById(lastTab18).className=("tab18");
		sp2.showPanel(tab18+"Panel");
		lastTab18=tab18;}}
		
var lastTab19="nutshell19";
function switchTab19(tab19)
{if (tab19!=lastTab19)
	{	document.getElementById(tab19).className=("tabActive19");
		document.getElementById(lastTab19).className=("tab19");
		sp2.showPanel(tab19+"Panel");
		lastTab19=tab19;}}
		
var lastTab20="nutshell20";
function switchTab20(tab20)
{if (tab20!=lastTab20)
	{	document.getElementById(tab20).className=("tabActive20");
		document.getElementById(lastTab20).className=("tab20");
		sp2.showPanel(tab20+"Panel");
		lastTab20=tab20;}}
		
var lastTab21="nutshell21";
function switchTab21(tab21)
{if (tab21!=lastTab21)
	{	document.getElementById(tab21).className=("tabActive21");
		document.getElementById(lastTab21).className=("tab21");
		sp2.showPanel(tab21+"Panel");
		lastTab21=tab21;}}
		
var lastTab22="nutshell22";
function switchTab22(tab22)
{if (tab22!=lastTab22)
	{	document.getElementById(tab22).className=("tabActive22");
		document.getElementById(lastTab22).className=("tab22");
		sp2.showPanel(tab22+"Panel");
		lastTab22=tab22;}}


function fadeInNextQuote()
{
	if (!quotes || quotes.length < 1)
		return;

	var curEle;

	if (typeof quotes.curIndex == "undefined")
		quotes.curIndex = quotes.length - 1;
	else
		curEle = quotes[quotes.curIndex];

	quotes.curIndex = (quotes.curIndex+1)%quotes.length;
	var nextEle = quotes[quotes.curIndex];

	if (curEle)
		Spry.Effect.DoFade(curEle, { from: 100, to: 0 });
	Spry.Effect.DoFade(nextEle, { to: 100, finish: function(){ setTimeout(function(){ fadeInNextQuote(); }, fadeInNextQuote.interval); } });
}

fadeInNextQuote.interval = 6000;

Spry.Utils.addLoadListener(function()
{
	// Show the sliding panels tab buttons.

	Spry.$$(".slidingTabPanelWrapper").setStyle("display: block");
	Spry.$$("#nutshell, #widgets, #data, #effects").addEventListener("click", function(){ switchTab(this.id); return false; }, false);	
	Spry.$$("#nutshell2, #widgets2, #data2, #effects2").addEventListener("click", function(){ switchTab2(this.id); return false; }, false);
	Spry.$$("#nutshell3, #widgets3, #data3, #effects3").addEventListener("click", function(){ switchTab3(this.id); return false; }, false);
	Spry.$$("#nutshell4, #widgets4, #data4, #effects4").addEventListener("click", function(){ switchTab4(this.id); return false; }, false);
	Spry.$$("#nutshell5, #widgets5, #data5, #effects5").addEventListener("click", function(){ switchTab5(this.id); return false; }, false);
	Spry.$$("#nutshell6, #widgets6, #data6, #effects6").addEventListener("click", function(){ switchTab6(this.id); return false; }, false);
	Spry.$$("#nutshell7, #widgets7, #data7, #effects7").addEventListener("click", function(){ switchTab7(this.id); return false; }, false);
	Spry.$$("#nutshell8, #widgets8, #data8, #effects8").addEventListener("click", function(){ switchTab8(this.id); return false; }, false);
	Spry.$$("#nutshell9, #widgets9, #data9, #effects9").addEventListener("click", function(){ switchTab9(this.id); return false; }, false);
	Spry.$$("#nutshell10, #widgets10, #data10, #effects10").addEventListener("click", function(){ switchTab10(this.id); return false; }, false);
	Spry.$$("#nutshell11, #widgets11, #data11, #effects11").addEventListener("click", function(){ switchTab11(this.id); return false; }, false);
	Spry.$$("#nutshell12, #widgets12, #data12, #effects12").addEventListener("click", function(){ switchTab12(this.id); return false; }, false);
	Spry.$$("#nutshell13, #widgets13, #data13, #effects13").addEventListener("click", function(){ switchTab13(this.id); return false; }, false);
	Spry.$$("#nutshell14, #widgets14, #data14, #effects14").addEventListener("click", function(){ switchTab14(this.id); return false; }, false);
	Spry.$$("#nutshell15, #widgets15, #data15, #effects15").addEventListener("click", function(){ switchTab15(this.id); return false; }, false);
	Spry.$$("#nutshell16, #widgets16, #data16, #effects16").addEventListener("click", function(){ switchTab16(this.id); return false; }, false);
	Spry.$$("#nutshell17, #widgets17, #data17, #effects17").addEventListener("click", function(){ switchTab17(this.id); return false; }, false);
	Spry.$$("#nutshell18, #widgets18, #data18, #effects18").addEventListener("click", function(){ switchTab18(this.id); return false; }, false);
	Spry.$$("#nutshell19, #widgets19, #data19, #effects19").addEventListener("click", function(){ switchTab19(this.id); return false; }, false);
	Spry.$$("#nutshell20, #widgets20, #data20, #effects20").addEventListener("click", function(){ switchTab20(this.id); return false; }, false);
	Spry.$$("#nutshell21, #widgets21, #data21, #effects21").addEventListener("click", function(){ switchTab21(this.id); return false; }, false);
	Spry.$$("#nutshell22, #widgets22, #data22, #effects22").addEventListener("click", function(){ switchTab22(this.id); return false; }, false);

	
	

	// Turn the slidingPanel region into a real sliding panel widget.

	Spry.$$("#slidingPanel").addClassName("SlidingPanels").setAttribute("tabindex", "0");
	Spry.$$("#slidingPanel > div").addClassName("SlidingPanelsContentGroup");
	Spry.$$("#slidingPanel .SlidingPanelsContentGroup > div").addClassName("SlidingPanelsContent");
	sp2 = new Spry.Widget.SlidingPanels('slidingPanel');

	// Find the quoteBox and setup any quotes inside it for fading.

	Spry.$$(".quoteBox").setStyle("position: relative; height: 260px;");
	quotes = Spry.$$(".quote").setStyle("position: absolute; top: 0px; left: 0px; opacity: 0; filter: alpha(opacity=0);");
	fadeInNextQuote();
});