memory card game

memory.js

$().ready(function() {

    var images = [
        'gingrich',
        'huntsman',
        'obama',
        'paul',
        'romney',
        'santorum'
    ];

    var shuffle = function(deck) {
        var tmp, current, top = deck.length;
        if(top) while(--top) {
            current = Math.floor(Math.random() * (top + 1));
            tmp = deck[current];
            deck[current] = deck[top];
            deck[top] = tmp;
        }
        return deck;
    };

    var createCard = function(v) {
        var $cardimg = $('<img>').attr('src', 'http://assets.sunlightfoundation.com/projects/superpacs_matchgame/' + v + '.png');
        var $card = $('<div>')
            .attr('class', 'card')
            .append(
                $('<div>').attr('class', 'face').append($cardimg)
            )
            .append(
                $('<div>').attr('class', 'back')
            );
        return $card;
    };

    var cards1 = [];
    var cards2 = [];
    var flipped = [];
    var score = 0;

    $.each(images, function(index, item) {
        var cardPair = [createCard(item), createCard(item + '_alt')];
        cardPair[0].attr('id', 'card' + index + 'a').data('pair', 'card' + index + 'b');
        cardPair[1].attr('id', 'card' + index + 'b').data('pair', 'card' + index + 'a');
        cards1.push(cardPair[0]);
        cards2.push(cardPair[1]);
    });

    cards = shuffle(cards1);
    $.each(cards1, function(index, item) {
        $('#deck1').append(item);
    });
    $.each(cards2, function(index, item) {
        $('#deck2').append(item);
    });

    var flipCard = function($card) {
        var $cardimg = $card.find('image');

        $card.addClass('flip');
        setTimeout(function() {
            $cardimg.data('visible', true).show();
        }, 250);

        flipped.push($card);
    };

    var unflipCards = function() {
        var $cards = $('.card.flip');
        $cards.find('image').data('visible', false).hide();
        $cards.removeClass('flip');
        var unflipped = [flipped[0], flipped[1]];
        flipped = [];
        return unflipped;
    };

    // Post-win message
    var triggerWin = function() {
        $('.hh')
            .show()
            .html('<p><a href="/superpacs/sleuth/"><img src="http://assets.sunlightfoundation.com/files/Match%20the%20superPAC/match-map.png" width="513" height="379" /></a></p><p>It’s not just a game. Super PACs are actively registering across the country, lying in wait for the election to pick up speed. To learn more about the super PACs near you and what you can do to help shed some light on the upcoming 2012 election, <a href="http://sunlightfoundation.com/superpacs/sleuth/">click here</a>.</p>');
        $('#deck1').slideUp();
        $('#deck2').slideUp();
    };

    $('.card').bind('click', function(ev) {

        ev.preventDefault();

        var $card = $(this);

        if ($card.hasClass('flip')) return;

        if (flipped.length > 1) {

            return;

        } else if (flipped.length == 1) {

            flipCard($card);

            if ($card.data('pair') == flipped[0].attr('id')) {

                setTimeout(function() {

                    var unflipped = unflipCards();
                    unflipped[0].css('visibility', 'hidden');
                    unflipped[1].css('visibility', 'hidden');
                    delete unflipped;

                    if (score >= 6) {
                        setTimeout(triggerWin, 500);
                    }

                }, 2000);

                score += 1;

            } else {

                setTimeout(function() {
                    unflipCards();
                }, 2000);

            }

        } else {

            flipCard($card);

        }

    });

});