// JavaScript Document
var timer = null;
function LayerPlayer()
{
	this.DisplayLayers = new Array();
	this.RelatedLayers = new Array();
	this.CurrenIndex = 0;
	this.WaperTime = 3;
}

function ClearLayers()
{
	this.DisplayLayers.length = 0;
	this.RelatedLayers.length = 0;
}

function AddLayer(dispLayer, relLayer)
{
	relLayer.index = this.RelatedLayers.length - 1;
	this.DisplayLayers.push(dispLayer);
	this.RelatedLayers.push(relLayer);
	relLayer.onclick = ChangeLayer;
}

function Play()
{
	var nextFrame = this.CurrenIndex + 1;
	if (nextFrame >= this.DisplayLayers.length)
	{
		nextFrame = 0;
	}
	if (this.CurrenIndex <= 0) this.CurrenIndex = 0;
	try
	{
		this.DisplayLayers[this.CurrenIndex].style.display = "none";
		this.DisplayLayers[nextFrame].style.display = "block";
		this.RelatedLayers[this.CurrenIndex].className = "";
		this.RelatedLayers[nextFrame].className = "rollbg";
		this.CurrenIndex = nextFrame;
	}
	catch(e)
	{
		alert(this.CurrenIndex);
	}
	timer = window.setTimeout("PlayLayers()", this.WaperTime * 1000);
}

function ResetLayer()
{
	this.DisplayLayers[this.CurrenIndex].style.display = "none";
	this.RelatedLayers[this.CurrenIndex].className = "rollbg";
	if (timer)
	{
		window.clearTimeout(timer);
	}
}

LayerPlayer.prototype.Clear = ClearLayers;
LayerPlayer.prototype.Add = AddLayer;
LayerPlayer.prototype.Play = Play;
LayerPlayer.prototype.ResetLayer = ResetLayer;


var player= new LayerPlayer();

function ChangeLayer()
{
	player.ResetLayer();
	player.CurrenIndex = this.index;
	player.Play();
}

function PlayLayers()
{
	player.Play();
}


function Init2()
{
	for (var i = 0; i <4; i++)
	{
		player.Add(document.getElementById("disp" + i), document.getElementById("rel" + i));
	}
	player.CurrenIndex = 3;
	player.Play();
}

function AddEvent(obj, e, eventHandler)
{
	if (obj.attachEvent)
	{
		obj.attachEvent("on" + e, eventHandler);

	}
	else
	{
		obj.addEventListener(e, eventHandler, false);
	}
}	

AddEvent(window, "load", Init2);