var slideshow = new Class({
	initialize: function()
	{
		this.elements = new Object();
		this.currentPicture = 0;
		this.slideShowTimer = 6;
    },
    createGUI: function()
    {
    	this.elements["container"] = new Element("div");
    	this.elements["container"].setStyles({'z-index':'1000','position':'absolute','width':'450px','margin-left':'-225px','left':'50%','height':'400px','top':'50px'});
    	this.elements["container"].fx = new Fx.Styles(this.elements["container"],{'duration':400,'wait':false});
		this.elements["pictureContainer"] = new Element("div");
    	this.elements["pictureContainer"].setStyles({'text-align':'center','padding':'10px','background':'transparent','text-align':'center'});
    	var self = this;
    	this.elements["pictureContainer"].fx = new Fx.Styles(this.elements["pictureContainer"],{'duration':400,'wait':false,'onComplete':function()
		{
			self.elements["picture"].setStyle("display","none");
			self.elements["picture"].setStyle("position","static");
			self.elements["picture"].setStyle("top","auto");
			self.elements["picture"].fadeIn();
		}
		});
		this.elements["container"].adopt(this.elements["pictureContainer"]);

		this.createNavigator();
		//document.body.appendChild(this.elements["container"]);
    },
    createPicture: function()
    {
    	if (this.elements["pictureContainer"]!=null)
		{
	    	this.pictureChange = true;
	    	if (this.elements["picture"]!=null)
			{
				var self = this;
				this.elements["picture"].fadeOut(function(){self.elements["picture"].remove();self.elements["picture"]=null;self.createPicture();});
				return null;
			}
	    	this.elements["picture"] = new Element("img");
	    	var self = this;
			this.elements["picture"].onload = function(){
				var width = (this.getSize()["size"]["x"]+20);
				var height = this.getSize()["size"]["y"];
				if (document.all) width=620;
				if (document.all) height=400;

				var marginLeft = 0;
				if (width<450)
				{
					marginLeft = (450-width)/2;
					width=450;
					self.elements["picture"].setStyle("margin-left",marginLeft+"px");
				}
				self.elements["pictureContainer"].fx.start({'height':height});
				self.elements["container"].fx.start({'width':width,'margin-left':((width/2)*-1)});
				if (self.slideshow==true)
				{
					self.slideShowNext();
				}
				self.pictureChange = false;
			};
	    	this.elements["picture"].setProperty("src",this.pictures[this.currentPicture].image);
	    	this.elements["picture"].setStyles({"position":"absolute","top":"-100000px"});
	    	this.elements["pictureContainer"].adopt(this.elements["picture"]);
	    }
    },
    createNavigator: function()
    {
    	var self = this;
    	this.elements["navigatorContainer"] = new Element("div");
    	this.elements["navigatorContainer"].setStyles({'margin-top':'10px','padding':'10px','height':'20px','background':'#ffffff','opacity':'0'});
    	this.elements["navigatorContainer"].fx = new Fx.Styles(this.elements["navigatorContainer"],{'duration':400,'wait':false});
    	this.elements["navigatorContainer"].addEvent("mouseenter",function()
		{
			self.mouseEntered();
		}
		);
    	this.elements["navigatorContainer"].addEvent("mouseleave",function()
		{
			self.mouseExited();
		}
		);
    	this.elements["container"].adopt(this.elements["navigatorContainer"]);
    	this.elements["firstButton"] = gui.createButton('div','first');
    	this.elements["firstButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"left"});
    	this.elements["firstButton"].addEvent("click",function(){self.firstPicture();});
    	this.elements["previousButton"] = gui.createButton('div','previous');
    	this.elements["previousButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"left"});
    	this.elements["previousButton"].addEvent("click",function(){self.previousPicture();});
    	this.elements["nextButton"] = gui.createButton('div','next');
    	this.elements["nextButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"right"});
    	this.elements["nextButton"].addEvent("click",function(){self.nextPicture();});
    	this.elements["lastButton"] = gui.createButton('div','last');
    	this.elements["lastButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"right"});
    	this.elements["lastButton"].addEvent("click",function(){self.lastPicture();});

    	this.elements["startButton"] = gui.createButton('div','start');
    	this.elements["startButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"left"});
    	this.elements["startButton"].addEvent("click",function(){self.start();});

    	this.elements["stopButton"] = gui.createButton('div','stop');
    	this.elements["stopButton"].setStyles({"display":"none","margin-left":"5px","margin-right":"5px","float":"left"});
    	this.elements["stopButton"].addEvent("click",function(){self.stop();});

    	this.elements["closeButton"] = gui.createButton('div','close');
    	this.elements["closeButton"].setStyles({"margin-left":"5px","margin-right":"5px","float":"right"});
    	this.elements["closeButton"].addEvent("click",function(){self.closeSlideshow();});

		this.elements["slider"] = new Element("div");
    	this.elements["slider"].setStyles({"background":"url(/img/slider.png)","margin-left":"10px","margin-right":"5px","margin-top":"4px","float":"left","height":"14px","width":"85px"});

		this.elements["knob"] = new Element("div");
    	this.elements["knob"].setStyles({"left":"40px","background":"url(/img/knob.png)","position":"relative","float":"left","width":"4px","height":"14px"});

		this.elements["timer"] = new Element("div");
    	this.elements["timer"].setStyles({"float":"left","width":"20px","height":"20px","margin-top":"4px","margin-left":"5px"});
		this.elements["timer"].innerHTML = "6s";

    	var self = this;

		this.elements["knob"].addEvent("mousedown",function(){self.knobDown = true;});
		this.elements["knob"].addEvent("mouseup",function(){self.knobDown = false;});
		this.elements["slider"].addEvent("mouseup",function(){self.knobDown = false;});

		this.elements["slider"].addEvent("mousemove",function(e)
		{
			if (self.knobDown==true)
			{
				e = new Event(e);
				var left = e.page.x-self.elements["slider"].getLeft();
				if (left<5) left = 5;
				if (left>self.elements["slider"].getSize()["size"]["x"]-5) left = self.elements["slider"].getSize()["size"]["x"]-5;
				self.elements["knob"].setStyle("left",left+"px");
				self.slideShowTimer = 3+Math.round(((left-5)/80)*7);
				self.elements["timer"].innerHTML = self.slideShowTimer+"s";
			}
		}
		);
    	this.elements["slider"].adopt(this.elements["knob"]);

    	this.elements["navigatorContainer"].adopt(this.elements["firstButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["previousButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["slider"]);
    	this.elements["navigatorContainer"].adopt(this.elements["timer"]);
    	this.elements["navigatorContainer"].adopt(this.elements["startButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["stopButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["closeButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["lastButton"]);
    	this.elements["navigatorContainer"].adopt(this.elements["nextButton"]);

		var self = this;
    	document.body.onmousemove = function()
    	{
    		self.mouseMoved();
    	}
    },
    hide: function()
    {
    	if (this.mouseInside!=1) this.mouse--;
    	if (this.mouse>0)
		{
			var self = this;
    		setTimeout(function(){self.hide();},300);
    	}
    	else
    	{
    		if (this.elements["navigatorContainer"]!=null)
    			this.elements["navigatorContainer"].fx.start({'opacity':'0'});
    	}
    },
    start: function()
    {
        this.elements["startButton"].setStyle("display","none");
        this.elements["stopButton"].setStyle("display","block");
        this.slideshow = true;
        this.slideShowNext();
    },
    slideShowNext: function()
    {
    	if (this.slideshow==true)
		{
    		var self = this;
    		setTimeout(function(){if (self.slideshow==true) self.nextPicture(); },this.slideShowTimer*1000);
    	}
    },
    stop: function()
    {
    	this.slideshow = false;
        this.elements["startButton"].setStyle("display","block");
        this.elements["stopButton"].setStyle("display","none");
        this.current = 0;
        this.slideshow = false;
    },
    mouseMoved: function()
    {
    	if (this.mouse>0)
		{
    		this.mouse = 4;
    	}
    	else
    	{
    		this.mouse = 4;
    		var self = this;
    		setTimeout(function(){self.hide();},300);
   			this.elements["navigatorContainer"].fx.start({'opacity':'1'});
   		}
    },
    mouseExited: function()
    {
    	this.mouseInside = 0;
    },
    mouseEntered: function()
    {
    	this.mouseInside = 1;
    },
    setPictures: function(pictures)
    {
    	this.pictures = pictures;
    	for (var i=0;i<pictures.length;i++)
    	{
    		var img = new Element("img");
    		img.setProperty("src",pictures[i].image);
    	}
    },
    nextPicture: function()
    {
    	if (this.pictureChange!=true)
		{
	    	this.currentPicture++;
	    	if (this.currentPicture > this.pictures.length -1) this.currentPicture = 0;
	    	this.createPicture();
	    }
    },
    previousPicture: function()
    {
    	if (this.pictureChange!=true)
		{
    		this.currentPicture--;
    		if (this.currentPicture < 0) this.currentPicture = this.pictures.length-1;
    		this.createPicture();
    	}
    },
    firstPicture: function()
    {
    	if (this.pictureChange!=true)
		{
    		this.currentPicture = 0;
    		this.createPicture();
    	}
    },
    lastPicture: function()
    {
    	if (this.pictureChange!=true)
		{
			this.currentPicture = this.pictures.length-1;
    		this.createPicture();
    	}
    },
    openSlideshow: function()
    {
    	gui.fadeBackgroundIn(1);
    	var self = this;
    	this.mouseInside = 0;
    	this.mouse = 0;
    	setTimeout(function(){self.createGUI();self.createPicture();self.start();},300);
    },
    closeSlideshow: function()
    {
    	document.body.onmousemove = null;
    	for (var x in this.elements)
    	{
    		this.elements[x].remove();
    		this.elements[x] = null;
    	}
    	gui.fadeBackgroundOut();
    }
});