if (typeof(BOUNTEE) == 'undefined') {
	BOUNTEE		= {};
	BOUNTEE.UI	= {};
}

BOUNTEE.UI.Product	= function()
{
	var priceScript		= '/mysoti/userProduct/getPrice';
	var coloursScript	= '/mysoti/userProduct/getColours';
	var sizesScript	= '/mysoti/userProduct/getSizes';
	var actionScript	= '/mysoti/userWishlistProduct/ajaxActions';

	var zoomLevel = 0;

	var init	= function() {
		$('body').addClass('dynamic');

        if (productType == 'CLO') {
            initColourSelectors();
        }
		initStyleSelectors();
		initZoomControls();
		initForm();
		initPowerButtons();
	}

	var initStyleSelectors = function() {
		$('#selector .selector-list li a:not(.popup)').click(function(e){
			e.preventDefault();
			var self = e.target;
			if ($(self).is('img')) {
				self = $(self).parent('a');

				selectStyle(self);

			}
        });
	}

	var initColourSelectors = function() {
		$('#selector .colours').click(function(e){
			e.preventDefault();
			var self = e.target;
			if ($(self).is('img')) {
				self = $(self).parent('a');
				selectColour(self);
			}
		});
	}

    var selectStyle = function(self) {
			$('#selector .selector-list li a img').each(function(i, obj){
				var img	= $(obj);
				img.attr('src', img.attr('src').replace('-on.', '.'));
			});
			$('#selector div.selected').removeClass('selected');
			$(self).parents('ul').parent('div').addClass('selected');
			var img = $(self).find('img');
			img.attr('src', img.attr('src').replace('.', '-on.'));

			var styleID		= $(self).attr('id').split('-').pop();
			var styleName	= $(self).attr('title');

			$('#display-style').text(styleName);

            if (productType == 'CLO') {
                var newClass = $(self).attr('id').replace('select', 'overlay');
                $('#overlay').removeClass().addClass(newClass);
                $('#field-brand').val(styleID);

                if ($(self).is('.guys')) {
                    $('#display-fit').text(subStyleGUY);
                    $('#field-style').val('CLO_GUY');
                }
                if ($(self).is('.girls')) {
                    $('#display-fit').text(subStyleGRL);
                    $('#field-style').val('CLO_GRL');
                }
                if ($(self).is('.kids')) {
                    $('#display-fit').text(subStyleKID);
                    $('#field-style').val('CLO_KID');
                }
                if ($(self).is('.onesie')) {
                    $('#display-fit').text(subStyleONE);
                    $('#field-style').val('CLO_ONE');
                }
                
                updateColours();
            }
            else {
                img = $('#design img');
                if ($(self).is('.art_can')) {
                    $('#display-fit').text(subStyleCAN);
                    $('#field-style').val('ART_CAN');
                    img.attr('src', img.attr('src').replace('ART_POS', 'ART_CAN'));
                }
                if ($(self).is('.art_pos')) {
                    $('#display-fit').text(subStylePOS);
                    $('#field-style').val('ART_POS');
                    img.attr('src', img.attr('src').replace('ART_CAN', 'ART_POS'));
                }
            }

            updateSizes();

    }

    var selectColour = function(self) {
        var colourID = $(self).attr('id').replace('select-', '');
        var brandID = $('#field-brand').val();

        $('#selector .colours li.selected').removeClass('selected');
        var newClass = $(self).attr('id').replace('select', 'colour');
        $('#colour').removeClass().addClass(newClass);
        $(self).parent('li').addClass('selected');

        var colourID = $(self).attr('id').replace('select-', '');
        var colourName	= $(self).attr('title');

        $('#display-colour').text(colourName);
        $('#field-colour').val(colourID);

        // Hack to stop Yellow American Apparel shirts being sold
        if (colourID == 'YEL' && brandID == 'AMA') {
            var styleID = $('#field-style').val();
            var type = styleID.substring(0, styleID.indexOf('_'));
            styleID = styleID.substring(styleID.indexOf('_')+1);
            var styleCssId = '#select-'+type+'-'+styleID+'-';
            if (styleID == 'GUY') styleCssId = styleCssId + 'AAA';
            else styleCssId = styleCssId + 'BEL';
            var self = $(styleCssId);
            selectStyle(self);
            alert ('Sorry! This design is not available in \n    a yellow American Apparel tee.');
        }

        updatePrice();
    }

	var updatePrice = function() {
		var form = $('#cart-form');

		$.getJSON(priceScript + '?responseFormat=int-json&' + form.find('input, select').serialize(), function(json){
			$('#display-price').text(json.price);
		});
	}

	var updateColours = function() {
		var form = $('#cart-form');
		$.getJSON(coloursScript + '?responseFormat=int-json&' + form.find('input[type=hidden]').serialize(), function(json){
			if (json && json.colours && json.colours.length) {
				var i, l;
				var picker = $('#colour-picker');
				var selectedColourID = false;
				selectedColourID = picker.find('li.selected:first a:first').attr('id');
				picker.find('li').remove();

				for (i=0, l=json.colours.length; i<l; i++) {
					picker.append('<li><a href="" id="select-'+json.colours[i].code+'" title="'+json.colours[i].colour+'"><img src="/assets/images/colour-'+json.colours[i].code+'.png" alt="'+json.colours[i].colour+'" /></a></li>');
				}

				if (selectedColourID != 'undefined') {
					var colourLink = picker.find('#'+selectedColourID+'').get(0);
					if (colourLink) {
						selectColour(colourLink);
					}else{
						selectColour(picker.find('a:first').get(0));
					}
				}else{
					selectColour(picker.find('a:first').get(0));
				}
            }
		});
	}

    var updateSizes = function() {
		var form = $('#cart-form');

		$.getJSON(sizesScript + '?responseFormat=int-json&' + form.find('input, select').serialize(), function(json){
            if(json && json.sizes && json.sizes.length) {
                var sizeSelect = $('#fSize');
                sizeSelect.find('option').remove();

                for (i=0, l=json.sizes.length; i<l; i++) {
                    sizeSelect.append('<option value="'+json.sizes[i].code+'">'+json.sizes[i].size+'</option>');
				}
            }
            updatePrice();
        });
	}

    var initForm = function() {
		$('#cart-form').find('input, select').change(updatePrice);
        $('#cart-form input[name=btnSubmit]').after('<img id="imgSubmit" src="/assets/images/add-basket.png" alt="Add to basket" />').remove();

        $('#imgSubmit').click(function(){
            // Changed tempoarily until basket functionality is implemented
            $('#cart-form').submit();
            //jQuery.blockUI({ message: '<br /><h1>Sorry!</h1><br /><p>Not Currently Implemented.</p><br />' });
            //setTimeout(jQuery.unblockUI, 3000);
            //return false;
        });
	}

	var initZoomControls = function() {
		$('#design').after('<img src="/assets/images/product-frame-t-sm.png" id="product-frame-t" /><img src="/assets/images/product-frame-lr.png" id="product-frame-r" /><img src="/assets/images/product-frame-b-sm.png" id="product-frame-b" /><img src="/assets/images/product-frame-lr.png" id="product-frame-l" />');


		$('.zoom-in a').click(function(e){
			e.preventDefault(e);
			var speed = 500;

			if (zoomLevel == 0) {

				//var largesize	= $('#design img').attr('src').replace('small', 'large');
                var largesize	= $('#design img').attr('src').replace('default', 'zoom1');

                $('#design img').animate({
					height: 1040,
					width: 1350,
					left: -337,
					top: -260
				}, speed, function(){
					$(this).hide();
					$('#design-large').hide().append('<img src="'+largesize+'" id="design-large-i" />').show();
				}).after('<div id="design-large"></div>');
				$('#overlay').fadeOut(speed);
				$('#design-large').draggable().css('cursor', 'move');

				zoomLevel = 1;
				return
			}

			if (zoomLevel == 1) {

				//var largesize	= $('#design-large-i').attr('src').replace('large', 'full');
                var largesize	= $('#design-large-i').attr('src').replace('zoom1', 'zoom2');
                $('#design-large').append('<img src="'+largesize+'" id="design-full-i" />').find('img:first').hide();

				$('#design-large').animate({
					width: 630,
					height: 510,
					left: -250,
					top: -250
				});

				$('#design-full-i').animate({
					height: 1000,
					width: 1000,
					left: 0,
					top: 0,
					opacity: 1
				});

				zoomLevel = 2;
			}
		});

		$('.zoom-out a').click(function(e){
			e.preventDefault(e);
			var speed = 500;

			if (zoomLevel==2) {

				$('#design-large').animate({
					height: 510,
					width: 630,
					top: 0,
					left: 0
				});

				$('#design-full-i').animate({
					left: 120,
					top: 30,
					height: 500,
					width: 500
				}, speed, function(){
					$(this).hide();
					$('#design-large-i').show();
				});

				zoomLevel = 1;
				return;
			}

			if (zoomLevel==1) {
				$('#design-large').remove();

				$('#design img').animate({
					left: 0,
					top: 0,
					height: 510,
					width: 630
				}, speed);

				$('#overlay').fadeIn(speed);

				zoomLevel = 0;
				return;
			}
		});
	};

	var initPowerButtons = function() {
		$('.power-buttons a.wish').click(function(e){
			e.preventDefault();
			var self = $(this);
			//var id	= $('input[name=productID]').val();
			var id	= $('input[name=userProductId]').val();
			var data = {
				productID: id,
				action: "add-to-wishlist"
			}

			$.post(actionScript, data, function(){
				self.selfHealingRemove();
			});
		})
		$('.power-buttons a.unwish').click(function(e){
			e.preventDefault();
			var self = $(this);
			//var id	= $('input[name=productID]').val();
			var id	= $('input[name=userProductId]').val();
			var data = {
				productID: id,
				action: "remove-from-wishlist"
			}

			$.post(actionScript, data, function(){
				self.selfHealingRemove();
			});
		})
	}



	return {
		init: init
	}

}();

jQuery(function($) { BOUNTEE.UI.Product.init(); });