function init() {
    var input = $("#inputs").children();

    for (var i=0; i<10; i++) { input.eq(i).val(Math.floor((Math.random()*99)+1)) }
}

function disableButtons(disable) {
    var buttons = $("#buttons").children();

    if (disable == null) {
        buttons.prop("disabled",true);
    } else {
        buttons.removeAttr("disabled");
    }
}

function swap(a,b,swap) {
    var compare = $("#compare");
    var input = $("#inputs").children();
    var a_item = $("#inputs").find("[data-order='"+a+"']");
    var b_item = $("#inputs").find("[data-order='"+b+"']");
    var a_position = a_item.position();
    var b_position = b_item.position();
    var a_destination = "370px";
    var b_destination = "514px";
    var ab_top = "140px";

    for (var i=0; i<10 ;i++) { input.eq(i).attr({
        "readonly":"readonly","tabIndex":"-1"
    }) }

    a_item.css({
        "box-shadow" : "0px 0px 15px #6699FF",
        "border" : "1px solid #6699FF"
    });
    b_item.css({
        "box-shadow" : "0px 0px 15px #FF3333",
        "border" : "1px solid #FF3333"
    });

    function goTo(element,x,y,back) {
        if (!back) {
            element.animate({ top: y }, 150)
            .animate({ left: x }, 350).delay(1000);
        } else {
            element.animate({ left: x }, 350)
            .animate({ top: y }, 150);
        }
    }

    goTo(a_item,a_destination,ab_top);
    goTo(b_item,b_destination,ab_top);

    if ( parseInt(a_item.val()) > parseInt(b_item.val()) ) {
        compare.text(">").delay(500).fadeIn(150);
    } else if ( parseInt(a_item.val()) < parseInt(b_item.val()) ) {
        compare.text("<").delay(500).fadeIn(150);
    } else { compare.text("=").delay(500).fadeIn(150) }

    if (!swap) {
        compare.delay(500).fadeOut(300);
        goTo(a_item,a_position.left,a_position.top,true);
        goTo(b_item,b_position.left,b_position.top,true);
    } else {
        compare.delay(500).fadeOut(300);
        goTo(a_item,b_position.left,b_position.top,true);
        goTo(b_item,a_position.left,a_position.top,true);
        a_item.attr("data-order",b);
        b_item.attr("data-order",a);
    }

    setTimeout(function() { a_item.css({
        "box-shadow" : "0px 0px 15px #fff",
        "border" : "1px solid #fff" });
    },2700);
    setTimeout(function() { b_item.css({
        "box-shadow" : "0px 0px 15px #fff",
        "border" : "1px solid #fff" });
    },2700);
}

$(document).ready(function() {
    init();

    $("#random").click(function() {
        var input = $("#inputs").children();

        for (var i=0; i<10; i++) { input.eq(i).val(Math.floor((Math.random()*99)+1)) }
    });

    $("#desc").click(function() {
        var input = $("#inputs").children();
        var values = new Array();

        for (var i=0; i<10; i++) { values[i] = Math.floor((Math.random()*99)+1) }
        values.sort(function(a,b){ return b - a });
        for (var i=0; i<10; i++) { input.eq(i).val(values[i]) }
    });

    $("#nearly_sorted").click(function() {
        var input = $("#inputs").children();
        var values = new Array();
        var unsorted_items = 3;

        for (var i=0; i<10; i++) { values[i] = Math.floor((Math.random()*99)+1) }

        values.sort(function(a,b){ return a - b });
        for (var i=0; i<unsorted_items; i++) {
            values[Math.floor((Math.random()*10)+1)] = Math.floor((Math.random()*99)+1);
        }

        for (var i=0; i<10; i++) { input.eq(i).val(values[i]) }
    });

    $("#start_button").click(function() {
        var animation_length = 3000;
        var input = $("#inputs").children();

        $("#animation_box").animate({"height":260},1000);
        input.attr("readonly","true");
        disableButtons();

        var n = 10;
        setTimeout(function(){doIt()},1000);
        function doIt() {
            var i = 0;
            function swaps() {
                var a_item = $("#inputs").find("[data-order='"+i+"']");
                var b_item = $("#inputs").find("[data-order='"+(i+1)+"']");

                if ( parseInt(a_item.val()) > parseInt(b_item.val()) ) {
                    swap(i,i+1,true); } else { swap(i,i+1); }

                i++;

                if (i<=(n-2)) { setTimeout( function() {swaps()}, animation_length) }

            } swaps();



            if (n>2) { setTimeout(function(){n--; doIt();},animation_length*(n-1)) }
            else {
                setTimeout(function() {
                    $("#animation_box").animate({"height":110},1000,
                        function() {
                            disableButtons(false);
                            input.removeAttr("readonly");
                        });
                },animation_length);
            }
        };
    });


$("#inputs").children().bind("keypress",function() {
    if (this.value.length > 1) return false;
});


});