/******************************************
 * slider.js                              *
 * 2010.07.05                             *
 * Script for javascript dropdown         *
 ******************************************
 * (c) Alexander Avanesov, Intspirit LLC  *
 ******************************************/

if (!window.AFMM) window.AFMM = { };

AFMM.AllCategoriesSlider = Class.create({
	initialize: function() {
		this.container 	= $('all_main_categories');
		if(!this.container) {
			throw Error("Slider container must be specified");
		}
		this.ulBox 		= $$('#all_main_categories .banner-products-list')[0];
		this.liItems 	= $$('#all_main_categories .banner-products-list li');
		this._handle 	= $$('#all_main_categories .slider-touch')[0];
		this._track 	= $$('#all_main_categories .slider-track')[0];
		this._btnLeft 	= $$('#all_main_categories .slider-left')[0];
		this._btnRight 	= $$('#all_main_categories .slider-right')[0];
		if(!this.liItems.length) {
			return;
		}
		this.itemWidth 		= this.liItems[0].getWidth();
		this.itemsWidth 	= this.itemWidth*this.liItems.length;
		this.slidableWidth 	= this.itemsWidth-this.itemWidth*4;
		this.resizeUlBox();
		if(this.slidableWidth<=0) {
			this.disable();
			return;
		}
		this._options = {
			range: $R(0, this.slidableWidth),
			onSlide: function(value) {
				this.slide(value);
	      	}.bind(this),
	      	onChange: function(value) { 
	      		this.slide(value);
	      	}.bind(this)
		};
		this._lastShift = 0;
		this._effect = null;
		this._slider = new Control.Slider(this._handle,this._track, this._options);
		this._btnLeft.observe('click', function(e) {
			this.arrowSlide(false);
		}.bind(this));
		this._btnRight.observe('click', function(e) {
			this.arrowSlide(true);
		}.bind(this));
	},
	slide: function(value) {
		value = Math.round(value);
		var round = Math.round(value/this.itemWidth);
		var newShift = this.itemWidth*round;
		if(newShift != this._lastShift) {
			this._lastShift = newShift;
			if(this._effect) {
				this._effect.cancel();
			}
			this._effect = new Effect.Move(this.ulBox, { 
				x: -newShift, 
				mode: 'absolute', 
				duration: 0.4,
				afterFinish: function() {
					this._effect = null;
				}.bind(this)
			});
		}
	},
	arrowSlide: function(right) {
		var availShift = this.slidableWidth - this._lastShift;
		var newValue;
		if(right) {
			if (availShift>0) {
				newValue = this._lastShift + this.itemWidth;
				this._slider.setValue(newValue);
			}
		}
		else {
			if (availShift<this.slidableWidth) {
				newValue = this._lastShift - this.itemWidth;
				this._slider.setValue(newValue);
			}
		}
	},
	resizeUlBox: function() {
		this.ulBox.style.width = this.itemsWidth + 'px';
	},
	disable: function() {
		this._handle.hide();
		this._btnLeft.style.cursor = 'default';
		this._btnRight.style.cursor = 'default';
	}
});

AFMM.SubCategoriesSlider = Class.create({
	initialize: function() {
		this.container 	= $('sub_categories_slider');
		if(!this.container) {
			throw Error("Slider container must be specified");
		}
		this.visibleArea  = $$('#sub_categories_slider .items-wrapper')[0];
		this.lisProducts 	= $$('#sub_categories_slider .banner-products-list li.item');
		this.ulCategories 	= $$('#sub_categories_slider .banner-category-list ul')[0];
		this.lisCategories 	= $$('#sub_categories_slider .banner-category-list li.item');
		this._btnUp 		= $$('#sub_categories_slider .arrow-top')[0];
		this._btnDn 		= $$('#sub_categories_slider .arrow-bottom')[0];
		if(this.lisProducts.length != this.lisCategories.length) {
			throw Error("Not the same as the number of products and categories");
		}
		if(!this.lisCategories.length || this.lisCategories.length<5) {
			return;
		}
		this.visibleHeight  = this.visibleArea.getHeight();
		this.itemHeight 	= this.lisCategories[1].offsetTop-this.lisCategories[0].offsetTop;
		this.itemsHeight 	= this.ulCategories.getHeight();
		this.slidableHeight = this.itemsHeight - this.visibleHeight;
		this._lastShift 	= 0;
		for ( var i = 0; i < this.lisProducts.length; i++) {
			this.lisCategories[i].observe('mouseover', this.itemOver.bind(this,i))
		}
		this._btnUp.observe('click', this.slide.bind(this,false));
		this._btnDn.observe('click', this.slide.bind(this,true))
		this.itemOver(0);
	},
	itemOver: function(index) {
		for ( var i = 0; i < this.lisProducts.length; i++) {
			if(i == index) {
				this.lisProducts[i].addClassName('active');
				this.lisCategories[i].addClassName('active');
			} 
			else {
				this.lisProducts[i].removeClassName('active');
				this.lisCategories[i].removeClassName('active');
			}
		}
	},
	slide: function(down, e) {
		e.stop();
		var availShift = this.slidableHeight - this._lastShift;
		var newShift = null;
		if(down) {
			if (availShift>0) {
				newShift = this._lastShift + this.itemHeight;
			}
		}
		else {
			if (availShift<this.slidableHeight) {
				newShift = this._lastShift - this.itemHeight;
			}
		}
		if(newShift !== null && newShift != this._lastShift) {
			this._lastShift = newShift;
			if(this._effect) {
				this._effect.cancel();
			}
			this._effect = new Effect.Move(this.ulCategories, { 
				y: -newShift, 
				mode: 'absolute', 
				duration: 0.4,
				afterFinish: function() {
					this._effect = null;
				}.bind(this)
			});
		}
		return false;
	}
});

AFMM.BoxSlider = Class.create({
    initialize: function(control, content) {
        this.control = $(control);
        this.content = $(content);
        if(this.control && this.content) {
            this.free = true;
            this.expanded = true;
            this.control.addClassName('c-pointer');
            this.control.observe('click', this.slideUpDn.bind(this));
        }
        this._options = { 
            duration: 0.5,
            afterFinish: (function() {
                this.free = true;
            }).bind(this)
        }
    },
    slideUpDn: function() {
        if(this.free) {
            this.free = false;
            if(this.expanded) {
                this.expanded = false;
                Effect.SlideUp(this.content, this._options);
            }
            else {
                this.expanded = true;
                Effect.SlideDown(this.content, this._options);
            }
        }
    }
});