**View source code: game-tutorial-oop4.js
I will only explain the code that is new or updated from the previous tutorial.
//============================= // Player //============================= // Object Type: TM.ILoopObject var Player = function(data){ this.speed = 30; this.data = { x: undefined, y: undefined, refMainObjects: undefined, pX: null, pY: null, dX: 0, dY: 0, text: "[-<>-]", }; TM.ILoopObject.call(this, this.speed, data); }; Player.prototype = Object.create(TM.ILoopObject.prototype); Player.prototype.constructor = Player;
Player class is created extending TM.ILoopObject.
// TM.ILoopObject functions implementation Player.prototype._init = function(){}; Player.prototype._inactivate = function(){ var frame = this.data.refMainObjects.frame; TMS.deleteTextAt(frame.data.x+this.data.x,frame.data.y+this.data.y,this.data.text); }; Player.prototype._calculate = function(){ this.move(); }; Player.prototype._draw = function(){ var frame = this.data.refMainObjects.frame; if(this.data.pX && this.data.pY){ TMS.deleteTextAt(frame.data.x+this.data.pX,frame.data.y+this.data.pY,this.data.text); } TMS.insertTextAt(frame.data.x+this.data.x,frame.data.y+this.data.y,this.data.text); };
Code in _init, _inactivate, _calculate and _draw functions instead of extending TM.ILoopObject functions directly. Keep these functions even if there is no code for them.
_inactivate: delete the instance.
_calculate: call move function.
_draw: It removes the text at the previous position(pX, pY) and draws current position(x, y).
// Player functions Player.prototype.move = function(){ this.data.pX = this.data.x; this.data.pY = this.data.y; this.data.x += this.data.dX; this.data.y += this.data.dY; this.data.dX = 0; this.data.dY = 0; }; Player.prototype.updateDirection = function(dX,dY){ this.data.dX += dX; this.data.dY += dY; };
move: moves the instance.
updateDirection: updates dX and dY.
// Static properties Program_Main.KEYSET = { LEFT: 37, UP: 38, RIGHT: 39, DOWN: 40, };
Static property KEYSET is added to Program_Main for better visibility. Static property means the properties can be accessed as class properties not through instance.
var Program_Main = function(){ this.speed = 30; this.data = {}; this.objects = { frame: null, enemy: null, player: null, }; TM.IProgram.call(this, this.speed); };
player is added to this.objects in Program_Main.
// TM.IProgram functions implementation Program_Main.prototype._init = function(){ TMS.cursor.hide(); this.objects.frame = new Frame({x:5,y:2}); this.objects.enemy = new Enemy({refMainObjects:this.objects}); this.objects.player = new Player({x:22,y:10,refMainObjects:this.objects}); }; Program_Main.prototype._inactivate = function(){}; Program_Main.prototype._calculate = function(){ var player = this.objects.player; TMD.print("Player",{x:player.data.x,y:player.data.y}); }; Program_Main.prototype._draw = function(){}; Program_Main.prototype._timeline = function(loopCount){}; Program_Main.prototype._getInput = function(){ var player = this.objects.player; var frame = this.objects.frame; if(TMI.keyboard.checkKey(Program_Main.KEYSET.LEFT) && player.data.x>2){ player.updateDirection(-1,0); } if(TMI.keyboard.checkKey(Program_Main.KEYSET.UP) && player.data.y>1){ player.updateDirection(0,-1); } if(TMI.keyboard.checkKey(Program_Main.KEYSET.RIGHT) && player.data.x+player.data.text.length<frame.data.width-2){ player.updateDirection(1,0); } if(TMI.keyboard.checkKey(Program_Main.KEYSET.DOWN) && player.data.y<frame.data.height-2){ player.updateDirection(0,1); } };
Functions of Program_Main are updated to handle player.
_init: player instance is created.
_calculate: print debug data using TMD.
_getInput: checks user input using TMI.keyboard.checkKey function and update player directions by calling player.updateDirection function.
Click Screen first, then press arrow keys in your keyboard to move player.
Type these commands into the browser console on this page to test.
main.inactive() //inactive main and main.objects(frame, enemy) main.init() //re-activate main and main.object(frame, enemy) main.objects.player.inactivate() //inactivate player. main.objects.player.init() //re-activate player. main.objects.enemy.inactivate() //inactivates enemy. main.objects.enemy.init() //re-activates enemy. main.objects.frame.inactivate() //inactivates frame. main.objects.frame.init() //re-activates frame.
Comments
Login with SNS account to write comments. see details