var Slider = Class.create({
	initialize: function (element, duration, n) {
		var children, l, dimensions, w = 0, h = 0, wrap, nav;
		
		this.slideInterval = 13 * 700;
		
		element = $(element);
		children = element.childElements();
		l = children.length;
		// Calculating max dimensions of children
		children.each(function (child) {
			dimensions = child.getDimensions();
			if (dimensions.width > w) {
				w = dimensions.width;
			}
			if (dimensions.height > h) {
				h = dimensions.height;
			}
		});
		
		wrap = new Element('div');
		// Creating a sequence
		lastch = children[children.length-1].cloneNode(true);
		lastch.setStyle({cssFloat: 'left',width: w + 'px'});
		firstch = children[0].cloneNode(true);
		firstch.setStyle({cssFloat: 'left',width: w + 'px'});
		
		wrap.appendChild(lastch);
		for (i = 0; i < children.length; i++) {
			child = children[i];
			child.setStyle({
				cssFloat: 'left',
				width: w + 'px'
			});
			wrap.appendChild(child);
		}
		wrap.appendChild(firstch);
		
		
		l = wrap.childElements().length;
		
		// Setting initial position
		n = 1;
		wrap.setStyle({
			marginLeft: n * -w + 'px',
			width: l * w + 'px',
			height:  h + 'px'
		});
		
		element.setStyle({
			width: w + 'px',
			height: h + 'px',
			overflow: 'hidden'
		});
		
		element.appendChild(wrap);
		
		nav = {
			ul: new Element('ul', {'class':'slider-navigation'}),
			
			prev: {
				li: new Element('li', { 'class': 'prev' }),
				a: new Element('a', { href:'#' }).update(' ')
			},
			next: {
				li: new Element('li', { 'class': 'next' }),
				a: new Element('a', { href:'#' }).update(' ')
			}
		};
		nav.prev.li.appendChild(nav.prev.a);
		nav.next.li.appendChild(nav.next.a);
		
		nav.ul.appendChild(nav.prev.li);
		nav.ul.appendChild(nav.next.li);
		
		
		
		element.appendChild(nav.ul);

		
		this.children = children;
		this.element = element;
		
		this.duration = (duration == undefined ? 1.0 : duration);
		this.wrap = wrap;
		this.nav = nav;
		this.w = w; // width of each slide
		this.h = h; // height of each slide
		this.l = l; // number of slides in slide show
		this.n = n; // number of the active slide

		
		Event.observe(nav.prev.a, 'click', this.prev.bind(this));
		Event.observe(nav.prev.a, 'mouseover', this.toggleHover );
		Event.observe(nav.prev.a, 'mouseout', this.toggleHover );
		
		Event.observe(nav.next.a, 'click', this.next.bind(this));
		Event.observe(nav.next.a, 'mouseover', this.toggleHover );
		Event.observe(nav.next.a, 'mouseout', this.toggleHover );
		
		
		Event.observe(element, 'mouseover', this.elementHover.bind(this) );
		Event.observe(element, 'mouseout', this.elementUnhover.bind(this) );
		
		
		this.locked = false;
		this.elementOver =  false;
		this.unpause();
	},
	
	
	elementHover: function() {
		this.element.addClassName('hover');
		this.elementOver =  true;
		this.pause();
	},

	elementUnhover: function() {
		this.element.removeClassName('hover');
		this.elementOver =  false;
		this.unpause();
	},
	
	
	toggleHover: function(e) {
		this.toggleClassName('hover');
	},
	
	
	setPosition: function(pos) {
		if (!pos) pos = 1; //this.l - 2;

		this.wrap.setStyle({
			'marginLeft': pos * (0 - this.w) + 'px'
		});
	},
	
	
	isFirst: function () {
		return (this.n == 1);
	},

	isLast: function () {
		return (this.n == this.l - 2);
	},
	
	
	
	
	
	pause: function() {
		// Stopping movement
		if (this.timerId) window.clearTimeout(this.timerId);
	},
	
	unpause: function() {
		// Continuing movement if mouse is out
		if (this.elementOver == false) {
			this.timerId = window.setTimeout( this.next.bind(this) , this.slideInterval);
		}
	},
	
	startSlide: function(){
		this.locked = true;
		this.pause();
	},
	
	stopSlide: function(){
		this.locked = false;
		this.unpause();
	},
	
	
	slide: function (callback) {
		this.startSlide();
		
		params = {
			style: 'margin-left: -' + this.n * this.w + 'px;',
			duration: this.duration
		}
		if (!callback) {
			callback = this.stopSlide;
		}
		params.afterFinish = callback.bind(this);
		
		new Effect.Morph(this.wrap, params);
		this.setActBlock();
		
	},
	
	
	next: function (e) {
		
		if (this.locked == true) { this.pause(); return;	}
		
		if (this.isLast()) {
			this.n++;
			this.slide(function() {this.n = 1 ;this.setPosition(this.n);this.stopSlide(); });
		} else {
			this.n++;
			this.slide();
		}
		return false;
	},
	
	
	prev: function (e) {
		if (this.locked == true) { this.pause(); return;	}
		
		if (this.isFirst()) {
			this.n--;
			this.slide(function() {this.n = this.l-2;this.setPosition(this.n);this.stopSlide(); }  );
		} else {	
			this.n--;
			this.slide();
		}
		return false;
	},
	
	setActBlock: function() {
		jQuery('#nav-boxed li').removeClass('item-nav-boxed-act');
		if(this.n==this.l-1){
			jQuery('#nav-boxed .item-nav-boxed-1').addClass('item-nav-boxed-act');
		}else if(this.n==0){
			var num = this.l-2;
			jQuery('#nav-boxed .item-nav-boxed-' + num).addClass('item-nav-boxed-act');
		}else{
			jQuery('#nav-boxed .item-nav-boxed-' + this.n).addClass('item-nav-boxed-act');
		}
	},
	
	setSlide : function(num) {
		this.startSlide();
		this.n = num ;this.setPosition(this.n);this.stopSlide();
		this.setActBlock();
	}
	
});