var pages = new Class({
	Implements: [Events,Options],
	options:{
		itemsOnPage: 10,
		pageWidth: 750,
		pageHeight: 375
	},
    initialize: function(options){
		this.setOptions(options);
		this.build();		
    },
	build: function(){
		if($$('.product-index')[0]){
			var productItems = $$('.product-index .item');
			var pageContent = $$('.content')[0];
			var pagerNav = $$('.main .top .pager')[0];
			var totalItems = productItems.length;
			var totalPages = Math.ceil(totalItems / this.options.itemsOnPage);
			
			
			
			this.indexWrap = new Element('div',{
				id:'index-wrap',
				styles:{
					'position':'absolute',
					'height':this.options.pageHeight,
					'width': this.options.pageWidth * totalPages
				}
			}).inject(pageContent, 'top');
			
			// placeholder fix
			pageContent.setStyle('height',this.options.pageHeight)
			
			for(i = 0; i < totalPages; i++){
				new Element('div',{
					'class': 'index-page',
					styles: {
						'float': 'left',
						'height':this.options.pageHeight,
						'width':this.options.pageWidth
					}
				}).inject(this.indexWrap, 'top');
			}
			
			if(totalItems > this.options.itemsOnPage){
				
				/*pageContent.setStyles({
					'padding-top':30,
					'position':'relative'
				});*/
				
				var pagePosition = 0;
				var maxPosition = totalPages * -this.options.pageWidth;
				var currentPage = 1;
				
				
				
				this.next = new Element('a',{
					//href: '#',
					id:'next',
					html: 'Næsta síða',
					styles: {
						'display':'inline',
						'top':'7px',
						//'color':'#000',
						'background-color':'#fff',
						'cursor':'pointer'
					},
					events: {
						click: function(){
							if(pagePosition > maxPosition+850){
								pagePosition = pagePosition-850;
								$('index-wrap').morph({'margin-left':pagePosition});
								currentPage = currentPage+1;
								pagerCounter.set('html',currentPage);
								if(currentPage == totalPages){
									$('next').morph({'color':'#cccccc'});
									$('prev').morph({'color':'#686868'});
								} else{
									$('prev').morph({'color':'#686868'});
									$('next').morph({'color':'#686868'});
								}
							}
						}
					}
				}).inject(pagerNav, 'top');
				
				
				this.pageCount = new Element('span',{
					id:'pagecount',
					html:' | <span class="current-page">' +currentPage+ '</span> af ' +totalPages+ ' | '
				}).inject(pagerNav, 'top');
				
				
				this.previous = new Element('a',{
					//href: '#',
					id:'prev',
					html: 'Fyrri síða',
					styles: {
						'display':'inline',
						'color':'#ccc',
						'background-color':'#fff',
						'cursor':'pointer'
					},
					events: {
						click: function(){
							if(pagePosition < 0){
								pagePosition = pagePosition+850;
								$('index-wrap').morph({'margin-left':pagePosition});
								currentPage = currentPage-1;
								pagerCounter.set('html',currentPage);
								if(currentPage == 1){
									$('prev').morph({'color':'#cccccc'});
									$('next').morph({'color':'#686868'});
								} else{
									$('prev').morph({'color':'#686868'});
									$('next').morph({'color':'#686868'});
								}
							}
						}
					}
				}).inject(pagerNav, 'top');
				
				var pagerCounter = pagerNav.getElement('.current-page');
				//var prev = $('prev');
				//var next = $('next');
				
			};
			
			var itemsOnPage = this.options.itemsOnPage;
			
			var z = 0;
			var e = 0;
			var indexPages = this.indexWrap.getElements('.index-page');
			
			productItems.each(function(item,index){
				//z++;
				
				item.inject(indexPages[e])
				//console.log(z,index);
				
				if(((index+1)%itemsOnPage) == 0){
					e++;
				}
			});
			
			$$('.product-index')[0].destroy();
		}
	}
});


window.addEvent('domready',function(){

	new pages({
		itemsOnPage: 15,
		pageWidth: 850
	});

	var slider = $('slider');
	if(slider){	
		var button = slider.getSiblings('#button');
		var slides = slider.getChildren('.slide');
		var slideCount = slides.length;	
		var i = slideCount-1;
		
		slider.setStyles({'width':161*slideCount});
		slider.set('morph',{duration:350});
		
		button.addEvent('click',function(){
			slider.setStyles({'margin-left':0});
			slider.morph({'margin-left':-161});
			slider.grab(slides[i],'bottom');
			++i;
			if(i == slideCount){
				i = 0;
			}
		});
		
	};
	
	var sliderWrapper = $$('.slider-wrapper')[0];
	if(sliderWrapper){
		var itemWidth = sliderWrapper.getElement('.item').getSize().x;
		var sliderWraperWidth = sliderWrapper.getSize().x;
		var itemCount = $$('.slider-wrapper .slider .item').length;
		var sliderwidth = itemCount*itemWidth;
		$$('.slider-wrapper .slider')[0].setStyle('width', sliderwidth);
		var viewwidth = $$('.slider-wrapper')[0].getSize().x;
		var xpos = 0;
		
		if(Cookie.read('xpos')){
			xpos = Cookie.read('xpos').toInt();
		};
		
		if(Cookie.read('itemCount')){
			if(Cookie.read('itemCount').toInt() != itemCount){
				xpos = 0;
				var posCookie = Cookie.write('xpos',xpos,{duration: 1});
			}
		}
		
		var slider = $$('.slider-wrapper .slider')[0];
		slider.setStyle('left',xpos);
		
		var rightButton = $$('.product-slider .right')[0];
		var leftButton = $$('.product-slider .left')[0];
		
		if(rightButton){
			rightButton.addEvent('click', function(evt) {
				
				if(Cookie.read('xpos')){
					xpos = Cookie.read('xpos').toInt();
				};
				
				if (sliderwidth + (xpos) > viewwidth+itemWidth) {
					xpos = xpos-(sliderWraperWidth+10);
					slider.morph({'left': xpos});
				}
				
				var posCookie = Cookie.write('xpos',xpos,{duration: 1});
				var lengthCookie = Cookie.write('itemCount',itemCount,{duration: 1});
				
			});
		}	
		
		if(leftButton){
			leftButton.addEvent('click', function(evt) {
				
				if(Cookie.read('xpos')){
					xpos = Cookie.read('xpos').toInt();
				};

				if (xpos < 0) {
					xpos = xpos+(sliderWraperWidth+10);
					slider.morph({'left': xpos});
				}
				
				var posCookie = Cookie.write('xpos',xpos,{duration: 1});
				var lengthCookie = Cookie.write('itemCount',itemCount,{duration: 1});
				
			});
		}

		var rightButtonSub = $$('.product-slider.subpage .right')[0];
		var leftButtonSub = $$('.product-slider.subpage .left')[0];
		var productSlider = $$('.product-slider.subpage')[0];
		if(productSlider){
			
			var lolbot = function(){
				rightButtonSub.morph({'opacity':0});
				leftButtonSub.morph({'opacity':0});
			}.delay(1500)
			
			//productSlider.addEvent('domready',lolbot());
			
			productSlider.addEvent('mouseenter',function(){
				rightButtonSub.morph({'opacity':1});
				leftButtonSub.morph({'opacity':1});
				clearTimeout(lolbot);
			});			
			
			productSlider.addEvent('mouseover',function(){
				rightButtonSub.morph({'opacity':1});
				leftButtonSub.morph({'opacity':1});
				clearTimeout(lolbot);
			});			
			
			productSlider.addEvent('mouseleave',function(){
				rightButtonSub.morph({'opacity':0});
				leftButtonSub.morph({'opacity':0});
			});	
			
		}
		
	}
	
	//breadcrumb fix & no price fix
	var productItem = $$('.product-item')[0];
	if(productItem){
		var productName = productItem.getElement('h1').get('text');
		var productId = productItem.getElement('#product-id').get('text');
		if(productItem.getElement('.product-id').get('text') == '#'){
			productItem.getElement('.product-id').destroy();
		}
		if(productItem.getElement('.price').get('text').toInt() == 0){
			productItem.getElement('.price').destroy();
		}
	}
	
	var breadCrumbs = $$('.breadcrumbs div a');
	if(breadCrumbs){
		breadCrumbs.each(function(crumb){
			if(crumb.get('text') == 'Vara'){
				var orLink = crumb.getProperty('href');
				crumb.set('text',productName);
				crumb.setProperty('href',orLink+productId);
			}
		});
	}
	
});


// in page scrolling
/*window.addEvent('load',function(){

	var content = $$('.content')[0];
	var middle = $$('.middle')[0];
	var contentHeight = content.getSize().y;
	var contentChild = content.getElement('div');
	var contentChildHeight = contentChild.getSize().y;
	var pos = 0;
	
	var contentScroll = new Fx.Morph(contentChild,{'link':'cancel',duration:200,transition:'sine:in:out'});
	
	contentChild.addEvent('mousewheel',function(event){
		if(event.wheel <= 0){
			if(pos > (-contentChildHeight + contentHeight)){
				pos = pos -200;
				contentScroll.start({'margin-top':pos})
			}
		} else if(event.wheel >= 0){
			if(pos < -1){
				pos = pos +200;
				contentScroll.start({'margin-top':pos})
			}
		}
	});
	
	if(contentChildHeight > contentHeight){
		middle.setStyles({
			'position':'relative'
		});
		
		new Element('a',{
			//href: '#',
			id:'up',
			html: '',
			styles: {
				'display':'block',
				'position':'absolute',
				'top':30,
				'right':-30,
				'height':20,
				'width':20,
				'color':'#000',
				'background-color':'#fff',
				'background-image':'url(/img/up.png)',
				'background-position':'50% 50%',
				'background-repeat':'no-repeat',
				'cursor':'pointer'
			},
			events: {
				click: function(){
					if(pos < -1){
						pos = pos +200;
						contentChild.morph({'margin-top':pos})
					}
				}
			}
		}).inject(middle, 'top');
		
		new Element('a',{
			//href: '#',
			id:'down',
			html: '',
			styles: {
				'display':'block',
				'position':'absolute',
				'bottom':10,
				'right':-30,
				'height':20,
				'width':20,
				'color':'#000',
				'background-color':'#fff',
				'background-image':'url(/img/down.png)',
				'background-position':'50% 50%',
				'background-repeat':'no-repeat',
				'cursor':'pointer'
			},
			events: {
				click: function(){
					if(pos > (-contentChildHeight + contentHeight)){
						pos = pos -200;
						contentChild.morph({'margin-top':pos})
					}
				}
			}
		}).inject(middle, 'top');
	}	
});*/


















