var BlogCarousel = new Class({
	initialize: function (id,options) {
		this.garageSlideshow = (options.garage) ? options.garage : false;
		// objects
		this.mooSlider = null;
		
		// dom objects
		this.slideShowHolder = $(id);
		this.curPicHolder = $E('.bgpreviewcontainer', this.slideShowHolder);
		this.curPic = this.curPicHolder.getChildren()[0].getChildren()[0].getChildren()[0];
		this.loadingPicHolder = $E('.bgprocessimg', this.slideShowHolder);
		this.thumbHolderHolder = $E('.bgimgarr',this.slideShowHolder);
		this.thumbHolder = $E('.bgimgarrdiv',this.slideShowHolder);
		this.thumbs = this.thumbHolder.getChildren();
		if (this.thumbs.length != 0) {
			this.sliderRail = $E('.bgmootoolslide', this.slideShowHolder);
			this.sliderLeftButton = $E('.bgmootoolslideleft', this.sliderRail);
			this.sliderRightButton = $E('.bgmootoolslideright', this.sliderRail);
			this.knob = $E('.bgelementctrl', this.sliderRail);
			
			// gallery info
			this.PicsCol = this.thumbs.length;
			this.sliderSteps = 0;
			
			// starting object dimensions
			this.startSlideShowWidth = (options.width) ? options.width : 0;
			this.SlideShowWidth = this.startSlideShowWidth;
			this.thumbWidth = this.thumbs[0].getSize().size.x;
			this.thumbsHolderWidth = 0;
			this.railWidth = 0;
			this.minKnobWidth = (options.min_knob_width) ? options.min_knob_width : 30;
			
			// slide show design
			this.maxPics = 0;
			this.railOffset = (options.offset_rail) ? options.offset_rail : 0;
			this.thumbsOffset = (options.offset_thumbs) ? options.offset_thumbs : 0;
			
			// animation effects
			this.FXThumbHolder = new Fx.Styles(this.thumbHolder, {wait: false, duration: 200,transition: Fx.Transitions.linear});
			this.FXCurPicHolder = new Fx.Styles(this.curPicHolder, {wait: false, duration: 200,transition: Fx.Transitions.linear});
			
			// miscs
			this.dontMovePlz = false;
			this.mouseDownTrigger = null;
			this.current = 0;
			this.scrollerVisible = true;
			
			// lets start
			
			this.setDimensions();
			if (this.scrollerVisible) {
				this.initSlider();
			}
			this.setListeners();
			this.setFirstPic();
		} else {
			
		}
	},
	setDimensions: function() {
		// set thumbs holder width
		this.thumbHolder.setStyle('width',(this.PicsCol*this.thumbWidth + 3) + 'px'); // +3 for IE6
		
		// get & set real slide show width
		if (this.startSlideShowWidth == 0) {
			this.slideShowHolder.setStyle('width', '100%');
		} else {
			this.slideShowHolder.setStyle('width', this.startSlideShowWidth);
			this.slideShowHolder.style.width = this.startSlideShowWidth;
		}
		
		this.slideShowWidth = this.slideShowHolder.getSize().size.x;
		
		// set thumbs block width
		this.thumbsHolderWidth = this.slideShowWidth - this.thumbsOffset;
		
		
		
		this.thumbHolderHolder.setStyle('width', (this.thumbsHolderWidth + 'px'));
		
		//alert([this.thumbsHolderWidth,this.slideShowWidth,this.startSlideShowWidth]);
		
		
		// set rail width without left & right buttons
		this.railWidth = this.slideShowWidth - this.railOffset;
		this.sliderRail.setStyle('width', (this.railWidth + 'px'));
		
		// get max thumbs on rail
		this.maxPics = Math.floor(this.slideShowWidth/this.thumbWidth);
		
		// get slider steps
		this.sliderSteps = this.PicsCol - this.maxPics;
		
		// set knob width
		if (this.PicsCol > this.maxPics) {
			var knobLength = Math.floor((this.maxPics/this.PicsCol)*(this.railWidth));
			if (knobLength >= this.minKnobWidth) {
				this.knob.setStyle('width', (knobLength+'px'));
			} else {
				this.knob.setStyle('width', this.minKnobWidth);
			}
			this.sliderRail.setStyle('display', 'block');
		} else if (this.PicsCol == 1) {
			this.curPic.setStyle('margin','0');
			this.thumbHolderHolder.setStyle('display', 'none');
			this.scrollerVisible = false;
			this.sliderRail.addClass('hidden');
		} else {
			//this.curPic.setStyle('margin','0');
			this.scrollerVisible = false;
			this.sliderRail.addClass('hidden');
		}
	},
	initSlider: function() {
		if (this.PicsCol >= this.maxPics) {
			this.mooSlider = new Slider(this.sliderRail, this.knob, {
				steps: this.sliderSteps,
				onChange: (function(step){
					
					this.dontMovePlz = true;
					if (carouselini.set.smooth_scroll) {
						this.FXThumbHolder.start({
							'left':(-this.thumbWidth*step)
						});
					} else {
						this.thumbHolder.setStyle('left', (-this.thumbWidth*step));
					}
					if (step == this.sliderSteps) {
						if(this.mooSlider){
							this.mooSlider.drag.options.grid.x = false;
							//this.mooSlider.set(this.sliderSteps);
						}
					}
					if (step == (this.sliderSteps - 1)) {
						if(this.mooSlider){
							this.mooSlider.drag.options.grid.x = Math.round(this.railWidth/(this.PicsCol)) - 1;
						}
					}
					 
				}).bind(this)
			}).set(0);
			this.mooSlider.drag.options.grid = Math.round(this.railWidth/(this.PicsCol)) - 1;
		}
	},
	setListeners: function() {
		this.sliderLeftButton.addEvent('mousedown', (function (event) {
			if (event.stopPropagation) event.stopPropagation(); else event.cancelBubble = true;
			this.moveSliderLeft();
			this.mouseDownTrigger = (this.moveSliderLeft).periodical(250,this);
			//this.mouseDownTrigger = setInterval(this.moveSliderLeft, 200);
		}).bind(this));
		this.sliderLeftButton.addEvent('mouseup', (function (event) {
			clearInterval(this.mouseDownTrigger);
		}).bind(this));
		this.sliderLeftButton.addEvent('mouseleave', (function (event) {
			clearInterval(this.mouseDownTrigger);
		}).bind(this));
		this.sliderRightButton.addEvent('mousedown', (function (event) {
			if (event.stopPropagation) event.stopPropagation(); else event.cancelBubble = true;
			this.moveSliderRight();
			this.mouseDownTrigger = (this.moveSliderRight).periodical(250,this);
		}).bind(this));
		this.sliderRightButton.addEvent('mouseup', (function (event) {
			clearInterval(this.mouseDownTrigger);
		}).bind(this));
		this.sliderRightButton.addEvent('mouseleave', (function (event) {
			clearInterval(this.mouseDownTrigger);
		}).bind(this));
		this.sliderRail.addEvent('mousewheel', (function (event) {
			if (!window.ie) event.preventDefault(); else event.returnValue = false;
			wheel = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3;
			if (wheel < 0) {
				this.moveSliderRight();
			} else {
				this.moveSliderLeft();
			}
		}).bind(this));
		this.thumbHolder.addEvent('mousewheel', (function (event) {
			if (!window.ie) event.preventDefault(); else event.returnValue = false;
			wheel = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3;
			if (wheel < 0) {
				this.moveSliderRight();
			} else {
				this.moveSliderLeft();
			}
		}).bind(this));
		
		var newImage = [];
		this.thumbs.each((function (one_pic, i) {
			//preloaded[i] = new Asset.image(one_pic.getProperty('href'), {onload: function () {
			//	one_pic.setOpacity(1);
			//}});
			
			one_pic.addEvent('click', (function (event) {
				if (!window.ie) event.preventDefault(); else event.returnValue = false;
				if (!one_pic.hasClass('bgfirtvisible')) {
					if (!this.dontMovePlz) {
						if (i < this.current) {
							this.moveSliderLeft();
						} else {
							this.moveSliderRight();
						}
					}
					//(function () {
						//alert(this);
						//	this.dontMovePlz = true; // don't  move pics on click
						this.dontMovePlz = false;
						this.current = i;
						this.curPicHolder.setStyle('display','none');
						this.curPicHolder.setStyle('opacity','0');
						this.loadingPicHolder.setStyle('display','block');
						if ($E('.bgfirtvisible',this.thumbHolder)) {
							$E('.bgfirtvisible',this.thumbHolder).removeClass('bgfirtvisible');
						}
						one_pic.addClass('load_preview');
						
						var loaded = false;
						
						newImage[i] = new Element('img', {
						    'events': {
								'load': (function(){
									
									if (!loaded) {
										//console.log(newImage[i]);
										
										one_pic.getChildren()[0].setOpacity(1);
										
									    this.curPic.setProperty('src',one_pic.href);
										this.loadingPicHolder.setStyle('display','none');
										if (window.ie) {
											this.curPicHolder.setStyle('display','block');
										} else {
											this.curPicHolder.setStyle('display','table');
										}
										
										//console.log(this.curPic.getSize().size.y);
										//this.curPic.setStyle('position','relative');
										
										//var hheight = this.garageSlideshow ? 352 : 428;
										
										//this.curPic.setStyle('top', Math.floor((hheight-this.curPic.getSize().size.y)/2) + 'px');
										one_pic.removeClass('load_preview');
										one_pic.addClass('bgfirtvisible');
										if (carouselini.set.smooth_preview) {
											this.FXCurPicHolder.start({
												'opacity':1
											});
										} else {
											this.curPicHolder.setStyle('opacity', '1');
										}
										loaded = true;
									}
								}).bind(this)
						    },
						    'src': one_pic.href
						});
					
					//}).create({'bind':this, 'delay':200});
				}
			}).bind(this));
		}).bind(this));
	},
	setFirstPic: function() {
		var firstThumb = $E('.bgfirtvisible', this.thumbHolder);
		new Asset.image(firstThumb.getAttribute('href'), {
			onload: (function() {
				this.curPic.setAttribute('src', firstThumb.getAttribute('href'));
				
				firstThumb.getChildren()[0].setOpacity(1);
			}).bind(this)
		});
	},
	moveSliderLeft: function() {
		if (this.mooSlider) {
			if (this.mooSlider.step > 0) {
				this.mooSlider.set(this.mooSlider.step - 1);
			}
		}
	},
	moveSliderRight: function() {
		if (this.mooSlider) {
			if (this.mooSlider.step < this.sliderSteps) {
				this.mooSlider.set(this.mooSlider.step + 1);
			}
		}
	}
});