///////////////////////////////////////////////////////////////////////////////
//  Dare Gallery - by Daniel Thomson
//////////////////////////////////////////////////////////////////////////////

// things to do:
// calculate where the center image in the gallery is, then, when the image is clicked on, find where in the list it should be, and then cycle the elements in the list to the right position. Hmmm.


var galleryOn = false;
var offersOn = false;
var offersWidth = null;
var endNav = false;
var searchTimer;
var zoomMultiplier = 1.5;
var zoomLevel = 0;
var maxZoom = 1;


$(document).ready(function() {
    findPageHeight();
    addSearch();
    addProductDetails();
    addSliders();
    addProductImageGallery();
    // set gallery position...
    windowWidth = document.body.scrollWidth;
    windowHeight = document.body.scrollHeight;
    scrollLength = windowWidth - 37;

    $("#rightSlider").css("left", scrollLength);
    // find center position for open gallery
    window.onresize = function() {
        findPageHeight();
        windowWidth = document.body.scrollWidth;
        scrollLength = windowWidth - 37;
        $("#rightSlider").css("left", scrollLength);
        windowHeight = document.body.clientHeight;
        sliderPos = (windowHeight / 2) - 215 + "px";
        $("#leftSlider").css("top", sliderPos);
        $("#rightSlider").css("top", sliderPos);
    };
    // click event for transparent layer
    $("#transparency").click(function() {
        $(this).css("display", "none");
        resetGallery();
        hideGallery();
        hideOffers();
    });

    // Press Escape event!
    $(document).keypress(function(e) {
        if (e.keyCode == 27) {
            $("#transparency").css("display", "none");
            resetGallery();
            hideGallery();
            hideOffers();
        }
    });
    addImagePopUp();
    addZoomFeature();
    addNavHack();
    addFlashVideo();
});

// add search drop down menus
function addSearch() {
    $(".searchBar ul .searchHeader").click(function() {
        $(this).parent().siblings("ul").removeClass("active");
        $(this).parent().addClass("active");
        return false;
    });
    $(".searchBar ul li").mouseout(function() {
        setSearchTimer();

    });
    $(".searchBar ul li").mouseover(function() {
        clearTimeout(searchTimer);
    });
};

function setSearchTimer() {
    clearTimeout(searchTimer);
    searchTimer = setTimeout("hideSearchBar()", 500);
};

function hideSearchBar() {
    $(".searchBar ul").removeClass("active");
};

// product details tabbing function
function addProductDetails() {
    $(".detailsTab").click(function() {
        $(this).parent().siblings("li").removeClass("active");
        $(this).parent().addClass("active");
        $(".dimensions").css("display", "none");
        $(".details").css("display", "block");
        return false;
    });

    $(".dimensionsTab").click(function() {
        $(this).parent().siblings("li").removeClass("active");
        $(this).parent().addClass("active");
        $(".details").css("display", "none");
        $(".dimensions").css("display", "block");
        return false;
    });
};


function addSliders() {
    windowHeight = document.body.clientHeight;
    sliderPos = (windowHeight / 2) - 215 + "px";
    $("#leftSlider").css("top", sliderPos);
    $("#rightSlider").css("top", sliderPos);
    $("#leftSlider .slider").toggle(function() {
        offersOn = true;
        if (galleryOn == true) {
            hideGallery();
        }
        showOffers();
        return false;
    },
   function() {
       hideOffers();
       offersOn = false;
       return false;
   });

    $("#rightSlider .slider").toggle(function() {
        galleryOn = true;
        if (offersOn == true) {
            hideOffers();
        }
        showGallery();
        return false;
    },
   function() {
       hideGallery();
       galleryOn = false;
       return false;
   });
};

function showOffers() {
    slideNumbers = $("#leftSlider .slideContent").children("div").size();
    slideAmount = slideNumbers * 224;
    windowWidth = document.body.scrollWidth;
    if (slideAmount > windowWidth) {
        slideAmount = windowWidth - 74;
    }
    slideAmount = parseFloat(slideAmount);
    slideAmount = slideAmount + "px";
    $("#leftSlider").animate({ left: slideAmount }, 1000);
    $("#transparency").css("display", "block");
};

function hideOffers() {
    $("#leftSlider").animate({ left: "-1px" }, 1000);
    $(".slideProduct").unbind();
    $("#transparency").css("display", "none");
};

function showGallery() {
    $("#rightSlider").animate({ left: "37px" }, 1000);
    $("#transparency").css("display", "block");
    // bind gallery events
    setTimeout("addImageGallery()", 1000);
};

function hideGallery() {
    windowWidth = document.body.scrollWidth;
    scrollLength = windowWidth - 37;
    $("#rightSlider").animate({ left: scrollLength }, 1000);
    $("#transparency").css("display", "none");
    // unbind gallery events
    $("#rightSlider .slideProduct").unbind();
    $("#rightSlider .galleryPrev").unbind();
    $("#rightSlider .galleryNext").unbind();
}

function findCenter(thisImage) {
    actualWidth = windowWidth - 74;
    listNum = actualWidth / 152;
    listPos = Math.floor(listNum / 2);
    thisPosition = $("#rightSlider .slideProduct").index(thisImage);
    shiftAmount = listPos - thisPosition;
    shiftGallery(shiftAmount);
};

function shiftGallery(positionChange) {
    galleryLength = $("#rightSlider .slideProduct").length;
    positionChange = galleryLength - positionChange;
    for (i = 0; i < positionChange; i++) {
        $("#rightSlider .slideProduct:eq(0)").remove().appendTo("#rightSlider .slideContent");
    }
    addGalleryControls();
};

function addImageGallery() {
    $("#rightSlider .slideProduct").mouseover(function() {
        $("#rightSlider .slideProduct").stop();
        $("#rightSlider .slideProduct").animate({ width: "152px" }, 200)
        $(this).animate({ width: "304px" }, 200);
        $(this).children(".slideProductPane").css("display", "none");
        $(this).siblings().children(".slideProductPane").css("display", "block");
    });

    $("#rightSlider .slideProduct").mouseout(function() {
        $("#rightSlider .slideProduct").stop();
        $(this).animate({ width: "152px" }, 200);
    });

    $("#rightSlider .slideProduct").click(function() {
        findCenter(this);
        $(this).animate({ width: "684px" }, 300);
        $(this).children(".slideProductInfo").css("display", "block");
        $(this).addClass("slideActiveClicked");
        // unbind all events to the gallery
        $("#rightSlider .slideProduct").unbind();
    });
};

function addGalleryControls() {
    $("#rightSlider .galleryClose").click(function() {
        $("#rightSlider .slideProduct").stop();
        resetGallery();
        return false;
    });

    $("#rightSlider .galleryNext").click(function() {
        //$("#rightSlider .slideProduct").stop();
        $("#rightSlider .slideProduct:eq(0)").remove().appendTo("#rightSlider .slideContent");
        nextItem = $(this).parent(".slideProduct").next();
        navEvent(nextItem);
        // add controls for this new item
        $("#rightSlider .galleryPrev").unbind();
        $("#rightSlider .galleryNext").unbind();
        $("#rightSlider .galleryClose").unbind();
        addGalleryControls();
        return false;
    });

    $("#rightSlider .galleryPrev").click(function() {
        //$("#rightSlider .slideProduct").stop();
        var thisIndex = galleryLength - 1;
        $("#rightSlider .slideProduct:eq(" + thisIndex + ")").remove().prependTo("#rightSlider .slideContent");
        prevItem = $(this).parent(".slideProduct").prev();
        navEvent(prevItem);
        // add controls for this new item
        $("#rightSlider .galleryPrev").unbind();
        $("#rightSlider .galleryNext").unbind();
        $("#rightSlider .galleryClose").unbind();
        addGalleryControls();
        return false;
    });
};

function resetGallery() {
    $("#rightSlider .slideProduct").unbind();
    $("#rightSlider .galleryPrev").unbind();
    $("#rightSlider .galleryNext").unbind();
    $("#rightSlider .galleryClose").unbind();
    // needs some work - need to hide slideproductInfo
    $("#rightSlider .slideProduct").animate({ width: "152px" }, 300);
    $("#rightSlider .slideProduct").removeClass("slideActiveClicked");
    $("#rightSlider .slideProductPane").css("display", "block");
    addTimer = setTimeout("addImageGallery()", 500);
    $(".slideProductInfo").css("display", "none");
};

function navEvent(activeItem) {
    $("#rightSlider .slideProduct").animate({ width: "152px" }, 300);
    $("#rightSlider .slideProduct").removeClass("slideActiveClicked");
    $("#rightSlider .slideProductPane").css("display", "block");
    $(".slideProductInfo").css("display", "none");

    activeItem.animate({ width: "684px" }, 500);
    activeItem.css("z-index", "20");
    activeItem.children(".slideProductInfo").css("display", "block");
    activeItem.addClass("slideActiveClicked");
    activeItem.children(".slideProductPane").css("display", "none");
};

function addProductImageGallery() {
    $(".thmbPane img").click(function() {
        imageSrc = $(this).attr("alt");
        $(".productImg .imagePane img").attr("src", imageSrc);
        // console.log(imageSrc);
    });
};

function findPageHeight() {
    $(".pageContent").css("height", "auto");
    newPageHeight = $("#wrap").height() - $(".footer").height() - $(".masthead").height() - 50;  // 50px padding
    currentPageHeight = $(".pageContent").height();
    if (newPageHeight > currentPageHeight) {
        $(".pageContent").css("height", newPageHeight + "px");
    };
};



function displayBox() {
    $(".favouritePopUp .favPopContent img").attr("src", imgSrc);
    $(".favouritePopUp .favPopContent img").attr("height", imgHeight);
    $(".favouritePopUp .favPopContent img").attr("width", imgWidth);
    // calculate height of the middle box
    imgWidth = imgWidth; // allow for padding on image
    imgHeight = imgHeight + 20; // allow for padding on image
    midHeight = imgHeight + 110;
    midWidth = imgWidth + 40;
    // claculate dimensions of popup
    $(".favouritePopUp .favPopML").height(midHeight);
    $(".favouritePopUp .favPopMR").height(midHeight);
    $(".favouritePopUp .favPopMLPane").height(midHeight);
    $(".favouritePopUp .favPopMRPane").height(midHeight);
    $(".favouritePopUp .favPopContent").height(midHeight);
    $(".favouritePopUp .favPopContent").width(imgWidth);
    $(".favouritePopUp .favPopContent .infoBox").width(imgWidth);
    $(".favouritePopUp .imgPane").height(imgHeight);
    $(".favouritePopUp .imgPane").width(imgWidth);
    $(".favouritePopUp").width(midWidth + 3); // crappy little ie6 hack +3
    $(".favouritePopUp .favPopTop").width(midWidth);
    $(".favouritePopUp .favPopBot").width(midWidth);
    $(".favouritePopUp .favPopContent img").css("padding", "0px");
    // calculate absolute position of the box
    boxWidth = $(".favouritePopUp").width();
    boxHeight = $(".favouritePopUp").height();
    pageWidth = $("#wrap").width();
    //console.log(boxWidth);
    leftPos = (pageWidth - boxWidth) / 2;
    $(".favouritePopUp").css("left", leftPos);
    //console.log(leftPos);
    // calculate the top position of the box
    winY = $(window).height();
    winX = $(window).width();
    scrY = $(window).scrollTop();
    scrX = $(window).scrollLeft();
    //alert("winY: "+winY+", winX: "+winX+", scrY: "+scrY+", scrX: "+scrX+", boxHeight: "+boxHeight);
    if (scrY > 90) {
        //alert("positioning box");
        if (boxHeight > winY) {
            $(".favouritePopUp").css("top", (scrY - 190) + "px");
        }
        else {
            var boxTop = ((winY - boxHeight) / 2) + scrY;
            $(".favouritePopUp").css("top", (boxTop - 190) + "px");
        }

    }
    $(".favouritePopUp").fadeIn("slow");
}

function addZoomFeature() {
    //$(".zoomIn").css("visibility", "hidden");
    $(".zoomIn").click(function() {
        zoomImage = $(this).parent().parent().parent().siblings(".imgPane").children("img");
        zoomHeight = zoomImage.attr("height");
        zoomWidth = zoomImage.attr("width");
        imgHeight = zoomHeight * zoomMultiplier;
        imgWidth = zoomWidth * zoomMultiplier;
        displayBox();
        zoomLevel = zoomLevel + 1;
        $(".zoomOut").css("visibility", "visible");
        if (zoomLevel >= maxZoom) {
            $(".zoomIn").css("visibility", "hidden");
            return false;
        }
        else {
            $(".zoomIn").css("visibility", "visible");
        }
        return false;
    });

    $(".zoomOut").click(function() {
        zoomImage = $(this).parent().parent().parent().siblings(".imgPane").children("img");
        zoomHeight = zoomImage.attr("height");
        zoomWidth = zoomImage.attr("width");
        imgHeight = zoomHeight / zoomMultiplier;
        imgWidth = zoomWidth / zoomMultiplier;
        displayBox();

        zoomLevel = zoomLevel - 1;
        $(".zoomIn").css("visibility", "visible");
        if (zoomLevel == (0 - maxZoom)) {
            $(".zoomOut").css("visibility", "hidden");
            return false;
        }
        else {
            $(".zoomOut").css("visibility", "visible");
        }
        return false;
    });

    $("#transparency").click(function() {
        closePopUps();
    });
}

function closePopUps() {
    $(".favouritePopUp").fadeOut("slow");
    $("#transparency").fadeOut("slow");
    if ($.browser.msie) {
        $(".favouritePopUp .favPopContent img").css("padding", "0px");
    }
}

function addImagePopUp() {


    // move image popup to the end of the document
    $("#transparency").appendTo("#wrap");
    var bodyHeight = $("body").height();
    var bodyWidth = $("body").width();
    $("#transparency").css({ height: bodyHeight + "px", width: bodyWidth + "px" });
    $(".favouritePopUp").appendTo("body");
    // open popup
    $(".popup").click(function() {
        $("#transparency").css("display", "block");
        imgSrc = $(this).attr("name");
        var popUpImg = new Image();
        popUpImg.onload = function() {
            imgHeight = popUpImg.height / zoomMultiplier;
            imgWidth = popUpImg.width / zoomMultiplier;
            displayBox();
        };
        popUpImg.src = imgSrc;
        return false;
    });

    // close popup
    $(".favPopContent .popClose").click(function() {
        closePopUps();
        return false;
    });

    //Press Escape event! - note: not working on IE6, maybe won't include it
    $(document).keyup(function(e) {
        if (e.keyCode == 27) {
            closePopUps();
        }
    });

    window.onresize = function() {



    }

    window.onscroll = function() {

        var bodyHeight = $(".favouritePopUp").height() + 20;
        var bodyWidth = $("body").width();
        $("#transparency").css({ height: bodyHeight + "px", width: bodyWidth + "px" });


    }

}

function addNavHack() {
    $(".mainNav li.active").find("a").addClass("active");
}

function addFlashVideo() {
    $(".videoLink").click(function() {
        showFlash($(this).attr("name"), $(this).text());
        return false;
    });

    var ul = $("#videoLinkList").children();

    if (ul.length > 0) {
        showFlash(ul.children("a:eq(0)").attr("name"), ul.children("a:eq(0)").text());
    }
}

function showFlash(url, title) {
    var so = new SWFObject("/Resources/Dare/Flash/dare_video_player.swf", "flashMovie", "512", "440", "9", "#FFFFFF");
    so.addVariable("id", "flashMovie");
    so.addParam("scale", "noscale");
    so.addVariable("title", title);
    so.addVariable("videoURL", url);
    so.write("videoPlayer");
}
