//Common.js
$(window).load(function() {
    game.init();
});

window.requestAnimFrame = (function(){
   return window.requestAnimationFrame  ||
     window.webkitRequestAnimationFrame ||
     window.mozRequestAnimationFrame ||
     window.oRequestAnimationFrame  ||
     window.msRequestAnimationFrame  ||
     function(/* function */ callback, /* DOMElement */ element){
      window.setTimeout(callback, 1000 / 60);
     };
   })();

var game = {
    gameRunning: false,
    init: function() {
        inputHandler.init();

        this.currentMap = resourceLoader.loadMap("SampleMap");
        this.entities = resourceLoader.loadEntities();

        game.canvas = $('#gameCanvas')[0];
        game.context = game.canvas.getContext('2d');


        //Here starts the game
        this.gameRunning = true;
        $('#gameCanvas').show();
        window.requestAnimFrame(game.drawLoop);
    },
    drawLoop: function() {
        if(this.gameRunning)
            requestAnimFrame(game.drawLoop);

        //1.Clear the canvas
        game.context.clearRect(0, 0, game.canvas.width, game.canvas.height);

        //2.Iterate through all items
        for(var i=0;i<game.entities.length; i++) {
            game.entities[i].update();
        }

        /*3.Draw them
        * 3.1 DrawBaseGround(Layer#1), 3.2 DrawItems(Layer#2), 3.3 DrawCharacters with actions...
        */
        game.context.drawImage(game.currentMap.imageLayerOne, 0,0);
        game.context.drawImage(game.currentMap.imageLayerTwo, 0,0);

        for(var j=0;j<game.entities.length; j++) {
            game.entities[j].draw();
        }
    }
}

var entities = [
    {
        name: "Player",
        type: "human", //or "cpu"
        posx: 85,
        posy: 85,
        speed: 10,
        imagePath: 'images/chars/defaultChar.png',
        charImage: new Image(),
        draw: function() {
            game.context.drawImage(this.charImage, this.posx, this.posy);
        },
        update: function() {
            if(inputHandler.keyForward) {
                this.posy -= speed;
            }
            if(inputHandler.keyBackward) {
                this.posy += speed;
            }
            if(inputHandler.keyLeft) {
                this.posx -= speed;
            }
            if(inputHandler.keyRight) {
                this.posx += speed;
            }

        }
    }
]

var maps =
    [
        {
            name: "SampleMap",
            layerOneImagePath: "images/maps/sampleMap/layerOne.png",
            layerTwoImagePath: "",
            imageLayerOne: new Image(),
            imageLayerTwo: new Image()
        }
    ]


var resourceLoader = {
    totalItemsLoaded: 0,
    loadMap: function(mapName) {
        for(var i=0;i<maps.length; i++) {
            if(maps[i].name == mapName) {
                if(maps[i].layerOneImagePath != '') {
                    maps[i].imageLayerOne = this.loadImage(maps[i].layerOneImagePath);
                }
                if(maps[i].layerTwoImagePath != '') {
                    maps[i].imageLayerTwo = this.loadImage(maps[i].layerTwoImagePath);
                }

                return maps[i];
            }
        }
    },
    loadEntities: function() {
        for(var i=0;i<entities.length; i++){
            entities[i].charImage = this.loadImage(entities[i].imagePath);
        }

        return entities;
    },
    loadImage: function(imagePath) {
        this.totalItemsLoaded++;
        var image = new Image();
        image.src = imagePath;
        return image;
    }
}

var inputHandler = {
    keyForward: false,
    keyBackward: false,
    keyLeft: false,
    keyRight: false,
    init: function() {
        $(window).click(inputHandler.mouseClickHandler);
        $(window).keydown(inputHandler.keyDownHandler);
        $(window).keyup(inputHandler.keyUpHandler);
    },
    keyDownHandler: function(ev) {
        if(ev.keyCode == '87') { //fw
            this.keyBackward = false;
            this.keyForward = true;
        }
        if(ev.keyCode == '83') { //bw
            this.keyForward = false;
            this.keyBackward = true;
        }
        if(ev.keyCode == '65') { //left
            this.keyRight = false;
            this.keyLeft = true;
        }
        if(ev.keyCode == '68') { // right
            this.keyRight = true;
            this.keyLeft = false;
        }
    },
    keyUpHandler: function(ev) {
        if(ev.keyCode == '87') { //fw
            this.keyForward = false;
        }
        if(ev.keyCode == '83') { //bw
            this.keyBackward = false;
        }
        if(ev.keyCode == '65') { //left
            this.keyLeft = false;
        }
        if(ev.keyCode == '68') { // right
            this.keyRight = false;
        }
    },
    mouseClickHandler: function(ev) {

    }
}