Add: WhacAMole typing game
This commit is contained in:
@@ -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";
|
||||
@@ -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;
|
||||
@@ -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();
|
||||
}
|
||||
}
|
||||
@@ -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);
|
||||
@@ -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"
|
||||
};
|
||||
@@ -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"
|
||||
};
|
||||
Reference in New Issue
Block a user