Add: WhacAMole typing game

src/game/global/global_variables.js

@@ -51,6 +51,7 @@ function goLogin() {
 	location.href = "login.html";
 }
 
+/*
 function isTypingGame() {
 	if(sessionStorageManager.getPlayingAppName() === null)
 		return false;
@@ -60,8 +61,31 @@ function isTypingGame() {
 
 	return true;
 }
+*/
 
-function isTypingPracticeStage() {
+function isTypingGameApp() {
+	if(sessionStorageManager.getPlayingAppName() == null)
+		return false;
+
+	if(sessionStorageManager.getPlayingAppID < 50 || sessionStorageManager.getPlayingAppID > 100)
+		return false;
+
+	return true;
+}
+
+
+function isMouseGameApp() {
+	if(sessionStorageManager.getPlayingAppName() == null)
+		return false;
+
+	if(sessionStorageManager.getPlayingAppID > 100)
+		return true;
+
+	return false;
+}
+
+
+function isTypingPracticeApp() {
 	let appName = sessionStorageManager.getPlayingAppName();
 
 	if(appName.indexOf("practice_") > -1)
@@ -70,7 +94,7 @@ function isTypingPracticeStage() {
 	return false;
 }
 
-function isTypingTestStage() {
+function isTypingTestApp() {
 	let appName = sessionStorageManager.getPlayingAppName();
 
 	if(appName.indexOf("test_") > -1)
@@ -79,39 +103,39 @@ function isTypingTestStage() {
 	return false;
 }
 
-function isEnglishTypingStage() {
+function isEnglishTypingApp() {
 	if(sessionStorageManager.getPlayingAppName().indexOf("english") > -1)
 		return true;
 
 	return false;
 }
 
-function isKoreanTypingStage() {
+function isKoreanTypingApp() {
 	if(sessionStorageManager.getPlayingAppName().indexOf("korean") > -1)
 		return true;
 
 	return false;
 }
 
-function isTypingWordStage() {
+function isTypingWordApp() {
 	let appName = sessionStorageManager.getPlayingAppName();
 
 	if(appName.indexOf("_word") > -1)
 		return true;
 
-	// if((isTypingPracticeStage() || isTypingTestStage()) && appName.indexOf("_word") > -1)
+	// if((isTypingPracticeApp() || isTypingTestApp()) && appName.indexOf("_word") > -1)
 	// 	return true;
 
 	return false;
 }
 
-function isTypingSentenceStage() {
+function isTypingSentenceApp() {
 	let appName = sessionStorageManager.getPlayingAppName();
 
 	if(appName.indexOf("_sentence") > -1)
 		return true;
 
-	// if((isTypingPracticeStage() || isTypingTestStage()) && appName.indexOf("_sentence") > -1)
+	// if((isTypingPracticeApp() || isTypingTestApp()) && appName.indexOf("_sentence") > -1)
 	// 	return true;
 
 	return false;
@@ -132,4 +156,22 @@ function isExperienceMaestroAccount() {
 }
 
 
+function getGameAppName() {
+	var appName = sessionStorageManager.getPlayingAppName();
+
+	if(isTypingPracticeApp())
+		return "typing_practice";
+	else if(isTypingTestApp())
+		return "typing_test.html";
+	else if(isTypingGameApp()) {
+		if(isKoreanTypingApp())
+			return appName.substring("typing_korean_".length);
+		else if(isEnglishTypingApp())
+			return appName.substring("typing_english_".length);
+	}
+
+	return appName;
+}
+
+
 let textStyleBasic = { font: "bold 32px Arial", fill: "#fff", align: "center", boundsAlignH: "center", boundsAlignV: "middle" };

src/game/result/history_board.js

@@ -45,13 +45,6 @@ HistoryBoard.prototype.calcDate = function(daysBefore) {
 
 
 HistoryBoard.prototype.printRecord = function(index, date, bestRecord) {
-	if(sessionStorageManager.getPlayingAppName().indexOf("typing") < 0)
-		this.printMouseAppHistory(index, date, bestRecord);
-	else
-		this.printTypingAppHistory(index, date, appName, bestRecord);
-}
-
-HistoryBoard.prototype.printMouseAppHistory = function(index, date, bestRecord) {
 	var posX = 60;
 	var posY = game.world.height / 2 + 90 + 30 * index;
 
@@ -68,27 +61,6 @@ HistoryBoard.prototype.printMouseAppHistory = function(index, date, bestRecord)
 		.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
 }
 
-HistoryBoard.prototype.printTypingAppHistory = function(index, date, appName, bestRecord) {
-	var posX = 60;
-	var posY = game.world.height / 2 + 90 + 30 * index;
-
-	var style = { font: "20px Arial", fill: "#ffc", align: "right", boundsAlignH: "right", boundsAlignV: "top" };
-
-	style.boundsAlignH = "center";
-	game.add.text(posX, posY, date, style)
-		.setTextBounds(0, 0, 40, 40)
-		.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
-
-	game.add.text(posX + 60, posY, appName, style)
-		.setTextBounds(0, 0, 60, 60)
-		.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
-
-	style.boundsAlignH = "right";
-	game.add.text(posX + 120, posY, StringUtil.getRecordTextWithoutUnit(bestRecord), style)
-		.setTextBounds(0, 0, 80, 60)
-		.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
-}
-
 HistoryBoard.prototype.printSample = function() {
 	this.printRecord(0, DateUtil.getYYYYMMDD(this.calcDate(2)), 1270);
 	this.printRecord(1, DateUtil.getYYYYMMDD(this.calcDate(3)), 1150);

src/game/result/result.js

@@ -3,7 +3,8 @@ var Result = {
 	preload: function() {
 		game.load.image('icon_fullscreen', '../../../resources/image/icon/fullscreen_white.png');
 
-		Animal.loadResources();
+		if(isTypingPracticeApp() || isTypingTestApp())
+			Animal.loadResources();
 
 		RankingBoard.loadResources();
 		game.load.image('star', '../../../resources/image/ui/star_particle.png');
@@ -67,10 +68,12 @@ var Result = {
 		var record = NumberUtil.numberWithCommas(Math.floor(sessionStorageManager.getRecord()));
 		style.font = "80px Arial";
 
-		if(sessionStorageManager.getPlayingAppID() < 100) {
+		// if(sessionStorageManager.getPlayingAppID() < 100) {
+		if(isTypingPracticeApp() || isTypingTestApp()) {
 			var leftAnimal = new Animal(Animal.TYPE_ANIMATION, game.world.centerX - 200, 150);
 			var animalLevelID = 0;
-			if(sessionStorageManager.getPlayingAppID() < 20)
+			// if(sessionStorageManager.getPlayingAppID() < 20)
+			if(isTypingPracticeApp())
 				animalLevelID = Animal.animalLevelIDByRecord(sessionStorageManager.getRecord(), Animal.TYPE_PRACTICE);
 			else
 				animalLevelID = Animal.animalLevelIDByRecord(sessionStorageManager.getRecord(), Animal.TYPE_TEST);
@@ -147,14 +150,21 @@ var Result = {
 		var startButton = new RoundRectButton(setting, RoundRectButton.NONE_ICON, "다시 시작", this.restartStage);
 	},
 
+
 	restartStage: function() {
-		if(sessionStorageManager.getPlayingAppName().indexOf("practice_") == 0) {
+		location.href = "../../web/client/" + getGameAppName() + ".html";
+		/*
+		if(isTypingPracticeApp())
 			location.href = "../../web/client/typing_practice.html";
-		} else if(sessionStorageManager.getPlayingAppName().indexOf("test_") == 0) {
+		else if(isTypingTestApp())
 			location.href = "../../web/client/typing_test.html";
-		} else {
+		else if(isTypingGameApp())
+			location.href = "../../web/client/" + this.getGameAppName() + ".html";
+		// else if(isMouseGameApp())
+		// 	location.href = "../../web/client/" + this.getGameAppName() + ".html";
+		else
 			location.href = "../../web/client/" + sessionStorageManager.getPlayingAppName() + ".html";
-		}
+		*/
 	}
 
 }

src/game/start/start.js

@@ -15,9 +15,9 @@ var Start = {
 		// top ui
 		var screenTopUI = new ScreenTopUI();
 		screenTopUI.makeBackButton( function() {
-			if(isTypingPracticeStage())
+			if(isTypingPracticeApp())
 				location.href = '../../web/client/menu_typing_practice.html';
-			else if(isTypingTestStage())
+			else if(isTypingTestApp())
 				location.href = '../../web/client/menu_typing_test.html';
 			else
 				location.href = '../../web/client/menu_app.html';
@@ -162,12 +162,19 @@ var Start = {
 
 
 	startStage: function() {
-		if(isTypingPracticeStage())
+		location.href = "../../web/client/" + getGameAppName() + ".html";
+		/*
+		if(isTypingPracticeApp())
 			location.href = "../../web/client/typing_practice.html";
-		else if(isTypingTestStage())
+		else if(isTypingTestApp())
 			location.href = "../../web/client/typing_test.html";
+		else if(isTypingGameApp())
+			location.href = "../../web/client/" + this.getGameAppName() + ".html";
+		// else if(isMouseGameApp())
+		// 	location.href = "../../web/client/" + this.getGameAppName() + ".html";
 		else
 			location.href = "../../web/client/" + sessionStorageManager.getPlayingAppName() + ".html";
+		*/
 	}
 
 }

src/game/typing/alphabet_list/english_basic_left.js

@@ -0,0 +1,5 @@
+var englishBasicLeftWordList = [
+	"a",
+	"s",
+	"d"
+];

src/game/typing/alphabet_list/english_basic_right.js

@@ -0,0 +1,5 @@
+var englishBasicRightWordList = [
+	"j",
+	"k",
+	"l"
+];

src/game/typing/alphabet_list/english_right_upper.js

@@ -2,8 +2,5 @@ var englishRightUpperWordList = [
 	"u",
 	"i",
 	"o",
-	"p",
-	"[",
-	"]",
-	"\\"
+	"p"
 ];

src/game/typing/alphabet_list/korean_basic_left.js

@@ -0,0 +1,5 @@
+var koreanBasicLeftWordList = [
+	"ㅁ",
+	"ㄴ",
+	"ㅇ",
+];

src/game/typing/alphabet_list/korean_basic_right.js

@@ -0,0 +1,4 @@
+var koreanBasicRightWordList = [
+	"ㅏ",
+	"ㅣ"
+];

src/game/typing/alphabet_list/korean_right_upper.js

@@ -2,8 +2,5 @@ var koreanRightUpperWordList = [
 	"ㅕ",
 	"ㅑ",
 	"ㅐ",
-	"ㅔ",
-	"[",
-	"]",
-	"\\"
+	"ㅔ"
 ];

src/game/typing/alphabet_list/korean_right_upper_double.js

@@ -2,8 +2,5 @@ var koreanRightUpperDoubleWordList = [
 	"ㅕ",
 	"ㅑ",
 	"ㅒ",
-	"ㅖ",
-	"[",
-	"]",
-	"\\"
+	"ㅖ"
 ];

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);

src/game/typing/practice/game.js

@@ -182,9 +182,9 @@ var TypingPractice = {
 
 	loadPracticeContent: function() {
 		var appName = "";
-		if(isTypingTestStage())
+		if(isTypingTestApp())
 			appName = sessionStorageManager.getPlayingAppName().substring(5);
-		else if(isTypingPracticeStage())
+		else if(isTypingPracticeApp())
 			appName = sessionStorageManager.getPlayingAppName().substring(9);
 
 		var testContent = [];

src/game/typing/test/game.js

@@ -14,7 +14,7 @@ var TypingTest = {
 		game.stage.backgroundColor = '#4d4d4d';
 
 		// top ui
-		let screenTopUI = new ScreenTopUI();
+		var screenTopUI = new ScreenTopUI();
 		screenTopUI.makeBackButton( function() {
 			sessionStorageManager.resetPlayingAppData();
 			location.href = '../../web/client/menu_typing_test.html';
@@ -32,13 +32,13 @@ var TypingTest = {
 
 
 		// typing content
-		let typingContentBG = new TypingContentBG();
+		var typingContentBG = new TypingContentBG();
 		typingContentBG.makeTestContentBG();
 
-		let TYPING_CONTENT_Y = 320;
+		var TYPING_CONTENT_Y = 320;
 
-		if( (isKoreanTypingStage() && isTypingSentenceStage())
-			|| (isEnglishTypingStage() && isTypingSentenceStage()) )
+		if( (isKoreanTypingApp() && isTypingSentenceApp())
+			|| (isEnglishTypingApp() && isTypingSentenceApp()) )
 			textStyleBasic.font = "bold 48px Arial";
 		else
 			textStyleBasic.font = "bold 84px Arial";
@@ -51,13 +51,13 @@ var TypingTest = {
 			.addColor(TypingTest.COLOR_CONTENT_INPUT, 0);
 		this.textTypingContent.anchor.set(0.5);
 
-		let TYPING_OFFSET_Y = 90;
+		var TYPING_OFFSET_Y = 90;
 		textStyleBasic.font = "32px Arial";
 
-		let textDoneColor = [ '#99994d', '#77774d', '#66664d' ];
+		var textDoneColor = [ '#99994d', '#77774d', '#66664d' ];
 		this.textTypingContentsDone = [];
 		this.textTypingRecordsDone = [];
-		for(let i = 0; i < TypingTest.TYPING_CONTENT_DONE_COUNT; i++) {
+		for(var i = 0; i < TypingTest.TYPING_CONTENT_DONE_COUNT; i++) {
 			this.textTypingContentsDone[i] = game.add.text(
 				game.world.centerX, TYPING_CONTENT_Y + TYPING_OFFSET_Y + i * 50,
 				"", textStyleBasic
@@ -66,8 +66,8 @@ var TypingTest = {
 				.addColor(textDoneColor[i], 0);
 			this.textTypingContentsDone[i].anchor.set(0.5);
 
-			let SCORE_POSITION_X = 900;
-			if(isTypingWordStage())
+			var SCORE_POSITION_X = 900;
+			if(isTypingWordApp())
 				SCORE_POSITION_X = 700;
 
 			this.textTypingRecordsDone[i] = game.add.text(
@@ -79,9 +79,9 @@ var TypingTest = {
 			this.textTypingRecordsDone[i].anchor.set(0.5);
 		}
 
-		let textPreviewColor = [ '#999999', '#888888', '#777777' ];
+		var textPreviewColor = [ '#999999', '#888888', '#777777' ];
 		this.textTypingContentPreview = [];
-		for(let i = 0; i < TypingTest.TYPING_CONTENT_PREVIEW_COUNT; i++) {
+		for(var i = 0; i < TypingTest.TYPING_CONTENT_PREVIEW_COUNT; i++) {
 			this.textTypingContentPreview[i] = game.add.text(
 				game.world.centerX, TYPING_CONTENT_Y - TYPING_OFFSET_Y - i * 50,
 				"", textStyleBasic
@@ -105,7 +105,7 @@ var TypingTest = {
 
 
 		// bottom ui
-		let screenBottomUI = new ScreenBottomUI();
+		var screenBottomUI = new ScreenBottomUI();
 		screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.getBestRecord());
 		screenBottomUI.printCenterText(sessionStorageManager.getPlayingAppKoreanName());
 		screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
@@ -138,7 +138,7 @@ var TypingTest = {
 		this.countDownText.text = this.countDownNumber.toString();
 		this.countDownText.alpha = 1;
 
-		let countDownTween = game.add.tween(this.countDownText);
+		var countDownTween = game.add.tween(this.countDownText);
 		countDownTween.to( { alpha: 0 }, GAME_SCREEN_SIZE.x, Phaser.Easing.Linear.None, true);
 		countDownTween.onComplete.add(this.tweenCountDown, this);
 
@@ -154,7 +154,7 @@ var TypingTest = {
 	},
 
 	gameOver: function() {
-		let gameOverText = new GameOverText();
+		var gameOverText = new GameOverText();
 
 		this.animalOnTitle.stopAnimation();
 
@@ -170,12 +170,12 @@ var TypingTest = {
 	},
 
 	initTypingData: function() {
-		let typingTextMan = new TypingTextManager();
+		var typingTextMan = new TypingTextManager();
 
-		let typingPracticeContents = this.getTypingTestContents();
+		var typingPracticeContents = this.getTypingTestContents();
 		// console.log(typingPracticeContents);
 		typingTextMan.makeTestContents(typingPracticeContents);
-		let wordCountForStage = TypingTest.WORD_COUNT_FOR_STAGE;
+		var wordCountForStage = TypingTest.WORD_COUNT_FOR_STAGE;
 		if(isDebugMode())
 			wordCountForStage = 3;
 		typingTextMan.slice(0, wordCountForStage);
@@ -195,14 +195,14 @@ var TypingTest = {
 
 
 	getTypingTestContents: function() {
-		let typingTestContents = this.loadTestContent();
+		var typingTestContents = this.loadTestContent();
 		// console.log('playingStageData.language : ' + playingStageData.language);
 		// console.log('playingStageData.level : ' + playingStageData.level);
 		// console.log('typingTestContents : ' + typingTestContents);
 
 		this.typingRecordForLines = [];
 		this.typingElapsedTime = [];
-		for(let i = 0; i < typingTestContents.length; i++) {
+		for(var i = 0; i < typingTestContents.length; i++) {
 			this.typingRecordForLines[i] = 0;
 			this.typingElapsedTime[i] = 0;
 		}
@@ -211,13 +211,13 @@ var TypingTest = {
 	},
 
 	loadTestContent: function() {
-		let appName = "";
-		if(isTypingTestStage())
+		var appName = "";
+		if(isTypingTestApp())
 			appName = sessionStorageManager.getPlayingAppName().substring(5);
-		else if(isTypingPracticeStage())
+		else if(isTypingPracticeApp())
 			appName = sessionStorageManager.getPlayingAppName().substring(9);
 
-		let testContent = [];
+		var testContent = [];
 		switch(appName) {
 			case "korean_basic":
 			testContent = koreanBasicWordList;
@@ -280,8 +280,8 @@ var TypingTest = {
 	},
 
 	showTypingTestContents: function() {
-		for(let i = 0; i < TypingTest.TYPING_CONTENT_DONE_COUNT; i++) {
-			let doneIndex = this.typingIndex - i - 1;
+		for(var i = 0; i < TypingTest.TYPING_CONTENT_DONE_COUNT; i++) {
+			var doneIndex = this.typingIndex - i - 1;
 			if(doneIndex < 0) {
 				this.textTypingContentsDone[i].text = "";
 				this.textTypingRecordsDone[i].text = "";
@@ -298,8 +298,8 @@ var TypingTest = {
 
 		this.textTypingContent.text = this.typingRandomContents[this.typingIndex];
 
-		for(let i = 0; i < TypingTest.TYPING_CONTENT_PREVIEW_COUNT; i++) {
-			let previewIndex = this.typingIndex + i + 1;
+		for(var i = 0; i < TypingTest.TYPING_CONTENT_PREVIEW_COUNT; i++) {
+			var previewIndex = this.typingIndex + i + 1;
 			if(previewIndex < this.typingRandomContents.length)
 				this.textTypingContentPreview[i].text = this.typingRandomContents[previewIndex];
 			else
@@ -316,8 +316,8 @@ var TypingTest = {
 	checkTypingContents: function(evnet) {
 		if(event.keyCode == Phaser.Keyboard.ENTER) {
 			// console.log("### enter ###");
-			let inputContent = this.inputTextContent.canvasInput.value();
-			let typingContent = this.typingRandomContents[this.typingIndex];
+			var inputContent = this.inputTextContent.canvasInput.value();
+			var typingContent = this.typingRandomContents[this.typingIndex];
 
 			if(inputContent === typingContent) {
 				this.calculateTypingRecord(typingContent);
@@ -340,8 +340,8 @@ var TypingTest = {
 	},
 
 	showTypingContentHighlight: function() {
-		let typingContent = this.typingRandomContents[this.typingIndex];
-		let inputContent = this.inputTextContent.canvasInput.value();
+		var typingContent = this.typingRandomContents[this.typingIndex];
+		var inputContent = this.inputTextContent.canvasInput.value();
 
 		this.textTypingContent.clearColors();
 		this.textTypingContent.addColor(TypingTest.COLOR_CONTENT_RIGHT, 0);
@@ -349,8 +349,8 @@ var TypingTest = {
 		if(typingContent == null)
 			return;
 
-		let typingContentLength = typingContent.length;
-		for(let i = 0; i < typingContentLength; i++) {
+		var typingContentLength = typingContent.length;
+		for(var i = 0; i < typingContentLength; i++) {
 			// console.log("typingContent.charAt(i) : " + typingContent.charAt(i));
 			// console.log("inputContent.charAt(i) : " + inputContent.charAt(i));
 
@@ -368,22 +368,22 @@ var TypingTest = {
 		this.timeTypingEnd = game.time.elapsedSince(0);
 		// console.log('this.timeTypingEnd : ' + this.timeTypingEnd);
 
-		let elapsedTimeMS = this.timeTypingEnd - this.timeTypingStart;
+		var elapsedTimeMS = this.timeTypingEnd - this.timeTypingStart;
 		// console.log('elapsedTimeMS : ' + elapsedTimeMS);
 
-		let typingContentLength = StringUtil.getUnicodeAlphabetCount(typingContent);
+		var typingContentLength = StringUtil.getUnicodeAlphabetCount(typingContent);
 		// console.log('typingContentLength : ' + typingContentLength);
-		let typingContentPlusEnterCount = typingContentLength + TypingTest.TYPING_COUNT_PLUS_ENTER;
+		var typingContentPlusEnterCount = typingContentLength + TypingTest.TYPING_COUNT_PLUS_ENTER;
 
-		let typingRecord = (typingContentPlusEnterCount + TypingTest.TYPING_COUNT_PLUS_ENTER) * 60000 / elapsedTimeMS;
+		var typingRecord = (typingContentPlusEnterCount + TypingTest.TYPING_COUNT_PLUS_ENTER) * 60000 / elapsedTimeMS;
 
 		this.typingElapsedTime[this.typingIndex] = elapsedTimeMS;
 		this.typingLetterCountTotal += typingContentPlusEnterCount;
 		this.typingRecordForLines[this.typingIndex] = typingRecord;
 		// console.log(this.typingRecordForLines[this.typingIndex]);
 
-		let typingElapsedTimeTotal = 0;
-		for(let i = 0; i <= this.typingIndex; i++) {
+		var typingElapsedTimeTotal = 0;
+		for(var i = 0; i <= this.typingIndex; i++) {
 			// console.log('i : ' + i + ' - time : ' + this.typingElapsedTime[i]);
 			typingElapsedTimeTotal += this.typingElapsedTime[i];
 		}
@@ -392,7 +392,7 @@ var TypingTest = {
 		// console.log(typingElapsedTimeTotal);
 		// console.log(typingRecordTotal);
 
-		let typingRecordTotalInteger = Math.floor(this.typingRecordTotal);
+		var typingRecordTotalInteger = Math.floor(this.typingRecordTotal);
 		this.averageTypingSpeedText.print(typingRecordTotalInteger);
 		// console.log('-------------- total --------------');
 		// console.log('typingLetterCountTotal : ' + this.typingLetterCountTotal);
@@ -400,7 +400,7 @@ var TypingTest = {
 		// console.log('typingRecordTotal : ' + typingRecordTotal);
 		// console.log('-----------------------------------');
 
-		let animalLevelID = Animal.animalLevelIDByRecord(typingRecordTotalInteger, Animal.TYPE_TEST);
+		var animalLevelID = Animal.animalLevelIDByRecord(typingRecordTotalInteger, Animal.TYPE_TEST);
 		this.animalOnTitle.startAnimation(Animal.SPECIES_DATA[animalLevelID]);
 		this.animalOnTitle.tweenAnimation(Animal.ANIMATION_TYPE_CHANGE);
 
@@ -419,7 +419,7 @@ var TypingTest = {
 
 	setTimeTypingStart: function() {
 		this.timeTypingStart = game.time.elapsedSince(0);
-		let timeGap = this.timeTypingStart - this.timeTypingEnd;
+		var timeGap = this.timeTypingStart - this.timeTypingEnd;
 
 		if(timeGap < 50)
 			return;

src/game/typing/whac_a_mole/game.js

@@ -0,0 +1,391 @@
+var TypingPractice = {
+
+	create: function() {
+		var self = this;
+
+		this.isOnStage = false;
+
+		this.initTypingData();
+		sessionStorageManager.setIsNewBestRecord(false);
+
+		var experienceAppTimer = new ExperienceAppTimer();
+		experienceAppTimer.setTimeOverListener(
+			(function() { this.gameOver(); }).bind(this)
+		);
+
+		game.stage.backgroundColor = '#4d4d4d';
+
+		// top ui
+		var screenTopUI = new ScreenTopUI();
+		screenTopUI.makeBackButton( function() {
+			sessionStorageManager.resetPlayingAppData();
+			location.href = '../../web/client/menu_app.html';
+		});
+		screenTopUI.makeFullScreenButton();
+
+
+		this.scoreManager = new ScoreManager();
+		this.scoreBoard = new ScoreBoard();
+		this.scoreManager.addOnChangeScoreListener(
+			(function(score) {
+				sessionStorageManager.setRecord(score);
+				this.scoreBoard.printScore(NumberUtil.numberWithCommas(score));
+			}).bind(this)
+		);
+		this.scoreManager.addOnChangeHighScoreListener(
+			(function(highScore) {
+				console.log(highScore);
+				sessionStorageManager.setBestRecord(highScore);
+				sessionStorageManager.setIsNewBestRecrd(true);
+				this.screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.getBestRecord());
+			}).bind(this)
+		);
+
+		// var heartManager = new HeartManager();
+
+
+		this.stageTimer = new StageTimer( TypingPractice.STAGE_TIMER_SEC, (function() {
+			self.isOnStage = false;
+
+			// self.goResult();
+			self.gameOver();
+		}));
+
+
+		// typing content
+		var typingContentBG = new TypingContentBG();
+		typingContentBG.makePracticeContentBG();
+
+		var TYPING_CONTENT_Y = 200;
+
+		textStyleBasic.font = "bold 84px Times New Roman";
+		this.textTypingContent = game.add.text(game.world.centerX, TYPING_CONTENT_Y, "", textStyleBasic)
+		.setShadow(3, 3, 'rgba(0, 0, 0, 1)', 2)
+		.addColor(TypingPractice.COLOR_CONTENT_INPUT, 0);
+		this.textTypingContent.anchor.set(0.5);
+
+		this.textTypingBracket = game.add.text(game.world.centerX, TYPING_CONTENT_Y, "[      ]", textStyleBasic)
+		.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2)
+		.addColor(TypingPractice.COLOR_BRACKET, 0);
+		this.textTypingBracket.anchor.set(0.5);
+
+
+		// textStyleBasic.font = "32px Arial";
+		var OFFSET_WORD_X = 70;
+
+		var textDoneColor = [ '#99994d', '#77774d', '#66664d' ];
+		this.textTypingContentsDone = [];
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_DONE_COUNT; i++) {
+			this.textTypingContentsDone[i] = game.add.text(
+				game.world.centerX - 200 - i * OFFSET_WORD_X, TYPING_CONTENT_Y,
+				"", textStyleBasic
+			);
+			this.textTypingContentsDone[i].addColor(textDoneColor[0], 0);
+			this.textTypingContentsDone[i].anchor.set(0.5);
+		}
+
+		var textPreviewColor = [ '#666666', '#888888', '#777777' ];
+		this.textTypingContentPreview = [];
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_PREVIEW_COUNT; i++) {
+			this.textTypingContentPreview[i] = game.add.text(
+				game.world.centerX + 200 + i * OFFSET_WORD_X,
+				TYPING_CONTENT_Y, "", textStyleBasic
+			);
+			this.textTypingContentPreview[i].addColor(textPreviewColor[0], 0);
+			this.textTypingContentPreview[i].anchor.set(0.5);
+		}
+
+		// keyboard
+		this.keyMapper = new KeyMapper();
+		this.keyboard = null;
+		if(sessionStorageManager.getPlayingAppName().indexOf("korean") > 0)
+			this.keyboard = new Keyboard(this.keyMapper, Keyboard.KOREAN);
+		else
+			this.keyboard = new Keyboard(this.keyMapper, Keyboard.ENGLISH);
+
+		game.input.keyboard.processKeyPress = (function() {
+			if(self.isOnStage === false)
+				return;
+
+			self.checkTypingContents(event);
+		});
+		this.shiftKey = game.input.keyboard.addKey(Phaser.Keyboard.SHIFT);
+
+
+		// bottom ui
+		this.screenBottomUI = new ScreenBottomUI();
+		// screenBottomUI.printBottomUILeftText("");
+		this.screenBottomUI.printCenterText(sessionStorageManager.getPlayingAppKoreanName());
+		this.screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
+
+
+		this.startGame();
+		// this.countDown();
+	},
+
+	startGame: function() {
+		this.isOnStage = true;
+		this.stageTimer.start();
+
+		this.showTypingPracticeContents();
+		this.showHighlightKey();
+	},
+
+	gameOver: function() {
+		this.isOnStage = false;
+
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_DONE_COUNT; i++) {
+			this.textTypingContentsDone[i].text = "";
+		}
+
+		this.textTypingBracket.text = "";
+
+		this.textTypingContent.clearColors();
+		this.textTypingContent.addColor(TypingPractice.COLOR_CONTENT_RIGHT, 0);
+		this.textTypingContent.text = "= 연습 끝 =";
+
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_PREVIEW_COUNT; i++) {
+			this.textTypingContentPreview[i].text = "";
+		}
+
+		var gameOverText = new GameOverText();
+		game.time.events.add(Phaser.Timer.SECOND * 2, this.goResult, this);
+	},
+
+	goResult: function() {
+		sessionStorageManager.setRecord(this.scoreManager.getScore());
+		if(sessionStorageManager.getRecord() > sessionStorageManager.getBestRecord())
+			sessionStorageManager.setBestRecord(sessionStorageManager.getRecord());
+
+		location.href = '../../web/client/result.html';
+	},
+
+	initTypingData: function() {
+		var typingTextMan = new TypingTextManager();
+
+		var typingPracticeContents = this.loadLetters();
+		// console.log(typingPracticeContents);
+		// typingTextMan.makePracticeContents(typingPracticeContents, 30);
+		// this.typingRandomContents = typingTextMan.getContents();
+		this.typingRandomContents = typingPracticeContents;
+		// console.log(this.typingRandomContents);
+		this.typingContentLength = this.typingRandomContents.length;
+		this.typingIndex = 0;
+	},
+
+
+	shuffleLettetFollowingFKey: function(wordList) {
+		var typingTextMan = new TypingTextManager();
+
+		var letters = [];
+		var shuffleLetters = typingTextMan.getShuffledArray(wordList);
+		for(var i = 0; i < shuffleLetters.length; i++) {
+			if(isKoreanTypingApp())
+				letters.push("ㄹ");
+			else
+				letters.push("f");
+
+			letters.push(shuffleLetters[i]);
+		}
+
+		return letters;
+	},
+
+	shuffleLettetFollowingJKey: function(wordList) {
+		var typingTextMan = new TypingTextManager();
+
+		var letters = [];
+		var shuffleLetters = typingTextMan.getShuffledArray(wordList);
+		for(var i = 0; i < shuffleLetters.length; i++) {
+			letters.push(shuffleLetters[i]);
+
+			if(isKoreanTypingApp())
+				letters.push("ㅓ");
+			else
+				letters.push("j");
+		}
+
+		return letters;
+	},
+
+	isLeftHandLetter: function(letter) {
+		switch(letter) {
+			case "t":
+			case "g":
+			case "b":
+			case "ㅅ":
+			case "ㅎ":
+			case "ㅠ":
+			return true;
+		}
+
+		return false;
+	},
+
+	shuffleLettetFollowingFJKey: function(wordList) {
+		var typingTextMan = new TypingTextManager();
+
+		var letters = [];
+		var shuffleLetters = typingTextMan.getShuffledArray(wordList);
+		for(var i = 0; i < shuffleLetters.length; i++) {
+			if(this.isLeftHandLetter(shuffleLetters[i])) {
+				letters.push(shuffleLetters[i]);
+
+				if(isKoreanTypingApp())
+					letters.push("ㅓ");
+				else
+					letters.push("j");
+			} else {	// right hand letter
+				if(isKoreanTypingApp())
+					letters.push("ㄹ");
+				else
+					letters.push("f");
+
+				letters.push(shuffleLetters[i]);
+			}
+		}
+
+		return letters;
+	},
+
+	loadLetters: function() {
+		var appName = "";
+		var letters = [];
+
+		if(isKoreanTypingApp()) {
+			letters = letters.concat(["ㄹ", "ㅓ"]);
+			letters = letters.concat(this.shuffleLettetFollowingJKey(koreanBasicLeftWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFKey(koreanBasicRightWordList));
+
+			letters = letters.concat(this.shuffleLettetFollowingJKey(koreanLeftUpperWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFKey(koreanRightUpperWordList));
+			letters = letters.concat(this.shuffleLettetFollowingJKey(koreanLeftLowerWordList));
+
+			// letters = letters.concat(this.shuffleLettetFollowingFKey(koreanRightLowerWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFJKey(koreanSecondFingerWordList.concat("ㅡ")));
+
+			// letters = letters.concat(this.shuffleLettetFollowingJKey(koreanLeftUpperDoubleWordList));
+			// letters = letters.concat(this.shuffleLettetFollowingFKey(koreanRightUpperDoubleWordList));
+		}
+		else {	// isEnglishTypingApp
+			letters = letters.concat(["f", "j"]);
+			letters = letters.concat(this.shuffleLettetFollowingJKey(englishBasicLeftWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFKey(englishBasicRightWordList));
+
+			letters = letters.concat(this.shuffleLettetFollowingJKey(englishLeftUpperWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFKey(englishRightUpperWordList));
+			letters = letters.concat(this.shuffleLettetFollowingJKey(englishLeftLowerWordList));
+
+			// letters = letters.concat(this.shuffleLettetFollowingFKey(englishRightLowerWordList));
+			letters = letters.concat(this.shuffleLettetFollowingFJKey(englishSecondFingerWordList.concat("m")));
+
+			// letters = letters.concat(this.shuffleLettetFollowingJKey(englishLeftUpperDoubleWordList));
+			// letters = letters.concat(this.shuffleLettetFollowingFKey(englishRightUpperDoubleWordList));
+		}
+
+		console.log(letters);
+
+		return letters;
+	},
+
+	showTypingPracticeContents: function() {
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_DONE_COUNT; i++) {
+			var doneIndex = this.typingIndex - i - 1;
+			if(doneIndex < 0) {
+				this.textTypingContentsDone[i].text = "";
+			} else {
+				this.textTypingContentsDone[i].text = this.typingRandomContents[doneIndex];
+			}
+		}
+
+		if(this.typingIndex == this.typingContentLength) {
+			this.textTypingContent.text = "";
+			return;
+		}
+
+		this.textTypingContent.text = this.typingRandomContents[this.typingIndex];
+
+		for(var i = 0; i < TypingPractice.TYPING_CONTENT_PREVIEW_COUNT; i++) {
+			var previewIndex = this.typingIndex + i + 1;
+			if(previewIndex < this.typingRandomContents.length)
+				this.textTypingContentPreview[i].text = this.typingRandomContents[previewIndex];
+			else
+				this.textTypingContentPreview[i].text = "";
+		}
+	},
+
+	hideHighlightKey: function() {
+		var prevText = this.typingRandomContents[this.typingIndex];
+		if(prevText === undefined)
+			return;
+
+		this.keyboard.hideHighlight(prevText);
+	},
+
+	showHighlightKey: function() {
+		var typingText = this.typingRandomContents[this.typingIndex];
+		if(typingText === undefined)
+			return;
+
+		// this.keyboard.showHighlight(typingText, this.leftHand, this.rightHand);
+	},
+
+	getKeyCode: function(text) {
+		return this.keyMapper.getKeyIDOfText(text);
+	},
+
+	isKeyPressed: function(inputContent, typingContent) {
+		var inputContentKeyCode = this.getKeyCode(inputContent);
+		var typingContentKeyCode = this.getKeyCode(typingContent);
+
+		if(inputContentKeyCode !== typingContentKeyCode)
+			return false;
+
+		var isShiftInputContent = this.shiftKey.isDown;
+		var isShiftTypingContent = this.keyMapper.isShiftText(typingContent);
+
+		if(isShiftInputContent !== isShiftTypingContent)
+			return false;
+
+		return true;
+	},
+
+	checkTypingContents: function(evnet) {
+		var inputContent = event.key;
+		var typingContent = this.typingRandomContents[this.typingIndex];
+
+		if(this.isKeyPressed(inputContent, typingContent)) {
+			// this.typingScore.increase();
+			this.scoreManager.plusScore(1);
+
+			this.playNextContent();
+
+			if(this.typingIndex === this.typingContentLength) {
+				// this.goResult();
+			}
+		} else {
+			this.scoreManager.resetScore();
+		}
+	},
+
+	playNextContent: function() {
+		this.hideHighlightKey();
+
+		this.typingIndex++;
+		this.showTypingPracticeContents();
+		this.showHighlightKey();
+	}
+}
+
+
+TypingPractice.TYPING_CONTENT_PREVIEW_COUNT	= 3;
+TypingPractice.TYPING_CONTENT_DONE_COUNT	= 3;
+// TypingPractice.TYPING_COUNT_PLUS_ENTER		= 1;
+
+// TypingPractice.OFFSET_RIGHT_ALIGN			= 10;
+
+TypingPractice.STAGE_TIMER_SEC				= 60;
+
+TypingPractice.COLOR_CONTENT_INPUT			= "#dddddd";
+TypingPractice.COLOR_BRACKET				= "#dddd70";
+TypingPractice.COLOR_CONTENT_RIGHT			= "#ffff4d";

src/game/typing/whac_a_mole/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/whac_a_mole/loading.js

@@ -0,0 +1,100 @@
+var Loading = {
+
+	preload: function() {
+		// this.game.load.image('loadingbar', './image/phaser.png');
+	},
+
+	create: function() {
+		// var userID = sessionStorage.getItem("UserID");
+		// console.log("userID : " + userID);
+
+		// this.game.stage.backgroundColor = '#4d4d4d';
+
+		// //	Progress report
+  //   	this.textProgress = game.add.text(game.world.centerX, 100, '로딩중 . . .', textStyleBasic);
+		// this.textProgress.anchor.setTo(0.5, 0.4);
+		// this.textProgress.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
+
+		// // Preload bar
+		// this.preloadBar = this.add.sprite(game.world.centerX, game.world.centerY, 'loadingbar');
+		// this.preloadBar.anchor.setTo(0.5);
+		// this.preloadBar.alpha = 0;
+
+		this.game.load.onFileComplete.add(this.fileComplete, this);
+		this.game.load.onLoadComplete.add(this.loadComplete, this);
+
+		this.startLoading();
+	},
+
+	startLoading: function() {
+		this.game.load.image('icon_fullscreen',	'../../../resources/image/icon/fullscreen_white.png');
+
+		this.game.load.image('hand_palm',	'../../../resources/image/ui/hand_palm.png');
+		this.game.load.image('hand_thumb',	'../../../resources/image/ui/hand_thumb.png');
+		this.game.load.image('hand_index_finger',	'../../../resources/image/ui/hand_index_finger.png');
+		this.game.load.image('hand_middle_finger',	'../../../resources/image/ui/hand_middle_finger.png');
+		this.game.load.image('hand_little_finger',	'../../../resources/image/ui/hand_little_finger.png');
+		this.game.load.image('hand_ring_finger',	'../../../resources/image/ui/hand_ring_finger.png');
+
+		Animal.loadResources();
+
+
+		// this.game.load.image('hand_left',	'../../../resources/image/ui/hand_left.png');
+		// this.game.load.image('hand_right',	'../../../resources/image/ui/hand_right.png');
+		// this.game.load.image('a', '../../../resources/image/icon/fullscreen_white.png');
+		// this.game.load.image('b', '../../../resources/image/icon/fullscreen_white.png');
+		// this.game.load.image('c', '../../../resources/image/icon/fullscreen_white.png');
+		// this.game.load.image('d', '../../../resources/image/icon/fullscreen_white.png');
+		// this.game.load.image('a', './image/phaser.png');
+		// this.game.load.image('b', './image/phaser.png');
+		// this.game.load.image('c', './image/phaser.png');
+		// this.game.load.image('d', './image/phaser.png');
+		// this.game.load.image('e', './image/phaser.png');
+		// this.game.load.image('g', './image/phaser.png');
+		// this.game.load.image('e', './image/phaser.png');
+		// this.game.load.image('f', './image/phaser.png');
+		// this.game.load.image('g', './image/phaser.png');
+		// this.game.load.image('h', './image/phaser.png');
+
+		// this.game.load.image('phaser', './image/phaser.png');
+		// this.game.load.spritesheet('button', './image/button_basic.png', 200, 100);
+		// this.game.load.image('star', './image/star_particle.png');
+		// this.game.load.image('medal_gold', './image/medal_gold.png');
+		// this.game.load.image('medal_silver', './image/medal_silver.png');
+		// this.game.load.image('medal_bronze', './image/medal_bronze.png');
+
+		this.game.load.start();
+	},
+
+	fileComplete: function(progress, cacheKey, success, totalLoaded, totalFiles) {
+		// this.preloadBar.alpha = progress / 100;
+
+		// console.log('progress : ' + progress);
+
+		// text.setText("File Complete: " + progress + "% - " + totalLoaded + " out of " + totalFiles);
+
+		// var newImage = game.add.image(x, y, cacheKey);
+		// newImage.scale.set(0.3);
+
+		// x += newImage.width + 20;
+		// if (x > 700)
+		// {
+		// 	x = 32;
+		// 	y += 332;
+		// }
+	},
+
+	loadComplete: function(progress, cacheKey, success, totalLoaded, totalFiles) {
+		// this.preloadBar.alpha = 1;
+
+		if(isDebugMode()) {
+			this.state.start('TypingPractice');
+			return;
+		}
+
+		this.state.start('TypingPractice');
+		// this.startMenu();
+		// this.startTypingTestStage();
+		// this.startTypingTestResult();
+	}
+}

src/game/typing/whac_a_mole/main.js

@@ -0,0 +1,16 @@
+/////////////////////////////
+// Main game
+
+const CONTENT_ID = "Typing Practice";
+
+let game = new Phaser.Game(
+	GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y,
+	Phaser.CANVAS, CONTENT_ID,
+	this, false, false
+);
+
+game.state.add('Loading', Loading);
+game.state.start('Loading');
+
+game.state.add('TypingPractice', TypingPractice);
+// game.state.add('Menu', Menu);

src/game/typing/whac_a_mole/stage_timer.js

@@ -0,0 +1,69 @@
+function StageTimer(stageTimerSec, onTimeOver) {
+	this.stageTimerSec = stageTimerSec;
+	this.onTimeOver = onTimeOver;
+
+	var fontStyle = StageTimer.DEFAULT_TEXT_FONT;
+
+	fontStyle.align = "right";
+	fontStyle.boundsAlignH = "right";
+	this.timerText = game.add.text(game.world.width - 300, 0, "", fontStyle)
+		.setTextBounds(0, 0, 200, StageTimer.FONT_HEIGHT_PX);
+
+	// var grd = this.label.context.createLinearGradient(0, 0, 0, StageTimer.FONT_HEIGHT_PX);
+	// grd.addColorStop(0, '#8ED6FF');
+	// grd.addColorStop(1, '#004CB3');
+	// this.label.fill = grd;
+	// this.scoreText.fill = grd;
+
+	// this.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
+	// this.label.stroke = '#000';
+	// this.label.strokeThickness = 3;
+
+	this.timerEvent = null;
+};
+
+StageTimer.prototype.start = function() {
+	this.timeLeft = this.stageTimerSec;
+	this.printTime();
+	if(this.timerEvent === null)
+		this.timerEvent = game.time.events.loop(Phaser.Timer.SECOND, this.updateTimer, this);
+}
+
+StageTimer.prototype.pause = function() {
+}
+
+StageTimer.prototype.stop = function() {
+	if(this.timerEvent)
+		this.removeTimer();
+	this.timerText.text = "시간 끝";
+}
+
+StageTimer.prototype.updateTimer = function() {
+	this.timeLeft--;
+	if(this.timeLeft === 0) {
+		this.stop();
+		this.onTimeOver();
+	} else {
+		this.printTime();
+	}
+}
+
+StageTimer.prototype.printTime = function() {
+	this.timerText.text = this.timeLeft.toString() + "초";
+}
+
+StageTimer.prototype.removeTimer = function() {
+	game.time.events.remove(this.timerEvent);
+	this.timerEvent = null;
+}
+
+
+StageTimer.FONT_HEIGHT_PX		= 70;
+
+StageTimer.DEFAULT_TEXT_FONT	= {
+	font: "38px Arial",
+	align: "center",
+	boundsAlignH: "center",		// left, center. right
+	boundsAlignV: "middle", 	// top, middle, bottom
+	fill: "#fff"
+};

src/game/typing/whac_a_mole/typing_score.js

@@ -0,0 +1,54 @@
+function TypingScore() {
+	this.typingCount = 0;
+
+	var fontStyle = TypingScore.DEFAULT_TEXT_FONT;
+
+	fontStyle.align = "right";
+	fontStyle.boundsAlignH = "right";
+	this.scoreTitleText = game.add.text(game.world.width / 2 - 40, TypingScore.SCORE_POS_Y, "연속 성공 타수 : ", fontStyle)
+	this.scoreTitleText.anchor.set(0.5);
+
+	fontStyle.align = "left";
+	fontStyle.boundsAlignH = "left";
+	this.scoreText = game.add.text(game.world.width / 2 + 100, TypingScore.SCORE_POS_Y, "0", fontStyle)
+	this.scoreText.anchor.set(0.5);
+
+	// var grd = this.scoreText.context.createLinearGradient(0, 0, 0, TypingScore.SCORE_POS_Y);
+	// grd.addColorStop(0, '#8ED6FF');
+	// grd.addColorStop(1, '#004CB3');
+	// this.scoreText.fill = grd;
+	// this.scoreText.fill = grd;
+
+	// this.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
+	// this.scoreText.stroke = '#000';
+	// this.scoreText.strokeThickness = 3;
+};
+
+TypingScore.prototype.score = function() {
+	return this.typingCount;
+}
+
+TypingScore.prototype.increase = function() {
+	this.typingCount++;
+	this.print(this.typingCount);
+}
+
+TypingScore.prototype.reset = function() {
+	this.typingCount = 0;
+	this.print(this.typingCount);
+}
+
+TypingScore.prototype.print = function(typingCount) {
+	this.scoreText.text = typingCount;
+}
+
+
+TypingScore.SCORE_POS_Y		= 35;
+
+TypingScore.DEFAULT_TEXT_FONT	= {
+font: "38px Arial",
+align: "center",
+boundsAlignH: "center",		// left, center. right
+boundsAlignV: "middle", 	// top, middle, bottom
+fill: "#fff"
+};