
$(function () {

    var data = [
        ['kasz-arm', 2, 'sprite ', 0],
        ['kasz-flo3', 1, 'sprite ', 1],
        ['flo1-cs', 1, '', 7],
        ['kasz-kie2', 2, 'sprite ', 5],
        ['kasz-kie', 2, 'sprite ', 6],
        ['kasz-arm3', 4, 'sprite ', 8],
        ['kasz-flo', 2, 'sprite ', 1],
        ['kasz-flo2', 2, 'sprite ', 7],
        ['kasz-leaf2', 2, 'sprite ', 4],
        ['kasz-hea', 2, 'sprite ', 2],
        ['kasz-hea2', 2, 'sprite ', 5],
        ['kasz-leaf', 2, 'sprite ', 4],
        ['kasz-leaf5', 12, 'sprite ', 4],
        ['kasz-leaf3', 4, 'sprite ', 5],
        ['kasz-leaf4', 2, 'sprite ', 7],
        ['cir-cs', 6, '', 3],
        ['cir-flo-cs', 2, '', 7],
        ['cir-cent-cs', 1, '', 7],
        ['cir2-cs', 3, '', 7]
    ],
            cursor = 1,
            count = 0;



//generowanie
    for (var i = 0; i < data.length; i++) {
        var pices = data[i][1];
        for (var y = 0; y < pices; y++) {
            var type = data[i][0];
            var sprite = data[i][2];
            var value = data[i][3];
            $('.elements').append('<div id="' + type + y + '" data-value="' + value + '" class="cli ' + sprite + type + ' w"></div>');
        }
    }
    
    $('.flo1-cs').append('<div id="flo2-cs1" data-value="7" class="flo2-cs w"></div>');

    $('.cli').click(function () {

        if ($(this).data('value') === cursor) {
            $(this).removeClass('w');
            $(this).unbind('click');
            count++;
            if (count === 49) {//49
                $('#jplayer_well').jPlayer('play');
                $('#f8').animate({top:300,left:765},1000);
                $('#f4').animate({top:230,left:765},1000);
                $('#f3').animate({top:160,left:765},1000);
                $('#f5').animate({top:90,left:765},1000);
                $('#f6').animate({top:20,left:765},1000);
                $('#f7').animate({top:-50,left:765},1000);
                $('#f2').animate({top:370,left:765},1000);
                $('.farby').animate({top:110,left:-622},1000);
                $('.mask2').fadeIn();
                $('.farba span').fadeIn();
            }
        } else {
            $('#jplayer_wrong').jPlayer('play');
        }
    });

    $('.farba').click(function () {
        cursor = $(this).data('value');
        $('main *').css({cursor: 'url(./styles/cursors/cursor' + cursor + '.cur) 0 0, default'});
    });

    $('.getmodel').click(function () {
        $('.model').animate({top: 0}, 500);
        $('.mask').fadeIn();
    });

    $('.hide').click(function () {
        $('.model').animate({top: -210}, 500);
                $('.mask').fadeOut(300);
    });
    $('.farby').animate({left:-12},500);
    $('.model').animate({top: 0}, 500).animate({top: -210}, 2000);
});
