HTML
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>You Are The Ghost</title>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<style type='text/css'>
#canvas {
background:#ABABAB;
margin:0;padding:0;
}
</style>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
var canvas, context, board, imageObj, tiles, board, display;
var NUM_OF_TILES = 4;
// viewport
var vX = 0,
vY = 0,
vWidth = 19,
vHeight = 19;
var playerX = 9,
playerY = 12;
var bluemode=false;
var bluetime=0;
var imagePlayer = new Image();
imagePlayer.src = "http://dl.dropbox.com/u/47083737/ludumdare/images/mobs/ghost.png";
var imagePlayerBlue = new Image();
imagePlayerBlue.src = "http://dl.dropbox.com/u/47083737/ludumdare/images/mobs/blueghost.png";
var open=true;
var opennum =0;
var pacX = 9,
pacY = 14;
var imageOpen = new Image();
imageOpen.src = "http://dl.dropbox.com/u/47083737/ludumdare/images/mobs/open.png";
var imageClose = new Image();
imageClose.src = "http://dl.dropbox.com/u/47083737/ludumdare/images/mobs/close.png";
var direction="left";
var directnum=0;
var worldWidth = 19,
worldHeight = 19;
//world array
var worldarray=new Array();
var arraycount=0;
var blocktype=0;
function loadMap(map) {
if (map == 1) {
return [
[0,0,0,0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 2, 3, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 3, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 2,...