function getPos(e) {
	var posx = 0;
	var posy = 0;
	if (e.pageX || e.pageY) 	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	return {x: posx, y: posy};
}

function expand(el) {
	el.style.width = '0px';
	el.style.height = '0px';
	
	var n = 0;
	var run = function() {
		if (n < 300) {
			n += 10;
			el.style.width = n + 'px';
			el.style.height = n + 'px';
			setTimeout(run, 10);
		}
	}
	
	run();
	
}


function contract(el) {
	var n = 300;

	var run = function() {
		if (n > 0) {
			n -= 10;
			el.style.width = n + 'px';
			el.style.height = n + 'px';
			setTimeout(run, 10);
		}
		else el.style.display = 'none';
			
	}
	
	run();
}

var width = 1000;
var height = 1000;
var elWidth;
var elHeight;

var mouseOver = function() {
	$('.highres').apply(function() {
		this.style.display = 'block';
	});	
}

var isAvailable = true;
var mouseMove = function(event) {
	
	
	/*if ($('#viewer')) var viewer = $('#viewer');
	else {
		var viewer = new $e('div');
		viewer.style.width = '100px';
		viewer.style.height = '100px';
		viewer.style.position = 'absolute';
		viewer.style.marginTop = '-50px';
		viewer.style.marginLeft = '-50px';
		viewer.id = 'viewer';
		viewer.addEvent('mousemove', window.mouseMove);
		viewer.style.border = '4px solid red';
		document.body.appendChild(viewer);
		
	
		
	}
	
	viewer.style.top = pos.y + 'px';
	viewer.style.left = pos.x + 'px';
	*/
	
	
	
	
	if (isAvailable) { 
		var pos = getPos(event);
		
		var pos2 = $('#mainimage').position();

		elWidth = pos2.width;
		elHeight = pos2.height;
		
		isAvailable = false;
	
		
		setTimeout(function() {
	
			
			var mid = 150;
			
			
			var offsetX = pos.x - pos2.left;
			
			var offsetY = pos.y - pos2.top;
			
			//save one function call
			var hrpos = $('.highres').position();
			var viewportWidth = hrpos.width;
			var viewportHeight = hrpos.height;
			
			$('.highres').apply(function() {
				var x = (0-((offsetX / elWidth) * width)+(elWidth/2));
				var y = (0-((offsetY / elHeight) * height)+(elHeight/2));
			
				//console.log(x);
				/*if (console) {
					console.log(offsetX + '  ' +  (Math.abs(x)) + ' / ' + width + ' ... ' + elWidth + ' ..... ' + viewportWidth);
				}*/
				
				if (x > 0) x = 0;
				if ((Math.abs(x) + viewportWidth) > width) x = 0-(width-viewportWidth);
				
				if (y > 0) y = 0;
				if ((Math.abs(y) + viewportHeight) > height) y = 0-(height-viewportHeight);
			//	if ((Math.abs(x) + elWidth) > viewportWidth) x = 0-(viewportWidth-elWidth);
				
				//if ((Math.abs(x) + (elWidth/2)) > width) x = 0;
			//	if (Math.abs(y) + (elHeight) > height) y = 0-(height-elHeight);
				
				this.style.backgroundPosition =  x + 'px ' + y + 'px';  
			});	
	
			isAvailable = true;
		}, 10);

	}
}

var mouseOut = function() {
	$('.highres').apply(function() {
		this.style.display = 'none';
	});
}

function switchImage(el) {
	document.getElementById('mainimage').src = el.src.replace('thumbnails', 'images');	
	
	
	
	
	var highres = new Image();
	highres.onload = function() {
		$('.highres').apply(function() {
			this.style.backgroundImage = 'url(' + highres.src + ')';
		});
		$('#mainimage').addEvent('mouseover', window.mouseOver);
		$('#mainimage').addEvent('mousemove', window.mouseMove);
		$('#mainimage').addEvent('mouseout', window.mouseOut);
		$('#mainimage').style.cursor = 'crosshair';
	}
	highres.onerror = function() {
		
	}
	
	highres.src = el.src.replace('thumbnails', 'images').replace('.jpg', '_large.jpg');
}


function switchImage(el) {
	document.getElementById('mainimage').src = el.src.replace('thumbnails', 'images');	
	
	
	
	var highres = new Image();
	highres.onload = function() {
		$('.highres').apply(function() {
			this.style.backgroundImage = 'url(' + highres.src + ')';
			
		});
		$('#mainimage').addEvent('mouseover', window.mouseOver);
		$('#mainimage').addEvent('mousemove', window.mouseMove);
		$('#mainimage').addEvent('mouseout', window.mouseOut);
		$('#mainimage').style.cursor = 'crosshair';
	}
	highres.onerror = function() {
		
	}
	
	highres.src = el.src.replace('thumbnails', 'images').replace('.jpg', '_large.jpg');
}


function switchImageUsed(el) {
	document.getElementById('mainimage').src = el.src.replace('thumbnails', 'images');	
	
	var highres = new Image();
	document.body.appendChild(highres);
	highres.id = 'tmphighres';
	highres.onload = function() {
		$('.highres').apply(function() {
			this.style.backgroundImage = 'url(' + highres.src + ')';
			window.height = $('#tmphighres').position().height;
			window.width = $('#tmphighres').position().width;
			document.body.removeChild(highres);
		});
		$('#mainimage').addEvent('mouseover', window.mouseOver);
		$('#mainimage').addEvent('mousemove', window.mouseMove);
		$('#mainimage').addEvent('mouseout', window.mouseOut);
		$('#mainimage').style.cursor = 'crosshair';
	}
	highres.onerror = function() {
		
	}
	
	highres.src = el.src.replace('thumbnails', 'images');
}


function switchManufacturer(uri, selected) {
	//window.location.href = '/clothing/' + uri + '/';
	$('#manucategory').empty();
	$('#manucategory').disabled = true;
	
	new Ajax({url: 'clothing/getManufacturerCategories/' + uri,
			  resultMode: Ajax.RESULT_OBJECT,
			  callback: function(result) {

				var option = new $e('option');
				option.appendChild(new $t('- Please Select -'));
				option.value = '';
				$('#manucategory').appendChild(option);
				
				for (var i = 0; i < result.category.length; i++) {

					var option = new $e('option');
					
					if (selected && selected == result.category[i].link + '/') option.selected = true;
					
					//alert(selected + '::' + result.category[i].link);
					option.appendChild(new $t(result.category[i].title));
					option.value = result.category[i].link;
					$('#manucategory').appendChild(option);
					
				}
				
				$('#manucategory').disabled = false;
		
			 }
	});
	
}


function switchCategory(uri) {
	window.location.href = '/clothing/' + uri + '/';		
}


$.ready(function() {
	//alert(1);
	if ($('#manufacturer') && $('#manufacturer').value != '') {
		switchManufacturer($('#manufacturer').value, window.location.href.split('clothing/')[1]);

	}
	
	if ($('.thumbnail').item(0)) switchImage($('.thumbnail').item(0));
	if ($('.thumbnailused').item(0)) switchImageUsed($('.thumbnailused').item(0));
});