var ANIMATION_TIME = 500;
var NUDGE_AMOUNT = 3;
$(function() {

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(doPostBack);

    function doPostBack() {

        if ($(".item").length > 4) {
            $("#scrollbar").slider({
                slide: slideMove
            });
        } else {
            $(".nudge").css({ display: "none" });
        }
        bindClickEvents();
        $(".nudge.left").mousedown(nudgeLeftMouseDown);
        $(".nudge.left").mouseup(nudgeLeftMouseUp);
        $(".nudge.right").mousedown(nudgeRightMouseDown);
        $(".nudge.right").mouseup(nudgeRightMouseUp);
    }
    //doPostBack();
});

function bindClickEvents() {
    $("table.active .move.left").click(moveLeftClick).mouseover(function(){$(this).css('background-position','0px -17px');}).mouseout(function(){$(this).css('background-position','left top');});
    $("table.active .move.right").click(moveRightClick).mouseover(function(){$(this).css('background-position','-29px -17px');}).mouseout(function(){$(this).css('background-position','right top');});
    $("table.active .front").click(moveToFront).mouseover(function(){$(this).css('background-position','0px -17px');}).mouseout(function(){$(this).css('background-position','0px 0px');});
    $("table.active .back").click(moveToBack).mouseover(function(){$(this).css('background-position','0px -17px');}).mouseout(function(){$(this).css('background-position','0px 0px');});
}

function unbindClickEvents() {
    $("table.active .move.left").unbind('click');
    $("table.active .move.right").unbind('click');
    $("table.active .front").unbind('click');
    $("table.active .back").unbind('click');
}

var slideMove = function(e, ui) {
    var scrollPane = $('#dynamic_table');
    var scrollContent = $("[id$='resultsControl_tray']");
    if (scrollContent.width() > scrollPane.width()) { 
        scrollContent.css('margin-left', Math.round(ui.value / 100 * (scrollPane.width() - scrollContent.width())) + 'px');
    }
    else { 
        scrollContent.css('margin-left', 0); 
    }
}
    
var nudgeTimer = null;

var nudgeLeftMouseDown = function() {
    clearInterval(nudgeTimer);
    nudgeLeft();
    nudgeTimer = setInterval(nudgeLeft, 100);
}

var nudgeLeftMouseUp = function() {
    clearInterval(nudgeTimer);
}

var nudgeRightMouseDown = function() {
    clearInterval(nudgeTimer);
    nudgeRight();
    nudgeTimer = setInterval(nudgeRight, 100);
}

var nudgeRightMouseUp = function() {
    clearInterval(nudgeTimer);
}

var nudgeLeft = function(eventObj) {
    if(!isNaN($("#scrollbar").slider("value"))) {
        $("#scrollbar").slider("moveTo", $("#scrollbar").slider("value") - NUDGE_AMOUNT);
    } else {
        $("#scrollbar").slider("moveTo", 100 - NUDGE_AMOUNT);
    }
}

var nudgeRight = function(eventObj) {
    
    if(!isNaN($("#scrollbar").slider("value"))) {
        $("#scrollbar").slider("moveTo", $("#scrollbar").slider("value") + NUDGE_AMOUNT);
    } else {
        $("#scrollbar").slider("moveTo", NUDGE_AMOUNT);
    }
    
    //$(".ui-slider-handle").click();
    //slideMove(eventObj, { value: $("#scrollbar").slider("value") });
}

var moveLeftClick = function(eventObj) {

    var item = $(eventObj.target).mouseout().parents('.item');
    var left = item.prev(":has(.active)");
    if (left.length) {
        unbindClickEvents();
        left.animate({
            left: item.width()
        }
                , ANIMATION_TIME, 'swing');

        item.animate({
            left: "-" + item.width()
        },
        ANIMATION_TIME,
        'swing',
        function() {
            //runs after animation completes
            left.css({ "left": "0" });
            item.css({ "left": "0" });
            left.before(item);
            bindClickEvents();
        });
    }
};

var moveRightClick = function(eventObj) {

    var item = $(eventObj.target).mouseout().parents('.item');
    var right = item.next(":has(.active)");
    if (right.length) {
        unbindClickEvents();
        right.animate({
            left: "-" + item.width()
        }
                , ANIMATION_TIME, 'swing');

        item.animate({
            left: item.width()
        },
        ANIMATION_TIME,
        'swing',
        function() {
            //runs after animation completes
            right.css({ "left": "0" });
            item.css({ "left": "0" });
            right.after(item);
            bindClickEvents();
        });
    }
};

var moveToBack = function(eventObj) {
    var item = $(eventObj.target).mouseout().parents('.item');
    var tray = $("[id$='resultsControl_tray']");
    unbindClickEvents();
    item.nextAll(":has(.active)").animate({
        left: "-" + item.width()
    }, ANIMATION_TIME, 'swing');

    var distanceToMove = item.width() * item.nextAll(":has(.active)").length;

    item.animate({
        left: distanceToMove + "px"
    }, ANIMATION_TIME, 'swing', function() {
        //runs after animation completes
        item.nextAll(":has(.active)").css({ "left": "0" });
        item.css({ "left": "0" });
        item.nextAll(":has(.active)").insertBefore(item);
        bindClickEvents();
    });
};

var moveMouseOver = function(eventObj) {
	$(eventObj.target).css('background-position','0px -17px');
}

var moveMouseOut = function(eventObj) {
	$(eventObj.target).css('background-position','left top');
}

var moveToFront = function(eventObj) {
    var item = $(eventObj.target).mouseout().parents('.item');
    var tray = $("[id$='resultsControl_tray']");

    unbindClickEvents();

    item.prevAll(":has(.active)").animate({
        left: item.width()
    }, ANIMATION_TIME, 'swing');

    var distanceToMove = item.width() * item.prevAll(":has(.active)").length;

    item.animate({
        left: "-" + distanceToMove + "px"
    }, ANIMATION_TIME, 'swing', function() {
        //runs after animation completes
        item.prevAll(":has(.active)").css({ "left": "0" });
        item.css({ "left": "0" });
        tray.prepend(item);
        bindClickEvents();
    });
};