TM.ScreenManager

View source code: https://github.com/a-mean-blogger/text-game-maker-js/blob/master/src/managers/screen-manager/screen-manager.js

Type

Class (extends TM.ILoopObject)

Purpose

A class that creates instances builds HTML canvas on the browser. the instance can prints or delete texts on the canvas screen. The main class of Text Game Maker JS.

Constructor Parameters

new TM.ScreenManager(customSreenSetting, customCharGroups)

• customSreenSetting(optional): an object that will be used to create Screen overriding the values of TM.defaultSettings.screen.
• customCharGroups(optional): an object that will be used to specify special text groups overriding the values of TM.defaultSettings.charGroup.

Important 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.
• cursor: It's an instance of TM.ScreenManager_Cursor. It has functions to show, hide or move the cursor on Screen.

Important Functions

• init(): activates/initializes the instance. (It executes when the instance created)
• inactivate(): inactivates the instance. Screen does not update anything any more.

Functions related to Screen

• insertText(text,color,backgroundColor): Inserts text at the current cursor location. color and backgroundColor are optional.
• insertTextAt(x,y,text,color,backgroundColor): insert text at x, y position. color and backgroundColor are optional.
• deleteText(text): Deletes text as long as the text length at the current cursor location.
• deleteTextAt(x,y,text): Deletes text as long as the text length at x, y position.
• clearScreen(): clears all texts and back ground colors on Screen.
• fillScreen(char, color, backgroundColor): fill Screen with char. color and backgroundColor are optional. You can fill the screen with one color by passing an empty space ' ' and backgroundColor.
• consoleScreenData(): print data of Screen on the browser console for debugging
• copyScreen(): copys and returns the current canvas data(not Screen data).
• pasteScreen(canvas): update canvas with canvas
• onReady(func): If there is an external font used to create Screen, wait until Screen loads it and run func when the font is loaded.

**You can add "/n " in text to break line. The cursor moves to the initial x position of text after the line break.
**You can "/r" in text to move the cursor to the first column of Screen.
**Any color formats that support HTML5 Canvas can be used for color and backgoundColor. For examples: 'red', '#fff', '#fa4ede', rgb(255, 100, 70)', 'rgba(255, 255, 255, 0.5)'...

Code Example

**View example source code: screen-manager-tutorial.js

Create an instance of TM.ScreenManager and assign to var TMS(Text Game Maker Screen).

var TMS = new TM.ScreenManger();

Print "Hello World" at the current cursor location.

TMS.insertText("Hello World\n");

Run Example

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

//print red "Hello World" at the current cursor location and break line.
TMS.insertText("Hello World\n", "red"); 
//print red "Hello World" with white background color at the current cursor location and break line.
TMS.insertText("Hello World\n", "red", "#fff"); 
//print red "Hello World" at (5,5) and break line.
TMS.insertTextAt(5, 5, "Hello World\n", "red"); 

TMS.clearScreen(); //clear Screen
TMS.fillScreen("A"); //fill Screen with "A"
TMS.fillScreen("A", null, "white"); //fill Screen with white color