// this file is inluded from every page

var current_url = window.location.toString().replace('#','');
if(current_url.indexOf('?') != -1) current_url = current_url.split('?')[0];

var current_page = current_url.split('/');
current_page = (current_page[current_page.length-1] == '') ? current_page[current_page.length-2] : current_page[current_page.length-1];
if(current_page.indexOf('.')) current_page = current_page.split('.')[0];
// current_page is sometimes set in template

//if((window.location == 'http://dev.betaunit.com/') || (window.location == 'http://dev.betaunit.com/')) current_page = 'start';
var jsBaseUrl = "http://dev.betaunit.com/";

if((window.location == jsBaseUrl) || (window.location == 'http://dev.betaunit.com/')) current_page = 'start';

var cartOutfolded = false;
var browser_ver, mozilla, safari, opera, msie, mac;
var win_width, win_height;


$j('document').ready(function(){

	$j('#BodyContent').fadeIn(1000);
	
	win_width = $j(window).width();
	win_height = $j(window).height();

	// BROWSER SETTINGS
	browser_ver = $j.browser.version;
	if($j.browser.mozilla) mozilla = true;
	if($j.browser.safari) safari = true;
	if($j.browser.opera) opera = true;
	if($j.browser.msie) msie = true;
	if(navigator.userAgent.indexOf('Macintosh') != -1) mac = true;

	// CALL SCRIPT IF SPECIFIC PAGE
	// (current_page is sometimes set in template)
	switch(current_page){
		case 'men': shopStart(); break;
		case 'outlet-men': shopStart(); break;
		case 'women': shopStart(); break;
		case 'outlet-women': shopStart(); break;
		case 'object-shop': shopStart(); break;
		case 'category_overview': categoryOverview(); break;
		case 'start':
			if(msie && (parseFloat(browser_ver) < 7)) alert('YOU ARE USING AN OUTDATED WEB BROWSER\nThis website is not optimized for Internet Explorer '+browser_ver+' and you will not be able to use certain functions.\nFor a better experience on this and all other websites - please upgrade your browser.'); break;
	}

	if(current_url.indexOf('/outfits/') != -1){
		product_amount = $j('#OutfitThumbs .thumb:first .product').length;
		// set first outfit image
		$j('#Outfit .outfit-image').css('background-image', 'url('+$j('#OutfitImageFront').val()+')');

		outfit(true);
		outfitFlip('init');
		buttonWrapper($j('#AddToBag'));
	}

	//______________________________

	// BUTTONS
	// remove <span> from <button>
	$j('button span').each(function(){
		var button_text = $j(this).text();
		$j(this).parent().html(button_text);
	})
	if(mozilla && !mac) $j('button:not(.large)').css({'height':'auto'});
	buttonWrapper();

	// LINKS
	// add mouseover-arrow-space
	$j('.menu-link').each(function(){ $j(this).html('<span class="link-prefix"></span>'+$j(this).html()) })
	// add arrow on current page link
	$j('.passive-link').each(function(){ $j(this).html('<span class="link-prefix">&raquo;&nbsp;</span>'+$j(this).html()) })
	// reset left-margin
	$j('.menu-link, .passive-link').css('margin-left', 0);
	$j('.sub-menu .menu-link, .sub-menu .passive-link').css('margin-left','3px');

	// hover
	/*$j('a').hover(
		function(){$j('.link-prefix', this).html('&raquo;&nbsp;')},
		function(){$j('.link-prefix', this).html('')}
	)*/

	// CHECKBOX
	$j('input:checkbox ~ label').css({'clear':'none', 'display':'inline'});

	// SEARCH FIELD
	$j('#search_mini_form #search').each(function(){
		if(mozilla && mac) $j(this).css({'padding-top':'0px'});
		if(mozilla && !mac) $j(this).css({'padding-top':'2px'});
		if(safari && !mac) $j(this).css({'line-height':'17px'});
	});

	//margin: 3px 0 0 0; padding: 1px 1px 0 1px;


	// Remove validation-failure
	$j('input').change(function(){
		var elm_id = $j(this).attr('id');
		$j('label[for="'+elm_id+'"]').css('color','black');
		$j('#advice-required-entry-'+elm_id).remove();
		$j(this).removeClass('validation-failed');
	})

	// MY CART (dropdown)
	$cartLink = $j('#ShoppingCartLink');
	$cartLink.bind('click', function(){
		if(!cartOutfolded) cartDrop('down');
		else cartDrop('up');
		return false;
	});

	// PRICE (split class .price)
	//$j('.price').each(function(){ priceFormat($j(this), 'small'); })
})




// MISC FUNCTIONS ___________________________________________________________________________

function priceFormat(obj, size){
	var fullprice = $j(obj).text();
	for(i=0; i<fullprice.length; i++){
		if(isNaN(fullprice.charAt(i)) && (fullprice.charAt(i) != ',')){
			var price = fullprice.substring(0,i).replace(',','');
			var currency = fullprice.substring(i);
			if(size == '10-10') $j(obj).html('<span style="font-size:10px">'+price+'</span>&nbsp;<span style="font-size:10px">'+currency+'</span>')
			if(size == '14-10') $j(obj).html('<span style="font-size:14px">'+price+'</span>&nbsp;<span style="font-size:10px">'+currency+'</span>')
			break;
		}

	}
}

function buttonWrapper(btn){
	if(msie && browser_ver == 7){
		if(btn == undefined){
			// all btns
			$j('button:not(.no-wrap)').each(function(){ wrap($j(this)); });
		}else{
			// specific btn
			wrap(btn);
		}

		function wrap(btn){
			if($j(btn).parents('.button-wrapper').length == 0){
				// before: <button><button> after: <div class="button-wrapper"><button><button></div>
				$j(btn).wrap('<div class="button-wrapper"></div>');
	
				// fix width for small buttons
				if($j(btn).hasClass('large') == false){
					$j(btn).css({'padding-left':0, 'padding-right':0})
					if($j(btn).css('width') == 'auto') $j(btn).width($j(btn).text().length*7+10);
				}
	
				if($j(btn).hasClass('large')){
					$j(btn).parent().height($j(btn).css('height'));
				}
	
				var extra_width = 2;
	
				// set width for .button-wrapper
				if($j(btn).width() == 0)
					var wrapper_width = parseInt($j(btn).css('width'));
				else
					var wrapper_width = $j(btn).width()+extra_width;
	
				$j(btn).parent().width(wrapper_width);
				// fix a weird focus issue
				$j('.button-wrapper:first').focus();
	
				if($j(btn).css('display') == 'none') $j(btn).parent().hide();
			}
		}
	}
}

function cartDrop(dir){
	var cart_height = $j('.block-cart').height()+30;

	if(dir == 'down'){
		cartOutfolded = true;
		$j('#ShoppingCartLink').attr('href','#');
		$j('.block-cart')
			.show()
			.css('top','-'+cart_height+'px')
			.animate({ 'top':'0px' }, 1000, 'easeOutQuart', function(){
				if(msie && browser_ver == 7) buttonWrapper($j('#CheckoutBtnPopup'));
			} );

		$j(document).bind('click', function(e){
			if($j(e.target).parents('.block-cart').length == 0) cartDrop('up');
		})

		if($j('#CartSum').text() == ''){
			// empty shopping bag
			$j('#Bag').text(0);
			$j('#CheckoutBtn').hide();
			if(msie && (browser_ver == 7)) $j('#HeaderMenuRight .button-wrapper').hide();
		}else{
			// items in shopping bag
			if(mozilla && !mac) $j('#CheckoutBtnPopup').css({'height':'auto'});
			//$j('.block-cart .price').each(function(){priceFormat($j(this), '14-10')})
			$j('#Bag').text($j('#CartQty').val());
			$j('#CheckoutBtn').show();
			if(msie && (browser_ver == 7)) $j('#HeaderMenuRight .button-wrapper').show();
		}


	}else if(dir == 'up'){
		cartOutfolded = false;
		$j('.block-cart').stop().animate({'top':'-'+cart_height+'px'}, {duration: 1500, easing: 'easeOutQuart'});
	}
}

function shopStart(){
	
	var image_amount = $j('#ShopStartHeader img').length;
	var html_btn = '';
	for(i=0; i<image_amount; i++){ html_btn += '<div class="btn">'+(i+1)+'</div>'; }
	$j('#ShopStartHeader').prepend('<div id="ShopStartHeaderNav">'+html_btn+'</div>');

	// save data and remove imgs
	var shop_start_src = [], shop_start_link = [];
	$j('#ShopStartHeader img').each(function(){
		shop_start_src.push($j(this).attr('src'));
		if($j(this).attr('longdesc') != undefined) shop_start_link.push($j(this).attr('longdesc'))
		else shop_start_link.push('');
		$j(this).remove();
	});

	// click nav
	var current_btn_no;
	var mouseovernav = false;
	// only one image - hide navigation
	if($j('#ShopStartHeaderNav .btn').size() == 1) $j('#ShopStartHeaderNav').hide();
	$j('#ShopStartHeaderNav .btn').click(function(){
		var index = $j(this).parent().children().index(this);
		clickShopStartHeader(index);
	}).mouseover(function(){ mouseovernav = true; }).mouseout(function(){ mouseovernav = false; })
	$j('#ShopStartHeaderNav').mouseover(function(){ clearInterval(shop_start_interval); }).mouseout(function(){ shop_start_interval = setInterval(function(){ clickShopStartHeader()}, 5000); })
	
	if(mozilla && mac) $j('#ShopStartHeaderNav .btn').css({'height':'10px', 'padding-top':'1px'})

	// auto-switch every 5 sek
	var shop_start_interval = setInterval(function(){ clickShopStartHeader()}, 5000);

	clickShopStartHeader(0);
	function clickShopStartHeader(num){
		if(current_btn_no == undefined) current_btn_no = 100;
		if(num == undefined) num = (current_btn_no+1);
		if(num == image_amount) num = 0;
		$j('#ShopStartHeader').css('background-image', 'url('+shop_start_src[num]+')');
		$j('#ShopStartHeaderNav .btn:eq('+num+')').addClass('current');
		$j('#ShopStartHeaderNav .btn:eq('+(current_btn_no)+')').removeClass('current');
		// mouse pointer
		if(shop_start_link[num].indexOf('http') != -1) $j('#ShopStartHeader').css('cursor', 'pointer')
		else $j('#ShopStartHeader').css('cursor', 'default');
		
		current_btn_no = num;
	}

	// click background
	$j('#ShopStartHeader').click(function(){
		if(!mouseovernav && (shop_start_link[current_btn_no].indexOf('http') != -1)) window.location = shop_start_link[current_btn_no];
	})

	// shop start menu
	flap($j('.shop-start-content'));

	// content items
	$j('.shop-start-content .item .name').wrap('<div class="name-wrapper"></div>');
	$j('.shop-start-content .name-wrapper').prepend('<div class="chr">&#9642;</div>').append('<div class="chr">&#9642;</div><br style="clear:both">')

	$j('.shop-start-content').each(function(){

		var item_num = 0, item_row = 0, item_highestImageHeight = 0;
		$j('.item', this).each(function(){
			
			// first item in row
			if(Number(parseInt(item_num/4)) == Number(item_row)){
				$j(this).css({'margin-left':'0px', 'clear':'left'});
				item_row ++;
			}
			
			var imageHeight = parseInt($j('.image', this).css('height'));
			$j(this).css('height', imageHeight+63+'px');
			
			$j(this).addClass('row_'+item_row);
			
			// check highest image height in current row
			if($j('.image', this).height() > item_highestImageHeight) item_highestImageHeight = $j('.image', this).height();
			
			// last item in row
			if((Number(item_num/4).toString().indexOf('.75') != -1) || ($(this).next() == null)){
				// loop through each image in current row and check if it need to have any top margin
				$j(this).parent().find('.row_'+item_row+' .image').each(function(){
					var imageMarginTop = (item_highestImageHeight > 0) ? item_highestImageHeight-$j(this).height() : 0;
					if(imageMarginTop > 0){
						$j(this).css('margin-top', imageMarginTop+'px');
						// add the extra top margin to parent div (.item)
						$j(this).parent().css('height', $j(this).parent().height()+imageMarginTop+'px');
					}
				})
				item_highestImageHeight = 0;
			}
			
			item_num ++;
		}).click(function(){
			window.location = $j(this).attr('title');
		}).mouseover(function(){
			$j('.name-wrapper *', this).addClass('color');
		}).mouseout(function(){
			$j('.name-wrapper *', this).removeClass('color');
		})
	})
}


/* FLAP
create flap like this:
<ul id="Flap">
	<li>[menu name]</li>
	<li>[menu name]</li>
</ul>
<div class="[container name] [menu name]"></div>
<div class="[container name] [menu name]"></div>
<script> flap($j('.[container name]')) </script>
*/
function flap(contentClass){
	$ul = $j('#Flap');
	$ul.wrap('<div id="Flap-Wrapper"></div>');
	$ul.show();
	$j(contentClass).hide();

	//if(mozilla && mac) $j('li', $ul).css({'height':'11px', 'padding-top':'2px'}) // style-fix mac/ff
	
	var li_width = 0;
	
	$j('li', $ul)
		.each(function(){
			// save navigation name
			$j(this).data('name', $j(this).text());
			// save name for content class
			var class_name = $j(this).text().replace(/ \(\d*\)/,'').toLowerCase();
			class_name = class_name.replace(/ /g,'-');
			$j(this).data('class_name', class_name);
			if(msie && browser_ver == 7){
				// fix name
				class_name = class_name.substring(0, class_name.length-1);
				$j(this).data('class_name', class_name);	
			}
			// add spaces
			$j(this).html('<div class="pre">&nbsp;</div><div class="flap-title">'+$j(this).text()+'</div><div class="post">&nbsp;</div>');
			if(mozilla && !mac) $j('.pre, .post', this).css('margin-top','-1px');
			li_width += ($j(this).width() + parseInt($j(this).css('margin-right')));
		})
		.bind('click', function(){
			var body_height = $j('body').height();
			contentClass.hide();
			 $j('body').height(body_height);
			$j('.'+$j(this).data('class_name')).fadeIn();
			// set class
			$j('li', $ul).removeClass('flap-active');
			$j(this).addClass('flap-active');
			addSquares($j(this));
			return false;
		})
		
	$j('li', $ul).filter(':first').addClass('flap-active');
	$j('li', $ul).filter(':last').css('margin-right','0px');
		
	// center flap lists
	var ul_inner_margin = ($ul.width()-li_width)/2+'px';
	$j('li', $ul).filter(':first').css('margin-left', ul_inner_margin);
	$j('li', $ul).filter(':last').css('margin-right', ul_inner_margin);
		
	$j('.'+$j('#Flap li:first').data('class_name')).show();
		
	addSquares($j('li:first', $ul));
	
	function addSquares(li){
		$j('#Flap').find('li').each(function(){
			$j('.pre', this).html('&nbsp;');
			$j('.post', this).html('&nbsp;');
		});
		$j('.pre', li).html('&#9642;');
		$j('.post', li).html('&#9642;');
	}
}



// CATEGORY OVERVIEW

function categoryOverview(){
	//alert('categoryOverview()')

	// content items
	$j('.products-grid .item .name').wrap('<div class="name-wrapper"></div>');
	$j('.products-grid .name-wrapper').prepend('<div class="chr">&#9642;</div>').append('<div class="chr">&#9642;</div><br style="clear:both">')

	$j('.products-grid').each(function(){

		var item_num = 0, item_row = 0;
		$j('.item', this).mouseover(function(){
			$j('.name-wrapper *', this).addClass('color');
		}).mouseout(function(){
			$j('.name-wrapper *', this).removeClass('color');
		})
	})
}


// OUTFIT

var fullview_image_animates = false;
var outfit_num = 1, outfit_id;
var product_num, product_amount;
var thumb_active = 0;


// invoked when page is loaded and every time a new outfit displays (from switchOutfit())
function outfit(init){

	// outfit product
	$j('#Outfit .item')
		.mouseover(function(){
			if($j(this).attr('title') != ''){
				$j(this).data('imagesrc', $j(this).attr('title'));
				$j(this).removeAttr('title');
			}
			$j('h3', this).addClass('color');
			product_num = Number($j('#Outfit #Items .item').index(this));
			$j('#ImageModel').css({'background':'url('+$j(this).data('imagesrc')+')'}).show();
		})
		.mouseout(function(){
			$j('h3', this).removeClass('color');
			$j('#ImageModel').hide();
		});

	// outfits navigation (thumbs)
	if(init){
		$j('#OutfitThumbs .thumb').each(function(){ $j(this).prepend('<div class="overlay"></div>'); });
		$j('#OutfitThumbs .thumb:first .overlay').hide();

		$j('#OutfitClick .thumb').each(function(i){
			$j(this)
				.bind('mouseover', {index:i}, function(e){ $j('.overlay:eq('+e.data.index+')').hide(); })
				.bind('mouseout', {index:i}, function(e){ if((thumb_active != e.data.index)) $j('.overlay:eq('+e.data.index+')').show(); })
				.bind('click', {index:i}, function(e){ switchOutfit($j(this).parent().filter('#OutfitThumbs .thumb:eq('+e.data.index+')')); })
		})
		// check if first outfir has flip-image
		if($j('#OutfitThumbs .thumb:eq(0) .outfit-image-back').val() == undefined) $j('.flip').hide();
	}

	// thumbnails container height
	var thumb_amount = $j('#OutfitThumbs .thumb').length;
	var thumb_rows = Math.ceil(thumb_amount/14);
	var thumb_height = parseInt($j('#OutfitThumbs .thumb').css('height'));
	$j('#Outfits').css('height', (thumb_height*thumb_rows)+'px');

	// outfit navigation (left/right)
	$j('#OutfitAmount').text(thumb_amount);
	$j('#OutfitNavArrows a').css({'opacity':'1', 'cursor':'pointer'}); if(msie && (browser_ver == 8)) $j('#OutfitNavArrows a:eq(0), #OutfitNavArrows a:eq(1)').show();

	$j('#OutfitNavArrows a:eq(0)')
		.mouseover(function(){ $j(this).addClass('color') }).mouseout(function(){ $j(this).removeClass('color') })
		.click(function(){
			var prev_num = Number($j('#CurrentOutfitNum').text())-1;
			switchOutfit($j('#OutfitThumbs .thumb:eq('+(prev_num-1)+')'))
		})

	$j('#OutfitNavArrows a:eq(1)')
		.mouseover(function(){ $j(this).addClass('color') }).mouseout(function(){ $j(this).removeClass('color') })
		.click(function(){
			var next_num = Number($j('#CurrentOutfitNum').text())+1;
			switchOutfit($j('#OutfitThumbs .thumb:eq('+(next_num-1)+')'))
		})
		
	if(outfit_num == 1){
		$j('#OutfitNavArrows a:eq(0)').css({'opacity':'0', 'cursor':'default'}).unbind('click'); 
		if(msie && (browser_ver == 8)) $j('#OutfitNavArrows a:eq(0)').hide();
	}
	if(outfit_num == thumb_amount){
		$j('#OutfitNavArrows a:eq(1)').css({'opacity':'0', 'cursor':'default'}).unbind('click');
		if(msie && (browser_ver == 8)) $j('#OutfitNavArrows a:eq(1)').hide();
	}

	// "shop this item" button
	$j('button.btn-popup').click(function(){
		showTransparentCanvas('Level1');
		showLargePopup();
	});

	// zoom outfit
	zoomImage($j('#Outfit .outfit-image'), $j('#Outfit #OutfitImageFrontZoom').val());
}

// flip outfit image
function outfitFlip(){

	$j('.flip')
		.mouseover(function(){ $j('#ZoomTooltip').data('disable', true); $j('#ZoomTooltip').hide(); })
		.mouseout(function(){ $j('#ZoomTooltip').data('disable', false); $j('#ZoomTooltip').show(); })
		.toggle(
			function(){
				$j('.outfit-image').css('background-image', 'url('+$j('#OutfitImageBack').val()+')')
				zoomImage($j('#Outfit .outfit-image'), $j('#Outfit #OutfitImageBackZoom').val());
			},
			function(){
				$j('.outfit-image').css('background-image', 'url('+$j('#OutfitImageFront').val()+')')
				zoomImage($j('#Outfit .outfit-image'), $j('#Outfit #OutfitImageFrontZoom').val());
			}
		);
}

// obj_outfit = #OutfitThumbs .thumb
function switchOutfit(obj_outfit){
	if(!fullview_image_animates){

		outfit_id = $j('.outfit-id', obj_outfit).val();
		outfit_num = $j('.outfit-num', obj_outfit).val();
		product_amount = $j('.product', obj_outfit).length;

		var outfit_image_front = $j('.outfit-image-front', obj_outfit).val();
		var outfit_image_front_zoom = $j('.outfit-image-front-zoom', obj_outfit).val();
		var outfit_image_back = $j('.outfit-image-back', obj_outfit).val();
		var outfit_image_back_zoom = $j('.outfit-image-back-zoom', obj_outfit).val();

		(outfit_image_back == undefined) ? $j('.flip').hide() : $j('.flip').show();

		// navigation thumbs
		$j('.overlay:eq('+thumb_active+')').show().data('visable', true);
		thumb_active = (outfit_num-1);
		$j('.overlay:eq('+thumb_active+')').hide();

		// change outfit image and zoom images
		$j('#Outfit #OutfitImageFront').attr('value', outfit_image_front);
		$j('#Outfit #OutfitImageBack').attr('value', outfit_image_back);
		$j('#Outfit #OutfitImageFrontZoom').attr('value', outfit_image_front_zoom);
		$j('#Outfit #OutfitImageBackZoom').attr('value', outfit_image_back_zoom);

		// clone big image and put copy under original
		$j('.outfit-image')
			.clone(true)
			.insertBefore($j('#Outfit .outfit-image'))
			.addClass('copy')
			.css('background-image', 'url('+outfit_image_front+')');

		// look zoom until fade is completed
		fullview_image_animates = true;

		// outfit counter
		$j('#CurrentOutfitNum').text(outfit_num);

		// add new outfit items
		$j('#Outfit #Items .item').remove();

		for(i=0; i<product_amount; i++){
			var name = $j('.product:eq('+i+') .product-name', obj_outfit).val();
			var productUrl = $j('.product:eq('+i+') .product-url', obj_outfit).val();
			var type = $j('.product:eq('+i+') .product-type', obj_outfit).val();
			var image = $j('.product:eq('+i+') .product-image-small', obj_outfit).val();
			var price = $j('.product:eq('+i+') .product-price', obj_outfit).val();
						
			var new_items_html = '<div class="item" title="'+image+'">';
			new_items_html += '<a href="javascript:loadProduct(\''+productUrl+'\', '+i+')"><h3>'+name+'</h3></a>';
			new_items_html += '<h4>'+type+' / '+price+' '+currency+'</h4>';
			new_items_html += '<button type="button" onClick="loadProduct(\''+productUrl+'\', '+i+')" class="btn-popup">shop this item</button>';
			new_items_html += '</div>';

			$j('#Outfit #Items').append(new_items_html);

			$j('#Outfit #Items .item:eq('+i+') h3').text(name);
			$j('#Outfit #Items .item:eq('+i+') .type').text(type);
			$j('#Outfit #Items .item:eq('+i+') .price').text(price);
		}
		if(mozilla) $j('button').css('height','auto');
		buttonWrapper();

		// swich big image, fadeout/delete original
		$j('.outfit-image:not(.copy)').fadeOut(1000, function(){
			$j(this).remove();
			// remove class "copy" from copy
			$j('.outfit-image.copy').removeClass('copy');

			fullview_image_animates = false;
			outfit();
		});
	}
}

function nextProductItem(){
	if(product_num < (product_amount-1)) product_num ++;
	else product_num = 0;
	showLargePopup();
}

var zoom_is_clicked = false;
function zoomImage(obj, imgSrc){
	if(!$j('#ZoomTooltip').length){
		$j('body').append('<div id="ZoomTooltip"></div>');
		$j('body').append('<div id="ZoomBigView"></div>');
	}

	$j(obj).addClass('cursor-zoom-in');

	$j(obj)
		.mousemove(function(e){
			if(!$j('#ZoomTooltip').data('disable')) ZoomTooltip('CLICK&nbsp;TO&nbsp;ZOOM');

			$j('#ZoomTooltip').css({
				top: (e.pageY + 15) + 'px',
				left: (e.pageX + 7) + 'px'
			});
		})
		.mouseout(function(e){ if(!zoom_is_clicked) $j('#ZoomTooltip').hide(); })
		.click(function(){
			if(!fullview_image_animates && !$j('#ZoomTooltip').data('disable')){

				zoom_is_clicked = true;

				$j('#ZoomBigView')
					.html('<img src="'+imgSrc+'" width="100%">')
					.show()
					.mousemove(function(e){
						$j('#ZoomTooltip').css({
							top: (e.pageY + 15) + 'px',
							left: (e.pageX + 7) + 'px'
						});
						
						var tooltop_limit_x = e.pageX+$j('#ZoomTooltip').width()+22;
						if(tooltop_limit_x > win_width) $j('#ZoomTooltip').hide();
						else $j('#ZoomTooltip').show();
						
					})
					.click(function(){
						zoom_is_clicked = false;
						$j(this).hide();
						$j('#ZoomTooltip').hide();
					});

				$j('#ZoomBigView img').width(win_width)

				$j(window).resize(function(){ $j('#ZoomBigView img').width(win_width);});

				ZoomTooltip('CLICK&nbsp;TO&nbsp;CLOSE');
			}
		});
}

function showClose(id) {
	$j('#'+id).show();
	$j('#'+id+'Link').hide();						
}

function ZoomTooltip(txt){ $j('#ZoomTooltip').show().html(txt); }

function showTransparentCanvas(level){
	var z;
	if(level == 'Level1') z = 200; else z = 210;

	var canvas_height = $j('body').height()-122;

	$j('body').append('<div class="transparent-canvas" id="'+level+'"></div>');
	$j('.transparent-canvas#'+level)
		.hide()
		.css({'height': canvas_height+'px','opacity': 0.85, 'z-index': z})
		.fadeIn(500);

	$j(window).bind('resize', function(){
		//alert('resize')
	})
}

function closeTransparentCanvas(id){ $j('.transparent-canvas#'+id).fadeOut(300, function(){ $j(this).remove() }); }

var codeToRun = ""; 
var contentToFill = "";

function changeList(id) {
	$j('#itemsLeft').html('');
	if(id == "attribute509") {
		var d= document.getElementById(id);
		var i=d.selectedIndex;
		if(prodColors[d.options[i].innerHTML] == null) {
			selectColor( d.options[i].innerHTML, "", "");	
		} else {
			selectColor( d.options[i].innerHTML, prodColors[d.options[i].innerHTML]["big"], prodColors[d.options[i].innerHTML]["full"]);
		}
	}
}


function loadProduct(url, num) {
	$j('#PopupLarge').html('<img class="outfitLoader" src="'+jsBaseUrl+"skin/frontend/base/blank/images/product-loader.gif\" />");
	new Ajax.Request(url+"?skipColumn=true",
	{
		method:'get',
		onSuccess: function(transport){
			var response = transport.responseText || "no response text";
			contentToFill = response;

			var script0 = 'document.getElementById("PopupLarge").innerHTML = \'<div style="position: absolute; right: 10px; top: 10px;" id=\"Close\"><a href=\"#\" onclick=\"closeTransparentCanvas(\\\'Level1\\\'); $j(\\\'#PopupLarge\\\').hide(); return false\">close [x]</a></div><div style="position:absolute;left:320px;top:8px"><a href=\"#\" onclick=\"closeTransparentCanvas(\\\'Level1\\\'); $j(\\\'#PopupLarge\\\').hide(); return false\"><span style=\"font-size:14px\">&laquo;</span> back to outfit</a> / <a href=\"#\" onClick=\"nextOutfitItem('+num+')\">next item</a> <span style=\"font-size:14px\">&raquo;</span></div>\'+contentToFill.substring(contentToFill.search("<!-- Product Info Container -->"), contentToFill.search("<!-- Close Product Info Container -->"));'
			showLargePopup();

			var script1 = "";
			if(response.search("//start_code_1") > 0)
				script1 = response.substring(response.search("//start_code_1")+("//start_code_1").length, response.search("//end_code_1"));

			var script2 = "";
			if(response.search("//start_code_2") > 0)
				script2 = response.substring(response.search("//start_code_2")+("//start_code_2").length, response.search("//end_code_2"));

			var script3 = "";
			if(response.search("//start_code_3") > 0)
				script3 = response.substring(response.search("//start_code_3")+("//start_code_3").length, response.search("//end_code_3"));

			var script4 = "";
			if(response.search("//start_code_4") > 0)
				script4 = response.substring(response.search("//start_code_4")+("//start_code_4").length, response.search("//end_code_4"));

			var script5 = "";
			if(response.search("//start_code_5") > 0)
				script5 = response.substring(response.search("//start_code_5")+("//start_code_5").length, response.search("//end_code_5"));

			var script6 = "";
			if(response.search("//start_code_6") > 0)
				script6 = response.substring(response.search("//start_code_6")+("//start_code_6").length, response.search("//end_code_6"));

			var script7 = "";
			if(response.search("//start_code_7") > 0)
				script7 = response.substring(response.search("//start_code_7")+("//start_code_7").length, response.search("//end_code_7"));

			var script9 = "";
			if(response.search("//start_code_9") > 0)
				script9 = response.substring(response.search("//start_code_9")+("//start_code_9").length, response.search("//end_code_9"));

				
			// Regexp version (can't determine the order though, so we can't use it )
			var pat = /\/\/allways_include([\w\W]*?)\/\/end_include([\w\W]*)/m
			var tmp = response
			var include = '';
			while(r=pat.exec(tmp)) {
				include+=r[1];
				tmp=r[2];
			}
			eval(script7);
			codeToRun = include + script0+script1+script4+script2+script3+script5+script6+script9+"bindAddToCartButtons();";
			
			if( window.execScript )
				setTimeout( function(){ window.execScript( codeToRun );}, 10);
			else
				setTimeout("eval(codeToRun)", 10);
			
		},
		onFailure: function(){ alert('Sorry, product not available') }
	});    				        	
}

function nextOutfitItem(current_outfit_item_num){
	var current_outfit_items = $j('#Outfit #Items .item').size();
	var next_num = (Number(current_outfit_item_num+1) == current_outfit_items) ? 0 : Number(current_outfit_item_num+1);
	
	closeTransparentCanvas('Level1');
	$j('#Outfit #Items .item:eq('+next_num+') button').trigger('click');
}


// large popup
var large_popup_is_set = false;
function showLargePopup() {
	if(!large_popup_is_set){
		$j('#PopupLarge').appendTo('body').show();
		large_popup_is_set = true;
	}else{
		$j('#PopupLarge').show();
	}

	var col_main_offset = $j('.col-main').offset();
	$j('#PopupLarge').css('left', col_main_offset.left+'px');

	var popup_outfit_obj = $j('#OutfitThumbs .thumb:eq('+(Number(outfit_num)-1)+')');
	var popup_product_obj = $j('.product:eq('+product_num+')', popup_outfit_obj);

	var popup_product_image_large = $j('.product-image-large', popup_product_obj).val();
	var popup_product_name = $j('.product-name', popup_product_obj).val();
	var popup_product_price = $j('.product-price', popup_product_obj).val();
	var popup_product_description = $j('.product-description-short', popup_product_obj).val();
	var popup_product_image_amount = $j('.product-images .product-image', popup_product_obj).length;

	$j('#ImageLarge').css('background','url('+popup_product_image_large+')')
	$j('#ProductData h1:first').text(popup_product_name);

	$j('#ProductData h1:last').text(popup_product_price);
	$j('#ProductData #ProductDescription').text(popup_product_description);

	// product images
	$j('#ImageBar .image').remove();
	var image_height = 80;
	for(i=0; i<popup_product_image_amount; i++){
		var popup_product_image = $j('.product-images .product-image:eq('+i+')', popup_product_obj).val();
		$j('#ImageBar').append('<div class="image" style="background:url('+popup_product_image+'); bottom:'+(image_height*i)+'px;"></div>');
		$j('#ImageBar .image:eq('+i+')').bind('mouseover', {index:i}, function(e){
			var image = $j('.product-images .product-image-large:eq('+e.data.index+')', popup_product_obj).val();
			$j('#ImageLarge').css('background','url('+image+')')
		})
	}


}

// small product popup
function showProductDetailPopup(name, description, image){
	showTransparentCanvas('Level2');
	var sketch = (image == undefined) ? '' : image;

	if(name == undefined){
		var popup_outfit_obj = $j('#OutfitThumbs .thumb:eq('+(Number(outfit_num)-1)+')');
		var popup_product_obj = $j('.product:eq('+product_num+')', popup_outfit_obj);

		var name = $j('.product-name', popup_product_obj).val();
		var description = $j('.product-description', popup_product_obj).val();
		sketch = $j('.product-sketch', popup_product_obj).val();
	}

	var html = 	'<div id="PopupSmall">';
	html += 	'	<div class="border-fat"></div>';
	html +=		'<div><div style="float: left; overflow: hidden;">'; 
	html += 	'	<h1>'+name+'</h1>';
	html += 	'	<div class="border-short"></div>';
	html += 	'	<p>'+description+'</p>';
	html += 	'</div>';
	html += 	'<div style="float: right; width: 275px; height: 330px; overflow: hidden;">';
	html += 	'	<div id="Close"><a href="#" onclick="closeTransparentCanvas(\'Level2\'); $j(\'#PopupSmall\').remove(); return false">close [x]</a></div>';
	if(sketch.length > 0) {
		html += 	'<div id="Sketch"><img src="'+sketch+'"/></div>';
	}
	html += 	'</div></div>';
	html += 	'	<div class="border-fat bottom"></div>';
	html += 	'</div>';

	$j('body').append(html);

	var popupLarge_offset = $j('#PopupLarge').offset();

	if(current_url.indexOf('/outfits/') != -1){
		// outfit
		$j('#PopupSmall').css({'left':(popupLarge_offset.left+35)+'px'});
	}else{
		// product
		var popupsmall_width = ((win_width/2)-($j('#PopupSmall').width()/2));
		$j('#PopupSmall').css('left', popupsmall_width+'px');
	}
}



/* Scripts for the Item Detail Page */

var lastColor = null;
var hasRunCode = false; 

function isdefined( variable)
{
    return (typeof(window[variable]) == "undefined")?  false: true;
}

function showColorNotAvailable() {
	jQuery("#noColorMessage").show();
}

function hideColorNotAvailable() {
	jQuery("#noColorMessage").hide();
}


function selectColor(color, bigImage, fullviewImage) {
	var holder = document.getElementById("colorHolder_" + color);
	var imageContainer = document.getElementById("itemDetailImageList");
	var colorNameHolder = document.getElementById("colorNameHolder"); 
	
	if(lastColor != null) {
		var colorImage = document.getElementById("colorName_"+lastColor);
		if(colorImage != null)
			colorImage.style.cssText = "border: 2px solid transparent !important";	
	}
		
	var colorImage = document.getElementById("colorName_"+color);
	if(colorImage != null)
		colorImage.style.cssText = "border: 2px solid #723570 !important";
	//$j(colorImage).css('cssText', '2px solid #723570 !important');
	
	//imageContainer.innerHTML = holder.innerHTML;
	//if(colorNameHolder != null)
	//	colorNameHolder.innerHTML = "("+color.toUpperCase()+")"; 
	
	if(bigImage != "") {
		changeImage(bigImage, fullviewImage);
		hideColorNotAvailable();
	} else {
		showBigImage(document.getElementById("styleImage").innerHTML);
		//showColorNotAvailable();
	}

	for(var i=0; i<document.addToCart.attribute509.options.length; i++) {
		if(document.addToCart.attribute509.options[i].text == color) {
			document.addToCart.attribute509.selectedIndex = i;
		}
	}

	// if size droplist does not exist, don't bother	
	if(jQuery("#attribute508").html() != null) {
		jQuery("#attribute508").removeAttr('disabled'); 
		spConfig.fillSelect(spConfig.settings[1]);
	}
		
	if(jQuery("#itemDetailImageList ul li:first a").attr("href") != null)
		eval(jQuery("#itemDetailImageList ul li:first a").attr("href").substr(11));
		
	jQuery("#clearSelectionLink").show();
	lastColor = color;
}

var doZoom = false;

function changeImage(url, zoom_url) {
	document.getElementById("mainImage").src = url;
	if(doZoom) {
		zoomImage($j('#mainImage'), zoom_url);	
		$j('#mainImage').addClass('zoom-cursor');
	}else{
		$j('#mainImage').removeClass('zoom-cursor');
	}
}

function getItemsLeft(){
	if($j("#attribute508 :selected").text() == "SELECT COLOR FIRST") {
		$j("#attribute508").attr("selectedIndex", "0")
	} else {
		var available_url = $j('#product_addtocart_form').attr('action').replace("/add", "/available");
		$j.post(available_url, $j('#product_addtocart_form').serialize(), function(data){
			$j('#itemsLeft').html(data);
		})
	}
}


function clearSelection() {
	var colorNameHolder = document.getElementById("colorNameHolder"); 
	colorNameHolder.innerHTML = ""; 
	document.addToCart.attribute509.selectedIndex = 0;
	jQuery("#clearSelectionLink").hide();
	var imageContainer = document.getElementById("itemDetailImageList");
	//imageContainer.innerHTML = document.getElementById("itemDetailContainer").innerHTML;
	changeImage($j('#styleImage').html(), $j('#mainImage').attr('longdesc'));
	hideColorNotAvailable();
	
	if(lastColor != null) {
		var colorImage = document.getElementById("colorName_"+lastColor);
		if(colorImage != null) {
			colorImage.style.cssText = "border: 2px solid #d49a96";	
		}
		
		lastColor = null;
	}
	
}

function checkPasswords(password, confirmPassword, length){
	var uInput = password.value;
        var confirm = confirmPassword.value;
        if(uInput != confirm){
             alert("Confirmation of password failed, try again");
		
                return false;
        }else if(uInput.length <= length){
            alert("Password can't be less than "+ length+ " characters");
		
                return false;
        }else{
            return true;
        }
}

function showClose(id) {
	$j('#'+id).show();
	$j('#'+id+'Link').hide();						
}
						
function showBigImage(image) {
	var mainImage = document.getElementById("mainImage");
	mainImage.src = image; 
}