﻿
var speed = 600; // Number: Speed of slide transistion in ms
var queueEffect = false; // Boolean: Add repeat effects to a queue?
var resetOnRollOut = true; // Boolean: Reset the panes to default pane on roll out?
var defaultPane = 0; // Number [0-3]: Pane to show when the page loads (0 to disable)

// Bind events & functions on DOM ready
$(document).ready(function() {
    if ($.browser.msie == true) {
        //Stop IE flicker
        document.execCommand('BackgroundImageCache', false, true);
    }
    $("#svmMenu").bind("mouseleave", function(e) {
        if (resetOnRollOut)
            ShowPane(defaultPane);
    });
    $("#animal").bind("mouseenter", function(e) {
        ShowPane(1);
    });
    $("#public").bind("mouseenter", function(e) {
        ShowPane(2);
    });
    $("#environmental").bind("mouseenter", function(e) {
        ShowPane(3);
    });

    // Handle anchors clicks
    $("a").bind("click", function(e) {
        if (this.href.indexOf("#") >= 0)
            ShowPane(this.href.substring(this.href.indexOf("#") + 1), 1);
    });
    if (this.location.hash.length > 0)
        ShowPane(this.location.hash.substring(1));
    else
        ShowPane(defaultPane);

    // Handle keypress events
    $(this).keypress(function(e) {
        switch (e.which) {
            case 49: ShowPane(1); break;
            case 50: ShowPane(2); break;
            case 51: ShowPane(3); break;
            default: break;
        }
    });
});

// Show/hide panes
function ShowPane(which) {
    if (which == 0) {
        $("#public").animate({ left: "220px" }, { queue: queueEffect, duration: speed });
        $("#environmental").animate({ left: "440px" }, { queue: queueEffect, duration: speed });
    }
    else if (which == 1) {
        $("#public").animate({ left: "440px" }, { queue: queueEffect, duration: speed });
        $("#environmental").animate({ left: "550px" }, { queue: queueEffect, duration: speed });
    }
    else if (which == 2) {
        $("#public").animate({ left: "110px" }, { queue: queueEffect, duration: speed });
        $("#environmental").animate({ left: "550px" }, { queue: queueEffect, duration: speed });
    }
    else if (which == 3) {
        $("#public").animate({ left: "110px" }, { queue: queueEffect, duration: speed });
        $("#environmental").animate({ left: "220px" }, { queue: queueEffect, duration: speed });
    }
    else
        return;
}