if (typeof Panagora != 'object' || typeof Panagora == 'undefined')
	var Panagora = {};
	
if (typeof console != 'object')
	var console = { log: function() {}, info: function() {} }

/**
 * This document should only contain scripts that are general and could/should be applied to any site
 */

var $j = jQuery.noConflict();

$j(document).ready(function() {
	
	/**
	 * Puts the #text-search label as value for input box. (for cleaner mark up)
	 * Use like this.. setInputFieldValueFromLabel($j('label[@for="text-search"]').html(), '#text-search');
	 *
	 * @param 	{object}		labelContent 	The label content
	 * @param 	{object}		inputFieldId 	The id of the target input field
	 * @return 	{void}
	 */
	$j.fn.setInputFieldValueFromLabel = function(labelContent, inputFieldId){
		$j(inputFieldId).val(labelContent).css('color', '#000');
		
		$j(inputFieldId).blur(function(){
			if($j(inputFieldId).val() == ''){
				$j(inputFieldId).val(labelContent).css('color', '#000');
			}
		});
		
		$j(inputFieldId).focus(function(){
			if($j(inputFieldId).val() == labelContent){
				$j(inputFieldId).val('');
			}
		});
	}

	/**
	* Function to get rid of target="_blank"
	* Write like this instead.. <a href="somewhere.asp" rel="external">Somewhere</a>
	*/
	$j('a[@rel="external"]').click(function() {
		return !window.open($j(this).attr('href'));
	});

});

Panagora.SwitchImageAndStep = function(fpi) {
	var currentImageId = 0;
	
	var scrollContainer = document.getElementById('scroller');
	var imgContainer = document.getElementById('content');

	var selected = 1;
	var loaded = 0;
	var initialized = false;
	var images;
	
	function setImage() {
		var image = images[currentImageId];
		var myDiv;
		var divs = $j('div.section', imgContainer);
		var target = 500;
		
		if (image.idx == selected) {
			myDiv = divs.get(1);
			scrollContainer.scrollLeft = 500;
			$j(document.createElement('div')).attr('id', 'selected-image').insertBefore('#list-image-'+currentImageId);
		} else if (image.idx < selected) {
			myDiv = divs.get(0);
			var rightDiv = divs.get(2);
			scrollStart(scrollContainer, 500, 0, 'horiz', function () { imgContainer.insertBefore(rightDiv, myDiv); scrollContainer.scrollLeft = 500; });
		} else if (image.idx > selected) {
			myDiv = divs.get(2);
			var leftDiv = divs.get(0);
			scrollStart(scrollContainer, 500, 1000, 'horiz', function () { imgContainer.appendChild(leftDiv); scrollContainer.scrollLeft = 500; });
		}

		$j('img', myDiv).get(0).src = image.src;
		// etc
		$j('.product-title', myDiv).text(fpi.images[currentImageId].title);
		$j('.product-description', myDiv).text(fpi.images[currentImageId].description);
		$j('.product-color', myDiv).text(' - ' + fpi.images[currentImageId].color);
		$j('.product-price', myDiv).text(fpi.images[currentImageId].price + ':-');
		$j('.product-press a', myDiv).attr('href', fpi.baseUrl + fpi.images[currentImageId].xl)

		$j('#selected-image').remove().insertBefore('#list-image-'+currentImageId);
		selected = image.idx;
	}
	
	function loadFirst() {
		if (!initialized) {
			setImage(images[0]);
			initialized = true;
		}
	}

	function imgLoaded() {
		loaded++;
		if (loaded == images.length)
			loadFirst();
	}
	
	function switchImage(e, stepForward, id) {
		var image;
		
		var oldId = currentImageId;
		
		if ( typeof id != 'undefined' ) {
			currentImageId = id;
		} else {
			if (stepForward && !fpi.images[++currentImageId]) {
				currentImageId = 0;
			} else if (!stepForward) {
				if (--currentImageId < 0)
					currentImageId = fpi.images.length - 1;
			}
		}
		
		setImage();
		
		e.stopPropagation();
		e.cancelBubble = true;
		e.preventDefault();
	}
	
	$j(document).ready(function () {
		images = [];
		
		for (i = 0; i < fpi.images.length; i++) {
			images[i] = new Image();
			images[i].src = fpi.baseUrl + fpi.images[i].large;
			images[i].idx = i + 1;
		}
		
		if (images[0].onload)
			for (i = 0; i < images.length; i++)
				images[i].onload = imgLoaded;
		else
			loadFirst();

		$j('#btn-next').click(function (e) { 
			switchImage(e, true);
		});
		$j('#btn-previous').click(function (e) { 
			switchImage(e, false); 
		});
		$j('.product-list-image').click(function (e) { 
			var id = this.id;
			switchImage(e, false, id.replace('list-image-', '')); 
		});
	});
}