$(function () {
    var val = [1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
            prod = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
            mix,
            clicked = 0,
            accept = [
                ['roślinnego']
            ],
            ok = '#3CB639',
            bad = '#F56B6B',
            click = function () {
                var $this = $(this);
                
                if ($this.data('value') === 1) {
                    $this.append('<div class="mark"></div>');
                    $('#jplayer_well').jPlayer('setMedia', {mp3: './media/brawo.mp3'}).jPlayer('play');
                    clicked++;
                    if (clicked === 7) {
                        $('.prod').unbind('click');
                        $('#i1').fadeIn(400);
                    }
                } else {
                    $this.append('<div class="mark" style="background:url(styles/images/bad.png)"></div>');
                    $('#jplayer_wrong').jPlayer('play');
                    setTimeout(function () {
                        $this.children().remove();
                    }, 500);
                }
            };

    function shuffleArray(array) {
        for (var i = array.length - 1; i > 0; i--) {
            var j = Math.floor(Math.random() * (i + 1));
            var temp = array[i];
            array[i] = array[j];
            array[j] = temp;
        }
        return array;
    }
    function countFilled() {
        var count = 0;
        for (var i = 1; i <= accept.length; i++) {
            var str = $("#i" + i + '>input').val().toLowerCase().trim();
            if (str !== '') {
                count++;
            }
        }
        return count;
    }
    function countLetters() {
        var count = 0;
        for (var i = 1; i <= accept.length; i++) {
            var str = $("#i" + i + '>input').val().length;
            if (str < 9) {
                count++;
            }
        }
        return count;
    }
    function checkAll(mark) {
        var err = 0;
        for (var i = 1; i <= accept.length; i++) {
            var str = $("#i" + i + '>input').val().toLowerCase().trim();

            if (accept[i - 1].indexOf(str) < 0) {
                err++;
                if (mark) {
                    $("#i" + i + '>input').css('background', bad);
                }
            } else {
                if (mark) {
                    $("#i" + i + '>input').css('background', ok);
                }
            }
        }
        return err;
    }

    mix = shuffleArray(prod);

    for (var i = 1, k = 0; i <= 4; i++) {
        for (var j = 1; j <= 3; j++) {

            var top = 15 + (170 * (j - 1));
            var left = 40 + (220 * (i - 1));

            $('.top_panel').append(
                    '<div id="prod' + mix[k] +
                    '" class="prod" style="background:url(styles/images/prod' + mix[k] +
                    '.png);top:' + top +
                    'px;left:' + left +
                    'px" data-value="' + val[mix[k]] +
                    '"></div>'
                    );
            k++;
        }
    }



    $('.prod').click(click);





    $("input").each(function () {
        var readOnly = $(this)[0].readOnly;
        if (!readOnly)
            $(this).val('');
    });

    $(".letterinput").keyup(function () {
        if (countFilled() === accept.length && countLetters() === 0) {
            if (checkAll(false) !== 0) {
                checkAll(true);
            } else {
                $("input").css('background', ok);
                $('#jplayer_well').jPlayer('setMedia', {mp3: '../../media/well.mp3'}).jPlayer('play');
            }
        }
    });
});