pac-man test fale

by Daniel Hall

HTML

<div id="game">
     <h1>PACMAN</h1>
 <small>Sprites &copy; Super Goomba-Rio</small>

    <div id="field">
        <table class="scoreboard" id="scoreboard">
          <tr><td class="title">SCORE:</td><td class="title">Lifes</td></tr>
          <tr><td id="txtScore" align="right">0</td><td id="txtLives" align="center">3</td></tr>
        </table>
        <div id="player" class="sprite gc pacman"></div>
    </div>
</div>

CSS

html {
        font-family:'Verdana';
        font-size: 1em;
    }
    body {
        background: #000000;
        overflow: hidden;
        margin: 0;
        padding: 0;
    }
    h1 {
        line-height: 1em;
        font-size: 3em;
        padding: 0;
        margin: 0;
        text-align: center;
        color: yellow;
        text-decoration: none;
    }
    small {
        color: #777777;
        font-style: italic;
        text-align: center;
        display: block;
        margin: 0;
        padding: 0;
    }
    #game {
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }
    #console {
        color: #ffffff;
    }
    .sprite {
        background-image: url('http://i50.tinypic.com/16c2nux.png');
        width: 16px;
        height: 16px;
    }
    .gc {
        position: absolute;
        display: inline-block;
        /*background-color: #000000;*/
        margin: 0;
        padding: 0;
        /*border: solid #cfcfcf 1px;*/
    }
    .console {
        color: #ffffff;
    }
    .blank {
        background: #000000;
    }
    .port {
        background: #000000;
        z-index: 4;
    }
    .border-vertical {
        background-position: -1px -18px;
    }
    .corner-left-top {
        background-position: -1px -1px;
    }
    .border-horizontal {
        background-position: -19px -1px;
    }
    .corner-right-top {
        background-position: -221px -1px;
    }
    .corner-right-bottom {
        background-position: -41px -153px;
    }
    .corner-left-bottom {
        background-position: -1px -245px;
    }
    .double-down {
        background-position: -111px -1px;
    }
    .left-out {
        background-position: -63px -80px;
    }
    .right-out {
        background-position: -159px -80px;
    }
    .double-right {
        background-position: -1px -200px;
    }
    .double-left {
        background-position: -221px -200px;
    }
    .left-top {
        background-position: -21px -23px;
   ...

JavaScript

var ghostInterval, gameInterval;

var pacman = (function () {
    var names = ['inky', 'pinky', 'clyde', 'blinky'];
    var directions = Object.freeze({
        PAUZED: {
            type: 'stopped',
            sprite: 'pauzed',
            x: 0,
            y: 0
        },
        LEFT: {
            type: 'horizontal',
            sprite: 'left',
            x: -1,
            y: 0
        },
        UP: {
            type: 'vertical',
            sprite: 'top',
            x: 0,
            y: -1
        },
        RIGHT: {
            type: 'horizontal',
            sprite: 'right',
            x: 1,
            y: 0
        },
        DOWN: {
            type: 'vertical',
            sprite: 'down',
            x: 0,
            y: 1
        }
    });
    var mapObjects = {
        ' ': 'blank',
            'a': 'corner-left-top',
            'b': 'corner-right-top',
            'c': 'corner-right-bottom',
            'd': 'corner-left-bottom',
            '=': 'border-horizontal',
            '|': 'border-vertical',
            't': 'double-down',
            '>': 'left-out',
            '<': 'right-out',
            '+': 'double-right',
            '*': 'double-left',
            '1': 'left-top',
            '2': 'right-top',
            '3': 'right-bottom',
            '4': 'left-bottom',
            '8': 'single-down',
            'A': 'single-up',
            '9': 'single-vertical',
            '-': 'single-horizontal',
            '_': 'ghost-gate',
            '6': 'single-right',
            '7': 'single-left',
            'B': 'left-down',
            'C': 'down-right',
            '.': 'split-up',
            'T': 'split-down',
            '5': 'horizontal',
            'X': 'port',
            'o': 'point',
            '%': 'superball'
    };

    var level1 = [
        'a========t========b',
        '|%ooooooo9ooooooo%|',
        '|o12o152o9o152o12o|',
        '|o43o453oAo453o43o|',
        '|ooooooooooooooooo|',
        '|o67o8 6-T-7o8o67o|',
 ...