$(function () {
    var task = 1;
    var result = {
        1: [2, "attic", "hall"],
        2: [1, "bathroom", "living room"],
        3: [1, "attic", "hall"],
        4: [1, "bedroom", "bathroom"],
        5: [1, "living room", "bathroom"],
        6: [1, "hall", "garden"],
        7: [2, "kitchen", "garden"],
        8: [1, "kitchen", "dining room"],
        9: [1, "living room", "kitchen"],
        10: [1, "bathroom", "dining room"],
        11: [1, "garden", "hall"],
        12: [2, "attic", "dining room"],
        13: [1, "hall", "living room"]
    };

    $(".element").click(function () {
        var $this = $(this);
        if ($this.data('value') !== result[task][0]) {
            $('#jplayer_wrong').jPlayer('play');
            $this.addClass('bad');
            setTimeout(function () {
                $this.removeClass('bad');
            }, 500);
        } else {
            task++;
            if (task < 14) {
                $this.addClass('ok');
                $("#task-1").fadeTo(500, 0.001);
                setTimeout(function () {
                    $this.removeClass('ok');
                    $("#task-1 .pict").css('background', 'url(styles/images/p' + (task - 1) + '.png)');
                    $("#element-1").text(result[task][1]);
                    $("#element-2").text(result[task][2]);
                    $("#task-1").fadeTo(1500, 1);
                }, 500);
            }
            if (task === 14) {
                $('#jplayer_well').jPlayer('play');
                $this.addClass('ok');
                $("#task-1").fadeTo(500, 0);
            }
        }
    });
    $("#task-1 .pict").css('background', 'url(styles/images/p' + (task - 1) + '.png)');
    $("#element-1").text(result[task][1]);
    $("#element-2").text(result[task][2]);
});