jisangs/chocomae
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: typing text width, typing text background color

Browse Source
This commit is contained in:
Jisang Park
2019-06-25 18:37:59 +09:00
parent 81550bb5d5
commit eda975e398
3 changed files with 50 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/typing/examination/game.js
+45 -34
View File
@@ -30,7 +30,7 @@ var TypingExamination = {
(function() { this.timeOver(); }).bind(this)
);
game.stage.backgroundColor = '#4d4d4d';
game.stage.backgroundColor = TypingExamination.STAGE_BACKGROUND_COLOR;
/*
// keyboard shortcut - useless. this.keyboard is chargning for ESC event
@@ -54,10 +54,12 @@ var TypingExamination = {
this.animalList = new AnimalList(90);
// typing content
var CONTENT_TEXT_WIDTH = 800;
var CONTENT_UNDERLINE_OFFSET = 16;
var TYPING_CONTENT_UNDERLINE_OFFSET = 2;
var CONTENT_UNDERLINE_OFFSET = 13;
var TYPING_CONTENT_UNDERLINE_OFFSET = 5;
var graphics = game.add.graphics(0, 0);
// graphics.beginFill(0xFF3300);
@@ -65,30 +67,32 @@ var TypingExamination = {
var TYPING_CONTENT_X = 50;
var TYPING_CONTENT_Y = 320;
var TYPING_CONTENT_Y = 390;
var RECORD_POSITION_X = 990;
var INPUT_TEXT_OFFSET_X = 10;
var INPUT_TEXT_OFFSET_Y = 60;
var FONT_SIZE = 32;
var TYPING_TEXT_OFFSET_HEIGHT = 52;
var FONT_SIZE = 26;
var BIG_FONT_SIZE = 28;
var TYPING_TEXT_OFFSET_HEIGHT = 46;
// textStyleBasic.font = "bold 38px Arial";
// textStyleBasic.backgroundColor = "rgba(0, 0, 0, 0.25)";
// current text
graphics.moveTo(
TYPING_CONTENT_X,
TYPING_CONTENT_Y + CONTENT_UNDERLINE_OFFSET + TYPING_CONTENT_UNDERLINE_OFFSET
);
graphics.lineTo(
TYPING_CONTENT_X + CONTENT_TEXT_WIDTH,
TYPING_CONTENT_Y + CONTENT_UNDERLINE_OFFSET + TYPING_CONTENT_UNDERLINE_OFFSET
);
textStyleBasic.font = "38px Courier New";
this.textTypedContentBack = game.add.text(
TYPING_CONTENT_X, TYPING_CONTENT_Y,
"", textStyleBasic
)
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2)
// .addColor(TypingExamination.COLOR_CONTENT_INPUT, 0);
this.textTypedContentBack.anchor.set(0, 0.5);
this.textTypedContentBack.fontSize = BIG_FONT_SIZE;
this.textTypedContentBack.style.backgroundColor = TypingExamination.INPUT_CONTENT_BACKGROUND_COLOR;
this.textTypingContentBack = game.add.text(
TYPING_CONTENT_X, TYPING_CONTENT_Y,
"", textStyleBasic
@@ -96,8 +100,8 @@ var TypingExamination = {
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2)
// .addColor(TypingExamination.COLOR_CONTENT_INPUT, 0);
this.textTypingContentBack.anchor.set(0, 0.5);
this.textTypingContentBack.fontSize = FONT_SIZE;
this.textTypingContentBack.style.backgroundColor = TypingExamination.BACKGROUND_COLOR_CONTENT_INPUT;
this.textTypingContentBack.fontSize = BIG_FONT_SIZE;
this.textTypingContentBack.style.backgroundColor = TypingExamination.STAGE_BACKGROUND_COLOR;
this.textTypingContent = game.add.text(
TYPING_CONTENT_X, TYPING_CONTENT_Y,
@@ -106,7 +110,16 @@ var TypingExamination = {
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2)
.addColor(TypingExamination.COLOR_CONTENT_INPUT, 0);
this.textTypingContent.anchor.set(0, 0.5);
this.textTypingContent.fontSize = FONT_SIZE;
this.textTypingContent.fontSize = BIG_FONT_SIZE;
graphics.moveTo(
TYPING_CONTENT_X,
TYPING_CONTENT_Y + CONTENT_UNDERLINE_OFFSET + TYPING_CONTENT_UNDERLINE_OFFSET
);
graphics.lineTo(
TYPING_CONTENT_X + CONTENT_TEXT_WIDTH,
TYPING_CONTENT_Y + CONTENT_UNDERLINE_OFFSET + TYPING_CONTENT_UNDERLINE_OFFSET
);
// current text line number / total line number
textStyleBasic.font = "38px Arial";
@@ -199,7 +212,7 @@ var TypingExamination = {
this.inputTextContent.anchor.set(0, 0.5);
this.inputTextContent.canvasInput.value('');
this.inputTextContent.canvasInput.focus();
this.inputTextContent.canvasInput.fontSize(FONT_SIZE);
this.inputTextContent.canvasInput.fontSize(BIG_FONT_SIZE);
// this.inputTextContent.canvasInput.fontWeight("");
this.inputTextContent.canvasInput.fontFamily("Courier New");
// this.inputTextContent.canvasInput.fontFamily("Courier New");
@@ -214,8 +227,6 @@ var TypingExamination = {
this.animalList = new AnimalList(670);
// bottom ui
var screenBottomUI = new ScreenBottomUI();
screenBottomUI.printLeftTextWithAppHighestRecord(sessionStorageManager.getAppHighestRecord());
@@ -223,7 +234,9 @@ var TypingExamination = {
screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
this.loadExaminationContent();
// var url = "./../../game/typing/literature_list/korean_national_anthem.txt";
var url = "./../../game/typing/literature_list/korean_cold_noodle.txt";
this.loadExaminationContent(url);
// this.countDown();
},
@@ -321,11 +334,10 @@ var TypingExamination = {
},
loadExaminationContent: function() {
loadExaminationContent: function(url) {
game.load.onLoadComplete.add(this.literatureLoadComplete, this);
game.load.text("literature", "./../../game/typing/literature_list/korean_national_anthem.txt");
game.load.text("cold_noodle", "./../../game/typing/literature_list/korean_cold_noodle.txt");
game.load.text("literature", url);
game.load.start();
},
@@ -334,8 +346,7 @@ var TypingExamination = {
game.load.onFileComplete.remove(this.loadExaminationContent, this);
game.load.onLoadComplete.remove(this.literatureLoadComplete, this);
// var literature = game.cache.getText("literature");
var literature = game.cache.getText("cold_noodle");
var literature = game.cache.getText("literature");
var examinationContent = literature.split("\n");
for(var i = 0; i < examinationContent.length; i++) {
@@ -363,12 +374,9 @@ var TypingExamination = {
this.startGame();
},
replaceSpaceWithSpaceIndicator: function(text) {
return text.replace(/ /g, TypingExamination.SPACE_INDICATOR);
},
setTypingContentText: function(text) {
this.textTypingContent.text = text;
this.textTypedContentBack.text = text;
},
setTypingContentBackText: function(text) {
@@ -394,13 +402,13 @@ var TypingExamination = {
}
var contentText = this.typingExaminationContents[this.typingIndex];
this.setTypingContentText(this.replaceSpaceWithSpaceIndicator(contentText));
this.setTypingContentText(contentText);
for(var i = 0; i < TypingExamination.TYPING_CONTENT_PREVIEW_COUNT; i++) {
var previewIndex = this.typingIndex + i + 1;
if(previewIndex < this.typingExaminationContents.length) {
var previewText = this.typingExaminationContents[previewIndex];
this.textTypingContentPreview[i].text = this.replaceSpaceWithSpaceIndicator(previewText);
this.textTypingContentPreview[i].text = previewText;
} else
this.textTypingContentPreview[i].text = "";
}
@@ -584,4 +592,7 @@ TypingExamination.WORD_COUNT_FOR_STAGE = 10;
TypingExamination.COLOR_CONTENT_INPUT = "#dddddd";
TypingExamination.COLOR_CONTENT_RIGHT = "#ffff4d";
TypingExamination.BACKGROUND_COLOR_CONTENT_INPUT = "#333333";
TypingExamination.STAGE_BACKGROUND_COLOR = "#4d4d4d";
TypingExamination.INPUT_CONTENT_BACKGROUND_COLOR = "#333333";
TypingExamination.STAGE_BACKGROUND_COLOR_HEX = 0x4d4d4d;
TypingExamination.INPUT_CONTENT_BACKGROUND_COLOR_HEX = 0x333333;