if(!com) var com={};
if(!com.grandcrowneresorts) com.grandcrowneresorts={};

com.grandcrowneresorts.Gallery = function(){
    var pub = {};
    
    var images = new Array();
    var captions = new Array();
    var height=336;
    var width=448;
    var currentImageNumber = 0;



    resize = function(imgHeight, imgWidth)
    {
        var newHeight = 0;
        var newWidth = 0;
        var ar = (height*1.0)/width;
        var iar = (imgHeight*1.0)/imgWidth;
        if(imgHeight > height || imgWidth > width)
        {
            if(iar > ar)
            { //too tall
                newHeight=height;
                newWidth = Math.round(((imgWidth)*(newHeight))/(imgHeight));
            }
            else
            { //too wide
                newWidth = width;
                newHeight = Math.round(((newWidth)*(imgHeight))/(imgWidth));
            }
        }
        else
        {
            newHeight=imgHeight;
            newWidth=imgWidth;
        }
        //alert(newHeight + " " + newWidth);
        
        return [newHeight, newWidth];
    };

    pub.highlightImage = function(imageNumber, aID, targetID)
    {
        document.getElementById('thumbnail'+currentImageNumber).style.border="solid 2px white";
        currentImageNumber = imageNumber;
        document.getElementById(aID).style.border="solid 2px black";
        
        var ih = "<img src='"+ images[imageNumber].src +"' style='width: "+ resize(images[imageNumber].height,images[imageNumber].width)[1] +"px; height: "+ resize(images[imageNumber].height,images[imageNumber].width)[0] +"px;' alt='' />";
        if(captions[imageNumber]!='')
            ih += "<br /><span>"+ captions[imageNumber] +"</span>";
        document.getElementById(targetID).innerHTML = ih;
    };

    drawThumbs = function(target, thumbTarget)
    {
        target.innerHTML = "<img src='"+ images[0].src +"' style='width: "+ resize(images[0].height,images[0].width)[1] +"px; height: "+ resize(images[0].height,images[0].width)[0] +"px;' alt='' />";
        
        var tih = "";
        for(i=0;i<images.length;i++)
        {
            var borderColor = "white";
            if(i==0)
                borderColor = "black";
                
            if(i%7==0)
                tih += "<br />";
                
            tih += "<a onclick=\"com.grandcrowneresorts.Gallery.highlightImage("+i+",'thumbnail"+i+"', '"+target.id+"');\" href='javascript:void(0);'><img id='thumbnail"+i+"'  src='"+images[i].src+"' style='height: 50px; width: 50px; margin: 5px; border: solid 2px "+borderColor+";' alt='' /></a>";
        }
        thumbTarget.innerHTML=tih;
        
        target.style.height=height+"px";
        target.style.width=width+"px";
        
        if(images.length > 0)
            pub.highlightImage(0,'thumbnail0', target.id);
    };


    pub.drawGallery=function(imagePaths, divID, thumbTargetID)
    {
        var target = document.getElementById(divID);
        var thumbTarget = document.getElementById(thumbTargetID);
        
        if(imagePaths.length > 0)
        {
        
            target.innerHTML = "Loading Gallery Images ... <span id='galleryPercent'>0</span>%";
            
            var loadedImages = 0;
            for(i=0;i<imagePaths.length;i++)
            {
            
                images[i] = new Image();
                images[i].onload=function () { loadedImages++; if(loadedImages==imagePaths.length) { drawThumbs(target, thumbTarget); } else { document.getElementById('galleryPercent').innerHTML=Math.round(((loadedImages*1.0)/imagePaths.length)*100); }  };
                images[i].src=imagePaths[i][0];
                captions[i]=imagePaths[i][1];
                
            }
        }
        else
        {
            target.style.display='none';
            thumbTarget.style.display='none';
        }
    };
  return pub;

}();