﻿
var imageShowObj = null;
var displayImgObj = null;
var thumbContainerobjs = null;
var currentContainer = null;
var showTime = 7000;
var timer = 0;
var absLeft = 0;
var picCount = 0;
var totalImgs = 0;

jQuery(document).ready(function() {
    //AdjustImage();
});

var crrentAwardImageObj = null;
var crrentCertificationsImageObj = null;

var imgMaxWidth = 420;
var imgMaxHeight = 295;

function InitShowImages() {
    AdjustImage("AwardImages");
    AdjustImage("CertificationImages");
}

function AdjustImage(contentid) {
    var imagethumbnailsObj = jQuery("#" + contentid).find(".imagethumbnails");
    var imagecontentObj = jQuery("#" + contentid).find(".imagecontent");
    var displayImgObj = imagecontentObj.find("img");
    var contentwidth = imagethumbnailsObj.width();

    //var left = 0;
    var left = GetLeftOff(contentid);
    var imgcount = imagethumbnailsObj.find("img").length;
    jQuery("#" + contentid).attr("imgcount", imgcount);
    jQuery("#" + contentid).attr("firstindex", 1);

    var firstImgObj = null;
    var haveLastIndex = false;
    imagethumbnailsObj.find("img").each(function(i) {
        var imgObj = jQuery(this);
        imgObj.css("left", left);
        imgObj.attr("imgindex", i + 1);
        left += imgObj.width() + 6;

        if (left <= contentwidth) {
            imgObj.show();
        }
        else if (!haveLastIndex) {
            jQuery("#" + contentid).attr("lastindex", i);
            haveLastIndex = true;
        }
        
        if (i == 0) {
            firstImgObj = imgObj;
        }

        if (!haveLastIndex && (i == imgcount - 1)) {
            jQuery("#" + contentid).attr("lastindex", imgcount);
        }
    });

    if (firstImgObj != null) {
        ShowImage(firstImgObj);
    }
}

function GetLeftOff(contentid) {
    var imagethumbnailsObj = jQuery("#" + contentid).find(".imagethumbnails");
    var contentwidth = imagethumbnailsObj.width();

    var imgShowWidth = 0;
    var left = 0;
    imagethumbnailsObj.find("img").each(function(i) {
        var imgObj = jQuery(this);
        left += imgObj.width() + 6;
        if (left <= contentwidth) {
            imgShowWidth += imgObj.width() + 6;
        }
    });

    var leftOff = 0;
    if (contentwidth > imgShowWidth) {
        leftOff = (contentwidth - imgShowWidth) / 2;
    }

    return leftOff;
}

function ProDownImage(obj) {
    var imgObj = jQuery(obj);
    var image = new Image();
    image.src = imgObj.attr("src");
    if (image.width > 0 && image.height > 0) {
        var rate = (imgMaxWidth / image.width < imgMaxHeight / image.height) ? imgMaxWidth / image.width : imgMaxHeight / image.height;
        if (rate <= 1) {
            imgObj.width(parseInt(image.width * rate));
            imgObj.height(parseInt(image.height * rate));
        }
        else {
            imgObj.width(image.width);
            imgObj.height(image.height);
        }
    }

    var left = (imgMaxWidth - imgObj.width()) / 2;
    var top = (imgMaxHeight - imgObj.height()) / 2;
    imgObj.css("left", left);
    imgObj.css("top", top);
}


function ClickShowImage(imgObj) {
    imgObj = jQuery(imgObj);
    var imgContentID = imgObj.parent().attr("imgcontentid");
    var imagecontentObj = jQuery("#" + imgContentID).find(".imagecontent");
    var displayImgObj = imagecontentObj.find("img");

    displayImgObj.fadeOut(600, function() {
        ShowImage(imgObj);
    });
}

function ShowImage(imgObj) {
    imgObj = jQuery(imgObj);
    var imgContentID = imgObj.parent().attr("imgcontentid");
    var showimageContent = jQuery("#" + imgContentID);
    var imagecontentObj = showimageContent.find(".imagecontent");
    var displayImgObj = imagecontentObj.find("img");

    var imgSrc = imgObj.attr("imgsrc");
    ProDownImage(displayImgObj, imgSrc);
    displayImgObj.attr("src", imgSrc);
    displayImgObj.fadeIn(600, function() {
    });

    imgObj.css("border", "solid 2px Yellow");
    if (imgContentID == "AwardImages") {
        if (crrentAwardImageObj != null) {
            crrentAwardImageObj.css("border", "solid 2px #FFFFFF");
        }
        crrentAwardImageObj = imgObj;
    }
    else if (imgContentID == "CertificationImages") {
        if (crrentCertificationsImageObj != null) {
            crrentCertificationsImageObj.css("border", "solid 2px #FFFFFF");
        }
        crrentCertificationsImageObj = imgObj;
    }

    showimageContent.find(".yearstyle").text(imgObj.attr("yearinfo"));
    showimageContent.find(".titlestyle").text(imgObj.attr("titleinfo"));
    showimageContent.find(".subtitlestyle").text(imgObj.attr("subtitleinfo"));

    var imagethumbnailsObj = jQuery("#" + imgContentID).find(".imagethumbnails");

    var contentwidth = imagethumbnailsObj.width();
    var imgcount = parseInt(showimageContent.attr("imgcount"));
    var firstindex = parseInt(showimageContent.attr("firstindex"));
    var lastindex = parseInt(showimageContent.attr("lastindex"));
    var currentindex = parseInt(imgObj.attr("imgindex"));

    //next image
    if (currentindex == lastindex && HaveNextImage(imgObj) && lastindex < imgcount) {
        var nextImgObj = imgObj.next();

        var offSetLeft = 0;
        var firstImgObj = imagethumbnailsObj.find("[imgindex='" + firstindex + "']");
        if (firstImgObj.width() > nextImgObj.width()) {
            offSetLeft -= firstImgObj.width();
        }
        else {
            offSetLeft -= nextImgObj.width();
        }
        firstImgObj.css("left", offSetLeft);
        firstImgObj.hide();

        //var left = 0;
        var left = GetMoveLeftOff(firstindex, imagethumbnailsObj, contentwidth);
        showimageContent.attr("firstindex", firstImgObj.next().attr("imgindex"));
        showimageContent.attr("lastindex", nextImgObj.attr("imgindex"));

        imagethumbnailsObj.find("img").each(function(i) {
            if (i + 1 > firstindex) {
                var img = jQuery(this);
                img.css("left", left);

                if ((left + img.width()) < contentwidth) {
                    img.show();
                }
                else {
                    img.hide();
                }

                left += img.width() + 6;
            }
        });
    }

    //pre image
    if (currentindex == firstindex && HavePreImage(imgObj) && currentindex < imgcount) {
        var preImgObj = imgObj.prev();

        var offSetLeft = 0;
        var lastImgObj = imagethumbnailsObj.find("[imgindex='" + lastindex + "']");
        if (lastImgObj.width() > preImgObj.width()) {
            offSetLeft -= lastImgObj.width();
        }
        else {
            offSetLeft -= preImgObj.width();
        }
        lastImgObj.css("left", offSetLeft);
        lastImgObj.hide();

        showimageContent.attr("firstindex", preImgObj.attr("imgindex"));
        showimageContent.attr("lastindex", lastImgObj.prev().attr("imgindex"));

        firstindex = parseInt(showimageContent.attr("firstindex"));
        
        //var left = 0;
        var left = GetMoveLeftOff(firstindex - 1, imagethumbnailsObj, contentwidth);
        
        imagethumbnailsObj.find("img").each(function(i) {
            if ((i + 1) >= firstindex) {
                var img = jQuery(this);
                img.css("left", left);

                if ((left + img.width()) < contentwidth) {
                    img.show();
                }
                else {
                    img.hide();
                }

                left += img.width() + 6;
            }
        });
    }

}

function GetMoveLeftOff(firstindex, imagethumbnailsObj, contentwidth) {
    var imgShowWidth = 0;
    var left = 0;
    imagethumbnailsObj.find("img").each(function(i) {
        if (i + 1 > firstindex) {
            var img = jQuery(this);

            if ((left + img.width()) < contentwidth) {
                imgShowWidth += img.width() + 6;
            }

            left += img.width() + 6;
        }
    });

    var leftOff = 0;
    if (contentwidth > imgShowWidth) {
        leftOff = (contentwidth - imgShowWidth) / 2;
    }
    
    return leftOff;
}

function HaveNextImage(imgObj) {
    var nextObj = imgObj.next();
    if (nextObj.attr("tagName") == "IMG") {
        return true;
    }
    else {
        return false;
    }
}

function HavePreImage(imgObj) {
    var preObj = imgObj.prev();
    if (preObj.attr("tagName") == "IMG") {
        return true;
    }
    else {
        return false;
    }
}


function NextImageShow(obj) {
    var clickObj = jQuery(obj);
    var imgContentID = clickObj.attr("imgcontentid");

    var nextObj = null;
    if (imgContentID == "AwardImages") {
        nextObj = crrentAwardImageObj.next();
    }
    else if (imgContentID == "CertificationImages") {
        nextObj = crrentCertificationsImageObj.next();
    }

    if (nextObj.attr("tagName") == "IMG") {
        ClickShowImage(nextObj);
    }
}

function PreImageShow(obj) {
    var clickObj = jQuery(obj);
    var imgContentID = clickObj.attr("imgcontentid");

    var preObj = null;
    if (imgContentID == "AwardImages") {
        preObj = crrentAwardImageObj.prev();
    }
    else if (imgContentID == "CertificationImages") {
        preObj = crrentCertificationsImageObj.prev()
    }

    if (preObj.attr("tagName") == "IMG") {
        ClickShowImage(preObj);
    }
}

/*

function LoadImage(callback) {
    var img = new Image();
    this.img = img;
    var appname = navigator.appName.toLowerCase();
    if (appname.indexOf("netscape") == -1) {
        //ie
        img.onreadystatechange = function() {
            if (img.readyState == "complete") {
                callback;
            }
        };
    } else {
        //firefox
        img.onload = function() {
            if (img.complete == true) {
                callback;
            }
        }
    }
}

LoadImage.prototype.get = function(url) {
    this.img.src = url;
}



function InitImagePlay() {
    imageShowObj = jQuery("#ImageShow");
    thumbContainerobjs = jQuery(".ThumbContainer");
    displayImgObj = imageShowObj.find("img");

    gallery();

    jQuery(".ImageShowClose").click(function() {
        jQuery("#ImagePlay").hide();
    });
}

function ShowImagePlay() {
    var imageShowObj = jQuery("#ImagePlay");
    imageShowObj.css("top", 20);
    var left = (jQuery(window).width() - 900) / 2;
    imageShowObj.css("left", left);
    imageShowObj.show();
}

function gallery() {

  //  var thumnImages = thumbnailsObj.find("img");
  //  totalImgs = thumnImages.length;

  //  jQuerytotalImgs = jQuery('.ThumbContainer');
  //  jQuery('#imageNumber').html('Image 1 of ' + totalImgs + ' images');

//    var thumbWidth = 0;
//    for (x = 0; x < totalImgs; x++) {
//        thumbWidth = thumbWidth + jQuery(jQuerytotalImgs[x]).outerWidth();
//    }

    //jQuery('.ThumbContainer').css({ width: thumbWidth + 'px' });

    //firstStr = jQuery('.thumb');
    //showStr = firstStr.html();

    GetShowImage(jQuery(".ThumbContainer:first"));
    //ShowImage(thumbContainerobjs.attr("imgsrc"), thumbContainerobjs.attr("imgwidth"), thumbContainerobjs.attr("imgheight"));
    displayImgObj.show();
    
    //showDiv(showStr);



//    jQuery('#slideLeft').hover(function(e) {
//        jQuery('#InnerContainer').stop();
//        jQuery('#InnerContainer').animate({ "left": "0px" }, 5000, "swing")
//    }, function() {
//        jQuery('#InnerContainer').stop();
//    });

//    jQuery('#slideRight').hover(function(e) {
//        posLeft = jQuery('#Thumbnails').offset().left;
//        absLeft = e.pageX - posLeft;
//        hiddenBit = thumbWidth - 500;
//        jQuery('#InnerContainer').stop();
//        jQuery('#InnerContainer').animate({ "left": -hiddenBit + "px" }, 5000, "swing")
//    }, function() {
//        jQuery('#InnerContainer').stop();
//    });



    jQuery('.ThumbContainer').click(function() {
        //htmlStr = jQuery(this).html();
        //        if ("p" + (totalImgs) == currentLarge) {
        //            jQuery('#clickRight').css("backgroundImage", "url(Images/blank.gif)")
        //				.attr("alt", "")
        //				.attr("title", "");
        //        }
        //        else {
        //            jQuery('#clickRight').css("backgroundImage", "url(Images/next.gif)")
        //				.attr("alt", "Next")
        //				.attr("title", "Next");
        //        }
        //        if ("p1" == currentLarge) {
        //            jQuery('#clickLeft').css("backgroundImage", "url(Images/blank.gif)")
        //				.attr("alt", "")
        //				.attr("title", "");
        //        }
        //        else {
        //            jQuery('#clickLeft').css("backgroundImage", "url(Images/previous.gif)")
        //				.attr("alt", "Previous")
        //				.attr("title", "Prevous");
        //        }


        var clickObj = jQuery(this);
        displayImgObj.fadeOut(600, function() {
            GetShowImage(clickObj);
            //ShowImage(clickObj.attr("imgsrc"), clickObj.attr("imgwidth"), clickObj.attr("imgheight"));
        });

        //imageShowObj.fadeOut(600, function() { showDiv(htmlStr) });
    });


//    jQuery('#clickRight').click(function() {
//        currentLarge = jQuery('#fullSize img').attr('class');
//        if ("p" + (total - 1) == currentLarge) {
//            jQuery('#clickRight').css("backgroundImage", "url(Images/blank.gif)")
//					.attr("alt", "")
//					.attr("title", "");
//        }
//        if ("p" + total != currentLarge) {
//            jQuery('#clickLeft').css("backgroundImage", "url(Images/previous.gif)")
//				.attr("alt", "Previous")
//				.attr("title", "Previous");
//            htmlStr = jQuery('#innerContainer li.' + currentLarge).next('li').html();
//            jQuery('#fullSize').fadeOut(600, function() { showDiv(htmlStr) });
//        }
//    });

//    jQuery('#clickLeft').click(function() {
//        currentLarge = jQuery('#fullSize img').attr('class');
//        if ("p2" == currentLarge) {
//            jQuery('#clickLeft').css("backgroundImage", "url(Images/blank.gif)")
//				.attr("alt", "")
//				.attr("title", "");
//        }
//        if ("p1" != currentLarge) {
//            jQuery('#clickRight').css("backgroundImage", "url(Images/next.gif)")
//					.attr("alt", "Next")
//					.attr("title", "Next");
//            htmlStr = jQuery('#innerContainer li.' + currentLarge).prev('li').html();
//            imageShowObj.fadeOut(600, function() { showDiv(htmlStr) });
//        }
//    });


//    jQuery('#autoPlay').toggle(function() {
//        jQuery('#autoPlay').css("backgroundImage", "url(Images/stop.gif)")
//				.attr("alt", "Stop")
//				.attr("title", "Stop");
//        autoPlay()
//    }, function() {
//        clearTimeout(timer);
//        jQuery('#autoPlay').css("backgroundImage", "url(Images/play.gif)")
//				.attr("alt", "Play")
//				.attr("title", "Play");
//    });


}

function NextImageShow() {
    var nextObj = currentContainer.next();
    if (nextObj.find("img").length > 0) {
        displayImgObj.fadeOut(600, function() {
            GetShowImage(nextObj);
            //ShowImage(clickObj.attr("imgsrc"), clickObj.attr("imgwidth"), clickObj.attr("imgheight"));
        });
    }
}

function PreImageShow() {
    var preObj = currentContainer.prev();
    if (preObj.find("img").length > 0) {
        displayImgObj.fadeOut(600, function() {
            GetShowImage(preObj);
            //ShowImage(clickObj.attr("imgsrc"), clickObj.attr("imgwidth"), clickObj.attr("imgheight"));
        });
    }
}

function showDiv(htmlStr) {
    imageShowObj.html(htmlStr).fadeIn(600);
    currentLarge = imageShowObj.find("img").attr("class");
    currentLarge = currentLarge.substr(1, 3);
    jQuery('#imageNumber').html('Image ' + currentLarge + ' of ' + totalImgs + ' images');
}

function GetShowImage(clickObj) {

    if (clickObj.attr("tagname") == "DIV") {
        if (currentContainer != null) {
            currentContainer.css("border", "solid 3px #FFFFFF");
        }

        clickObj.css("border", "solid 3px #FEA429");
        currentContainer = clickObj;

        var imgSrc = clickObj.attr("imgsrc");
        displayImgObj.attr("src", "Images/ImageShow/loading.gif");
        var img = new LoadImage(ShowImage(clickObj));
        img.get(imgSrc);
    }
}


function ProDownImage(imgObj, imgSrc) {
    imgObj = jQuery(imgObj);
    var image = new Image();
    image.src = imgSrc;
    if (image.width > 0 && image.height > 0) {
        var rate = (imgMaxWidth / image.width < imgMaxHeight / image.height) ? imgMaxWidth / image.width : imgMaxHeight / image.height;
        if (rate <= 1) {
            imgObj.width(parseInt(image.width * rate));
            imgObj.height(parseInt(image.height * rate));
        }
        else {
            imgObj.width = image.width;
            imgObj.height = image.height;
        }
    }
}

function ShowImage(clickObj) {    
    var imgSrc = clickObj.attr("imgsrc");
    var width = clickObj.attr("imgwidth")
    var height = clickObj.attr("imgheight");
    displayImgObj.removeAttr("height");
    displayImgObj.removeAttr("width");

    ProDownImage(displayImgObj, imgSrc);
    displayImgObj.attr("src", imgSrc);
    
//    if (width > imgMaxWidth) {
//        displayImgObj.attr("width", imgMaxWidth);
//        displayImgObj.removeAttr("height");
//    }
//    else {
//        displayImgObj.attr("width", width);
//    }

//    displayImgObj.attr("src", imgSrc);
//    if (displayImgObj.height() > imgMaxHeight) {
//        displayImgObj.attr("height", imgMaxHeight);
//    }
    
    displayImgObj.fadeIn(600, function() {
    });
    
    //.fadeIn(600);

    //var strImgHtml = '<img src="' + imgSrc + '" />';
    //imageShowObj.html(strImgHtml).fadeIn(600);
    //currentLarge = imageShowObj.find("img").attr("class");
    //currentLarge = currentLarge.substr(1, 3);
    //jQuery('#imageNumber').html('Image ' + currentLarge + ' of ' + totalImgs + ' images');
}


function LoadImage(callback) {
    var img = new Image();
    this.img = img;
    var appname = navigator.appName.toLowerCase();
    if (appname.indexOf("netscape") == -1) {
        //ie
        img.onreadystatechange = function() {
            if (img.readyState == "complete") {
                callback;
            }
        };
    } else {
        //firefox
        img.onload = function() {
            if (img.complete == true) {
                callback;
            }
        }
    }
}

LoadImage.prototype.get = function(url) {
    this.img.src = url;
}

function autoPlay() {
    currentLarge = jQuery('#fullSize img').attr('class');
    if ("p" + (total - 1) == currentLarge) {
        jQuery('#clickRight').css("backgroundImage", "url(Images/blank.gif)")
					.attr("alt", "")
					.attr("title", "");
    }
    if ("p" + total != currentLarge) {
        jQuery('#clickLeft').css("backgroundImage", "url(Images/previous.gif)")
					.attr("alt", "Previous")
					.attr("title", "Previous");
        htmlStr = jQuery('#innerContainer li.' + currentLarge).next('li').html();
        imageShowObj.fadeOut(600, function() { playDiv(htmlStr) });
    }
    if ("p" + (total) == currentLarge) {
        jQuery('#clickLeft').css("backgroundImage", "url(Images/blank.gif)")
					.attr("alt", "")
					.attr("title", "");
        jQuery('#clickRight').css("backgroundImage", "url(Images/next.gif)")
					.attr("alt", "Next")
					.attr("title", "Next");
        htmlStr = jQuery('#innerContainer li.p1').html();
        imageShowObj.fadeOut(600, function() { playDiv(htmlStr) });
    }
    timer = setTimeout("autoPlay()", showTime);
}


function playDiv(htmlStr) {
    imageShowObj('#fullSize').html(htmlStr).fadeIn(600);
    currentLarge = jQuery('#fullSize img').attr('class');
    currentLarge = currentLarge.substr(1, 3);
    jQuery('#imageNumber').html('Image ' + currentLarge + ' of ' + total + ' images');
}

*/
