Slider = new Class.create({
	"initialize": function (options) {
		this.options = {
			"slider"			: "slider",
			"path"				: "images/",
			"linkText"			: "Explore",
			"itemWidth"			: 150,
			"itemHeight"		: 120,
			"items"				: [],
			"animate"			: true,
			"animationDelay"	: 5,
			"slideDelay"		: 1,
			"slideLoop"			: true,
			"onClick"			: false
		};
		Object.extend(this.options, options || {});
		
		this.build();
	},
	"build": function () {
		this.slider = new Element("div", { "class": "ui-slider" }).setStyle({ "position": "relative" });
		this.dragHere = new Element("div", { "class": "ui-slider-drag-here" }).hide();
		this.itemList = new Element("tr", { "vAlign": "top" });
		
		for (var i = 0; i < this.options.items.length; i++) {
			var lnk = new Element("span").update(this.options.items[i].linkText || this.options.linkText);
			var itm = new Element("td", { "class": "item","width":this.options.itemWidth }).setStyle({
				"width"		: this.options.itemWidth + "px",
				"minWidth"	: this.options.itemWidth + "px",
				"maxWidth"	: this.options.itemWidth + "px",
				"height"	: this.options.itemHeight + "px",
				"background"	: "url(" + this.options.path + this.options.items[i].file + ") 0 0 no-repeat"
			}).insert(
				new Element("img", { "src":  this.options.path +"spacer.gif",width:this.options.itemWidth,height:1 })
			);
			
			if (this.options.onClick !== false)
				itm.observe("click", this.options.onClick.curry($H(this.options.items[i])))
			else if (typeof this.options.items[i].onClick != "undefined")
				itm.observe("click", this.options.items[i].onClick.curry($H(this.options.items[i])))
			else if (typeof this.options.items[i].link != "undefined")
				itm.observe("click", this.__followLink.curry(this.options.items[i].link))
			
			this.itemList.insert(itm);
		}
		
		this.slider.insert(new Element("table", { "cellSpacing": 0, "cellPadding": 0 }).insert(new Element("tbody").insert(this.itemList)));
		this.drag = new Element("div", { "class": "ui-slider-drag" }).observe("click", this.dragClick.bind(this));
		this.dragger = new Element("div", { "class": "ui-slider-dragger" });
		
		new Draggable(this.dragger, {
			"constraint"	: "horizontal",
			"snap"		: this.onDraggerMove.bind(this)
		});
		
		$(this.options.slider).insert(this.slider.insert(this.dragHere)).insert(this.drag.insert(this.dragger)).addClassName("ui-slider-container");
		
		if (this.options.animate) {
			this.sliderMove = 0;
			this.sliderMoveReset = false;
			new PeriodicalExecuter(this.moveSlider.bind(this), this.options.animationDelay);
		} else {
			this.dragHere.appear({
				"duration"	: 0.5,
				"afterFinish"	: (function () {
					setTimeout((function () {
						this.dragHere.fade({
							"duration"	: 0.5
						});
					}).bind(this), 2000);
				}).bind(this)
			});
		}
	},
	"dragClick": function (ev) {
		if (typeof this.moveSliderPe != "undefined") {
			this.moveSliderPe.stop();
		}
		this.__updateVars();

		var x = Event.pointerX(ev) - this.drag.cumulativeOffset().left - Math.round(this.draggerWidth / 2);
		
		if (x < 0) x = 0;
		else if (x > this.maxX) x = this.maxX;
		
		this.slider.morph("left: -"+Math.ceil(x / this.maxX * ((this.options.itemWidth * this.options.items.length) - this.sliderWidth)) + "px", {
			"duration": this.options.slideDelay
		});
		this.dragger.morph("left: "+x+ "px", {
			"duration": this.options.slideDelay
		});
	},
	"moveSlider": function (pe) {
		this.moveSliderPe = pe;
		this.__updateVars();
		
		if (this.sliderMoveReset) {
			this.sliderMoveReset = false;
			this.sliderMove = 0;
		} else {
			this.sliderMove += (this.options.itemWidth * this.sliderPerPage);
		}
		
		if (this.sliderMove > (this.options.itemWidth * this.options.items.length) - this.sliderWidth) {
			if (this.options.slideLoop) {
				this.sliderMoveReset = true;
			} else {
				pe.stop();
			}
			this.sliderMove = (this.options.itemWidth * this.options.items.length) - this.sliderWidth;
		}
		
		this.slider.morph("left: -"+this.sliderMove+"px", {
			"duration": this.options.slideDelay
		});
		this.dragger.morph("left: "+Math.ceil(this.sliderMove / ((this.options.itemWidth * this.options.items.length) - this.sliderWidth) * this.maxX) + "px", {
			"duration": this.options.slideDelay
		});
	},
	"onDraggerMove": function (x, y) {
		if (typeof this.moveSliderPe != "undefined") {
			this.moveSliderPe.stop();
		}
		this.__updateVars();
		
		if (x < 0) x = 0;
		else if (x > this.maxX) x = this.maxX;
		
		this.slider.setStyle({
			"left": -Math.ceil(x / this.maxX * ((this.options.itemWidth * this.options.items.length) - this.sliderWidth)) + "px"
		});
		return [x, 0];
	},
	"__updateVars": function () {
		if (typeof this.draggerWidth == "undefined") {
			this.draggerWidth = this.dragger.getWidth();
			this.sliderWidth = $(this.options.slider).getWidth();
			this.maxX = this.sliderWidth - this.draggerWidth - 6;
			this.sliderPerPage = Math.floor(this.sliderWidth / this.options.itemWidth);
		}
	},
	"__followLink": function (link) {
		location.href = link;
	}
});

