Add: key highlight

src/game/typing/practice/game.js

@@ -53,10 +53,11 @@ class TypingPractice {
 
 
 		this.keyMapper = new KeyMapper();
+		this.keyboard = null;
 		if(sessionStorageManager.playingAppName.indexOf("korean") > 0)
-			new Keyboard(this.keyMapper, Keyboard.KOREAN);
+			this.keyboard = new Keyboard(this.keyMapper, Keyboard.KOREAN);
 		else
-			new Keyboard(this.keyMapper, Keyboard.ENGLISH);
+			this.keyboard = new Keyboard(this.keyMapper, Keyboard.ENGLISH);
 
 		game.input.keyboard.processKeyPress = () => {
 			self.checkTypingContents(event);
@@ -95,6 +96,7 @@ class TypingPractice {
 
 	startGame() {
 		this.showTypingPracticeContents();
+		this.showHighlightKey()
 		this.showPlayingWordNumber();
 	}
 
@@ -205,6 +207,7 @@ class TypingPractice {
 	}
 
 	showTypingPracticeContents() {
+		// done
 		let doneIndex = this.typingIndex - 1;
 		if(doneIndex < 0)
 			this.textTypingContentsDone.text = "";
@@ -216,8 +219,12 @@ class TypingPractice {
 			return;
 		}
 
-		this.textTypingContent.text = this.typingRandomContents[this.typingIndex];
 
+		// typing
+		let typingText = this.typingRandomContents[this.typingIndex];
+		this.textTypingContent.text = typingText;
+
+		// preview
 		let previewIndex = this.typingIndex + 1;
 		if(previewIndex > this.typingRandomContents.length - 1)
 			this.textTypingContentPreview.text = "";
@@ -225,6 +232,24 @@ class TypingPractice {
 			this.textTypingContentPreview.text = this.typingRandomContents[previewIndex];
 	}
 
+	hideHighlightKey() {
+		let prevText = this.typingRandomContents[this.typingIndex];
+		if(prevText === undefined)
+			return;
+
+		console.log("hide : " + prevText);
+		this.keyboard.hideHighlight(prevText);
+	}
+
+	showHighlightKey() {
+		let typingText = this.typingRandomContents[this.typingIndex];
+		if(typingText === undefined)
+			return;
+
+		console.log("show : " + typingText);
+		this.keyboard.showHighlight(typingText);
+	}
+
 
 	getKeyCode(text) {
 		return this.keyMapper.getKeyIDOfText(text);
@@ -263,8 +288,11 @@ class TypingPractice {
 
 
 	playNextContent() {
+		this.hideHighlightKey();
+
 		this.typingIndex++;
 		this.showTypingPracticeContents();
+		this.showHighlightKey();
 		this.showPlayingWordNumber();
 	}