﻿// Javascript File

window.onload = init;

function init(){    
    //Hide movement arrows
    if(document.getElementById('slidePanel')){        
        if($("#slidePanel").css("left").toString() == "0px" || $("#slidePanel").css("left").toString() == "auto"){
            hideArrow('r','show');
        };
    }
    
    //Cufon font replace
    fontReplace();    
    insightValidation();
    
    if(document.getElementById('thumbnails')){
        //Reflection options
        reflectionOptions();
        
        //Sliding Images
        slideImages();
        imageDetails();        
    }
    
    if(document.getElementById('googleMapSouth')){
        googleLoader('south');
    }
    
    $(document).pngFix();
}

function fontReplace(){
    //Navigation
    Cufon.set('fontSize','20px').replace('#hd li a',{        
        fontFamily: 'conrad',
        hover: true
    });
    
    //Main Titles
    Cufon.set('fontSize','39px').replace('h1', { 
        fontFamily: 'ConradReg' 
    });
    
    Cufon.set('fontSize','24px').replace('#introduction h1', { 
        fontFamily: 'ConradReg' 
    });
    
    Cufon.set('fontSize','21px').replace('h2', { 
        fontFamily: 'ConradReg' 
    });
    
    Cufon.set('fontSize','30px').replace('#column-a h2', { 
        fontFamily: 'ConradReg' 
    });
    
    Cufon.set('fontSize','21px').replace('.coupon h2', { 
        fontFamily: 'ConradReg' 
    });
    
    Cufon.set('fontSize','18px').replace('h4', {
        fontFamily: 'ConradReg'
    });
    
    if(document.getElementById('news')){
		Cufon.set('fontSize','16px').replace('.coupon h3 a', {
			fontFamily: 'ConradReg',
			hover: true
		});	
    }
    else{
		Cufon.set('fontSize','21px').replace('.coupon h3 a', {
			fontFamily: 'ConradReg',
			hover: true
		});
		
		Cufon.set('fontSize','21px').replace('.coupon h3', {
			fontFamily: 'ConradReg',
			hover: true
		});	
    }
    
    Cufon.set('fontSize','21px').replace('.feature h3 a', {
		fontFamily: 'ConradReg',
		hover: true
	});	
	
	Cufon.set('fontSize','21px').replace('.feature h3', {
		fontFamily: 'ConradReg',
		hover: true
	});
}

function insightValidation(){    
    $("#footer-cta form").submit(function(){
        var elements = $("#footer-cta form input");        
        var errMsg = "The following fields require attention: " + "\n\n";
        var errNumber = 0;
        
        for(i=0;i<=elements.length-1;i++){
            var element = $(elements)[i];            
            if(element.type == "text"){
                if($(element).attr("value") == "" || $(element).attr("value") == "required"){
                    highlight($(element));                
                    errNumber = errNumber + 1;
                    errMsg = errMsg + errNumber + ". " + element.name + "\n";
                    inputClear(element);
                }
            }
        }
        
        if(errNumber > 0){
            alert(errMsg);
            return false;
        }
        else{
            return true;
        }
    });
}

function highlight(node){
    $(node).css({
        "font-weight" : "bold",
        "color" : "#F00",
        "border" : "solid 1px #F00"
    });
    $(node).attr("value","required");    
}

function inputClear(node){    
    $(node).focus(function(){
        if(node.type == "text" && $(node).attr("value") == "required"){
            $(node).attr("value","");
            $(node).css({
                "font-weight" : "normal",
                "color" : "#000",
                "border" : "none"
            });            
        }
    });
}

function reflectionOptions(){
    var reflectionDetailsNormal = {
        height: 0.5,
        opacity: 0.2
    }
    
    var reflectionDetailsSelected = {
        height: 0.5,
        opacity: 0.4
    }

    $("#thumbnails img").reflect(reflectionDetailsNormal);
    $("#thumbnails li.selected img").reflect(reflectionDetailsSelected);
}

function slideImages(){
    var movingIncrement = 841;
    var movementSpeed = 1200;
    
    var currentIncrement = $("#thumbnails ul").css("left");        
    var numberOfThumbnails = $("#thumbnails ul li").length;    
    
    $("#sr").mousedown(function(){
        currentIncrement = currentIncrement.replace("px","");
        
        if(currentIncrement.indexOf("-") > -1){
            currentIncrement = currentIncrement.replace("-","");
            
            if(numberOfThumbnails > currentIncrement){
                currentIncrement = parseFloat(currentIncrement) + movingIncrement;
                currentIncrement = "-" + currentIncrement + "px";
                $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed);
            }
            else{
                currentIncrement = "-" + currentIncrement + "px";
                $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed);
            }
        }
        else{            
            currentIncrement = parseFloat(currentIncrement) - movingIncrement;
            currentIncrement = currentIncrement + "px";
            
            $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed)
        }
        
        //Hide arrows        
        if(currentIncrement.toString() != "0px"){hideArrow('l','show')}        
        if(currentIncrement.toString() == "-841px"){hideArrow('r','hide')}
    });
    
    $("#sl").click(function(){
        currentIncrement = currentIncrement.replace("px","");        
        
        if(parseFloat(currentIncrement) >= 0){            
            if(currentIncrement < 840 && currentIncrement > 0){            
                currentIncrement = parseFloat(currentIncrement) + movingIncrement;
                currentIncrement = currentIncrement + "px";
                $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed)
            }
            else{
                currentIncrement = currentIncrement + "px";
                $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed)
            }
        }
        else{            
            currentIncrement = currentIncrement.replace("px","")
            currentIncrement = parseFloat(currentIncrement) + movingIncrement;
            currentIncrement = currentIncrement + "px";
            $("#thumbnails ul").animate({left:currentIncrement.toString()},movementSpeed)
        }
        
        //Hide arrows        
        if(currentIncrement.toString() == "0px"){
            hideArrow('l','hide');
            hideArrow('r','show');
        }
    });
}

function imageDetails(){
    //Show first coupon and first details
    var productId = $("#selectedProduct").attr("value").toString();
    
    if(productId == ""){
        var firstCoupon = $("#work-coupons").children().get(0);
        var firstCaseStudy = getMiniThumbDestination($(firstCoupon))
        var firstThumbnail = $("#slidePanel ul").children().get(0);
            
        $(firstCoupon).css("display","block");
        $(firstCaseStudy).css("display","block");        
        
        var firstImage = showFirstImage($("#slidePanel li:first"));
        var firstProductId = $("#slidePanel li:first").attr("class");
        firstProductId = firstProductId.replace(" selected","");
        
        $("#main-image-" + firstProductId).attr("src",firstImage);        
    }
    else{
        var selectedProduct = $("#slidePanel li." + productId).attr("class");
        $("#slidePanel li." + productId).attr("class",selectedProduct + " selected");
        $(".coupon." + productId).css("display","block");
        
        var firstMiniThumbSelected = getMiniThumbDestination($(".coupon." + productId));                       
        $(firstMiniThumbSelected).css("display","block");
        
        var selectedImage = showFirstImage($("#slidePanel li." + productId));        
        $("#main-image-" + productId).attr("src",selectedImage);
    }
    
    //Updates the case study into the main content area
    var fadeDelay = 350;
    
    $("#thumbnails ul li").click(function(){		
		var currentlySelectedCheck = $(this).attr("class").toString();
		if(currentlySelectedCheck.indexOf("selected") == -1){
			// Deselected the currently selected thumbnail
			var currentSelectedImage = $("#slidePanel li.selected")
			var currentSelectedImageClass = $(currentSelectedImage).attr("class").toString();
			currentSelectedImageClass = currentSelectedImageClass.replace(" selected","");
			$(currentSelectedImage).attr("class",currentSelectedImageClass);
			
			// Hides the currently selected text
			var currentSelectedImageText = $(currentSelectedImage).children().get(1);
			$(currentSelectedImageText).css("display","none");
			
			// Hides the currently selected section
			var currentSection = "#work-coupons ." + currentSelectedImageClass;
			$(currentSection).css("display","none");
			
			// Highlights the clicked thumbnail
			var requestedImage = $(this);
			var requestedImageClass = $(requestedImage).attr("class").toString();
			$(requestedImage).attr("class",requestedImageClass + " selected");
			
			// Updates the empty main image section
			var requestedImageSrc = $(requestedImage).children().get(0);
			requestedImageSrc = $(requestedImageSrc).children().get(0);
			requestedImageSrc = $(requestedImageSrc).attr("src").toString();
			requestedImageSrc = requestedImageSrc.replace("ST","SS");
			
			var requestedImageLocation = "#main-image-" + requestedImageClass;
			$(requestedImageLocation).attr("src",requestedImageSrc);
			
			// Reset the mini thumb to first
			var miniThumbLocationReset = "." + requestedImageClass + " #mini-thumbs li.selected";			
			var miniThumbLocationResetClass = $(miniThumbLocationReset).attr("class").toString();
			miniThumbLocationResetClass = miniThumbLocationResetClass.replace(" selected","");
			$(miniThumbLocationReset).attr("class",miniThumbLocationResetClass);
			
			var miniThumbFirst = "." + requestedImageClass + " #mini-thumbs li.first";
			$(miniThumbFirst).attr("class","first selected");
			
			// Show the clicked thumbnail section
			var requestedSection = "#work-coupons ." + requestedImageClass;
			$(requestedSection).css("display","block");		
		}
    });

    //Displays case study name under main thumbnails
    $("#thumbnails ul li").mouseover(function(){        
        var spanElement = $(this).children().get(1);
        $(spanElement).css("display","block");
    });
    
    $("#thumbnails ul li").mouseout(function(){
        var spanElement = $(this).children().get(1);
        var currentClass = $(this).attr("class").toString();
        if(currentClass.indexOf("selected") == -1){
            $(spanElement).css("display","none");
        }
    });
    
    //Changes the main image based on mini thumb clicked    
    var miniFadeDelay = 350;
    
    $("#mini-thumbs li").click(function(){		
        var currentMiniSelectedCheck = $(this).attr("class").toString();
        if(currentMiniSelectedCheck.indexOf("selected") == -1){
			// Get productId of mini thumb parent
			var productIdNode = $(this).parent().get(0);
			productIdNode = $(productIdNode).prevAll().get(1);
			var productId = $(productIdNode).attr("id").toString();
			productId = productId.replace("main-image-","");
			
			// Deselect currently selected mini thumb
			var selectedMiniThumbLocation = "." + productId + " #mini-thumbs li.selected";
			var selectedMiniThumbLocationClass = $(selectedMiniThumbLocation).attr("class").toString();
			selectedMiniThumbLocationClass = selectedMiniThumbLocationClass.replace(" selected","");
			$(selectedMiniThumbLocation).attr("class",selectedMiniThumbLocationClass);
			
			// Select the current mini thumb
			var requestedMiniThumb = $(this);
			var requestedMiniThumbClass = $(requestedMiniThumb).attr("class").toString();
			requestedMiniThumbClass = requestedMiniThumbClass + " selected";
			$(requestedMiniThumb).attr("class",requestedMiniThumbClass);
			
			// Update alt tag to display on page			
			var requestedMiniThumbCaptionNode = $(requestedMiniThumb).parent().get(0);
			requestedMiniThumbCaptionNode = $(requestedMiniThumbCaptionNode).prev().get(0);
			var requestedMiniThumbAlt = $(requestedMiniThumb).children().get(0);
			requestedMiniThumbAlt = $(requestedMiniThumbAlt).attr("alt").toString();
			var caption = "<strong>Above: </strong>" + requestedMiniThumbAlt;
			$(requestedMiniThumbCaptionNode).html(caption);
			
			// Update main image to currently selected mini thumb
			var requestedMiniThumbSrc = $(requestedMiniThumb).children().get(0);
			requestedMiniThumbSrc = $(requestedMiniThumbSrc).attr("src").toString();
			requestedMiniThumbSrc = requestedMiniThumbSrc.replace("D3","SS");			
			var mainImageLocation = "#main-image-" + productId;
			$(mainImageLocation).attr("src",requestedMiniThumbSrc);
			$(mainImageLocation).attr("alt",requestedMiniThumbAlt);
			$(mainImageLocation).attr("title",requestedMiniThumbAlt);
        }
    });
}

function miniThumbnailDelay(imageSrc,imageCaption,caseStudy){    
    var imageDescription = $("#column-a").children().get(1);
    imageCaption = "<strong>Above: </strong>" + unescape(imageCaption);    
    
    $(imageDescription).html(imageCaption);
    $("#" + caseStudy).attr("src",imageSrc);
}

function thumbnailDelay(selectedCouponClass,couponClass){
	alert("something");
	$("#work-coupons ." + selectedCouponClass).css("display","none");    
    $("#work-coupons ." + couponClass).css("display","block");
}

function getMiniThumbDestination(node){
    var currentNode = $(node).children().get(1);    
    currentNode = $(currentNode).children().get(0);
    currentNode = $(currentNode).children().get(3);    
    
    return currentNode;
}

function showFirstImage(node){
    var currentClassName = $(node).children().get(0);    
    currentClassName = $(currentClassName).children().get(0);   
    
    var imageDetails = $(currentClassName).attr("src");    
    imageDetails = imageDetails.replace("ST_","SS_");
    
    return imageDetails;
}

function hideArrow(arrow,toggle){
    if(toggle == 'hide'){$("#s" + arrow).css("height","0px")}
    else{$("#s" + arrow).css("height","37px")}    
}

// End of Javascript File