var optionsManager = false;
var productOptions = new Class({

    Implements: [Options, Events],

    options:{
        fields: ['colour', 'lining', 'fitting','size','material']
    },

    initialize: function(options){
        this.setOptions(options);
        this.attachChangeEvents();
        this.updateOptions();
        this.setupPersonalisation();
    },

    attachChangeEvents: function() {
        for(i=0,l=this.options.fields.length;i<l;i++) {
            if(element = $(this.options.fields[i])) {
                element.addEvent('change', this.updateOptions.bind(this));
            } 

            fields = $$('*[name=' + this.options.fields[i] + ']');
            for(y=0, x=fields.length; y<x; y++) {
                fields[y].addEvent('click', this.updateOptions.bind(this));    
            }
        }
    },

    updateOptions: function() {
        var params = '';
        var url    = this.getUrl();
        for(i=0,l=this.options.fields.length;i<l;i++) {
            var element = $(this.options.fields[i]);
            if(element && element.name) {
                if(element.selectedIndex) {
                    params += (element.name + '=' + element.options[element.selectedIndex].value + '&');
                } else {
                    params += (element.name + '=' + element.value + '&');
                }
            }

            fields = $$('*[name=' + this.options.fields[i] + ']');
            for(y=0, x=fields.length; y<x; y++) {
                if(fields[y] && fields[y].checked == true && fields[y].name) {
                    params += (fields[y].name + '=' + fields[y].value + '&');
                }
            }
        }

        var productOptions = this;
        var jsonRequest = new Request({
            url: url + ':ajaxCombi?'+params, 
            onRequest: function() { productOptions.startPleaseWait(); },
            onComplete: function(response, responseXML){
                
                if(responseXML.getElementsByTagName('result').item(0).childNodes.item(0).nodeValue != 'false') {

                    if(instance_id = responseXML.getElementsByTagName('instance_id').item(0).childNodes.item(0)) {
                        $('instance_id').value = instance_id.nodeValue;
                    }
                    
                    if(price = responseXML.getElementsByTagName('price').item(0).childNodes.item(0)) {
                        if(price.nodeValue == 0) {
                            $('instance_price').innerHTML = "Price on Application";
                            $('priceonapplication').style.display = 'block';
                        } else {
                            $('instance_price').innerHTML = "&pound;" + price.nodeValue;
                            $('priceonapplication').style.display = 'none';
                        }
                    }              
		
                    len = responseXML.getElementsByTagName('length').item(0).childNodes.item(0);
                    wid = responseXML.getElementsByTagName('width').item(0).childNodes.item(0);
                    dep = responseXML.getElementsByTagName('depth').item(0).childNodes.item(0);
                    if(len && wid && dep) {
                       $('dimensions').innerHTML = '( ' + len.nodeValue + ' x ' + wid.nodeValue + ' x ' + dep.nodeValue + '" )';
                    } else if(len) {
                       $('dimensions').innerHTML = '( ' + len.nodeValue + '" )';
                    }


                    if(image = responseXML.getElementsByTagName('image').item(0).childNodes.item(0)) {
                        productOptions.changeZoomImage(image.nodeValue);
                    }
                    
                    if(altimage = responseXML.getElementsByTagName('altimage').item(0).childNodes.item(0)) {
                        productOptions.changeAltImage(altimage.nodeValue);
                    }else{
											$('img').set('styles', {'visibility': 'visible'});
											$('altimg').addClass('hideAlt');
											if($('viewaltimage')){
												$('viewaltimage').set('styles', {'visibility': 'hidden', 'display': 'none'});
											}
										}

                    if($('preview')) {
                        if(swatch = responseXML.getElementsByTagName('colour_swatch').item(0).childNodes.item(0)) {
                            $('preview').setProperty('bg', swatch.nodeValue);
                        }

                        emboss = responseXML.getElementsByTagName('embossing').item(0).childNodes.item(0)
                        engrave = responseXML.getElementsByTagName('engraving').item(0).childNodes.item(0)
                        if(emboss && emboss.nodeValue == 't') {
                            $('previewSample').setProperty('rel', 'emboss');
                        } else if(engrave && engrave.nodeValue == 't') {
                            $('previewSample').setProperty('rel', 'engrave');
                        }
                    }

                } else {
                    productOptions.optionNotAvailable();
                }

                productOptions.stopPleaseWait();
                productOptions.updateLiningOptions();
                productOptions.updatePersonalisation();
            }
        }).get();      
    },

    changeZoomImage: function(img) {        
        MagicZoom_stopZooms();
        MagicZoom.prototype.showrect = function () {var pleft = this.positionX - this.popupSizeX / 2;var ptop = this.positionY - this.popupSizeY / 2;var perX = pleft * (this.bigImageSizeX / this.smallImageSizeX);var perY = ptop * (this.bigImageSizeY / this.smallImageSizeY);if (document.documentElement.dir == "rtl") {perX = (this.positionX + this.popupSizeX / 2 - this.smallImageSizeX) * (this.bigImageSizeX / this.smallImageSizeX);}pleft += parseInt(MagicZoom_getStyle(this.smallImage, "borderLeftWidth"));ptop += parseInt(MagicZoom_getStyle(this.smallImage, "borderTopWidth"));if (MagicZoom_ua != "msie" || !(document.compatMode && "backcompat" == document.compatMode.toLowerCase())) {pleft += parseInt(MagicZoom_getStyle(this.smallImage, "paddingLeft"));ptop += parseInt(MagicZoom_getStyle(this.smallImage, "paddingTop"));}if ((this.bigImageSizeX - perX) < parseInt(this.bigImageCont.style.width)) {perX = this.bigImageSizeX - parseInt(this.bigImageCont.style.width);}if ((this.bigImageSizeY - perY) < parseInt(this.bigImageCont.style.height)) {perY = this.bigImageSizeY - parseInt(this.bigImageCont.style.height);}this.bigImage.style.left = (- perX) + "px";this.bigImage.style.top = (- perY) + "px";this.bigImageCont.style.top = this.bigImageContStyleTop;this.bigImageCont.style.display = "block";this.bigImageCont.style.visibility = "visible";this.bigImage.style.display = "block";this.bigImage.style.visibility = "visible";this.recalculating = false;};

        var content  = '';
        content += '<a href="/cms_media/images/800x800_fitbox-'+img+'" id="mZoom" rel="zoom-position: inner; zoom-width:360px; zoom-height:360px" class="MagicZoom" target="_blank">';
        content += '<img src="/cms_media/images/360x360_fitbox-'+img+'" border="0" id="tag" />';
        content += '<img class="MagicZoomLoading" src="/images/blank.gif" alt="" />';
        content += '</a>';
        $('img').innerHTML = content;
        
        findZooms = function() { MagicZoom_findZooms(); }

        findZooms.delay(100);
    },
    
    changeAltImage: function(img) {
    	if($('altimg')){
    		MagicZoom_stopZooms();
        MagicZoom.prototype.showrect = function () {var pleft = this.positionX - this.popupSizeX / 2;var ptop = this.positionY - this.popupSizeY / 2;var perX = pleft * (this.bigImageSizeX / this.smallImageSizeX);var perY = ptop * (this.bigImageSizeY / this.smallImageSizeY);if (document.documentElement.dir == "rtl") {perX = (this.positionX + this.popupSizeX / 2 - this.smallImageSizeX) * (this.bigImageSizeX / this.smallImageSizeX);}pleft += parseInt(MagicZoom_getStyle(this.smallImage, "borderLeftWidth"));ptop += parseInt(MagicZoom_getStyle(this.smallImage, "borderTopWidth"));if (MagicZoom_ua != "msie" || !(document.compatMode && "backcompat" == document.compatMode.toLowerCase())) {pleft += parseInt(MagicZoom_getStyle(this.smallImage, "paddingLeft"));ptop += parseInt(MagicZoom_getStyle(this.smallImage, "paddingTop"));}if ((this.bigImageSizeX - perX) < parseInt(this.bigImageCont.style.width)) {perX = this.bigImageSizeX - parseInt(this.bigImageCont.style.width);}if ((this.bigImageSizeY - perY) < parseInt(this.bigImageCont.style.height)) {perY = this.bigImageSizeY - parseInt(this.bigImageCont.style.height);}this.bigImage.style.left = (- perX) + "px";this.bigImage.style.top = (- perY) + "px";this.bigImageCont.style.top = this.bigImageContStyleTop;this.bigImageCont.style.display = "block";this.bigImageCont.style.visibility = "visible";this.bigImage.style.display = "block";this.bigImage.style.visibility = "visible";this.recalculating = false;};

        var content  = '';
        content += '<a href="/cms_media/images/800x800_fitbox-'+img+'" id="aZoom" rel="zoom-position: inner; zoom-width:360px; zoom-height:360px" class="MagicZoom" target="_blank">';
        content += '<img src="/cms_media/images/360x360_fitbox-'+img+'" border="0" />';
        content += '<img class="MagicZoomLoading" src="/images/blank.gif" alt="" />';
        content += '</a>';
        $('altimg').innerHTML = content;
				$('altimg').addClass('hideAlt');
				$('img').set('styles', {'visibility': 'visible'});
				if(!$('viewaltimage')){
					var viewSlideshow = new Element('strong', {
						'html': 'View Alternative Image',
						'id': 'viewaltimage',
						'events': {
							'click': function(){
								$('altimg').toggleClass('hideAlt');
								if($('altimg').hasClass('hideAlt')){
									this.set('html', 'View Alternative Image');
									$('img').set('styles', {'visibility': 'visible'});
								}else{
									this.set('html', 'Hide Alternative Image');
									$('img').set('styles', {'visibility': 'hidden'});
								}
							}
						}
					});
					viewSlideshow.inject($('altimg'), 'after');	
				}else{
					$('viewaltimage').set('html', 'View Alternative Image');
					$('viewaltimage').set('styles', {'visibility': 'visible', 'display': 'block'});
				}
				
        
        findZooms = function() { MagicZoom_findZooms(); }

        findZooms.delay(100);
    	}        
    },

    updateLiningOptions: function() {
        var url = this.getUrl();
        var colour = $('colour');
        if(colour) {
            var productOptions = this;
            var jsonRequest = new Request.JSON({
                url: url + ':getDistinctIndexJson',
                onComplete: function(resp){
                    selected = false;
                    opts = $$('#options-lining li')
                    if(opts) {
                        for(i=0, l=opts.length;i<l;i++) {
                            if(productOptions.in_array(opts[i].getProperty('rel'), resp.lining)) {
                                opts[i].style.display = 'block';
                                if(opts[i].hasClass('selected')) {
                                    selected = true;
                                }
                            } else {
                                opts[i].style.display = 'none';
                                opts[i].removeClass('selected')
                            }
                        }

                        if(selected == false && $('lining')) {
                            for(i=0, l=opts.length;i<l;i++) {    
                                if(opts[i].style.display == 'block') {
                                    opts[i].addClass('selected');
                                    $('lining').value = opts[i].getProperty('rel'); 
                                    break;
                                }
                            }
                            productOptions.updateOptions();
                        }
                    }
                }
            }).get({'colour': colour.value, 'lining': 'reset', 'fitting': 'reset', 'dindex': 'colour,lining,fitting'});
        }        
    },

    setupPersonalisation: function() {
        if($('preview')) {
            $('preview').addEvent('click', this.updatePersonalisation.bind(this));            
        }
    }, 

    updatePersonalisation: function() {
        if($('initialsInput')) {
        	var val = $('initialsInput').getProperty('value').toUpperCase();
            var rel = $('previewSample').getProperty('rel');
            var src = $('preview').getProperty('bg');

            if(rel == 'engrave') { src = "chrome.jpg"; }

            if(src) {
        		var sampleUrl = "/modules/preview.php?text=" + val + "&bg=preview-" + src + "&type=" + rel;
        	    $('previewSample').setProperty('src', sampleUrl);
		        $('initials').setProperty('value', val);
            }
        }
    },

    in_array: function(needle, haystack, strict) {
        var found = false, key, strict = !!strict;
        for (key in haystack) {
            if ((strict && haystack[key] === needle) || (!strict && haystack[key] == needle)) {
                found = true;
                break;
            }
        }
        return found;
    },

    startPleaseWait: function() {
			$('instance_price').set('text', '');
			$('instance_price').removeClass('price')
			$('add').setStyle('display', 'inline');
			$('add').setProperties({
				src: '/images/ajax-loader.gif',
				disabled: 'disabled'
			});
    },

    stopPleaseWait: function() {
			$('instance_price').addClass('price');
            if($('instance_price').innerHTML != 'Price on Application' && $('instance_price').innerHTML != 'Option Not Available') {
			    $('add').setProperty('src', '/images/addbutton.gif');
			    $('add').setStyle('display', 'inline');
			    $('add').removeProperty('disabled');
            } else {
                $('add').style.display = 'none';
            }
    },
		
	optionNotAvailable: function() {
		$('instance_price').set('text', 'Option Not Available');
		$('instance_price').removeClass('price');
		$('add').setStyle('display', 'none');
		$('add').setProperties({
			src: '/images/ajax-loader.gif',
			disabled: 'disabled'
		});
    },

    getUrl: function() {
        path = document.location.pathname.toString().replace(/:edit/, '');
        host = document.location.host.toString();
        prot = document.location.protocol.toString();
        return prot + '//' + host + path;
    }

});

window.addEvent('domready', function(){
    optionsManager = new productOptions();    
});


function addToBasket(product) {
  // Check if this item is personalised
  var initials = $('initialsInput');

  if($('colour')) {
	product = product + ' Colour:' + $('colour').value;
  }

  if($('lining')) {
	product = product + ' Lining:' + $('lining').value;
  }


  if(initials && initials.value != '') {
		var url = optionsManager.getUrl();
		var jsonRequest = new Request({
	  	url: url + ':addtobasket',
	    onComplete: function(response, responseXML){
				$('productadd').submit();
	    }
		}).get({'instance_id' : '10602', 'emboss_engrave' : initials.value, 'product' : product});	
  } else {
		$('productadd').submit();
  }
}
