var imageLinks
var productTabs
var origFeaturesHeight
var man1Savings
var man2Savings
var man3Savings
var man3Price
var productFlashVersion = 9



function pageInitSavings(){
    if ($('revealSaving1')){man1Savings = $('revealSaving1').value; }
    if ($('revealSaving2')){man2Savings = $('revealSaving2').value; }
    if ($('revealSaving3')){man3Savings = $('revealSaving3').value; }

    if ($('revealSavingCyl1')){man1CylSavings = $('revealSavingCyl1').value; }
    if ($('revealSavingCyl2')){man2CylSavings = $('revealSavingCyl2').value; }
    if ($('revealSavingCyl3')){man3CylSavings = $('revealSavingCyl3').value; }

    if ($('revealSaving1')){
	    man1Width = man1Savings * 1.5;
	    man2Width = man2Savings * 1.5;
	    man3Width = man3Savings * 1.5;
    }

    if ($('revealSavingCyl1')){
    man1CylWidth = man1CylSavings * 1.5;
    man2CylWidth = man2CylSavings * 1.5;
    man3CylWidth = man3CylSavings * 1.5;
    }
}

function pageInit(){
    // Features Tabs
    // ------------------------------
    // 



	if ($('productTabs')){
	
	    // If there is a Savings reveal panel and it is active, then
	    // initiaise the functions for this.
	    if($('savingsRevealUp1') || $('savingsRevealCyl1')){
	        pageInitSavings();
	    }
	    
	    
	    downloadLinks();
     
        // Dynamically set the height of the initial tab to stop the flicker when clicking on a link
        var tabHeight = $('tabsContent').offsetHeight;
		
        $('productTabsDivContainer').style.height = tabHeight+'px';

        // If the features height hasn't been set then save the height of it - this is so that we can return
        // the features to the corerct height when closing it
        if (origFeaturesHeight == undefined){
            origFeaturesHeight = tabHeight;
        }

        productTabs = $('productTabs').getElementsByTagName("a");   
        
        if (productTabs.length>0){
           for (var i=0; i < productTabs.length; i++) {
           
                productTabs[i].onclick = function() {
                     $('productTabsDivContainer').style.overflow = 'hidden';
                    // Reset the class on each of the tabs
                    for (var x=0; x < productTabs.length; x++) {
                        $(productTabs[x]).className = "";
                        this.className = "selected"; // Set the class of the selected tab to on
                    }    
                    var tabURL = this.getAttribute('rel'); // Url to display
                    
                    pageTracking('store/product.asp?'+tabURL)
                   
                   
                    // Load Tab via AJAX
                    Effect.Fade('tabsContent', { duration: 0.2,afterFinish: function(){
                        new Ajax.Updater('tabsContent',tabURL,{onComplete: function(){
                            
                            Effect.Appear('tabsContent', { duration: 0.2, afterFinish:function(){
                                tabHeight = $('tabsContent').offsetHeight;
                                
                                new Effect.Morph('productTabsDivContainer', {
                                  style: 'height:'+tabHeight+'px;', // CSS Properties
                                  duration: 0.2,
                                  queue: 'end',afterFinish:function(){
                                    externalLinks();
                                    trackingLinks();
                                    pageInit();
                                  }
                                });                                   
                             }});
                        }});
                    }});
                    return(false);
                }
            }
        }
	}

	if ($('navTabs')){
//	    downloadLinks();
     
        // Dynamically set the height of the initial tab to stop the flicker when clicking on a link
        var tabHeight = $('tabsContent').offsetHeight;
        $('productTabsDivContainer').style.height = tabHeight+'px';

        // If the features height hasn't been set then save the height of it - this is so that we can return
        // the features to the corerct height when closing it
        if (origFeaturesHeight == undefined){
            origFeaturesHeight = tabHeight;
        }

        productTabs = $('navTabs').getElementsByTagName("a");   
        
        if (productTabs.length>0){
           for (var i=0; i < productTabs.length; i++) {
           
                productTabs[i].onclick = function() {
                     $('productTabsDivContainer').style.overflow = 'hidden';
                    // Reset the class on each of the tabs
                    for (var x=0; x < productTabs.length; x++) {
                        $(productTabs[x]).className = "";
                        this.className = "selected"; // Set the class of the selected tab to on
                    }    
                    var tabURL = this.getAttribute('rel'); // Url to display
                 
                    // Load Tab via AJAX

                    Effect.Fade('tabsContent', { duration: 0.2,afterFinish: function(){
																					 
																					 
                        new Ajax.Updater('tabsContent',tabURL,{onComplete: function(){
                            
                            Effect.Appear('tabsContent', { duration: 0.2, afterFinish:function(){
                                tabHeight = $('tabsContent').offsetHeight;

								new Effect.Morph('productTabsDivContainer', {
                                  style: 'height:'+tabHeight+'px;', // CSS Properties
                                  duration: 0.2,
                                  queue: 'end',afterFinish:function(){
                                    externalLinks();
                                    //pageInit();
                                  }
                                });
                             }});
                        }});
                    }});
                    return(false);
                }
            }
        }
	}

	if($('savingsRevealUp')){
		document.getElementById('savingsRevealUp').style.display='block';
		// The following statements have if statements around them to check if there are competitors on the page
		if($('savingsRevealUp1')){document.getElementById('savingsRevealUp1').style.display='block';}
		if($('savingsRevealUp2')){document.getElementById('savingsRevealUp2').style.display='block';}
		if($('savingsRevealUp3')){document.getElementById('savingsRevealUp3').style.display='block';}
		document.getElementById('graphAxisUp').style.display='block';
		if($('savingsMan1Bar')){document.getElementById('savingsMan1Bar').style.width='0px';}
		if($('savingsMan2Bar')){document.getElementById('savingsMan2Bar').style.width='0px';}
		if($('savingsMan3Bar')){document.getElementById('savingsMan3Bar').style.width='0px';}
		
		if($('savingsMan1Bar')){
			new Effect.Morph('savingsMan1Bar', {
				style: 'background:#ee1122; width:'+man1Width+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'upright'}
			});
		}
		if($('savingsMan2Bar')){
			new Effect.Morph('savingsMan2Bar', {
				style: 'background:#ee1122; width:'+man2Width+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'upright'}
			});
		}
		if($('savingsMan3Bar')){
			new Effect.Morph('savingsMan3Bar', {
				style: 'background:#ee1122; width:'+man3Width+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'upright'}
			});
		}
		new Effect.Opacity('man1UpPrice', { from: 0, to: 1.0, duration: 1.2});
		new Effect.Opacity('man2UpPrice', { from: 0, to: 1.0, duration: 2.4});
		new Effect.Opacity('man3UpPrice', { from: 0, to: 1.0, duration: 3.6});
		}
	if($('savingsRevealCyl')){
		document.getElementById('savingsRevealCyl').style.display='block';
		if($('savingsRevealCyl1')){document.getElementById('savingsRevealCyl1').style.display='block';}
		if($('savingsRevealCyl2')){document.getElementById('savingsRevealCyl2').style.display='block';}
		if($('savingsRevealCyl3')){document.getElementById('savingsRevealCyl3').style.display='block';}
		document.getElementById('graphAxisCyl').style.display='block';
		if($('savingsMan1CylBar')){document.getElementById('savingsMan1CylBar').style.width='0px';}
		if($('savingsMan2CylBar')){document.getElementById('savingsMan2CylBar').style.width='0px';}
		if($('savingsMan3CylBar')){document.getElementById('savingsMan3CylBar').style.width='0px';}
		
		if($('savingsMan1CylBar')){
			new Effect.Morph('savingsMan1CylBar', {
				style: 'background:#ee1122; width:'+man1CylWidth+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'cyl'}
			});
		}
		if($('savingsMan2CylBar')){
			new Effect.Morph('savingsMan2CylBar', {
				style: 'background:#ee1122; width:'+man2CylWidth+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'cyl'}
			});
		}
		if($('savingsMan3CylBar')){
			new Effect.Morph('savingsMan3CylBar', {
				style: 'background:#ee1122; width:'+man3CylWidth+'px', // CSS Properties
				duration: 1.2, // Core Effect properties
				queue: {position: 'end', scope: 'cyl'}
			});
		}
		new Effect.Opacity('man1Price', { from: 0, to: 1.0, duration: 1.2 });
		new Effect.Opacity('man2Price', { from: 0, to: 1.0, duration: 2.4 });
		new Effect.Opacity('man3Price', { from: 0, to: 1.0, duration: 3.6 });
		}


// ===============================================================================

    var viewAllFeatures = "closed";
    
    // View all features
    // ------------------------------
    // Opens and closes the 'view more features' div
    if ($('viewFeaturesLink')) {

        var txtHideFeatures = "Hide features"
        var txtShowFeatures = "View all features"
        
        if ($('txtHideFeatures')) {
            txtHideFeatures = $('txtHideFeatures').value;
            txtShowFeatures = $('txtShowFeatures').value;
        }
    
        $('viewFeaturesLink').onclick = function(){
            var tabHeight = $('tabsContent').offsetHeight;
            if (viewAllFeatures == "closed"){
                var allFeatures = $('moreFeatures').getElementsByTagName("div");
                var featuresHeight = parseInt($(allFeatures[0]).offsetHeight)+20; // Get height to open div to
                var initialHeight
                var featuresHeight = getTotalFeatures();
				
				
				if (browser == "ie6" || browser == "ie7" ){
                    initialHeight = 368
                }else{
//                  initialHeight = getTotalFeatures();//324
                    initialHeight = 356
                }
                
                
                var totalHeight = initialHeight + featuresHeight

				$('productTabsDivContainer').style.overflow = 'visible';

                new Effect.Morph('productTabsDivContainer', {
                  style: 'height:'+totalHeight+'px;', // CSS Properties
                  duration: 0.5
                });
                new Effect.Morph('moreFeatures', {
                  style: 'height:'+featuresHeight+'px;', // CSS Properties
                  duration: 0.5
                });
                this.innerHTML = txtHideFeatures
                viewAllFeatures = "open"
                this.className = "arrowUp column1"

            }else{
                origFeaturesHeight = origFeaturesHeight+1
                viewAllFeatures = "closed"
                this.innerHTML = txtShowFeatures
                this.className = "arrowRight column1"
                
                new Effect.Morph('productTabsDivContainer', {
                  style: 'height:'+origFeaturesHeight+'px;', // CSS Properties
                  duration: 0.5
                });
                 new Effect.Morph('moreFeatures', {
                  style: 'height:0px;', // CSS Properties
                  duration: 0.5
                });               
            }
            return(false);
            
        }
    }
    
    // Thumbnail images
    // ----------------
    if ($('imageSwapLinks')){
        imageLinks = $('imageSwapLinks').getElementsByTagName("a");

        if (imageLinks.length>0){
            for (var i=0; i < imageLinks.length; i++) {
                //Show the hidden links (hidden for non-js versions)

                if(imageLinks[i].rel.match("loadFilm")){ 
                    if(hasFlashVersion(productFlashVersion)){
                        $(imageLinks[i]).removeClassName("hidden")
                    }
                    imageLinks[i].onclick = function(){
                        loadFilm(this.href);
                        return(false);
                    }
                }else if(imageLinks[i].rel.match("loadImage")){
                    if(hasFlashVersion(productFlashVersion)){
                        imageLinks[i].onclick = function(){
                            loadImage(this.href);
                            return(false);
                        }
                    }
                
                }else if(imageLinks[i].rel.match("loadSpin")){
                    if(hasFlashVersion(productFlashVersion)){
                        $(imageLinks[i]).removeClassName("hidden")
                    }
                    imageLinks[i].onclick = function(){
                        loadSpin(this.href);
                        return(false);
                    }
                }
            }
        }
    }
}

// Returns the total number of features so we can calculate the height to open up to
function getTotalFeatures(){
    var featuresAcross = 3
    var featureHeight = 290
    var openHeight
    
    var totalFeatures = $('moreFeatures').getElementsByTagName('div')
    var featureCount = (totalFeatures.length)+1;

    if (parseInt(featureCount) < parseInt(featuresAcross)){
        featureCount = featuresAcross
    }
    
    openHeight = Math.round((featureCount/featuresAcross))
    openHeight = openHeight * featureHeight
    
    openHeight = openHeight +10
    return openHeight
    
}
// ===============================================================================
	//Flash video code
	var ready = false;
					
	function assetLoaderReady() {
		ready = true;
	}
	
	function isReady() {
		return ready;
	}					
   
    function thisMovie(movieName) {
		if (navigator.appName.indexOf("Microsoft") != -1) {
			return window[movieName]
		}
		else {
			return document[movieName]
		}
	}
	
	function loadImage(argPath) {
	
	    imgArray = argPath.split("image=")
	   
		if (isReady()) {
			thisMovie("assetViewer").image(imgArray[1]);
		}
	}
	
	function loadSpin() {
		if (isReady()) {
			thisMovie("assetViewer").spin();
		}
	}
	
	function loadFilm(argPath, argBuffer) {
		if (isReady()) {
			thisMovie("assetViewer").film(argPath,argBuffer);
		}
	}

  
// ===============================================================================
    /*
    if ($('imageSwapLinks')){
    
        imageLinks = $('imageSwapLinks').getElementsByTagName("a");
       
        // Set the Gallery image links
        if (imageLinks.length>0){
           for (var i=0; i < imageLinks.length; i++) {
                if(imageLinks[i].rel.match("imageSwap")){
                    
                    imageLinks[i].onclick = function() {
                    
                        // Get the image from inside the a tag
                        var imageRef = this.getElementsByTagName("img");
                       
                        var imageSrc = imageRef[0].src
                        
                        var imageArray = imageSrc.split("_")
                        $('productLarge').src = "http://media.dev/images_resize_sites/images/products/XL_"+imageArray[(imageArray.length)-1]
                        return(false);
                    }
                }
            }
        }
    }
    */
document.observe("dom:loaded",function() {pageInit();});