var $j = jQuery.noConflict();

function tech_name(s)
{
	return s.toLowerCase().replace(/[^a-z0-9]+/g, ' ').replace(/\s+/g, '-');
}

var LampColors = {

     PICKER_BASE: '/secure/images/color-picker/',

     init: function()
     {
	     LampColors.initOutline();
	     LampColors.initPicker();
     },

     initOutline: function()
     {
	     function init(option, img) {
		     img = option.length && $j(img);
		     option.change(function() {
			     LampColors.updateColor(option, img);
		     }).change();
	     }

	     init($j('select.color'), '.productDetailsImage-03-outline');
	     init($j('select.base-color'), '.productDetailsImage-04-outline');
     },

     initPicker: function()
     {
	     var pickers = $j('tr.pick-options ul').map(function() { return $j('input', this); });

	     $j.each(pickers, function() {
		     this.change(function(e) { LampColors.onPickerChange(pickers); });
		     this.color_name = this.parents('tr.pick-options').prev().find('strong.color-name');
	     });

	     if ($j.browser.msie) {
		     $j('tr.pick-options ul label').click(LampColors.onLabelClick);
	     }

	     if (pickers.length > 0) {
		     LampColors.title = tech_name($j('#product-title').text());
		     LampColors.photoContainer = $j('div.productDetailsImage-01');
		     LampColors.photo = LampColors.photoContainer.children('a').attr({ id: 'picker-original', 'loaded': 'loaded' });
		     LampColors.original = LampColors.photo;
		     setTimeout(function() {
			     LampColors.onPickerChange(pickers);
		     }, 1000);
	     }
     },

     outlineColor: function(option)
     {
	     return $j('.option-extra-' + option.val()).text();
     },

     updateOutline: function(img, hex)
     {
	     if(hex && hex != "") {
		     if(hex.substring(0, 1) != '#') hex = '#' + hex;
		     img.css({'background-color': hex});
	     }
     },

     updateColor: function(option, img)
     {
	     LampColors.updateOutline(img, LampColors.outlineColor(option));
     },

     onPickerChange: function(pickers)
     {
	     var colors = $j.map(pickers, function(item) {
			     var input = item.filter('[checked]');
			     var container = input.parent();
			     if (!container.is('.selected')) {
				     item.parent('.selected').removeClass('selected');
				     container.addClass('selected');
				     // input.prev() is the LABEL element.
				     item.color_name.html(input.prev().attr('title'));
			     }
			     return input.get(0).title;
		     }).join('-');

	     var prefix = LampColors.PICKER_BASE + LampColors.title + '-' + colors;
	     LampColors.updateImage(colors, prefix + '-M.png', prefix + '-L.png');
     },

     onLabelClick: function()
     {
	     var input = $j('#' + $j(this).attr('for'));
	     if (!input.attr('checked')) {
		     input.attr('checked', 'checked').change();
	     }
     },

     updateImage: function(name, medium, large)
     {
	     var probe_id = 'picker-' + name; probe = $j('#' + probe_id);

	     LampColors.clearLoading();
	     LampColors.loading = probe_id;

	     if (probe.length > 0) {
		     LampColors.swapLoadedImage(probe);
	     }
	     else {
		     var current = LampColors.photo, photo = current.clone(true).css('display', 'none').attr('id', probe_id);

		     current.after(photo);

		     photo.unbind('click').removeAttr('onclick').click(function(e) {
			     e.preventDefault();
			     openphotowindow(large);
		     }).html(load_image(medium, function() {
			     photo.attr('loaded', 'loaded');
			     LampColors.swapLoadedImage(photo);
		     }, LampColors.onLoadError));

		     // small delay to prevent visual thrashing
		     LampColors.loadDelay = setTimeout(function() {
			     LampColors.startLoading(photo);
		     }, 100);
	     }
     },

     startLoading: function(photo)
     {
	     if (photo.attr('loaded')) return;
	     LampColors.photoContainer.addClass('loading');
	     LampColors.photo.stop().fadeTo('normal', 0);
	     LampColors.loadDelay = null;
     },

     stopLoading: function()
     {
	     if (LampColors.photoContainer.is('.loading')) {
		     LampColors.photoContainer.removeClass('loading');
		     return true;
	     }
	     return false;
     },

     clearLoading: function()
     {
	     if (LampColors.loadDelay) {
		     clearTimeout(LampColors.loadDelay);
		     LampColors.loadDelay = null;
		     return false;
	     }
	     else {
		     return LampColors.stopLoading();
	     }
     },

     swapLoadedImage: function(change_to)
     {
	     if (change_to.attr('error')) { return LampColors.updateImage('original'); }
	     if (!change_to.attr('loaded') || (LampColors.loading != change_to.attr('id'))) { return; }

	     LampColors.photo.stop().css('display', 'none');
		 LampColors.clearLoading();
		 LampColors.photo = change_to.stop().css('opacity', 1).css('display', 'block');
     },

     onLoadError: function()
     {
	     $j(this.parentNode).attr('error', 'error');
	     LampColors.updateImage('original');
     }
}

function load_image(src, onload, onerror) {
	var img = new Image();
	if (onload) {
		img.onload = function() { onload.call(img); }
	}
	if (onerror) {
		img.onerror = function() { onerror.call(img); }
	}
	img.src = src;
	return img;
}

$j(LampColors.init);

$j(window).load(function() {
	$j('#container').height($j(window).height() > $j(document).height() ? $j(window).height() : $j(document).height());
})

$j(window).resize(function() {
	$j('#container').height($j(window).height() > $j(document).height() ? $j(window).height() : $j(document).height());
})