TM.IObject

View source code: https://github.com/a-mean-blogger/text-game-maker-js/blob/master/src/base-objects/i-object.js

Type

Interface Class

**There is no "interface class" in JavaScript. It just means the role of this class is interface. This class should be extended and creates new classes

Purpose

A interface class to create instances that doesn't need to repeat. (for example: frame of game). TM.IObject is the base class of all other Text Game Maker JS classes. all other classes are extended from this class.

Createdinstance is created by Constructor.
Activatedactivated by init function.
Inactivatedinactivated by inactivate function.

Constructor Parameters

new TM.IObject(data, skipInit)
  • data(optional): object with data that will be used in the class(for example:{x:1,y:2}. data will be saved as this.data
  • skipInit(optional): TM.IObject executes init function when an instance is created by default. if skipInit is passed as true, it will not execute init when an instance is created.

Properties

  • isActive: It will be set true after calling init function, false after calling inactivate. The Object status(active/inactive) can be checked by this property.
    **Inactivated(this.isActive == false) does not mean it inactivates all functions of it. The functions need to be coded for each status(this.isActive is true- active, false- inactive) if different behaviors are required.

Functions

  • init(): activates/initializes the instance. It's executed when the instance created as default but It is not executed if skipInit is passed as true. In this case, you need to call this function manually to initiate instance.
  • inactivate(): inactivates the instance.

Extension of Functions

When you extends TM.IObject functions above, create new functions with there name starts "_" instead of extending them directly. The functions blow with "_" will be executed when the TM.IObject functions are called.

  • _init: Write the code that should executed when instance is initiated.(for example: draw a game frame on Screen)
  • _inactivate: Write the code that should executed when instance is inactivated.(for example: delete a game frame on Screen)

Code Example

**View example source code: i-object-tutorial.js

Let's create a Frame class extending TM.IObject that draw a game frame. It will be easy to understand if you compare below with the full source code(i-object-tutorial.js).

Create Manager Instance

var TMS = new TM.ScreenManager();

Extend TM.IObject Class

//=============================
// Frame
//=============================
// Object Type: TM.IObject
// Description: a sample game frame object
var Frame = function(data){
  this.data = {
    x: undefined,
    y: undefined,
    frame: [
      '+-----------<  My Frame  >-----------+\n',
      '|                                    |\n',
      '|                                    |\n',
      '|                                    |\n',
      '|                                    |\n',
      '|                                    |\n',
      '|                                    |\n',
      '|                                    |\n',
      '+------------------------------------+\n'
    ],
    todayText: null,
  };
  TM.IObject.call(this, data);
};
Frame.prototype = Object.create(TM.IObject.prototype);
Frame.prototype.constructor = Frame;

Frame class is created extending TM.IObject.

this.data is the structures and default values of class. data passed as the parameter will overwrite this.dataundefined in this.data means the value should be passed as data parameter, null in this.data means no default value for them. Therefore x, y should be passed as data parameter to create instance of this class.

skipInit is not passed to TM.ILoopObject.call so init will be executed when an instance created.

Extend TM.IObject Functions

위에서 설명한 것 처럼, 함수를 직접 상속받지 말고 함수이름 앞에 _를 붙여 코드를 작성하면 해당 함수 호출시 같이 호출됩니다. TM.IObject는 init, inactivate를 가지고 있으므로 _init, _inactivate를 작성해 줍니다.

// TM.IObject functions implementation
Frame.prototype._init = function(){
  this.updateTodayText();
  this.drawFrame();
  this.drawTodayText();
};
Frame.prototype._inactivate = function(){
  this.drawTodayText(true);
  this.drawFrame(true);
};

함수가 활성화될 때와 비활성화될 때 호출되어야 하는 함수들을 기록하였습니다. 다음으로 이 함수들을 작성해 줍시다.

Add Frame Class Functions

// Frame functions
Frame.prototype.updateTodayText = function(){
  var today = new Date();
  var year = today.getFullYear();
  var month = today.getMonth()+1;
  var date = today.getDate();
  this.data.todayText = year+'-'+month+'-'+date;
};
Frame.prototype.drawFrame = function(remove){
  TMS.cursor.move(this.data.x, this.data.y);
  for(var i=0; i<this.data.frame.length; i++){
    if(remove) TMS.deleteText(this.data.frame[i]);
    else TMS.insertText(this.data.frame[i]);
  }
};
Frame.prototype.drawTodayText = function(remove){
  TMS.cursor.move(this.data.x+2, this.data.y+1);
  if(remove) TMS.deleteText(this.data.todayText);
  else TMS.insertText(this.data.todayText);
};

These are custom functions of the class.

Creating Instance

var myFrame = new Frame({x:2,y:2});

Create a myFrame instance their data is {x:2, y:2}.

Run Example

Type these commands into the browser console on this page to test.

//inactivate myFrame 
myFrame.inactivate();

//re-activate(initialize) myFrame
myFrame.init();

//create new Frame's instance (myFrame2)
var myFrame2 = new Frame({x:4,y:4});

Comments

Add Comment

Login with SNS account to write comments. see details

UP