/* Variables */
var canvas;
var context;

var player_direction;
var x;
var y;
var colour;
var nick;

var gamestarted = false;

var MAZE_WIDTH;
var MAZE_HEIGHT;

var img_maze;
var img_wars;

var health = 10;

var mazedata; // Variable to store maze data as a bool[][]

var brick; // Brick image

/* Gameplay */

function checkKey(e) {
    e = e || window.event;
    if (e.keyCode==32)
        fire();
    if (e.keyCode==37)
        rotateLeft();
    if (e.keyCode==38)
        moveForward();
    if (e.keyCode==39)
        rotateRight();
    if (e.keyCode==40)
        moveBackward();
    if (e.keyCode==13)
        startGame();
    if (e.keyCode==27)
        quitGame();
}

document.onkeydown = checkKey;

function updateHealth(amount) {
    health = amount;
    if (health>0)
        document.title = "Maze Wars - Health: "+health;
    else
        document.title = "Maze Wars";
}

function drawSplash() {
    /* Reset canvas */
    canvas.width = canvas.width;

    /* Background */
    context.fillStyle = "#000000";
    context.fillRect(0,0,500,500);

    /* Draw text */
    context.drawImage(img_maze,154,160);
    context.drawImage(img_wars,154,280);

    /* List Instructions */
    document.getElementById('players').innerHTML = '<font color="#FFFFFF"><b>Instructions - Enter: Start Game, Space: Fire Lazer, Up/Down/Left/Right: Move Character</b></font>';
}

function init() {
    canvas = document.getElementById("canvas");
    context = canvas.getContext("2d");

    var logindiv = document.getElementById("login_form");
    var gamediv = document.getElementById("game_container");

    logindiv.style.display = "none";
    gamediv.style.display = "block";

    brick = new Image();
    brick.src = "brick.jpg";

    img_maze = new Image();
    img_maze.src = "maze.png";
    img_wars = new Image();
    img_wars.src = "wars.png";

    drawSplash();
}

function startGame() {
    gamestarted = true;
    updateHealth(10);
    sendStart();
}

function drawfire(firex,firey,direction) {
    if (direction==1)
        direction = 3;
    else if (direction==3)
        direction = 1;

    context.fillStyle = "#FF0000";
    context.beginPath();
    context.moveTo(255-((x-firex)*10),255-((y-firey)*10));
    context.arc(255-((x-firex)*10),255-((y-firey)*10),35,Math.PI*0.5*direction-0.18,Math.PI*0.5*direction+0.18);
    context.lineTo(255-((x-firex)*10),255-((y-firey)*10));
    context.closePath();
    context.fill();
}

function checkBlock(x,y) {
    if (x<0)
        x+=MAZE_WIDTH;
    if (y<0)
        y+=MAZE_HEIGHT;
    if (x>=MAZE_WIDTH)
        x-=MAZE_WIDTH;
    if (y>=MAZE_HEIGHT)
        y-=MAZE_HEIGHT;
    return (mazedata[y][x]=='1');
}

function draw() {
    /* Reset canvas */
    canvas.width = canvas.width;

    /* Background */
    context.fillStyle = "#000000";
    context.fillRect(0,0,500,500);

    /* Draw maze */
    for (var i=0; i<50; i++) {
        for (var j=0; j<50; j++) {
            if (checkBlock(i+x-25,j+y-25))
                context.drawImage(brick, i*10, j*10, 10, 10); // Draw wall square
        }
    }

    /* Draw player */
    context.fillStyle = "#"+colour;
    context.beginPath(); // Start the path
    context.arc(255, 255, 5, 0, Math.PI*2, false); // Draw a circle
    context.closePath(); // Close the path
    context.fill(); // Fill the path

    /* Draw opponents */
    for (var i=0; i<players.length; i++) {
        if (players[i].nick!=nick && players[i].x!=null) { // don't draw self or any colliding players or not in play characters
            context.fillStyle = "#"+players[i].colour; // Set player colour
            console.log("Style",context.fillStyle); // ###
            context.beginPath(); // Start the path
            context.arc(players[i].x*10+5-x*10+250, players[i].y*10+5-y*10+250, 5, 0, Math.PI*2, false); // Draw a circle
            context.closePath(); // Close the path
            context.fill(); // Fill the path
        }
    }
}

function isFree(x, y) {
    if (x<0||y<0||x>=MAZE_WIDTH||y>=MAZE_HEIGHT)
        return true;
    return (mazedata[y][x]!=1);
}

/* Movement */
function moveForward() {
    switch (player_direction) {
        case 0:
            if (isFree(x+1,y))
                x++;
            break;
        case 1:
            if (isFree(x,y-1))
                y--;
            break;
        case 2:
            if (isFree(x-1,y))
                x--;
            break;
        case 3:
            if (isFree(x,y+1))
                y++;
            break;
    }

    /* Folding */
    if (x<0)
        x = MAZE_WIDTH;
    else if (x>=MAZE_WIDTH)
        x = 0;
    else if (y<0)
        y = MAZE_HEIGHT;
    else if (y>=MAZE_HEIGHT)
        y = 0;

    updatePosition(x,y);
    draw();
}

function moveBackward() {
    switch (player_direction) {
        case 0:
            if (isFree(x-1,y))
                x--;
            break;
        case 1:
            if (isFree(x,y+1))
                y++;
            break;
        case 2:
            if (isFree(x+1,y))
                x++;
            break;
        case 3:
            if (isFree(x,y-1))
                y--;
            break;
    }

    /* Folding */
    if (x<0)
        x = MAZE_WIDTH;
    else if (x>=MAZE_WIDTH)
        x = 0;
    else if (y<0)
        y = MAZE_HEIGHT;
    else if (y>=MAZE_HEIGHT)
        y = 0;

    updatePosition(x,y);
    draw();
}

function rotateRight() {
    player_direction--;
    if (player_direction==-1)
        player_direction = 3;
    draw();
}

function rotateLeft() {
    player_direction++;
    if (player_direction==4)
        player_direction = 0;
    draw();
}