﻿ var startingImageIndexOffset = 0;
   
    function shiftImagesLeft()
    {  
        var currentImage = document.getElementById("CurrentImage");
        var hdnImages = document.getElementsByName("hdnImageSrc");
        var thumbNails = document.getElementsByName("thumbNail");
        var leftbtn = document.getElementById("button_left");
        var rightbtn = document.getElementById("button_right");
        
        if(startingImageIndexOffset > 0)
        {
            startingImageIndexOffset--;
            currentImage.src = hdnImages[startingImageIndexOffset].value;  
           
            for(var i=0; i<thumbNails.length; i++)
            {
                thumbNails[i].src = hdnImages[i + startingImageIndexOffset].value;
                
            }
            
        }
    }

    function shiftImagesRight()
    {
        var currentImage = document.getElementById("CurrentImage");
        var hdnImages = document.getElementsByName("hdnImageSrc");
        var thumbNails = document.getElementsByName("thumbNail");        
        var leftbtn = document.getElementById("button_left");
        var rightbtn = document.getElementById("button_right");
                
        if(startingImageIndexOffset < (hdnImages.length -1))
        {
            startingImageIndexOffset++;
            currentImage.src = hdnImages[startingImageIndexOffset].value;  
            if((startingImageIndexOffset+4) < (hdnImages.length))
            {
                for(var i=0; i<thumbNails.length; i++)
                {
                    thumbNails[i].src = hdnImages[i + startingImageIndexOffset].value;
                }
            }
        }  
    }
    
    function enlargeThumbNail(imageIndex)
    {
        var currentImage = document.getElementById("CurrentImage");
        var thumbNails = document.getElementsByName("thumbNail");  
        
        currentImage.src = thumbNails[imageIndex].src;
  
    }

