document.observe("dom:loaded", function() {
	$$('#naviMain li').each(function(el){
		el.observe('mouseover', function(){
			this.addClassName('hover');
		});
		el.observe('mouseout', function(){
			this.removeClassName('hover');
		});
	});
	
	if($('nextImages') && $('prevImages')) {
	
		if($('onload-moreviews')) {
			$$('#onload-moreviews li').each(function(el){
				el.setStyle({'display': 'list-item'});
			});
		}
		
		if($('default-moreviews')) {
			var collections = $$('#ul-moreviews > div[id^=moreview]');
			$$('#ul-moreviews a').each(function(el){
				el.observe('mouseover', function(){
					imageSwitchSet(this.href, this.title);
				});
				el.observe('mouseout', imageSwitchReset);
			});
		} else {
			var collections = $$('.more-views ul');
		}
		//collections.each(function(collection){
		for(var y = 0, z = collections.length; y < z; y++) {
			(function() {
				var collection = collections[y];
				var els = collection.childElements();
				var active = 0;
				if(typeof(els[active]) != 'undefined') {
					els[active].setStyle({'display': 'block'});
				}
				if(typeof(els[active+1]) != 'undefined') {
					els[active+1].setStyle({'display': 'block'});
				}
				/*$('nextImages').observe('click', function(e){
					e.stop();
					if(collection.getStyle('display') != 'none') {
						if(active >= els.size()-2) {
							active = 0;
						} else {
							active = active + 2;
						}
						
						els.each(function(el){
							el.setStyle({'display': 'none'});
						});
						
						els[active].setStyle({'display': 'block'});
						if(typeof(els[active+1]) != 'undefined') {
							els[active+1].setStyle({'display': 'block'});
						}
					}
				});
				$('prevImages').observe('click', function(e){
					e.stop();
					if(collection.getStyle('display') != 'none') {
						if(active > 1) {
							active = active - 2;
						} else {
							active = els.size()-2;
						}
									
						els.each(function(el){
							el.setStyle({'display': 'none'});
						});
						
						els[active].setStyle({'display': 'block'});
						if(typeof(els[active+1]) != 'undefined') {
							els[active+1].setStyle({'display': 'block'});
						}
					}
				});*/
			
			})();
		}
		
		/*var active = 0;
	
		$$('.more-views li')[active].setStyle({'display': 'block'});
		$$('.more-views li')[active+1].setStyle({'display': 'block'});
	
		$('nextImages').observe('click', function(e){
			e.stop();
			
			
			
			if(active >= $$('.more-views li').size()-2) {
				active = 0;
			} else {
				active = active + 2;
			}
			
			$$('.more-views li').each(function(el){
				el.setStyle({'display': 'none'});
			});
			
			$$('.more-views li')[active].setStyle({'display': 'block'});
			$$('.more-views li')[active+1].setStyle({'display': 'block'});
						
		});
		$('prevImages').observe('click', function(e){
			e.stop();
			
			if(active > 1) {
				active = active - 2;
			} else {
				active = $$('.more-views li').size()-2;
			}
						
			$$('.more-views li').each(function(el){
				el.setStyle({'display': 'none'});
			});
			
			$$('.more-views li')[active].setStyle({'display': 'block'});
			$$('.more-views li')[active+1].setStyle({'display': 'block'});
		});*/
		
		$('nextImages').observe('click', function(e){
			e.preventDefault();
			var next = $$('#color-swatches .swatchContainer img.swatchSelected')[0].up();
			while(true) {
				var next = next.next();
				if(next && next.down('img').hasClassName('disabledSwatch')) {
					continue;
				}
				break;
			}
			if(next) {
				next.down('img').onclick();
			}
		});
		$('prevImages').observe('click', function(e){
			e.preventDefault();
			var previous = $$('#color-swatches .swatchContainer img.swatchSelected')[0].up();
			while(true) {
				var previous = previous.previous();
				if(previous && previous.down('img').hasClassName('disabledSwatch')) {
					continue;
				}
				break;
			}
			if(previous) {
				previous.down('img').onclick();
			}
		});
		
		$$('#color-swatches .swatchContainer img')[0].onclick();
	}
});

function imageSwitchSet(url, title) {
	$$('p.product-image img.active')[0].id = 'image-old';
	var a = new Element('img', { src: url });
	a.id = 'image';
	$$('p.product-image')[0].appendChild(a);
	
	new Effect.Fade($$('p.product-image img.active')[0], { 
		to:0,
		afterFinish: function(){
			$$('p.product-image img.active')[0].remove();
			$$('p.product-image img')[0].addClassName('active');
			//$$('p.product-image img')[0].id = 'image';
		}
	});
	
	document.getElementById('color-title').innerHTML = title;
}
function imageSwitchSetClick(url, title) {
	$('image').writeAttribute('src', url);
	baseImageUrl = url;
	document.getElementById('color-title').innerHTML = title;
}
function imageSwitchReset() {
	$('image').writeAttribute('src', baseImageUrl);
}