Scroller = Class.create({
	initialize: function(element, options) {
		element = $(element);
		this.element = element;
		this.options = options;
		this.options = Object.extend({
			effectDuration: 3.0,
			timeout: 5000, 
			excerptBg:'images/background.png',
			imageBg:'images/trans.gif',
			nextImg: 'images/next.png',
			previousImg: 'images/previous.png',
			pauseImg: 'images/pause.png',
			resumeImg: 'images/play.png',
			url: "inc/slider.php",
			containerClass: 'scroller',
			controlClass: 'control',
			postClass: 'post',
			imageClass: 'image',
			excerptClass: 'excerpt',
			sliderClass: 'slider',
			titleClass: 'title',
			titleTextClass: 'titletext',
			excerptTextClass: 'text'
		}, options || {});
		this.PNGFix(); 
		this.postFrame = $("posts");
		this.CreateNav(); 
		this.GetData();
	},

	GetData: function() {
		new Ajax.Request(this.options.url, {
			method:'get',
			onSuccess: function(t) {
				this.aPosts = t.responseText.evalJSON(true);
				$("posts").setStyle({ background: "transparent url("+this.aPosts[0].image+") 3px 3px no-repeat" });
				this.post_count = this.aPosts.length;
				this.PreloadImages();
				this.Warp(0);
			}.bind(this)
		});
	},
	
	PreloadImages: function() {
		var d = document;
		if (!d.imgs) d.imgs = new Array();
		var i;
		j = this.aPosts.length;
		for (i=0; i<this.aPosts.length; i++) {
			d.imgs[j]=new Image; 
			d.imgs[j++].src = this.aPosts[i].image;
		}
	},
	
	Warp: function(key) {
		if (key == this.aPosts.length || key < 0) {
			this.GetData();
			return;
		}
		var new_key = key;
		var old_key = this.current_key;
		this.current_key = new_key;
		
		var oPost = this.aPosts[new_key];
		var image = new Element('img', { 'src': oPost.image });
		var postBox = new Element('div', { 'id': 'postBox'+key, className: this.options.postClass }).setStyle({ zIndex: key }).hide();
		var imageBox = new Element('div', { 'id': 'imageBox'+key, className: this.options.imageClass }).setStyle({ background: "transparent url("+this.options.imageBg+")" }).hide();
		var excerptBox = new Element('div', { 'id': 'excerptBox'+key, className: this.options.excerptClass }).hide();
		var sliderBox = new Element('div', { 'id': 'sliderBox'+key, className: this.options.sliderClass }).setStyle({ background: "#000" }).hide();
		var titleBox = new Element('div', { 'id': 'titleBox'+key, className: this.options.titleClass }).hide();
		var titletext = new Element('a', { 'href': oPost.permalink, className: this.options.titleTextClass }).update(oPost.title).setStyle({ background: "transparent" });
		//var excerpttext = new Element('p', { className: this.options.excerptTextClass }).update(oPost.excerpt); 
		postBox.appendChild(imageBox);
		postBox.appendChild(excerptBox);
		imageBox.appendChild(image);
		excerptBox.appendChild(sliderBox);
		excerptBox.appendChild(titleBox);
		titleBox.appendChild(titletext);
		//excerptBox.appendChild(excerpttext);
		
		this.postFrame.appendChild(postBox);
		this.StartTransition(old_key, new_key);

		$("postBox"+new_key).observe('load', function() { this.StartTransition(old_key, new_key); }.bind(this));
	},

	StartTransition: function(old_key, new_key) {
		
		new Effect.multiple([$("postBox"+new_key), $("imageBox"+new_key), $("excerptBox"+new_key)], Effect.Appear, { 
			speed: 0, 
			duration: this.options.effectDuration,
			beforeStart: function() { 
				if ($("sliderBox" + old_key) != null && $("sliderBox" + old_key) != null) {
					new Effect.Parallel([
						new Effect.Fade("sliderBox" + old_key, {
							sync: true,
							from: 0.7,
							to: 0
						}), 
						new Effect.Fade("titleBox" + old_key, {
							sync: true,
							from: 1,
							to: 0
						})], { 
						duration: 1.0 
					});
				}
			}.bind(this),
			afterFinish: function() { 
				if ($("default_img") != null) $("default_img").remove();
				if ($("postBox"+old_key) != null) $("postBox"+old_key).fade({ duration: 1.0, from: 1, to: 0 });
				new Effect.Parallel([
					new Effect.Appear("sliderBox" + new_key, {
						sync: true,
						from: 0,
						to: 0.7
					}), 
					new Effect.Appear("titleBox" + new_key, {
						sync: true,
						from: 0,
						to: 1
					})], {
					duration: 1.0
				});
				if (this.timeoutInPlace) clearTimeout(this.timeoutInPlace);
				this.timeoutInPlace = setTimeout(function() { this.Warp(this.current_key+1); }.bind(this), this.options.timeout);
			}.bind(this)
		});
	},

	CreateNav: function() {
		/*$("prev").hide();
		$("next").hide();
		Event.observe($("controls"), 'mouseover', function(event) {
			Event.stop(event);
			$("prev").show();
			$("next").show();
		}.bind(this));
		Event.observe($("controls"), 'mouseout', function(event) {
			Event.stop(event);
			$("prev").hide();
			$("next").hide();
		}.bind(this));*/
		Event.observe($("next"), 'click', function(event) {
			if (this.timeoutInPlace) { clearTimeout(this.timeoutInPlace); }
			this.Warp(this.current_key+1);
		}.bind(this));
		Event.observe($("prev"), 'click', function(event) {
			if (this.timeoutInPlace) { clearTimeout(this.timeoutInPlace); }
			this.Warp(this.current_key-1);
		}.bind(this));
		/*Event.observe($("pause"), 'click', function(event) {
			clearTimeout(this.timeoutInPlace);
			$("pause").hide();
			$("resume").show();
		}.bind(this));
		Event.observe($("resume"), 'click', function(event) {
			if (this.timeoutInPlace) { clearTimeout(this.timeoutInPlace); } 
			this.Warp(this.current_key+1);
			$("resume").hide();
			$("pause").show();
		}.bind(this));*/	
	},

	PNGFix: function(){var version=parseFloat(navigator.appVersion.split('MSIE')[1]);if((version >= 5.5)&&(version < 7)&&(document.body.filters)){document.getElementsByClassName('ie-fix-opacity').each(function(poElement){var cBGImg=poElement.currentStyle.backgroundImage;var cImage=cBGImg.substring(cBGImg.indexOf('"')+1,cBGImg.lastIndexOf('"'));poElement.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+cImage+"',sizingMethod='scale')";poElement.style.backgroundImage="none";});}}
});