/*********************************************************************************\

            TAB MARKER POSITIONING AND MORPHING

/*********************************************************************************/

//Global Current Position (Y position for tab marker)
var currentTabMarkerYPosition = 11;

function BindTabButtonsToSlideMarker(elementsToBind, markerYPositions, markerID) {

    var marker = jQuery("#" + markerID);

    //For mouse events, bind morphing to buttons, so that marker will be displayed in correct position.
    for (i = 0; i < elementsToBind.length; i++) {

        var button = jQuery('#btn' + elementsToBind[i]);
        var newPosition = markerYPositions[i] - 0;

        BindEventsToTabButton(button, newPosition, marker);        
    }
}

function BindEventsToTabButton(button, newPosition, marker) {

    button.mouseenter(function() {
        marker.animate({
            top: newPosition
        }, 1500);
    });
    
    button.mouseleave(function() {
        marker.animate({
            top: currentTabMarkerYPosition
        }, 1500);
    });    
    
    button.mouseleave(function() {
        currentTabMarkerYPosition = newPosition;
    });
}



/*********************************************************************************\

                 NAVIGATION POSITIONING AND MORPHING

/*********************************************************************************/

//Global Current Position (Y position for tab marker)
var currentNavMarkerXPosition = 483;
var currentNavMarkerWidth = 32;

function BindNavButtonsToSlideMarker(elementsToBind, markerXPositions, markerWidths, markerID) {

    var marker = jQuery("#" + markerID);

    //For mouse events, bind morphing to buttons, so that marker will be displayed in correct position.
    for (i = 0; i < elementsToBind.length; i++) {

        var button = jQuery('#btn' + elementsToBind[i]);
        var newPosition = markerXPositions[i] - 0;
        var newWidth = markerWidths[i] - 0;

        BindEventsToNavButton(button, newPosition, newWidth, marker);
    }
}

function BindEventsToNavButton(button, newPosition, newWidth, marker) {

    button.mouseenter(function() {
        marker.stop().animate({
            left: newPosition,
            width: newWidth
        }, 500);
    });

    button.mouseleave(function() {
        marker.stop().animate({
            left: currentNavMarkerXPosition,
            width: currentNavMarkerWidth
        }, 500);
    });

    button.click(function() {
        currentNavMarkerXPosition = newPosition; 
        currentNavMarkerWidth = newWidth;
    });
}

function NavMarkerReset(markerID) {
    
    var marker = jQuery("#" + markerID);
    marker.animate({ left: currentNavMarkerXPosition, width: currentNavMarkerWidth }, 500);
}