var myself;

function BakerViewer(isDynamic) {
    this.isDynamic = isDynamic;
    this.mainImage = new Object();
    this.mainImageId = "";
    this.alternateImage1 = new Object();
    this.alternateImage1Id = "";
    this.alternateImage2 = new Object();
    this.alternateImage2Id = "";
    this.alternateImage3 = new Object();
    this.alternateImage3Id = "";
    this.vignettesQueryString = undefined;
    this.roomScenes = new Array();

    var s7zoom;
    var vignettesJson;
    var selectedFinish;
    var selectedFinishCode;
    var selectedFabric;
    var selectedFabricCode;
    var selectedOption = "";
    var isInitialized = false;
    var timesTried = 0;
    var isSimplyBaker = false;
    var viewportSize;
    var dimensionString;

    var printLink;
    var printPageName;
    var activePrintLink;
    var activeQueryObject;

    this.initialize = function(simplyBaker) {
        if (this.vignettesQueryString != undefined) {
            myself = this;
            switch(document.domain) {
                case 'review.kohlerinteriors.kohler.com':
                    $.getScript('http://review.kohler.kohler.com/services/vignettes/getvignjson.jsp?jquery=1' + this.vignettesQueryString, vignettesCallback);
                    break;
                case 'preprod.kohlerinteriors.kohler.com':
                    $.getScript('http://preprod.kohler.kohler.com/services/vignettes/getvignjson.jsp?jquery=1' + this.vignettesQueryString, vignettesCallback);
                    break;
                default:
                    $.getScript('http://www.kohler.com/services/vignettes/getvignjson.jsp?jquery=1' + this.vignettesQueryString, vignettesCallback);
            }
        }

        if (isDynamic) {
            s7zoom = new SjZViewer('http://s7d4.scene7.com/is/image/','', 430, 470, this.mainImage['image.width'], this.mainImage['image.height']);
            var zoomsteps=2;
            var zoomlimit=100;

            s7zoom.setBackground("0xffffff");
            s7zoom.setTurnTime(1);
            s7zoom.setMaxZoom(zoomlimit); //sets the initial maxZoom for images
            s7zoom.setZoomStep(zoomsteps); //sets the initial maxZoom for images
            s7zoom.setFormat("jpeg");

            if (parseInt(this.mainImage['image.width']) > parseInt(this.mainImage['image.height'])) {
                viewportSize = parseInt(this.mainImage['image.width']);
                dimensionString = "&wid=" + viewportSize;
            } else if (parseInt(this.mainImage['image.width']) > parseInt(this.mainImage['image.height'])) {
                viewportSize = parseInt(this.mainImage['image.height']);
                dimensionString = "&hei=" + viewportSize;
            } else {
                viewportSize = parseInt(this.mainImage['image.height']);
                dimensionString = "&wid=" + viewportSize + "&hei=" + viewportSize;
            }
        }

        isInitialized = true;
        isSimplyBaker = simplyBaker;

        printLink = $('a#viewspopup-print-link').attr('printhref');
        activePrintLink = printLink;
        printPageName = printLink.split('?')[0];
        activeQueryObject = $.query.load(printLink);
        $('a#viewspopup-print-link').click(function() {
            window.open(activePrintLink,'printerfriendly','width=750,height=650,scrollbars=yes');
        });
    }

    this.getViewer = function() {
        return s7zoom;
    }

    this.showMainImage = function() {
        resetSelections();
        $("td#bakerViewsMainImageThumbnailCell").css("background-color", "red").find("img.bakerViewsPopupTriangle").show();
        if (isDynamic) {
            s7zoom.setImage('http://s7d4.scene7.com/is/image/KIG/' + this.mainImageId + '?qlt=85,1&op_sharpen=1', true, this.mainImage['image.width'], this.mainImage['image.height']);
        } else {
            var fade = $('#static-image-holder-main');
            if (!(fade.is(':visible'))) {
                $('.static-image-holder').fadeOut(300);
                fade.fadeIn(300);
            }
        }
    }

    this.showAlternateImage = function(whichAltAngle) {
        resetSelections();
        $('td#bakerViewsAlt' + whichAltAngle + 'ThumbnailCell').css("background-color", "red").find("img.bakerViewsPopupTriangle").show();
        if (isDynamic) {
            var id = "this.alternateImage" + whichAltAngle + "Id";
            var width = "this.alternateImage" + whichAltAngle + "['image.width']";
            var height = "this.alternateImage" + whichAltAngle + "['image.height']";
            s7zoom.setImage('http://s7d4.scene7.com/is/image/KIG/' + eval(id) + '?qlt=85,1&op_sharpen=1', true, eval(width), eval(height));
        } else {
            var fade = $('#static-image-holder-alt' + whichAltAngle);
            if (!(fade.is(':visible'))) {
                $('.static-image-holder').fadeOut(300);
                fade.fadeIn(300);
            }
        }
    }

    this.showViewsPopup = function(option) {
        if (isInitialized) {
            $("body").removeClass("curWait");
            $("div#collnavlyr,div#catnavlyr,div#browsenavlyr,div#aboutnavlyr,div#newsnavlyr,div#interview").hide(); // get rid of any open page nav elements
            $("div#bakerViewsPopup").show().css("visibility", "inherit");
            selectedOption = option;
            switch(option) {
                case "enlarge":
                    this.showEnlargeImageOption();
                    break;
                case "alt":
                    this.showAlternateImageOption();
                    break;
                case "finishoptions":
                    this.showFinishSelectionOption();
                    break;
				case "flash":
                    this.showFlashPiece();
                    break;
                case "room":
                    this.showRoomScenesOption();
            }
        } else if (timesTried == 10) {
            $("body").removeClass("curWait");
            alert("Error creating zoom viewer. Please try again later.");
            timesTried = 0;
        } else {
            $("body").addClass("curWait");
            timesTried++;
            var temp = this;
            setTimeout(function() { temp.showViewsPopup(option) }, 500);
        }
    }

    var resetPopupContent = function() {
        $("div.bakerViewsActiveTab").attr("class", "bakerViewsInactiveTab"); // reset tabs
        $("div.bakerViewsSidebar").hide(); // reset popup divs
        if (selectedOption != "room") $("div#bakerViewsRoomSceneProducts div").hide(); // reset product list on room scenes tab
        activePrintLink = printLink;
    }

    this.showEnlargeImageOption = function() {
        resetPopupContent();
        $("div#bakerViewsZoomAndDrapingSidebar").show();
        if ($("div#bakerViewsAlternateAngleSidebar").size() > 0) { // still need to show the alternate image choices even if user chose the main image tab
            $("div#bakerViewsAlternateAngleSidebar").show();
        }
        $("div#bakerViewsZoomViewTab").attr("class", "bakerViewsActiveTab");
        this.showMainImage();
        $('div.bakerViewsPopupPrintButton').show();
    }

    this.showAlternateImageOption = function() {
        resetPopupContent();
        this.showAlternateImage('1');
        $('div#bakerViewsZoomAndDrapingSidebar, div#bakerViewsAlternateAngleSidebar').show();
        $("div#bakerViewsZoomViewTab").attr("class", "bakerViewsActiveTab");
        $('div.bakerViewsPopupPrintButton').show();
    }

    this.showFinishSelectionOption = function() {
        resetPopupContent();
        resetSelections();
        selectedFabricCode = undefined; // resets to state where no fabric is selected
        if ($('table.drapingTable-finishes .nonDraped').size() > 0) {
            this.showMainImage();
        } else {
            $("table.drapingTable-finishes div.bakerViewsThumbnailHolder:eq(0)").click();
        }
        $("div#bakerViewsZoomAndDrapingSidebar, div#bakerViewsFinishesSelection").show();
        $("div#bakerViewsFinishOptionsTab").attr("class", "bakerViewsActiveTab");
        $('div.bakerViewsPopupPrintButton').show();
    }

    this.showRoomScenesOption = function() {
        resetPopupContent();
        this.showRoomScene(0);
        $("div#bakerViewsRoomScenesSidebar").show();
        $("div#bakerViewsRoomScenesTab").attr("class", "bakerViewsActiveTab");
        $('div.bakerViewsPopupPrintButton').hide();
    }

    this.selectFinish = function(holder, name, code) {
        resetSelections(false);
        $(holder).css("background-color", "red")
                .find("img.bakerViewsPopupTriangle").show();
        selectedFinish = holder;
        selectedFinishCode = code;

        var drapingUrlString;
        if (isSimplyBaker) {
            if (selectedFabricCode == undefined) {
                selectedFabric = $("#drapingTable-fabrics div.bakerViewsThumbnailHolder:eq(0)");
                selectedFabricCode = $(selectedFabric).attr("section");
                $(selectedFabric).css("background-color", "red").find("img.bakerViewsPopupTriangle").show();
                var fabricHolder = $("#drapingTable-fabrics div.bakerViewsThumbnailHolder:eq(0)");
                var fabricName = $(fabricHolder).attr('id').split('-')[2].replace(/_/g, ' ');
                $("span.bakerViewsFabricName").text(fabricName);
                activeQueryObject.SET('s7fabric', selectedFabricCode);
            }
            drapingUrlString = buildDrapingUrlString(this.mainImageId, code, selectedFabricCode);
        } else {
            drapingUrlString = buildDrapingUrlString(this.mainImageId, code);
        }
        s7zoom.setImage(drapingUrlString, false, viewportSize, viewportSize);
        $("span.bakerViewsFinishName").text(name);

        activePrintLink = printPageName + activeQueryObject.SET('s7finish', selectedFinishCode).toString();
    }

    this.selectFabric = function(holder, name, code) {
        resetSelections(true);
        $(holder).css("background-color", "red")
                .find("img.bakerViewsPopupTriangle").show();
        selectedFabric = holder;
        selectedFabricCode = code;

        var drapingUrlString = buildDrapingUrlString(this.mainImageId, selectedFinishCode, code);
        s7zoom.setImage(drapingUrlString, false, viewportSize, viewportSize);
        $("span.bakerViewsFabricName").text(name);

        activePrintLink = printPageName + activeQueryObject.SET('s7fabric', selectedFabricCode).toString();
    }

    function buildDrapingUrlString(imageId, finishCode, fabricCode) {
        var s7imageString = [];
        s7imageString.push('http://s7d4.scene7.com/is/image/KIG/?fmt=jpg&op_sharpen=1&bgc=255,255,255&size=');
        s7imageString.push(viewportSize);
        s7imageString.push(',');
        s7imageString.push(viewportSize);
        s7imageString.push('&originN=0,0&layer=1&src=ir{KIGRender/');
        s7imageString.push(imageId);
        s7imageString.push('?obj=wood&src=');
        s7imageString.push(finishCode);
        if (fabricCode != undefined) {
            s7imageString.push('&obj=main&src=');
            s7imageString.push(fabricCode);
        }
        s7imageString.push('&res=90&sharp=1');
        s7imageString.push(dimensionString);
        s7imageString.push('}');
        return s7imageString.join('');
    }

    function resetSelections(fromFabrics) {
        $("div#bakerViewsRoomSceneProducts").empty();
        $("table#bakerViewsMainImageTable td").css("background-color", "white");
        
        if (fromFabrics == null) {
            $(selectedFinish).css("background-color", "white");
            $(selectedFabric).css("background-color", "white");
            $('img.bakerViewsPopupTriangle').hide();
        } else if (selectedFinish != null && !fromFabrics) {
            $(selectedFinish).css("background-color", "white");
            $('.drapingTable-finishes img.bakerViewsPopupTriangle').hide();
        } else if (selectedFabric != null && fromFabrics) {
            $(selectedFabric).css("background-color", "white");
            $('#drapingTable-fabrics img.bakerViewsPopupTriangle').hide();
        }
        
        $("div#bakerViewsRoomSceneProductsHeader").hide();
        $("td.bakerViewsRoomSceneThumbnailCell").css("background-color", "white").find("img.bakerViewsPopupTriangle").hide(); // reset room scene selections
    }

    function populateRoomSceneInfo(data) {
        vignettesJson = eval(data);
        for (var i = 0; i < vignettesJson.length; i++) {
            var imagePath = vignettesJson[i].VignGallery.VignImage.imagepath;
            var s7id;
            if (imagePath.indexOf("/") > -1) {
                s7id = imagePath.substring(imagePath.lastIndexOf("/") + 1);
            } else {
                s7id = imagePath;
            }
            s7id = s7id.replace('.jpg', '');
            vignettesJson[i].VignGallery.VignImage.imagepath = s7id;
            if (isDynamic) {
                $.getScript("http://s7d4.scene7.com/is/image/KIG/" + s7id + "?req=imageprops,json&id=" + i);
            } else {
                myself.roomScenes[i] = vignettesJson[i];
                myself.generateRoomSceneDiv(i);
            }
        }
    }

    function vignettesCallback() {
        populateRoomSceneInfo(jsonarray);
    }

    this.generateRoomSceneDiv = function(index) {
        var s7id = vignettesJson[index].VignGallery.VignImage.imagepath;
        this.roomScenes[index]['s7id'] = s7id;
        var productHtml = "";
        var numberOfItems = vignettesJson[index].VignGallery.VignItem.length;
        if (numberOfItems != undefined) {
            for (var j = 0; j < numberOfItems; j++) {
                var prodnum = vignettesJson[index].VignGallery.VignItem[j].prodnum;
                var prodid = vignettesJson[index].VignGallery.VignItem[j].prodpiid;
                productHtml += "<a href=\"/baker/1_1_5_0_coll_prod.jsp?brand=Baker&prod_num=" + prodnum + "&prod_id=" + prodid + "\" target=\"_blank\">";
                productHtml += "No. " + prodnum + "<br/>";
                productHtml += vignettesJson[index].VignGallery.VignItem[j].name + "<br/><br/></a>";
            }
        } else {
            var prodnum = vignettesJson[index].VignGallery.VignItem.prodnum;
            var prodid = vignettesJson[index].VignGallery.VignItem.prodpiid;
            productHtml += "<a href=\"/baker/1_1_5_0_coll_prod.jsp?brand=Baker&prod_num=" + prodnum + "&prod_id=" + prodid + "\" target=\"_blank\">";
            productHtml += "No. " + vignettesJson[index].VignGallery.VignItem.prodnum + "<br/>";
            productHtml += vignettesJson[index].VignGallery.VignItem.name + "<br/><br/></a>";
        }
        this.roomScenes[index]['html'] = productHtml;

        var roomSceneThumbnail;
        if (isDynamic) {
            roomSceneThumbnail = $('<div onclick="bakerViewer.showRoomScene(' + index + ')" class="bakerViewsThumbnailHolder" style="padding-bottom:2px">'
                    + '<img border="0" class="bakerViewsPopupTriangle" src="images/viewsPopupTriangle.gif"/>'
                    + '<img width="80" height="80" border="0" style="border: 1px solid white;" src="http://s7d4.scene7.com/is/image/KIG/' + s7id + '?fmt=jpg&qlt=85,1&wid=80&hei=80" alt="' + s7id + '"/></div>');
        } else {
            roomSceneThumbnail = $('<div onclick="bakerViewer.showRoomScene(' + index + ')" class="bakerViewsThumbnailHolder" style="padding-bottom:2px">'
                    + '<img border="0" class="bakerViewsPopupTriangle" src="images/viewsPopupTriangle.gif"/>'
                    + '<img width="80" height="80" border="0" style="border: 1px solid white;" src="/images/product/80x80/' + s7id + '.jpg" alt="' + s7id + '"/></div>');
            $('#static-image-holder-roomscene' + index).html('<img src="/images/product/large/' + s7id + '.jpg" alt="' + s7id + '" height="470" width="430">');
        }
        $("td#bakerViewsRoomSceneThumbnailCell" + index).append(roomSceneThumbnail);
    }

    this.showRoomScene = function(index) {
        if (this.roomScenes[index] != undefined) {
            resetSelections();
            if (isDynamic) {
                s7zoom.setImage('http://s7d4.scene7.com/is/image/KIG/' + this.roomScenes[index]['s7id'] + '?qlt=85,1&op_sharpen=1', false, this.roomScenes[index]['image.width'], this.roomScenes[index]['image.height']);
            } else {
                var fade = $('#static-image-holder-roomscene' + index);
                if (!(fade.is(':visible'))) {
                    $('.static-image-holder').fadeOut(300);
                    fade.fadeIn(300);
                }
            }
            $("div#bakerViewsRoomSceneProducts").append(this.roomScenes[index]['html']);
            $("div#bakerViewsRoomSceneProductsHeader").show();
            $("td#bakerViewsRoomSceneThumbnailCell" + index).css("background-color", "red").find("img.bakerViewsPopupTriangle").show();
        }
    }

    this.positionViewsPopup = function() {
        var popupDiv = $("div#bakerViewsPopup");
        $(popupDiv).css("left", ($(window).width() / 2 - $(popupDiv).width() / 2));
    }

    this.hideViewsPopup = function() {
        $("div#bakerViewsPopup").hide().css("visibility", "hidden"); // hide div, set visibility to hidden
        $("div.bakerViewsThumbnailName").hide();
    }
}

// Show/Hide finish/fabric names on views popup
var thumbnailNameTimeout;
var finishBeingHoveredOver;

function showFinishName(element, finishName) {
    var elementOffset = $(element).offset();
    var cssObj = {'top': elementOffset['top'] + 6, 'left': elementOffset['left'] + 12};
    $("div.bakerViewsThumbnailName").css(cssObj).text(finishName).show();
}

function hideFinishName() {
    $("div.bakerViewsThumbnailName").hide();
}

function showFlash() {
	$("div#collnavlyr,div#catnavlyr,div#browsenavlyr,div#aboutnavlyr,div#newsnavlyr,div#interview").hide(); // get rid of any open page nav elements
	so.write("flashcontent");
	$('div#paginiFlashPiece').css('visibility','visible');
}

$(function() {
    $('div.bakerViewsThumbnailHolder').hover(function() {
        clearTimeout(thumbnailNameTimeout);
        finishBeingHoveredOver = this;
        if ($(finishBeingHoveredOver).attr('id')) {
            var finishName = $(finishBeingHoveredOver).attr('id').split('-')[2].replace(/_/g, ' ');
            showFinishName(finishBeingHoveredOver, finishName);
        }
    }, function() {
        thumbnailNameTimeout = setTimeout('hideFinishName()', 10);
    });

    $('div.bakerViewsThumbnailName').hover(function() {
        clearTimeout(thumbnailNameTimeout);
    }, function() {
        thumbnailNameTimeout = setTimeout('hideFinishName()', 10);
    });

    $('div.bakerViewsThumbnailName').click(function() {
        $(finishBeingHoveredOver).click();
    });
	
	$('span.closeFlashPopup').click(function() {
        $('div#paginiFlashPiece').css('visibility','hidden');
    });
});