// JavaScript Document

function DisplayLargeIllustrationImage(thumb) {
     
    var largeImage = document.getElementById('bigOne');
    var printImage = document.getElementById('thumbNail');
    
    if ( largeImage == null ) return;    
    
    var re = /blank.gif/i;
    var index = printImage.src.search(re);
    if ( index > -1 ) return;
    
    
    //Set up variables before swapping images
    var largeImageSource = largeImage.src;
    var printImageSource = printImage.src;    
    var thumbHeight = thumb.height;
    var thumbWidth = thumb.width;
    var largeHeight = largeImage.height;
    var largeWidth = largeImage.width;
          
    //Determine orientation: portrait or landscape?
    var square = ((thumbHeight == thumbWidth)?true:false);
    var portrait = ((thumbHeight > thumbWidth)?true:false);

    //Depending upon aspect ratio, set the proper width & height
    if (square) {
        largeImage.height = 400;
        largeImage.width = 400;    
    }
    else if (portrait) {
        largeImage.height = 400;
        largeImage.width = ( (thumbWidth/thumbHeight) * 400);
    }
    else {
        largeImage.width = 600;
        largeImage.height = ( (thumbHeight/thumbWidth ) * 600);
    }
      
    //Determine orientation: portrait or landscape?
    square = ((largeHeight == largeWidth)?true:false);
    portrait = ((largeHeight > largeWidth)?true:false);

    //Depending upon aspect ratio, set the proper width & height
    if (square) {
        printImage.height = 100;
        printImage.width = 100;    
    }
    else if (portrait) {
        printImage.height = 100;
        printImage.width = ( (largeWidth/largeHeight) * 100);
    }
    else {
        printImage.width = 100;
        printImage.height = ( (largeHeight/largeWidth ) * 100);
    }  
    
    //Set the thumbnail image
    printImage.src = largeImageSource;
    
    //set the largeImage source
    largeImage.src = printImageSource;  
    
    //var divInfo = document.getElementById('divInfo');
    //if (largeImage.src.indexOf('_') > 0){        
    //    divInfo.style.visibility = "hidden";
    //}else{
    //    divInfo.style.visibility = "visible"; 
    //}
      
    return;        
}

function DisplayLargeImage(thumb) {
    var largeImage = document.getElementById('bigOne');
    var pageName = document.getElementById('htmlPageName').value;
    var thumbId = 0;
    
    if ( largeImage == null ) return;
    
    //set the largeImage source
    largeImage.src=thumb.src;
   
    //Determine orientation: portrait or landscape?
    var square = ((thumb.height == thumb.width)?true:false);
    var portrait = ((thumb.height > thumb.width)?true:false);

    //Depending upon aspect ratio, set the proper width & height
    if (square) {
        largeImage.height = 400;
        largeImage.width = 400;    
    }
    else if (portrait) {
        largeImage.height = 400;
        largeImage.width = ( (thumb.width/thumb.height) * 400);
    }
    else {
        largeImage.width = 600;
        largeImage.height = ( (thumb.height/thumb.width ) * 600);
    }
    
    thumbIds = thumb.id.split("_");
    try {
        //thumbId = thumbIds[1];
        var idx = thumbIds.length;
        thumbId = thumbIds[idx-1];
    }
    catch(e){
        alert("ImageId not set");
    }
    
    
    //debugger;
    switch ( pageName )
    {
        case "Illustration.htm":
            StartAJAX("showLargeIllustrationImage|" + thumbId);
            break;
        case "Print.htm":
            StartAJAX("showLargeImagePrint|" + thumbId);
            break; 
        default:
            StartAJAX("showLargeImage|" + thumbId);
            break;  
    }
    
    return;        
}

function cart_onClick() {
    window.location = "lib/cart.php";
    return false;
}

function addToCart_onClick() {
    var inputList = document.getElementsByTagName('input');
    var printIdList = '';
    var boxIdStrings = '';
    var checkboxCounter = 0;
    var x=0;
    
    for(x=0; x < inputList.length; x++) {
        if (inputList[x].type == 'checkbox') {
            checkboxCounter +=1;
            
            if (inputList[x].checked){
            boxIdStrings = inputList[x].id.split('_');
            printIdList += (boxIdStrings[2] + '_');  
            }      
        }
    }
    
    if ( printIdList != '' )   
        window.location = "lib/cart.php?items=" + printIdList + '&add=1';
        
    //IMPORTANT NOTE:  for this code to work it assumes
    //  the last input on the page is of type checkbox
    else if (checkboxCounter == 1) {
        boxIdStrings = inputList[x-1].id.split('_');
        printIdList += (boxIdStrings[2] + '_');         
        window.location = "lib/cart.php?items=" + printIdList + '&add=1'; 
        }
        
    else 
        alert('Please check at least one item to add to your cart');
       
    return false;
}


function setOnClickHandlers() {
    //set the link to display cart
    /*  var cart = document.getElementById('cart');
    if ( cart != null )
        cart.onclick = leftColJS.cartClick;        
    */
    
    //set the link to add items to cart; where visible
    var addToCartLink =  document.getElementById('addToCart');
    if ( addToCartLink != null)
      addToCartLink.onclick = leftColJS.addToCartClick;
      
    //set the link to view available prints; where visible
    var viewMediaLink =  document.getElementById('media');
    if ( viewMediaLink != null)
      viewMediaLink.onclick = leftColJS.viewMedia;
}


function media_onClick(){
    var artworkId = document.getElementById('artworkId').value;
    window.location = 'Print.htm?artworkId=' + artworkId;
    return false;
}


leftColJS = function(){
    return{
        init: function(){
            var pageName = document.getElementById('htmlPageName').value;
            StartAJAX("createLeftNav|" + pageName);                   
        },
        
        onpageload: function(e){                                  
            //Select all images in the left hand navigation
            var parentDiv = document.getElementById('leftcontent');
            var arrImages = parentDiv.getElementsByTagName('img');
            
            for(var i=0; i <= arrImages.length-1; i++){
                arrImages[i].onmouseover = leftColJS.mouseOverMe;
            } 
            
            setOnClickHandlers();                        
                                                     
            StartAJAX('displayCartItemCount');
            
            //Auto-adjust left-hand scroll bars for window height
            xAddEventListener(window, "resize", adjustLayout, false);  
            adjustLayout(); 
            
            return true;
        },
        
        mouseOverMe: function(e){
            return DisplayLargeImage(this);
        },
        
        cartClick: function(){
            return cart_onClick();
        },
        
        addToCartClick: function(){
            return addToCart_onClick();
        },
        
        viewMedia: function(){
            return media_onClick();
        },
        
        selectImage: function(){
            //Set the visible right-sided image if coming in from another page:

            var qrStr = window.location.search;
            var pageName = document.getElementById('htmlPageName').value;
            
            //Split the query string & see if it's got an artworkId value                      
            //if ( qrStr.length > 0 && (getQueryVariable('artworkId') != 709))
            if ( eval((qrStr.length) > 0) )
            {             
                //Select all images in the left hand navigation
                var parentDiv = document.getElementById('leftcontent');
                var arrImages = parentDiv.getElementsByTagName('img');
                var arrImgName = new Array();
                var img = null;            
                
                var artId = 0;
                var spQrStr = qrStr.substring(1);
                var arrQrStr = new Array();
                // splits each of pair
                var arr = spQrStr.split('&');
                
                for (var i=0;i<arr.length;i++){
                    // splits each of field-value pair
                    var index = arr[i].indexOf('=');
                    var key = arr[i].substring(0,index);
                    var val = arr[i].substring(index+1);
                    
                    // saves each of field-value pair in an array variable
                    arrQrStr[key] = parseInt(val);
                }                
                artId = arrQrStr['artworkId'];                            
                
                for(var i=0; i <= arrImages.length-1; i++){
                    arrImgName = arrImages[i].id.split('_');
                    if ( parseInt(arrImgName[arrImgName.length-1]) == arrQrStr['artworkId'] )
                       img = arrImages[i];                        
                }            
                //DisplayLargeImage(img);                
                return DisplayLargeImage(img);
                
            }  // END if ( qrStr.length > 0 )
            //Run through this 'else if' statement if top painting on leftNav has a print
            else if (pageName == 'RecentPaintings.htm')                               
            {
              var artId = document.getElementById('artworkId').value;
              
              var parentDiv = document.getElementById('leftcontent');
              var arrImages = parentDiv.getElementsByTagName('img');  
              var arrImgName = new Array();
              var img = null;
              var found = false;
              
                for(var i=0; (i <= arrImages.length-1) && !found; i++){
                    arrImgName = arrImages[i].id.split('_');
                    if ( parseInt(arrImgName[arrImgName.length-1]) == artId )
                    {
                       img = arrImages[i];                        
                       found = true;
                    }
                }                             
              
              return DisplayLargeImage(img);  
            }
        }  // END selectImage function 
    };
}(this);

Page_Load = function(){
    return{
        init: function(){
            leftColJS.init();
        }
    };
}(this);

function PageLoading(){
    Page_Load.init();
}

window.onload = function() {PageLoading();}