Add: WhacAMole typing game

src/game/typing/lib/hand.js

@@ -0,0 +1,263 @@
+function Hand(keyMapper) {
+	this.keyMapper = keyMapper;
+	this.pressingFinger = KeyButton.NONE_FINGER;
+	this.prevFingerSprite = null;
+
+	this.hand = game.add.image(0, Hand.DEFAULT_Y_PX, "hand_palm");
+	this.hand.anchor.set(0.5);
+	this.hand.scale.set(2);
+
+	this.thumb = game.add.image(0, 0, "hand_thumb");
+	this.thumb.alpha = 0.5;
+	this.hand.addChild(this.thumb);
+
+	this.index_finger = game.add.image(0, 0, "hand_index_finger");
+	this.index_finger.alpha = 0.5;
+	this.hand.addChild(this.index_finger);
+
+	this.middle_finger = game.add.image(0, 0, "hand_middle_finger");
+	this.middle_finger.alpha = 0.5;
+	this.hand.addChild(this.middle_finger);
+
+	this.ring_filger = game.add.image(0, 0, "hand_little_finger");
+	this.ring_filger.alpha = 0.5;
+	this.hand.addChild(this.ring_filger);
+
+	this.little_finger = game.add.image(0, 0, "hand_ring_finger");
+	this.little_finger.alpha = 0.5;
+	this.hand.addChild(this.little_finger);
+
+	var mask = game.add.graphics();
+	mask.beginFill(0xffffff);
+	mask.drawRect(100, 300, 1028, 360);
+	this.hand.mask = mask;
+}
+
+Hand.prototype.move = function(sprite, x, y) {
+	sprite.x = x;
+	sprite.y = y;
+}
+
+Hand.prototype.moveTo = function(key) {
+}
+
+Hand.prototype.moveToDefaultPosition = function() {
+	this.moveRow(3, null);
+	this.unhighlightOffFinger(KeyButton.NONE_FINGER);
+}
+
+
+Hand.prototype.moveRow = function(rowNo, key) {
+	var rowIndex = rowNo - 1;
+	this.hand.y = Hand.DEFAULT_Y_PX + Keyboard.DEFAULT_KEY_SIZE_PX * rowIndex;
+
+	this.moveColumn(rowNo, key);
+}
+
+Hand.prototype.moveColumn = function(rowNo, key) {
+}
+
+
+Hand.prototype.getFingerSprite = function(fingerNo) {
+	var fingerSprite = null;
+	switch(fingerNo) {
+		case KeyButton.THUMB:
+		fingerSprite = this.thumb;
+		break;
+		case KeyButton.INDEX_FINGER:
+		case KeyButton.INDEX_FINGER_BASELINE:
+		fingerSprite = this.index_finger;
+		break;
+		case KeyButton.MIDDLE_FINGER:
+		fingerSprite = this.middle_finger;
+		break;
+		case KeyButton.RING_FINGER:
+		fingerSprite = this.ring_filger;
+		break;
+		case KeyButton.LITTLE_FINGER:
+		fingerSprite = this.little_finger;
+		break;
+	}
+	return fingerSprite;
+}
+
+Hand.prototype.highlightOnFinger = function(fingerNo) {
+	// console.log(fingerNo);
+	var pressingFingerSprite = this.getFingerSprite(fingerNo);
+	if(pressingFingerSprite === this.prevFingerSprite)
+		return;
+
+	if(this.prevFingerSprite !== null)
+		this.unhighlightOffFinger();
+
+	if(pressingFingerSprite !== null) {
+		// console.log(pressingFingerSprite);
+		pressingFingerSprite.tint = 0xffff00;
+		pressingFingerSprite.alpha = 1;
+	}
+
+	this.prevFingerSprite = pressingFingerSprite;
+}
+
+Hand.prototype.unhighlightOffFinger = function() {
+	if(this.prevFingerSprite === null)
+		return;
+	this.prevFingerSprite.tint = 0xffffff;
+	this.prevFingerSprite.alpha = 0.5;
+
+	this.prevFingerSprite = null;
+}
+
+
+Hand.DEFAULT_Y_PX		= 540;	// 680;
+
+
+
+LeftHand.prototype = Object.create(Hand.prototype);
+LeftHand.constructor = LeftHand;
+
+function LeftHand(keyMapper) {
+	Hand.call(this, keyMapper);
+
+	this.move(this.thumb, 126, -50);
+	this.move(this.index_finger, 96, -102);
+	this.move(this.middle_finger, 58, -116);
+	this.move(this.ring_filger, 32, -110);
+	this.move(this.little_finger, 4, -106);
+	this.moveToDefaultPosition();
+}
+
+LeftHand.prototype.moveTo = function(key) {
+	if(key === undefined)
+		return;
+
+	// console.log(key);
+	var keyCode = this.keyMapper.getKeyIDOfText(key.normalText);
+
+	if(keyCode != "Space")
+		this.moveRow(key.row, key);
+	else
+		this.moveRow(3, key);
+
+	switch(key.keyCode) {
+		case "Key5":
+		case "KeyT":
+		case "KeyG":
+		case "KeyB":
+		this.moveColumn(5, key);
+		break;
+	}
+
+	this.highlightOnFinger(key.fingerType);
+}
+
+LeftHand.prototype.moveColumn = function(rowNo, key) {
+	var rowIndex = rowNo - 1;
+	this.hand.x = LeftHand.DEFAULT_X_PX + (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * rowIndex;
+
+	if(key === null)
+		return;
+
+	var keyCode = this.keyMapper.getKeyIDOfText(key.normalText);
+	switch(keyCode) {
+		case "Key5":
+		case "KeyT":
+		case "KeyG":
+		case "KeyB":
+		this.hand.x += Keyboard.DEFAULT_KEY_SIZE_PX;
+		break;
+
+		case "ShiftLeft":
+		this.hand.x = LeftHand.DEFAULT_X_PX;
+		break;
+	}
+}
+
+
+LeftHand.DEFAULT_X_PX	= 100;
+
+
+
+RightHand.prototype = Object.create(Hand.prototype);
+RightHand.constructor = RightHand;
+
+function RightHand(keyMapper) {
+	Hand.call(this, keyMapper);
+
+	this.hand.scale.x *= -1;
+
+	this.move(this.thumb, 126, -50);
+	this.move(this.index_finger, 96, -102);
+	this.move(this.middle_finger, 58, -116);
+	this.move(this.ring_filger, 32, -110);
+	this.move(this.little_finger, 4, -106);
+	this.moveToDefaultPosition();
+}
+
+RightHand.prototype.moveTo = function(key) {
+	if(key === undefined)
+		return;
+
+	// console.log(key);
+	var keyCode = this.keyMapper.getKeyIDOfText(key.normalText);
+
+	if(keyCode != "Space")
+		this.moveRow(key.row, key);
+	else
+		this.moveRow(3, key);
+
+	switch(key.keyCode) {
+		case "Key5":
+		case "KeyT":
+		case "KeyG":
+		case "KeyB":
+		this.moveColumn(5, key);
+		break;
+	}
+
+	this.highlightOnFinger(key.fingerType);
+}
+
+RightHand.prototype.moveColumn = function(rowNo, key) {
+	var rowIndex = rowNo - 1;
+	this.hand.x = RightHand.DEFAULT_X_PX + (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * rowIndex;
+
+	if(key === null)
+		return;
+
+	var keyCode = this.keyMapper.getKeyIDOfText(key.normalText);
+	switch(keyCode) {
+		case "Key6":
+		case "KeyY":
+		case "KeyH":
+		case "KeyN":
+		this.hand.x -= Keyboard.DEFAULT_KEY_SIZE_PX;
+		break;
+
+		case "Minus":
+		case "BracketLeft":
+		case "Quote":
+		this.hand.x += (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * 3;
+		break;
+
+		case "Equal":
+		case "BracketRight":
+		this.hand.x += (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * 5;
+		break;
+
+		case "Backslash":
+		this.hand.x += (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * 7;
+		break;
+
+		case "Enter":
+		this.hand.x = RightHand.DEFAULT_X_PX + (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * 6;
+		break;
+
+		case "ShiftRight":
+		this.hand.x = RightHand.DEFAULT_X_PX + (Keyboard.DEFAULT_KEY_SIZE_PX / 2) * 6;
+		break;
+	}
+}
+
+
+RightHand.DEFAULT_X_PX	= 810;

src/game/typing/lib/key_button.js

@@ -0,0 +1,258 @@
+function KeyButton(x, y, width, height, normalText, shiftText, handSide, row, fingerType, alignType) {
+	this.normalText = normalText;
+	this.shiftText = shiftText;
+	this.handSide = handSide;
+	this.row = row;
+	this.fingerType = fingerType;
+	this.alignType = alignType;
+
+	this.setting = new RoundRectButtonSetting(x, y, width, height, KeyButton.DEFALUT_ROUND_AMOUNT_PX);
+	this.setting.strokeWidthPx = 2;
+
+	this.buttonSolid = this.makeButtonSolidSprite(this.setting);
+	this.setNormalColor();
+	this.buttonStroke = this.makeButtonStrokeSprite(this.setting);
+
+	this.baselineStroke = null;
+	if(fingerType == KeyButton.INDEX_FINGER_BASELINE) {
+		this.baselineStroke = this.makeBaselineStrokeSprite(this.setting, width, height);
+		this.buttonStroke.addChild(this.baselineStroke);
+	}
+
+	this.buttonText = this.makeText(this.setting, this.normalText);
+	if(this.normalText.length > 0) {
+		this.buttonStroke.addChild(this.buttonText);
+	}
+
+	this.highlightButtonStroke = this.makeHighlightButtonStrokeSprite(this.setting);
+	this.highlightButtonStroke.alpha = 0;
+}
+
+KeyButton.prototype.makeButtonSolidSprite = function(setting) {
+	var btnTexture = new Phaser.Graphics()
+		.beginFill(0xffffff, 0.5)
+		// .lineStyle(setting.strokeWidthPx, 0xFFffff, 1)
+		.drawRoundedRect(0, 0, setting.width, setting.height, setting.roundAmount)
+		.endFill()
+		.generateTexture();
+
+	return game.add.sprite(
+		setting.x,	// - setting.width / 2,
+		setting.y,	// - setting.height / 2,
+		btnTexture
+	);
+}
+
+KeyButton.prototype.makeButtonStrokeSprite = function(setting) {
+	var btnTexture = new Phaser.Graphics()
+		.lineStyle(setting.strokeWidthPx, 0xaaaaaa, 1)
+		.drawRoundedRect(0, 0, setting.width, setting.height, setting.roundAmount)
+		.generateTexture();
+
+	return game.add.sprite(
+		setting.x,	// - setting.width / 2,
+		setting.y,	// - setting.height / 2,
+		btnTexture
+	);
+}
+
+KeyButton.prototype.makeHighlightButtonStrokeSprite = function(setting) {
+	var strokeWidth = setting.strokeWidthPx * 2;
+	var btnTexture = new Phaser.Graphics()
+		.lineStyle(strokeWidth, 0xfffff00, 1)
+		.drawRoundedRect(0, 0, setting.width, setting.height, setting.roundAmount)
+		.generateTexture();
+
+	return game.add.sprite(
+		setting.x - strokeWidth / 4,
+		setting.y - strokeWidth / 4,
+		btnTexture
+	);
+}
+
+KeyButton.prototype.makeBaselineStrokeSprite = function(setting, width, height) {
+	var strokePx = setting.strokeWidthPx;
+
+	var baselineTexture = new Phaser.Graphics()
+		.lineStyle(2, 0x888888)
+		.moveTo(1, 1)
+		.lineTo(16, 1)
+		.lineStyle(2, 0xffffff)
+		.moveTo(0, 0)
+		.lineTo(15, 0)
+		.generateTexture();
+
+	var baselineSprite = game.add.sprite(
+			strokePx + setting.width / 2,
+			strokePx + setting.height - 6,
+			baselineTexture
+		);
+	baselineSprite.anchor.set(0.5);
+	return baselineSprite;
+}
+
+KeyButton.prototype.makeText = function(setting, textContent) {
+	var fontStyle = { };
+	if(this.alignType === KeyButton.NORMAL_KEY)
+		setting.fontStyle.font = "20px Courier New";
+	else
+		setting.fontStyle.font = "11px Courier New";
+
+	var OFFSET_X = 4, OFFSET_Y = 3;
+	var textPosX = 0, textPosY = 0;
+	switch(this.alignType) {
+		case KeyButton.NORMAL_KEY:
+		case KeyButton.NORMAL_FUNCTION_KEY:
+		textPosX = setting.strokeWidthPx + setting.width / 2;
+		textPosY = setting.strokeWidthPx + setting.height / 2 + OFFSET_Y;
+		break;
+
+		case KeyButton.LEFT_FUNCTION_KEY:
+		textPosX = setting.strokeWidthPx + OFFSET_X;
+		textPosY = setting.strokeWidthPx + setting.height;
+		break;
+
+		case KeyButton.CENTER_FUNCTION_KEY:
+		textPosX = setting.strokeWidthPx + setting.width / 2;
+		textPosY = setting.strokeWidthPx + setting.height;
+		break;
+
+		case KeyButton.RIGHT_FUNCTION_KEY:
+		textPosX = setting.strokeWidthPx + setting.width - OFFSET_X;
+		textPosY = setting.strokeWidthPx + setting.height;
+		break;
+	}
+
+	var buttonText = game.add.text(textPosX, textPosY, textContent, setting.fontStyle);
+	switch(this.alignType) {
+		case KeyButton.NORMAL_KEY:
+		case KeyButton.NORMAL_FUNCTION_KEY:
+		buttonText.anchor.set(0.5);
+		break;
+
+		case KeyButton.LEFT_FUNCTION_KEY:
+		buttonText.anchor.set(0, 1);
+		break;
+
+		case KeyButton.CENTER_FUNCTION_KEY:
+		buttonText.anchor.set(0.5, 1);
+		break;
+
+		case KeyButton.RIGHT_FUNCTION_KEY:
+		buttonText.anchor.set(1, 1);
+		break;
+	}
+
+	return buttonText;
+}
+
+
+KeyButton.prototype.setNormalColor = function() {
+	switch(this.fingerType) {
+		case KeyButton.THUMB:
+		this.buttonSolid.tint = 0x604d4d;
+		break;
+
+		case KeyButton.INDEX_FINGER:
+		case KeyButton.INDEX_FINGER_BASELINE:
+		this.buttonSolid.tint = 0x4d604d;
+		break;
+
+		case KeyButton.MIDDLE_FINGER:
+		this.buttonSolid.tint = 0x4d4d60;
+		break;
+
+		case KeyButton.RING_FINGER:
+		this.buttonSolid.tint = 0x60604d;
+		break;
+
+		case KeyButton.LITTLE_FINGER:
+		this.buttonSolid.tint = 0x4d6060;
+		break;
+
+		default:
+		this.buttonSolid.tint = 0x4d4d4d;
+		// this.buttonSolid.alpha = 0;
+	}
+}
+
+KeyButton.prototype.setTargetColor = function() {
+	switch(this.fingerType) {
+		case KeyButton.THUMB:
+		this.buttonSolid.tint = 0xff8080;
+		break;
+
+		case KeyButton.INDEX_FINGER:
+		case KeyButton.INDEX_FINGER_BASELINE:
+		this.buttonSolid.tint = 0x80ff80;
+		break;
+
+		case KeyButton.MIDDLE_FINGER:
+		this.buttonSolid.tint = 0x8080ff;
+		break;
+
+		case KeyButton.RING_FINGER:
+		this.buttonSolid.tint = 0xffff80;
+		break;
+
+		case KeyButton.LITTLE_FINGER:
+		this.buttonSolid.tint = 0x80ffff;
+		break;
+
+		default:
+		this.buttonSolid.tint = 0x202020;
+		// this.buttonSolid.alpha = 0;
+	}
+}
+
+KeyButton.prototype.setGoodPressColor = function() {
+	this.buttonSolid.tint = 0x0000ff;
+}
+
+KeyButton.prototype.setBadPressColor = function() {
+	this.buttonSolid.tint = 0xff0000;
+}
+
+
+KeyButton.prototype.showHighlight = function() {
+	this.highlightButtonStroke.alpha = 1;
+}
+
+KeyButton.prototype.hideHighlight = function() {
+	this.highlightButtonStroke.alpha = 0;
+}
+
+
+KeyButton.prototype.onShiftPressed = function() {
+	this.buttonText.text = this.shiftText;
+}
+
+KeyButton.prototype.onShiftUnpressed = function() {
+	this.buttonText.text = this.normalText;
+}
+
+
+KeyButton.NONE_ICON					= "";
+KeyButton.NONE_BUTTON_TEXT			= "";
+
+KeyButton.DEFALUT_ROUND_AMOUNT_PX	= 10;
+
+KeyButton.NORMAL_KEY				= "normal_key";
+KeyButton.NORMAL_FUNCTION_KEY		= "normal_function_key";
+KeyButton.LEFT_FUNCTION_KEY			= "left_function_key";
+KeyButton.CENTER_FUNCTION_KEY		= "center_function_key";
+KeyButton.RIGHT_FUNCTION_KEY		= "right_function_key";
+
+
+KeyButton.NONE_HAND					= 0;
+KeyButton.LEFT_HAND					= 1;
+KeyButton.RIGHT_HAND				= 2;
+KeyButton.BOTH_HAND					= 3;
+
+KeyButton.NONE_FINGER				= 0;
+KeyButton.THUMB						= 1;
+KeyButton.INDEX_FINGER				= 2;
+KeyButton.INDEX_FINGER_BASELINE		= 3;
+KeyButton.MIDDLE_FINGER				= 4;
+KeyButton.RING_FINGER				= 5;
+KeyButton.LITTLE_FINGER				= 6;

src/game/typing/lib/key_mapper.js

@@ -0,0 +1,237 @@
+function KeyData() {
+	this.functionKey = null;
+	this.englishKey = null;
+	this.koreanKey = null;
+}
+
+function KeyTextData(normalText, shiftText) {
+	this.normalText = normalText;
+	this.shiftText = shiftText;
+}
+
+
+function KeyMapper() {
+	this.keyboardKeyMap = {};
+	this.inputKeyMap = {};
+
+	this.registerFunctionKey();
+	this.registerEnglishKey();
+	this.registerKoreanKey();
+}
+
+
+KeyMapper.prototype.registerFunctionKey = function() {
+	this.registerFunctionKeyTextData("Backquote", "`", "~");
+	this.registerFunctionKeyTextData("Digit1", "1", "!");
+	this.registerFunctionKeyTextData("Digit2", "2", "@");
+	this.registerFunctionKeyTextData("Digit3", "3", "#");
+	this.registerFunctionKeyTextData("Digit4", "4", "$");
+	this.registerFunctionKeyTextData("Digit5", "5", "%");
+	this.registerFunctionKeyTextData("Digit6", "6", "^");
+	this.registerFunctionKeyTextData("Digit7", "7", "&");
+	this.registerFunctionKeyTextData("Digit8", "8", "*");
+	this.registerFunctionKeyTextData("Digit9", "9", "(");
+	this.registerFunctionKeyTextData("Digit0", "0", ")");
+	this.registerFunctionKeyTextData("Minus", "-", "_");
+	this.registerFunctionKeyTextData("Equal", "=", "+");
+	this.registerFunctionKeyTextData("Backspace", "backspace", "backspace");
+
+	this.registerFunctionKeyTextData("Tab", "tab", "tab");
+	this.registerFunctionKeyTextData("BracketLeft", "[", "{");
+	this.registerFunctionKeyTextData("BracketRight", "]", "}");
+	this.registerFunctionKeyTextData("Backslash", "\\", "|");
+
+	this.registerFunctionKeyTextData("CapsLock", "caps lock", "caps lock");
+	this.registerFunctionKeyTextData("Semicolon", ";", ":");
+	this.registerFunctionKeyTextData("Quote", "'", "\"");
+	this.registerFunctionKeyTextData("Enter", "enter", "enter");
+
+	this.registerFunctionKeyTextData("ShiftLeft", "left_shift", "left_shift");
+	this.registerFunctionKeyTextData("ShiftRight", "right_shift", "right_shift");
+	this.registerFunctionKeyTextData("Comma", ",", "<");
+	this.registerFunctionKeyTextData("Period", ".", ">");
+	this.registerFunctionKeyTextData("Slash", "/", "?");
+
+	this.registerFunctionKeyTextData("ControlLeft", "ctrl", "ctrl");
+	this.registerFunctionKeyTextData("window", "window", "window");
+	this.registerFunctionKeyTextData("AltLeft", "alt", "alt");
+	this.registerFunctionKeyTextData("Chinese", "한자", "한자");
+	this.registerFunctionKeyTextData("Space", "space", "space");
+	this.registerFunctionKeyTextData("KoreanEnglish", "한/영", "한/영");
+	this.registerFunctionKeyTextData("AltRight", "alt", "alt");
+	this.registerFunctionKeyTextData("ControlRight", "ctrl", "ctrl");
+}
+
+KeyMapper.prototype.registerEnglishKey = function() {
+	this.registerEnglishKeyTextData("KeyQ", "q", "Q");
+	this.registerEnglishKeyTextData("KeyW", "w", "W");
+	this.registerEnglishKeyTextData("KeyE", "e", "E");
+	this.registerEnglishKeyTextData("KeyR", "r", "R");
+	this.registerEnglishKeyTextData("KeyT", "t", "T");
+	this.registerEnglishKeyTextData("KeyY", "y", "Y");
+	this.registerEnglishKeyTextData("KeyU", "u", "U");
+	this.registerEnglishKeyTextData("KeyI", "i", "I");
+	this.registerEnglishKeyTextData("KeyO", "o", "O");
+	this.registerEnglishKeyTextData("KeyP", "p", "P");
+
+	this.registerEnglishKeyTextData("KeyA", "a", "A");
+	this.registerEnglishKeyTextData("KeyS", "s", "S");
+	this.registerEnglishKeyTextData("KeyD", "d", "D");
+	this.registerEnglishKeyTextData("KeyF", "f", "F");
+	this.registerEnglishKeyTextData("KeyG", "g", "G");
+	this.registerEnglishKeyTextData("KeyH", "h", "H");
+	this.registerEnglishKeyTextData("KeyJ", "j", "J");
+	this.registerEnglishKeyTextData("KeyK", "k", "K");
+	this.registerEnglishKeyTextData("KeyL", "l", "L");
+
+	this.registerEnglishKeyTextData("KeyZ", "z", "Z");
+	this.registerEnglishKeyTextData("KeyX", "x", "X");
+	this.registerEnglishKeyTextData("KeyC", "c", "C");
+	this.registerEnglishKeyTextData("KeyV", "v", "V");
+	this.registerEnglishKeyTextData("KeyB", "b", "B");
+	this.registerEnglishKeyTextData("KeyN", "n", "N");
+	this.registerEnglishKeyTextData("KeyM", "m", "M");
+}
+
+KeyMapper.prototype.registerKoreanKey = function() {
+	this.registerKoreanKeyTextData("KeyQ", "ㅂ", "ㅃ");
+	this.registerKoreanKeyTextData("KeyW", "ㅈ", "ㅉ");
+	this.registerKoreanKeyTextData("KeyE", "ㄷ", "ㄸ");
+	this.registerKoreanKeyTextData("KeyR", "ㄱ", "ㄲ");
+	this.registerKoreanKeyTextData("KeyT", "ㅅ", "ㅆ");
+	this.registerKoreanKeyTextData("KeyY", "ㅛ", "ㅛ");
+	this.registerKoreanKeyTextData("KeyU", "ㅕ", "ㅕ");
+	this.registerKoreanKeyTextData("KeyI", "ㅑ", "ㅑ");
+	this.registerKoreanKeyTextData("KeyO", "ㅐ", "ㅒ");
+	this.registerKoreanKeyTextData("KeyP", "ㅔ", "ㅖ");
+
+	this.registerKoreanKeyTextData("KeyA", "ㅁ", "ㅁ");
+	this.registerKoreanKeyTextData("KeyS", "ㄴ", "ㄴ");
+	this.registerKoreanKeyTextData("KeyD", "ㅇ", "ㅇ");
+	this.registerKoreanKeyTextData("KeyF", "ㄹ", "ㄹ");
+	this.registerKoreanKeyTextData("KeyG", "ㅎ", "ㅎ");
+	this.registerKoreanKeyTextData("KeyH", "ㅗ", "ㅗ");
+	this.registerKoreanKeyTextData("KeyJ", "ㅓ", "ㅓ");
+	this.registerKoreanKeyTextData("KeyK", "ㅏ", "ㅏ");
+	this.registerKoreanKeyTextData("KeyL", "ㅣ", "ㅣ");
+
+	this.registerKoreanKeyTextData("KeyZ", "ㅋ", "ㅋ");
+	this.registerKoreanKeyTextData("KeyX", "ㅌ", "ㅌ");
+	this.registerKoreanKeyTextData("KeyC", "ㅊ", "ㅊ");
+	this.registerKoreanKeyTextData("KeyV", "ㅍ", "ㅍ");
+	this.registerKoreanKeyTextData("KeyB", "ㅠ", "ㅠ");
+	this.registerKoreanKeyTextData("KeyN", "ㅜ", "ㅜ");
+	this.registerKoreanKeyTextData("KeyM", "ㅡ", "ㅡ");
+}
+
+
+KeyMapper.prototype.registerFunctionKeyTextData = function(keyID, normalText, shiftText) {
+	if(this.keyboardKeyMap[keyID] === undefined) {
+		this.keyboardKeyMap[keyID] = new KeyData();
+	}
+	this.keyboardKeyMap[keyID].functionKey = new KeyTextData(normalText, shiftText);
+
+	if(this.inputKeyMap[keyID] === undefined)
+		this.inputKeyMap[keyID] = keyID;
+	if(this.inputKeyMap[normalText] === undefined)
+		this.inputKeyMap[normalText] = keyID;
+	if(this.inputKeyMap[shiftText] === undefined)
+		this.inputKeyMap[shiftText] = keyID;
+}
+
+KeyMapper.prototype.registerEnglishKeyTextData = function(keyID, normalText, shiftText) {
+	if(this.keyboardKeyMap[keyID] === undefined) {
+		this.keyboardKeyMap[keyID] = new KeyData();
+	}
+	this.keyboardKeyMap[keyID].englishKey = new KeyTextData(normalText, shiftText);
+
+	if(this.inputKeyMap[keyID] === undefined)
+		this.inputKeyMap[keyID] = keyID;
+	if(this.inputKeyMap[normalText] === undefined)
+		this.inputKeyMap[normalText] = keyID;
+	if(this.inputKeyMap[shiftText] === undefined)
+		this.inputKeyMap[shiftText] = keyID;
+}
+
+KeyMapper.prototype.registerKoreanKeyTextData = function(keyID, normalText, shiftText) {
+	if(this.keyboardKeyMap[keyID] === undefined) {
+		this.keyboardKeyMap[keyID] = new KeyData();
+	}
+	this.keyboardKeyMap[keyID].koreanKey = new KeyTextData(normalText, shiftText);
+
+	if(this.inputKeyMap[keyID] === undefined)
+		this.inputKeyMap[keyID] = keyID;
+	if(this.inputKeyMap[normalText] === undefined)
+		this.inputKeyMap[normalText] = keyID;
+	if(this.inputKeyMap[shiftText] === undefined)
+		this.inputKeyMap[shiftText] = keyID;
+}
+
+
+KeyMapper.prototype.getNormalText = function(keyID, language) {
+	if(this.keyboardKeyMap[keyID] === undefined) {
+		console.log(keyID);
+		return "?";
+	}
+
+	// console.log(keyID);
+	// console.log(language);
+	// console.log(this.keyboardKeyMap[keyID]);
+	var keyData = this.keyboardKeyMap[keyID];
+	if(language === Keyboard.ENGLISH && keyData.englishKey !== null) {
+		return keyData.englishKey.normalText;
+	}
+	else if(language === Keyboard.KOREAN && keyData.koreanKey !== null) {
+		return keyData.koreanKey.normalText;
+	}
+	else if(keyData.functionKey !== undefined) {
+		return keyData.functionKey.normalText;
+	}
+	else {
+		return "?";
+	}
+}
+
+KeyMapper.prototype.getShiftText = function(keyID, language) {
+	if(this.keyboardKeyMap[keyID] === undefined) {
+		console.log(keyID);
+		return "?";
+	}
+
+	// console.log(keyID);
+	// console.log(language);
+	// console.log(this.keyboardKeyMap[keyID]);
+	var keyData = this.keyboardKeyMap[keyID];
+	if(language === Keyboard.ENGLISH && keyData.englishKey !== null) {
+		return keyData.englishKey.shiftText;
+	}
+	else if(language === Keyboard.KOREAN && keyData.koreanKey !== null) {
+		return keyData.koreanKey.shiftText;
+	}
+	else if(keyData.functionKey !== undefined) {
+		return keyData.functionKey.shiftText;
+	}
+	else {
+		return "?";
+	}
+}
+
+
+
+KeyMapper.prototype.getKeyIDOfText = function(text) {
+	return this.inputKeyMap[text];
+}
+
+KeyMapper.prototype.isShiftText = function(text) {
+	var keyID = this.getKeyIDOfText(text);
+	var keyData = this.keyboardKeyMap[keyID];
+
+	if(keyData.englishKey !== null && keyData.englishKey.shiftText === text)
+		return true;
+	else if(keyData.koreanKey !== null && keyData.koreanKey.shiftText === text && keyData.koreanKey.normalText !== text)
+		return true;
+	else if(keyData.functionKey !== null && keyData.functionKey.shiftText === text)
+		return true;
+
+	return false;
+}

src/game/typing/lib/keyboard.js

@@ -0,0 +1,448 @@
+function Keyboard(keyMapper, language) {
+	this.keyMapper = keyMapper;
+	this.language = language;
+
+	this.keyIndex = 0;
+	this.keyDataList = [];
+	this.keyList = [];
+
+	this.allKeyHash = {};
+	this.normalKeyHash = {};
+
+	this.keyUpReservations = [];
+
+	this.highlightKey = null;
+	this.highlightShiftKey = null;
+
+
+	game.input.keyboard.addCallbacks(this, this.keyDown, this.keyUp, null);
+	// game.input.keyboard.processKeyDown = this.keyDown;
+	// game.input.keyboard.processKeyUp = this.keyUp;
+
+
+	var shiftKey = game.input.keyboard.addKey(Phaser.KeyCode.SHIFT);
+	shiftKey.onDown.add(this.shifted, this);
+	shiftKey.onUp.add(this.unshifted, this);
+
+	this.initKeyData();
+
+	for(var i = 0; i < this.keyDataList.length; i++) {
+		this.keyList[i] = new KeyButton(
+			this.keyDataList[i].x,
+			this.keyDataList[i].y,
+			this.keyDataList[i].width,
+			this.keyDataList[i].height,
+			this.keyDataList[i].normalText,
+			this.keyDataList[i].shiftText,
+			this.keyDataList[i].handSide,
+			this.keyDataList[i].row,
+			this.keyDataList[i].fingerType,
+			this.keyDataList[i].alignType
+		);
+
+		this.allKeyHash[this.keyDataList[i].keyID] = this.keyList[i];
+	}
+}
+
+Keyboard.prototype.hideHighlight = function(text) {
+	var keyID = this.keyMapper.getKeyIDOfText(text);
+	this.allKeyHash[keyID].hideHighlight();
+
+	if(!this.keyMapper.isShiftText(text))
+		return;
+
+	var handSide = this.allKeyHash[keyID].handSide;
+	if(handSide === KeyButton.LEFT_HAND)
+		this.allKeyHash["ShiftRight"].hideHighlight();
+	else
+		this.allKeyHash["ShiftLeft"].hideHighlight();
+}
+
+Keyboard.prototype.showHighlight = function(text) {
+	var keyID = this.keyMapper.getKeyIDOfText(text);
+	var key = this.allKeyHash[keyID];
+	key.showHighlight();
+}
+
+Keyboard.prototype.getKeyOfText = function(text) {
+	var keyID = this.keyMapper.getKeyIDOfText(text);
+	return this.allKeyHash[keyID];
+}
+
+Keyboard.prototype.getKey = function(keyID) {
+	return this.allKeyHash[keyID];
+}
+
+Keyboard.prototype.keyDown = function(char) {
+	var keyCode = char.code;
+	this.setPressedSprite(keyCode);
+}
+
+Keyboard.prototype.setPressedSprite = function(keyCode) {
+	var keyID = this.keyMapper.getKeyIDOfText(keyCode);
+	var key = this.allKeyHash[keyID];
+	if(key === undefined) {
+		console.log(keyCode+ " is pressed but not registered to KeyMapper");
+		return;
+	}
+
+	switch(keyCode) {
+		case "Tab":
+		case "CapsLock":
+		case "MetaLeft":
+		case "MetaRight":
+		console.log(keyCode + " is pressed but not show");
+		return;
+	}
+
+	key.setTargetColor();
+}
+
+Keyboard.prototype.keyUp = function(char) {
+	var keyCode = char.code;
+	this.setNormalSprite(keyCode);
+}
+
+Keyboard.prototype.setNormalSprite = function(keyCode) {
+	var keyID = this.keyMapper.getKeyIDOfText(keyCode);
+	var key = this.allKeyHash[keyID];
+	if(key !== undefined)
+		key.setNormalColor();
+}
+
+
+
+Keyboard.prototype.shifted = function() {
+	for(var i = 0; i < this.keyDataList.length; i++) {
+		this.keyList[i].onShiftPressed();
+	}
+}
+
+Keyboard.prototype.unshifted = function() {
+	for(var i = 0; i < this.keyDataList.length; i++) {
+		this.keyList[i].onShiftUnpressed();
+	}
+}
+
+
+Keyboard.prototype.keyPress = function(char) {
+	// self.checkTypingContents(event);
+	// console.log(char);
+	if(game.input.keyboard.isDown(Phaser.Keyboard.SHIFT))
+		console.log("shift is pressed");
+}
+
+
+Keyboard.prototype.makeKeyDataObject = function(keyID, normalText, shiftText, handSide, row, fingerType, x, y, width, height, alignType) {
+	var keyDataObject = {};
+	keyDataObject.keyID = keyID;
+	keyDataObject.normalText = normalText;
+	keyDataObject.shiftText = shiftText;
+	keyDataObject.handSide = handSide;
+	keyDataObject.row = row;
+	keyDataObject.fingerType = fingerType;
+	keyDataObject.x = x;
+	keyDataObject.y = y;
+	keyDataObject.width = width;
+	keyDataObject.height = height;
+	keyDataObject.alignType = alignType;
+
+	return keyDataObject;
+}
+
+Keyboard.prototype.makeNextNormalKeyDataObject = function(keyID, prevKeyData, normalText, shiftText, handSide, fingerType) {
+	return this.makeKeyDataObject(
+		keyID,
+		normalText,
+		shiftText,
+		handSide,
+		prevKeyData.row,
+		fingerType,
+		prevKeyData.x + prevKeyData.width + Keyboard.KEY_GAP_PX,
+		prevKeyData.y,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.NORMAL_KEY
+	);
+}
+
+
+Keyboard.prototype.addFunctionKeyData = function(keyID, handSide, row, fingerType, x, y, width, height, type) {
+	var normalText = this.keyMapper.getNormalText(keyID, this.language);
+	var shiftText = this.keyMapper.getShiftText(keyID, this.language);
+
+	var newKey = this.makeKeyDataObject(
+		keyID,
+		normalText, shiftText,
+		handSide, row, fingerType,
+		x, y,
+		width, height,
+		type
+	);
+	this.keyDataList[this.keyIndex] = newKey;
+	this.keyIndex++;
+}
+
+Keyboard.prototype.addNextFunctionKeyData = function(keyID, handSide, fingerType, width, height, type) {
+	var prevKey = this.keyDataList[this.keyIndex - 1];
+	var normalText = this.keyMapper.getNormalText(keyID, this.language);
+	var shiftText = this.keyMapper.getShiftText(keyID, this.language);
+
+	var newKey = this.makeKeyDataObject(
+		keyID,
+		normalText, shiftText,
+		handSide, prevKey.row, fingerType,
+		prevKey.x + prevKey.width + Keyboard.KEY_GAP_PX, prevKey.y,
+		width, height,
+		type
+	);
+	this.keyDataList[this.keyIndex] = newKey;
+	this.keyIndex++;
+
+	// this.normalKeyHash[keyID] = newKey;
+}
+
+Keyboard.prototype.addNextNormalKeyData = function(keyID, handSide, fingerType) {
+	var prevKey = this.keyDataList[this.keyIndex - 1];
+	var normalText = this.keyMapper.getNormalText(keyID, this.language);
+	var shiftText = this.keyMapper.getShiftText(keyID, this.language);
+
+	var newKey = this.makeNextNormalKeyDataObject(
+		keyID,
+		prevKey,
+		normalText, shiftText,
+		handSide, fingerType
+	);
+	this.keyDataList[this.keyIndex] = newKey;
+	this.keyIndex++;
+
+	this.normalKeyHash[keyID] = newKey;
+}
+
+
+
+Keyboard.prototype.initKeyData = function(keyMapper) {
+	// row 1
+	this.addFunctionKeyData(
+		"Backquote",
+		KeyButton.LEFT_HAND,
+		Keyboard.ROW_1,
+		KeyButton.LITTLE_FINGER,
+		Keyboard.KEYBOARD_OFFSET_POX_X,
+		Keyboard.ROW_1_POX_Y,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.NORMAL_FUNCTION_KEY
+	);
+	this.addNextNormalKeyData("Digit1", KeyButton.LEFT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("Digit2", KeyButton.LEFT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("Digit3", KeyButton.LEFT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("Digit4", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("Digit5", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("Digit6", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("Digit7", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("Digit8", KeyButton.RIGHT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("Digit9", KeyButton.RIGHT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("Digit0", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("Minus", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("Equal", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextFunctionKeyData(
+		"Backspace",
+		KeyButton.RIGHT_HAND,
+		KeyButton.LITTLE_FINGER,
+		Keyboard.BACKSPACE_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+
+	// row 2
+	this.addFunctionKeyData(
+		"Tab",
+		KeyButton.LEFT_HAND,
+		Keyboard.ROW_2,
+		KeyButton.NONE_FINGER,
+		Keyboard.KEYBOARD_OFFSET_POX_X,
+		Keyboard.ROW_2_POX_Y,
+		Keyboard.TAB_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextNormalKeyData("KeyQ", KeyButton.LEFT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("KeyW", KeyButton.LEFT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("KeyE", KeyButton.LEFT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("KeyR", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyT", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyY", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyU", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyI", KeyButton.RIGHT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("KeyO", KeyButton.RIGHT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("KeyP", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("BracketLeft", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("BracketRight", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("Backslash", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+
+	// row 3
+	this.addFunctionKeyData(
+		"CapsLock",
+		KeyButton.LEFT_HAND,
+		Keyboard.ROW_3,
+		KeyButton.NONE_FINGER,
+		Keyboard.KEYBOARD_OFFSET_POX_X,
+		Keyboard.ROW_3_POX_Y,
+		Keyboard.CAPS_LOCK_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextNormalKeyData("KeyA", KeyButton.LEFT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("KeyS", KeyButton.LEFT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("KeyD", KeyButton.LEFT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("KeyF", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER_BASELINE);
+	this.addNextNormalKeyData("KeyG", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyH", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyJ", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER_BASELINE);
+	this.addNextNormalKeyData("KeyK", KeyButton.RIGHT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("KeyL", KeyButton.RIGHT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("Semicolon", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("Quote", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextFunctionKeyData(
+		"Enter",
+		KeyButton.RIGHT_HAND,
+		KeyButton.LITTLE_FINGER,
+		Keyboard.ENTER_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+
+	// row 4
+	this.addFunctionKeyData(
+		"ShiftLeft",
+		KeyButton.LEFT_HAND,
+		Keyboard.ROW_4,
+		KeyButton.LITTLE_FINGER,
+		Keyboard.KEYBOARD_OFFSET_POX_X,
+		Keyboard.ROW_4_POX_Y,
+		Keyboard.SHIFT_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextNormalKeyData("KeyZ", KeyButton.LEFT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextNormalKeyData("KeyX", KeyButton.LEFT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("KeyC", KeyButton.LEFT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("KeyV", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyB", KeyButton.LEFT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyN", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("KeyM", KeyButton.RIGHT_HAND, KeyButton.INDEX_FINGER);
+	this.addNextNormalKeyData("Comma", KeyButton.RIGHT_HAND, KeyButton.MIDDLE_FINGER);
+	this.addNextNormalKeyData("Period", KeyButton.RIGHT_HAND, KeyButton.RING_FINGER);
+	this.addNextNormalKeyData("Slash", KeyButton.RIGHT_HAND, KeyButton.LITTLE_FINGER);
+	this.addNextFunctionKeyData(
+		"ShiftRight",
+		KeyButton.RIGHT_HAND,
+		KeyButton.LITTLE_FINGER,
+		Keyboard.SHIFT_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+
+	// row 5
+	this.addFunctionKeyData(
+		"ControlLeft",
+		KeyButton.LEFT_HAND,
+		Keyboard.ROW_5,
+		KeyButton.NONE_FINGER,
+		Keyboard.KEYBOARD_OFFSET_POX_X,
+		Keyboard.ROW_5_POX_Y,
+		Keyboard.CTRL_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"window",
+		KeyButton.LEFT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.WINDOW_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"AltLeft",
+		KeyButton.LEFT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.ALT_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"Chinese",
+		KeyButton.LEFT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.CHINESE_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.LEFT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"Space",
+		KeyButton.BOTH_HAND,
+		KeyButton.THUMB,
+		Keyboard.SPACE_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.CENTER_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"KoreanEnglish",
+		KeyButton.RIGHT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.KOREAN_ENGLISH_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"AltRight",
+		KeyButton.RIGHT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.ALT_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+	this.addNextFunctionKeyData(
+		"ControlRight",
+		KeyButton.RIGHT_HAND,
+		KeyButton.NONE_FINGER,
+		Keyboard.CTRL_KEY_WIDTH_PX,
+		Keyboard.DEFAULT_KEY_SIZE_PX,
+		KeyButton.RIGHT_FUNCTION_KEY
+	);
+}
+
+
+Keyboard.ENGLISH						= "english";
+Keyboard.KOREAN							= "korean";
+
+Keyboard.DEFAULT_KEY_SIZE_PX			= 46;
+Keyboard.BACKSPACE_KEY_WIDTH_PX			= Keyboard.DEFAULT_KEY_SIZE_PX * 1.5;
+Keyboard.TAB_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 1.5;
+Keyboard.CAPS_LOCK_KEY_WIDTH_PX			= Keyboard.DEFAULT_KEY_SIZE_PX * 1.9;
+Keyboard.ENTER_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 1.75;
+Keyboard.SHIFT_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 2.4;
+Keyboard.CTRL_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 1.7;
+Keyboard.WINDOW_KEY_WIDTH_PX			= Keyboard.DEFAULT_KEY_SIZE_PX;
+Keyboard.ALT_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 1.5;
+Keyboard.CHINESE_KEY_WIDTH_PX			= Keyboard.DEFAULT_KEY_SIZE_PX;
+Keyboard.SPACE_KEY_WIDTH_PX				= Keyboard.DEFAULT_KEY_SIZE_PX * 5.9;
+Keyboard.KOREAN_ENGLISH_KEY_WIDTH_PX	= Keyboard.DEFAULT_KEY_SIZE_PX;
+
+Keyboard.KEY_GAP_PX					= 6;
+
+Keyboard.KEYBOARD_OFFSET_POX_X		= 150;
+Keyboard.ROW_1_POX_Y				= 320;
+Keyboard.ROW_2_POX_Y				= Keyboard.ROW_1_POX_Y + Keyboard.DEFAULT_KEY_SIZE_PX + Keyboard.KEY_GAP_PX;
+Keyboard.ROW_3_POX_Y				= Keyboard.ROW_2_POX_Y + Keyboard.DEFAULT_KEY_SIZE_PX + Keyboard.KEY_GAP_PX;
+Keyboard.ROW_4_POX_Y				= Keyboard.ROW_3_POX_Y + Keyboard.DEFAULT_KEY_SIZE_PX + Keyboard.KEY_GAP_PX;
+Keyboard.ROW_5_POX_Y				= Keyboard.ROW_4_POX_Y + Keyboard.DEFAULT_KEY_SIZE_PX + Keyboard.KEY_GAP_PX;
+
+
+Keyboard.ROW_1		= 1;
+Keyboard.ROW_2		= 2;
+Keyboard.ROW_3		= 3;
+Keyboard.ROW_4		= 4;
+Keyboard.ROW_5		= 5;

src/game/typing/lib/typing_content_bg.js

@@ -5,7 +5,7 @@ TypingContentBG.prototype.makePracticeContentBG = function() {
 	var CONTENT_Y = 140;
 
 	var bar = game.add.graphics();
-	if(isKoreanTypingStage()) {
+	if(isKoreanTypingApp()) {
 		bar.beginFill(TypingContentBG.COLOR_CONTENT_BG, 1);
 		bar.drawRect(0, CONTENT_Y, GAME_SCREEN_SIZE.x, 120);
 	} else {
@@ -22,11 +22,11 @@ TypingContentBG.prototype.makeTestContentBG = function() {
 	var CONTENT_Y = 260;
 
 	var bar = game.add.graphics();
-	if(isKoreanTypingStage()) {
+	if(isKoreanTypingApp()) {
 		bar.beginFill(TypingContentBG.COLOR_CONTENT_BG, 1);
 		bar.drawRect(0, CONTENT_Y, GAME_SCREEN_SIZE.x, 120);
 	} else {
-		if(isTypingSentenceStage()) {
+		if(isTypingSentenceApp()) {
 			bar.beginFill(TypingContentBG.COLOR_CONTENT_BG, 1);
 			bar.drawRect(0, CONTENT_Y, GAME_SCREEN_SIZE.x, 46);
 			bar.beginFill(TypingContentBG.COLOR_CONTENT_ALPHABET_BG, 1);