/// <reference path="jquery-1.4.1.min.js" />

function getWidth() {
    var x = 0;
    if (window.innerWidth) {
        x = window.innerWidth;
    }
    else if (document.documentElement && document.documentElement.clientWidth) {
        x = document.documentElement.clientWidth;
    }
    else if (document.body) {
        x = document.body.clientWidth;
    }
    return x;
}

function getHeight() {
    var y = 0;
    if (self.innerHeight) {
        y = self.innerHeight;
    }
    else if (document.documentElement && document.documentElement.clientHeight) {
        y = document.documentElement.clientHeight;
    }
    else if (document.body) {
        y = document.body.clientHeight;
    }
    return y;
}

function setSmallScreen() {
    var smallHeight = getHeight();
    if (smallHeight < 600) {
        smallHeight = 600;
        $('#realBody').css('height', smallHeight);
        $('#force-height, #force-height img').css('height', (smallHeight + 100));
    } else {
        $('#realBody').css('height', '100%');
        $('#force-height, #force-height img').css('height', 650);
    }
}

function contentBox() {
    this.selector = "";
    this.width = 600;
    this.height = 400;
    this.top = 0;
    this.left = 0;
    this.startTop = 0;
    this.startLeft = 0;
    this.bugTop = 0;
    this.bugLeft = 0;
    this.anchored = "top";
    this.leftAnchored = "left";
    this.moveBug = true;
}

function backgroundImg() {
    this.width = 1200;
    this.height = 800;
    this.file = "/images/bg1.jpg";
    this.setFile = function (file) {
        this.file = file;
        $("#bg-load").attr("src", "/images/clear.gif");
        $("#bg-load").attr("src", file);
    }
    this.presetFile = function (file) {
        this.file = file;
        $("#bgimg").attr("src", "/images/clear.gif");
        $("#bgimg").attr("src", file);
        $("#bg-load").attr("src", file);
    }
}

var bgImg = new backgroundImg();
var startImg = new backgroundImg();
startImg.width = 1200;
startImg.height = 800;
startImg.file = "/images/bgs/0.jpg";
var anim = false;
var loadingHome = false;
var contentLoaded = true;
var filesLoaded = true;
var homeBugState = 0;
var queue = new Array();
var newBox = null;
var curPos = 0;
var keepContent = false;
var keepBackground = false;
var animateBackground = true;
var boxOne = new contentBox();
var boxTwo = new contentBox();
var boxThree = new contentBox();
var boxFour = new contentBox();
var boxFive = new contentBox();
var boxStart = new contentBox();
var curBoxObj = boxOne;

function resetBoxes() {
    boxOne.selector = "#contentOne";
    boxOne.width = 561;
    boxOne.height = 491;
    boxOne.top = 100;
    boxOne.left = 99;
    boxOne.startTop = 100;
    boxOne.startLeft = 99;
    boxOne.bugLeft = 43;
    boxOne.bugTop = 43;
    boxTwo.selector = "#contentTwo";
    boxTwo.width = 781;
    boxTwo.height = 406;
    boxTwo.top = 87;
    boxTwo.left = 99;
    boxTwo.startTop = 87;
    boxTwo.startLeft = 99;
    boxTwo.bugLeft = 43;
    boxTwo.bugTop = 46;
    boxTwo.anchored = "bottom";    
    boxThree.selector = "#contentThree";
    boxThree.width = 831;
    boxThree.height = 540;
    boxThree.top = 45;
    boxThree.left = 98;
    boxThree.startTop = 136;
    boxThree.startLeft = 98;
    boxThree.bugLeft = 46;
    boxThree.bugTop = 46;
    boxThree.anchored = "bottom";
    boxThree.leftAnchored = "right";
    boxFour.selector = "#contentFour";
    boxFour.width = 510;
    boxFour.height = 470;
    boxFour.top = 100;
    boxFour.left = 99;
    boxFour.startTop = 100;
    boxFour.startLeft = 100;
    boxFour.bugLeft = 46;
    boxFour.bugTop = 43;
    boxFour.leftAnchored = "right";
    boxFive.selector = "#contentFive";
    boxFive.width = 421;
    boxFive.height = 605;
    boxFive.top = 7;
    boxFive.left = 278;
    boxFive.startTop = 7;
    boxFive.startLeft = 299;
    boxFive.bugLeft = 0;
    boxFive.bugTop = 0;
    boxFive.moveBug = false;
    boxStart.selector = "#contentHome";
    boxStart.width = 263;
    boxStart.height = 263;
    boxStart.top = 159;
    boxStart.left = 455;
    boxStart.startTop = 159;
    boxStart.startLeft = 528;
    boxStart.bugTop = 229;
    boxStart.bugLeft = 528;
}
function smallWorkBox() {
    boxOne.width = 281;
    boxOne.height = 491;
}
function smallPeopleBox() {
    boxTwo.width = 272;
    boxTwo.height = 456;
}
function onAnimateEnd() {
    var a = 1;
}
resetBoxes();

function menu(position) {
    if (anim) {
        return false;
    }
    if (loadingHome && position != 0) { return false }

    $("#tm-zero, #tm-one, #tm-two, #tm-three, #tm-four, #tm-five").removeClass("active");
    $(".intro-tag").hide();
    
    if (homeBugState == 1) {
        hideHome();
    }
    else if (homeBugState == 2) {
        homeFlipBack(true);
    }
    curPos = position;
    switch (position) {
        case 1:
            $("#tm-one").addClass("active");
            powerMove(boxOne);
            return false;
        case 2:
            $("#tm-two").addClass("active");
            powerMove(boxTwo);
            return false;
        case 3:
            $("#tm-three").addClass("active");
            powerMove(boxThree);
            return false;
        case 4:
            $("#tm-four").addClass("active");
            powerMove(boxFour);
            return false;
        case 0:
            $("#tm-zero").addClass("active");
            var curWidth = getWidth();
            curWidth = parseInt(((curWidth / 2) - 52).toString());
            boxStart.bugLeft = curWidth;
            boxStart.left = (curWidth - 79);
            $("#menu-bug-big").css("left", (curWidth - 105) + "px");
            powerMove(boxStart);
            return false;
    }
}

function powerMove(box) {
    anim = true;
    newBox = box;
    if (curBoxObj.leftAnchored == "left") {
        $(curBoxObj.selector).animate({ "left": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, continueMoving);
    }
    else {
        $(curBoxObj.selector).animate({ "right": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, continueMoving);
    }
}

function continueMoving() {
    $(curBoxObj.selector).hide();
    if (!keepContent) {
        onAnimateEnd = function () { };
        getContent(newBox.selector);
    }

    if (curBoxObj.anchored != newBox.anchored) {
        var curHeight = getHeight();
        if (newBox.anchored == "bottom") {
            $("#menu-box, #menu-bug").css("top", "auto").css("bottom", (curHeight - 105 - curBoxObj.bugTop) + "px");
        }
        else {
            $("#menu-box, #menu-bug").css("bottom", "auto").css("top", (curHeight - 105 - curBoxObj.bugTop) + "px");
        }
    }
    if (curBoxObj.leftAnchored != newBox.leftAnchored) {
        var curWidth = getWidth();
        if (newBox.leftAnchored == "right") {
            $("#menu-box, #menu-bug").css("left", "auto").css("right", (curWidth - 105 - curBoxObj.bugLeft) + "px");
        }
        else {
            $("#menu-box, #menu-bug").css("right", "auto").css("left", (curWidth - 105 - curBoxObj.bugLeft) + "px");
        }
    }
    if (newBox.leftAnchored == "left") {
        $(newBox.selector).css("left", newBox.startLeft + "px");
    }
    else {
        $(newBox.selector).css("right", newBox.startLeft + "px");
    }
    switch (newBox.anchored) {
        case "bottom":
            $(newBox.selector).css("botttom", newBox.startTop + "px");
            if (newBox.leftAnchored == "left") {
                $("#menu-bug").animate({ "left": newBox.bugLeft + "px", "bottom": newBox.bugTop + 'px' }, 500);
                $("#menu-box").animate({ "left": newBox.bugLeft + "px", "bottom": newBox.bugTop + 'px' }, 500, showBox);
            }
            else {
                $("#menu-bug").animate({ "right": newBox.bugLeft + "px", "bottom": newBox.bugTop + 'px' }, 500);
                $("#menu-box").animate({ "right": newBox.bugLeft + "px", "bottom": newBox.bugTop + 'px' }, 500, showBox);
            }
            break;
        case "top":
            $(newBox.selector).css("top", newBox.startTop + "px");
            if (newBox.leftAnchored == "left") {
                $("#menu-bug").animate({ "left": newBox.bugLeft + "px", "top": newBox.bugTop + 'px' }, 500);
                $("#menu-box").animate({ "left": newBox.bugLeft + "px", "top": newBox.bugTop + 'px' }, 500, showBox);
            }
            else {
                $("#menu-bug").animate({ "right": newBox.bugLeft + "px", "top": newBox.bugTop + 'px' }, 500);
                $("#menu-box").animate({ "right": newBox.bugLeft + "px", "top": newBox.bugTop + 'px' }, 500, showBox);
            }
            break;
    }
}

function showBox() {
    if (filesLoaded && contentLoaded) {
        setMessage("Assets loaded. Showing content!<br />");
        curBoxObj = newBox;
        animateBox(false);
        $(curBoxObj.selector).css("width", "0px").css("height", "0px");
        $(curBoxObj.selector).show();
        if (!keepBackground) {
            $("#bgimg").fadeOut(0, function () {
                $("#bgimg").attr("src", $("#bg-load").attr("src"));
                var FullscreenrOptions = { width: bgImg.width, height: bgImg.height, bgID: '#bgimg' };
                jQuery.fn.fullscreenr(FullscreenrOptions);
            });
            $("#bgimg").fadeIn(300);
        }

        if (curBoxObj.leftAnchored == "left") {
            setMessage("Animating box.<br />");
            $(curBoxObj.selector).animate({ "left": curBoxObj.left + "px", "width": curBoxObj.width + "px", "height": curBoxObj.height + "px" }, function () {
                var a = 1;
                anim = false;
                setMessage("Box animation finished.<br />");
                onAnimateEnd();
            });
        }
        else {
            setMessage("Animating box.<br />");
            $(curBoxObj.selector).animate({ "right": curBoxObj.left + "px", "width": curBoxObj.width + "px", "height": curBoxObj.height + "px" }, function () {
                var a = 1;
                anim = false;
                setMessage("Box animation finished.<br />");
                onAnimateEnd();
            });
        }
        anim = false;
        keepContent = false;
        keepBackground = false;
        setMessage("All content should be visible now.<br />");
    }
    else {
        setMessage("Assets not loaded... trying again<br />");
        setTimeout("showBox()", 200);
    }
}

function getContent(forBox) {
    if (forBox == "#contentOne") {
        loadContent('/work/?blank=yes', forBox);
    }
    if (forBox == "#contentTwo") {
        loadContent('/people/?blank=yes', forBox);
    }
    if (forBox == "#contentThree") {
        loadContent('/home/about/?blank=yes', forBox);
    }
    if (forBox == "#contentFour") {
        loadContent('/feed/?blank=yes', forBox);
    }
    if (forBox == "#contentFive") {
        loadContent('/home/contact/?blank=yes', forBox);
    }
    if (forBox == "#contentHome") {
        loadContent('/home/?blank=yes', forBox);
    }
}
function loadContent(url, forSelector) {
    startMessage("Loading content: " + url + "<br />");
    filesLoaded = false;
    contentLoaded = false;
    keepBackground = false;
    animateBoxState = 1;
    animateBox(true);
    $.ajax({
        async: true,
        url: url,
        dataFilter: function (data, type) {
            return data;
        },
        success: function (data) {
            setMessage("AJAX request sucessful<br />");
            $(forSelector + ' .content-shell').html(data);
            if ($(".hidden-title").length > 0) {
                document.title = $(".hidden-title").html();
            }
            contentLoaded = true;
            //check for new backgrounds
            if (!keepBackground) {
                setMessage("Waiting for BG image to fully load.<br />");
                $("#bg-load").unbind();
                $("#bg-load").bind('load', function (e) {
                    setMessage("BG image fully loaded. Ready to show content.<br />");
                    filesLoaded = true;
                    animateBackground = false;
                });
                bgImg.setFile(bgImg.file);
            }
            else {
                setMessage("No new BG image... ready to show content.<br />");
                filesLoaded = true;
                animateBackground = true;
                resetAnimateBgs();
            }

            _gaq.push(['_trackPageview', url]);
        },
        error: function(request, status, error) {
            setMessage("AJAX request error: " + status + "<br />");
        }
    });
}

function animateBox(start) {
    if (homeBugState != 0) {
        return;
    }
    if (start) {
        $("#menu-bug").hide();
        $(".preloader").show();
    }
    else {
        $("#menu-bug").show();
        $(".preloader").hide();
    }
}

function showWorkLanding() {
    $(curBoxObj.selector).animate({ "left": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, function () {
        resetBoxes();
        menu(1);
    });
    return false;
}

function showWorkSub(ID) {
    $(curBoxObj.selector).animate({ "left": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, function () {
        smallWorkBox();
        loadContent('/work/' + ID + '/?blank=yes', "#contentOne");
        keepContent = true;
        menu(1);
    });
    return false;
}
function showPeopleLanding() {
    $(curBoxObj.selector).animate({ "left": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, function () {
        resetBoxes();
        menu(2);
    });
    return false;
}
function showPeopleSub(ID) {
    $(curBoxObj.selector).animate({ "left": curBoxObj.startLeft + "px", "width": "0px", "height": "0px" }, function () {
        smallPeopleBox();
        loadContent('/people/' + ID + '/?blank=yes', "#contentTwo");
        keepContent = true;
        menu(2);
    });
    return false;
}
function showContact() {
    keepBackground = true;
    getContent(boxFive.selector);
    animateBox(false);
    $(boxFive.selector).css("width", "0px").css("height", "0px");
    $(boxFive.selector).show();
    $(boxFive.selector).animate({ "left": boxFive.left + "px", "width": boxFive.width + "px", "height": boxFive.height + "px" });
    return false;
}
function hideContact() {
    $(boxFive.selector).animate({ "left": boxFive.startLeft + "px", "width": "0px", "height": "0px" }, function () {
        $(boxFive.selector).hide();
    });
    return false;
}
function showHome() {
    if (anim == true) { return false };

    anim = true;
    curPos = 0;
    onAnimateEnd = function () { var a = 1; };
    $("#menu-box .text").hide();
    $("#menu-box .sharp").show();
    $(".menu-box").animate({ "width": "154px", "height": "154px" }, function () {
        $("#menu-box .text-full").show();
        anim = false;
    });
    $("#menu-bug").hide();
    $("#menu-bug-big").show();
    homeBugState = 1;
    keepContent = false;
    loadingHome = false;
    return false;
}
function hideHome() {
    anim = true;
    $("#menu-box .text-full").hide();
    $(".menu-box").animate({ "width": "51px", "height": "51px" }, function () {
        $("#menu-box .text").show();
        anim = false;
    });
    $("#menu-bug").show();
    $("#menu-bug-big").hide();
    homeBugState = 0;
    return false;
}
function homeFlipAlt() {
    anim = true;
    curPos = 0;
    onAnimateEnd = function () { var a = 1; };
    homeBugState = 2;
    $("#menu-box .text").hide();
    $("#menu-box .sharp").show();
    $("#menu-bug").hide();
    $("#menu-bug-big").show();
    $("#menu-one").animate({ "width": "154px", "height": "154px" });
    $("#menu-two").animate({ "width": "154px", "height": "154px" });
    $("#menu-three").animate({ "width": "154px", "height": "154px" });
    $("#menu-four").animate({ "width": "154px", "height": "154px" }, function () {
        $("#menu-box .text-full").show();
        $(".home-dot").css("top", "87px").css("left", "97px").css("width", "76px").css("height", "76px");
        $("#menu-box .text-full").hide();
        if (!$.browser.msie) {
            $("#menu-one").animate({ "right": "238px", "bottom": "143px", "rotate": "-45deg" }, 'fast', function () {
                $("#menu-two").animate({ "left": "199px", "bottom": "193px", "rotate": "21deg" }, 'fast', function () {
                    $("#menu-three").animate({ "top": "150px", "right": "118px", "rotate": "58deg" }, 'fast', function () {
                        $("#menu-four").animate({ "left": "275px", "top": "224px", "rotate": "-21deg" }, 'fast', homeFlipAltContinue);
                    });
                });
            });
        }
        else {
            $("#menu-one").animate({ "right": "238px", "bottom": "143px" }, 'fast', function () {
                $("#menu-two").animate({ "left": "199px", "bottom": "193px" }, 'fast', function () {
                    $("#menu-three").animate({ "top": "150px", "right": "118px" }, 'fast', function () {
                        $("#menu-four").animate({ "left": "275px", "top": "224px" }, 'fast', homeFlipAltContinue);
                    });
                });
            });
        }
    });
    return false;
}
function homeFlipAltContinue() {
    $("#menu-box .blurred").show();
    $(".menu-box").css("background-color", "transparent");
    $("#menu-bug-big").hide();
    $("#contentHome .home-dot").show().animate({ "width": "263px", "height": "263px", "top": "0px", "left": "0px" }, function () {
        $("#contentHome .one").show();
        $("#contentHome .home-dot").fadeOut();
        anim = false;
    });
}
function homeFlipOne() {
    $("#contentHome .one").hide();
    anim = true;
    homeBugState = 2;
    $(".home-dot").css("top", "87px").css("left", "97px").css("width", "76px").css("height", "76px");
    $("#menu-box .text-full").hide();
    $("#menu-bug-big").hide();
    $("#contentHome .home-dot").show().animate({ "width": "263px", "height": "263px", "top": "0px", "left": "0px" });
    if (!$.browser.msie) {
        $("#menu-one").animate({ "right": "238px", "bottom": "143px", "rotate": "-45deg" }, 'slow');
        $("#menu-two").animate({ "left": "199px", "bottom": "193px", "rotate": "21deg" }, 'slow');
        $("#menu-three").animate({ "top": "150px", "right": "118px", "rotate": "58deg" }, 'slow');
        $("#menu-four").animate({ "left": "275px", "top": "224px", "rotate": "-21deg" }, 'slow', function () {
            $("#menu-box .blurred").show();
            $("#contentHome .home-dot").fadeOut();
            $("#contentHome .one").fadeIn();
            $(".menu-box").css("background-color", "transparent");
            anim = false;
        });
    }
    else {
        $("#menu-one").animate({ "right": "238px", "bottom": "143px" }, 'slow');
        $("#menu-two").animate({ "left": "199px", "bottom": "193px" }, 'slow');
        $("#menu-three").animate({ "top": "150px", "right": "118px" }, 'slow');
        $("#menu-four").animate({ "left": "275px", "top": "224px" }, 'slow', function () {
            $("#menu-box .blurred").show();
            $("#contentHome .home-dot").fadeOut();
            $("#contentHome .one").fadeIn();
            $(".menu-box").css("background-color", "transparent");
            anim = false;
        });
    }
    return false;
}
function homeFlipTwo() {
    anim = true;
    $("#contentHome .one").hide();
    $("#contentHome .two").show();
    anim = false;
    return false;
}
function homeFlipBack(doHideHome) {
    anim = true;
    homeBugState = 1;
    $("#contentHome .one").hide();
    $("#contentHome .two").hide();
    $("#contentHome .home-dot").show();
    $("#menu-box .blurred").hide();
    $("#menu-one").css("background-color", "#dbdbdb");
    $("#menu-two").css("background-color", "#616161");
    $("#menu-three").css("background-color", "#8d8c8c");
    $("#menu-four").css("background-color", "#eeeeee");
    $("#contentHome .home-dot").animate({ "width": "70px", "height": "70px", "top": "87px", "left": "95px" });
    if ($.browser.msie) {
        $("#menu-one").animate({ "right": "53px", "bottom": "54px" }, 'slow');
        $("#menu-two").animate({ "left": "56px", "bottom": "54px" }, 'slow');
        $("#menu-three").animate({ "top": "57px", "right": "53px" }, 'slow');
        $("#menu-four").animate({ "left": "56px", "top": "57px" }, 'slow', function () {
            $("#contentHome .home-dot").hide();
            $("#menu-bug-big").show();
            $("#menu-box .text-full").fadeIn();
            anim = false;
            if (doHideHome == true) {
                hideHome();
            }
        });
    }
    else {
        $("#menu-one").animate({ "right": "53px", "bottom": "54px",  "rotate": "0deg" }, 'slow');
        $("#menu-two").animate({ "left": "56px", "bottom": "54px", "rotate": "0deg" }, 'slow');
        $("#menu-three").animate({ "top": "57px", "right": "53px", "rotate": "0deg" }, 'slow');
        $("#menu-four").animate({ "left": "56px", "top": "57px", "rotate": "0deg" }, 'slow', function () {
            $("#menu-bug-big").show();
            $("#menu-box .text-full").fadeIn();
            anim = false;
            if (doHideHome == true) {
                hideHome();
            }
        });
    }
    return false;
}

var curBG = 0;
var maxBG = 13;
function animateBgs() {
    if (animateBackground) {
        $("#bg-load").unbind();
        var browser = "";
            if ($.browser.mozilla) {
                browser = 0;
            } else {
                browser = "slow";
            }
        curBG += 1;
        if (curBG > maxBG) { curBG = 0 };
        $("#bg-load").bind('load', function (e) {
            $("#bgimg").fadeOut(browser, function () {
                $("#bgimg").attr("src", "/images/bgs/" + curBG + ".jpg");
                $("#bgimg").show();
            });
        });
        $("#bg-load").attr("src", "/images/bgs/" + curBG + ".jpg");
    }
}
function resetAnimateBgs() {
    $("#bg-load").bind('load', function (e) {
        $("#bgimg").fadeOut('slow', function () {
            $("#bgimg").attr("src", "/images/bgs/" + curBG + ".jpg");
            if (bgImg.width != 1200 || bgImg.height != 800) {
                bgImg.width = 1200;
                bgImg.height = 800;
                var FullscreenrOptions = { width: bgImg.width, height: bgImg.height, bgID: '#bgimg' };
                jQuery.fn.fullscreenr(FullscreenrOptions);
            }
            $("#bgimg").show();
        });
        $("#bg-load").unbind();
    });
    $("#bg-load").attr("src", "/images/bgs/" + curBG + ".jpg");
}

$(window).resize(reCenter);

function reCenter() {
    if (curPos == 0) {
        var curWidth = getWidth();
        curWidth = parseInt(((curWidth / 2) - 52).toString());
        boxStart.bugLeft = curWidth;
        boxStart.left = (curWidth - 79);
        $("#contentHome").css("left", boxStart.left + "px");
        $("#menu-bug").css("left", curWidth + "px");
        $("#menu-box").css("left", curWidth + "px");
        $("#menu-bug-big").css("left", (curWidth - 105) + "px");
    }
    setSmallScreen();
}

function setMessage(msg) {
    $("#lblMessages").html($("#lblMessages").html() + msg);
}
function startMessage(msg) {
    $("#lblMessages").html(msg);
}
$("document").ready(function () {
    $("#tm-zero, #tm-one, #tm-two, #tm-three, #tm-four").fadeTo('fast', 0.8);

    $.ajaxSetup({
        dataType: 'html'
    });
    reCenter();
    menu(curPos);
    if (curPos == 0) {
        $(".intro-tag").show();
    }
    var FullscreenrOptions = { width: bgImg.width, height: bgImg.height, bgID: '#bgimg' };
    jQuery.fn.fullscreenr(FullscreenrOptions);
    var FullscreenrOptions = { width: bgImg.width, height: bgImg.height, bgID: '#bg-load' };
    jQuery.fn.fullscreenr(FullscreenrOptions);
});
window.setInterval("animateBgs()", 7000);