From 8cf7f67ac667fdac3fbb797b24b61a1377c5fb43 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=A2=E1=84=91=E1=85=B3=E1=86=AF=20=E1=84=82?= =?UTF-8?q?=E1=85=A9=E1=84=90=E1=85=B3=E1=84=87=E1=85=AE=E1=86=A8?= Date: Mon, 3 Sep 2018 09:15:50 +0900 Subject: [PATCH] Fix: screen top ui, screen bottom ui --- src/game/lib/button/typing_app_button.js | 12 +++--- .../{screen_bottom.js => screen_bottom_ui.js} | 41 ++++++++++--------- src/game/lib/screen_top_ui.js | 30 ++++++++++++++ src/game/login/login.js | 7 +++- src/game/menu/app_area_bg.js | 4 +- src/game/menu/menu_app.js | 25 ++++++----- src/game/menu/menu_typing_practice.js | 41 ++++++++++--------- src/game/menu/menu_typing_test.js | 41 ++++++++++--------- src/game/menu/welcome_player_text.js | 8 ++-- src/game/mouse/space_invaders/game.js | 33 ++++++++------- src/game/result/result.js | 18 ++++---- src/game/start/start.js | 22 +++++----- src/game/typing/practice/game.js | 20 ++++----- src/game/typing/test/game.js | 20 ++++----- src/web/client/login.html | 1 + src/web/client/menu_app.html | 3 +- src/web/client/menu_app_play_free.html | 3 +- src/web/client/menu_typing_practice.html | 3 +- src/web/client/menu_typing_test.html | 3 +- src/web/client/result.html | 3 +- src/web/client/space_invaders.html | 3 +- src/web/client/start.html | 3 +- src/web/client/typing_practice.html | 3 +- src/web/client/typing_test.html | 3 +- 24 files changed, 197 insertions(+), 153 deletions(-) rename src/game/lib/{screen_bottom.js => screen_bottom_ui.js} (52%) create mode 100644 src/game/lib/screen_top_ui.js diff --git a/src/game/lib/button/typing_app_button.js b/src/game/lib/button/typing_app_button.js index 0a5566e..11836f4 100644 --- a/src/game/lib/button/typing_app_button.js +++ b/src/game/lib/button/typing_app_button.js @@ -22,9 +22,9 @@ class TypingAppButton extends RoundRectButton { 0x666666 ); setting.setTextColor( - "#668", - "#668", - "#668", + "#66c", + "#66c", + "#66c", "#333" ); break; @@ -44,9 +44,9 @@ class TypingAppButton extends RoundRectButton { 0x666666 ); setting.setTextColor( - "#866", - "#866", - "#866", + "#a66", + "#a66", + "#a66", "#333" ); break; diff --git a/src/game/lib/screen_bottom.js b/src/game/lib/screen_bottom_ui.js similarity index 52% rename from src/game/lib/screen_bottom.js rename to src/game/lib/screen_bottom_ui.js index edb3633..86c3944 100644 --- a/src/game/lib/screen_bottom.js +++ b/src/game/lib/screen_bottom_ui.js @@ -1,41 +1,41 @@ ///////////////////////////// // Screen bottom -class ScreenBottom { +class ScreenBottomUI { constructor() { this.dbConnectManager = new DBConnectManager(); - this.bottomBarCenterY = game.world.height - ScreenBottom.BOTTOM_BAR_HEIGHT / 2; + this.bottomBarCenterY = game.world.height - ScreenBottomUI.BG_HEIGHT / 2; - this.makeBottomLine(); - this.leftText = this.printBottomText(this.leftText, "", "left"); - this.centerText = this.printBottomText(this.centerText, "", "center"); - this.rightText = this.printBottomText(this.rightText, "", "right"); + this.drawBG(); + this.leftText = this.printText(this.leftText, "", "left"); + this.centerText = this.printText(this.centerText, "", "center"); + this.rightText = this.printText(this.rightText, "", "right"); } - makeBottomLine() { + drawBG() { game.add.graphics() .beginFill(0x303030, 1) .drawRect( - 0, game.world.height - ScreenBottom.BOTTOM_BAR_HEIGHT, - game.world.width, ScreenBottom.BOTTOM_BAR_HEIGHT + 0, game.world.height - ScreenBottomUI.BG_HEIGHT, + game.world.width, ScreenBottomUI.BG_HEIGHT ); } - printBottomLeftText(text) { + printLeftText(text) { this.leftText.text = text; } - printBottomCenterText(text) { + printCenterText(text) { this.centerText.text = text; } - printBottomRightText(text) { + printRightText(text) { this.rightText.text = text; } - printBottomText(textObject, text, align) { + printText(textObject, text, align) { if(textObject !== null && textObject !== undefined) { textObject.text = ""; textObject = null; @@ -45,7 +45,7 @@ class ScreenBottom { let anchorValue = 0; switch(align) { case "left": - posX = ScreenBottom.BOTTOM_BAR_TEXT_OFFSET; + posX = ScreenBottomUI.TEXT_OFFSET; break; case "center": @@ -54,7 +54,7 @@ class ScreenBottom { break; case "right": - posX = game.world.width - ScreenBottom.BOTTOM_BAR_TEXT_OFFSET; + posX = game.world.width - ScreenBottomUI.TEXT_OFFSET; anchorValue = 1; break; } @@ -67,10 +67,10 @@ class ScreenBottom { return textObject; } - printBottomLeftTextWithBestRecord(bestRecord) { + printLeftTextWithBestRecord(bestRecord) { let roundUpBestRecord = Math.round(bestRecord); let highScoreWithCommas = NumberUtil.numberWithCommas(roundUpBestRecord); - this.printBottomLeftText("오늘의 최고 기록 : " + highScoreWithCommas); + this.printLeftText("오늘의 최고 기록 : " + highScoreWithCommas); } getFontStyle() { @@ -79,6 +79,7 @@ class ScreenBottom { } -ScreenBottom.BOTTOM_BAR_HEIGHT = 50; -ScreenBottom.BOTTOM_BAR_NAME_WIDTH = 200; -ScreenBottom.BOTTOM_BAR_TEXT_OFFSET = 10; \ No newline at end of file +ScreenBottomUI.BG_HEIGHT = 50; + +ScreenBottomUI.NAME_WIDTH = 200; +ScreenBottomUI.TEXT_OFFSET = 10; \ No newline at end of file diff --git a/src/game/lib/screen_top_ui.js b/src/game/lib/screen_top_ui.js new file mode 100644 index 0000000..1322466 --- /dev/null +++ b/src/game/lib/screen_top_ui.js @@ -0,0 +1,30 @@ +///////////////////////////// +// Screen top ui + +class ScreenTopUI { + + constructor() { + this.drawBG(); + } + + drawBG() { + game.add.graphics() + .beginFill(0x303030, 1) + .drawRect( + 0, 0, + game.world.width, ScreenTopUI.BG_HEIGHT + ); + } + + makeBackButton(eventHandler) { + this.backButton = new BackButton(eventHandler); + } + + makeFullScreenButton() { + // this.fullscreenButton = new FullscreenButton(); + } + +} + + +ScreenTopUI.BG_HEIGHT = 60; \ No newline at end of file diff --git a/src/game/login/login.js b/src/game/login/login.js index aa7e1b5..0225cff 100644 --- a/src/game/login/login.js +++ b/src/game/login/login.js @@ -15,12 +15,15 @@ class Login { this.game.stage.backgroundColor = '#4d4d4d'; this.textStyle = { font: "bold 32px Arial", fill: "#fff", align: "right", boundsAlignH: "right", boundsAlignV: "middle" }; - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { sessionStorageManager.clear(); location.href = '../../web/main/index.html'; }); + screenTopUI.makeFullScreenButton(); + - let fullscreenButton = new FullscreenButton(this.game); let textX = this.game.world.centerX - 320; if(sessionStorageManager.maestroID === null) diff --git a/src/game/menu/app_area_bg.js b/src/game/menu/app_area_bg.js index c6bb615..6705b3f 100644 --- a/src/game/menu/app_area_bg.js +++ b/src/game/menu/app_area_bg.js @@ -20,8 +20,8 @@ class AppAreaBG { AppAreaBG.COLOR_MOUSE_APP = 0xffce54; AppAreaBG.COLOR_TYPING_APP = 0x99ccff; -AppAreaBG.COLOR_TYPING_KOREAN = 0x88bbff; -AppAreaBG.COLOR_TYPING_ENGLISH = 0xbbccff; +AppAreaBG.COLOR_TYPING_KOREAN = 0xbbccff; +AppAreaBG.COLOR_TYPING_ENGLISH = 0x88bbff; AppAreaBG.GAP_X = 10; AppAreaBG.GAP_Y = 10; diff --git a/src/game/menu/menu_app.js b/src/game/menu/menu_app.js index d2d5b28..87de43d 100644 --- a/src/game/menu/menu_app.js +++ b/src/game/menu/menu_app.js @@ -5,7 +5,6 @@ class MenuApp { preload() { game.load.image('icon_fullscreen', '../../../resources/image/icon/fullscreen_white.png'); - game.load.image('space_invaders', '../../../resources/image/icon/space_invaders.png'); } create() { @@ -30,27 +29,27 @@ class MenuApp { ); typingBG.printText( "타 자 연 습 앱", - game.world.centerX, 500, + game.world.centerX, 490, 170, "#000", 0.03 ); - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { sessionStorageManager.clear(); location.href = '../../web/client/login.html'; }); - - let fullscreenButton = new FullscreenButton(); + screenTopUI.makeFullScreenButton(); - // bottom - let screenBottom = new ScreenBottom(); - // screenBottom.printBottomLeftText("게임 진행 정보"); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + // ScreenBottomUI.printLeftText("게임 진행 정보"); // let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName); - // screenBottom.printBottomCenterText(playingAppName); - screenBottom.printBottomCenterText("메뉴"); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // ScreenBottomUI.printCenterText(playingAppName); + screenBottomUI.printCenterText("메뉴"); + screenBottomUI.printRightText(sessionStorageManager.playerName); new WelcomePlayerText(sessionStorageManager.playerName); @@ -69,7 +68,7 @@ class MenuApp { } loadSucceeded(replyJSON) { - console.log(replyJSON); + // console.log(replyJSON); self.makeMouseAppButtons( replyJSON.MouseAppList, diff --git a/src/game/menu/menu_typing_practice.js b/src/game/menu/menu_typing_practice.js index b6b5f72..46dd540 100644 --- a/src/game/menu/menu_typing_practice.js +++ b/src/game/menu/menu_typing_practice.js @@ -14,13 +14,6 @@ class MenuTypingPractice { self = this; this.game.stage.backgroundColor = '#4d4d4d'; - // top - let backButton = new BackButton( () => { - location.href = '../../web/client/menu_app.html'; - }); - let fullscreenButton = new FullscreenButton(this.game); - - // typing app area let typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1, 0, 60, @@ -28,10 +21,10 @@ class MenuTypingPractice { ); // korean app area - let koreanBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_KOREAN, 1, - AppAreaBG.MARGIN_X, 60 + AppAreaBG.GAP_Y, - GAME_SCREEN_SIZE.x - AppAreaBG.MARGIN_X * 2, 270 - ); + // let koreanBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_KOREAN, 1, + // AppAreaBG.MARGIN_X, 60 + AppAreaBG.GAP_Y, + // GAME_SCREEN_SIZE.x - AppAreaBG.MARGIN_X * 2, 270 + // ); // koreanBG.printText( // "한 글 타 자", // game.world.centerX, 320, @@ -39,10 +32,10 @@ class MenuTypingPractice { // ); // english app area - let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1, - AppAreaBG.MARGIN_X, 340, - GAME_SCREEN_SIZE.x - AppAreaBG.MARGIN_X * 2, 270 - ); + // let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1, + // AppAreaBG.MARGIN_X, 340, + // GAME_SCREEN_SIZE.x - AppAreaBG.MARGIN_X * 2, 270 + // ); // englishBG.printText( // "영 문 타 자", // game.world.centerX, 370, @@ -50,6 +43,14 @@ class MenuTypingPractice { // ); + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { + location.href = '../../web/client/menu_app.html'; + }); + screenTopUI.makeFullScreenButton(); + + // typing tab buttons let typingPracticeTabButton = new TypingTabButton( TypingTabButton.PRACTICE_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y, @@ -69,11 +70,11 @@ class MenuTypingPractice { ); // typingTestTabButton.inputEnabled = false; - // bottom - let screenBottom = new ScreenBottom(); - // screenBottom.printBottomLeftText("게임 진행 정보"); - screenBottom.printBottomCenterText("메뉴 > 타자 연습"); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + // screenBottomUI.printLeftText("게임 진행 정보"); + screenBottomUI.printCenterText("메뉴 > 타자 연습"); + screenBottomUI.printRightText(sessionStorageManager.playerName); this.makeActiveTypingPracticeAppButtons(); diff --git a/src/game/menu/menu_typing_test.js b/src/game/menu/menu_typing_test.js index 7d9fda0..dd5dedd 100644 --- a/src/game/menu/menu_typing_test.js +++ b/src/game/menu/menu_typing_test.js @@ -14,13 +14,6 @@ class MenuTypingTest { self = this; this.game.stage.backgroundColor = '#4d4d4d'; - // top - let backButton = new BackButton( () => { - location.href = '../../web/client/menu_app.html'; - }); - let fullscreenButton = new FullscreenButton(this.game); - - // typing app area let typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1, 0, 60, @@ -28,10 +21,10 @@ class MenuTypingTest { ); // korean app area - let koreanBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_KOREAN, 1, - 0, 60 + AppAreaBG.GAP_Y, - GAME_SCREEN_SIZE.x, 270 - ); + // let koreanBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_KOREAN, 1, + // 0, 60 + AppAreaBG.GAP_Y, + // GAME_SCREEN_SIZE.x, 270 + // ); // koreanBG.printText( // "한 글 타 자", // game.world.centerX, 320, @@ -39,10 +32,10 @@ class MenuTypingTest { // ); // english app area - let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1, - 0, 340, - GAME_SCREEN_SIZE.x, 270 - ); + // let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1, + // 0, 340, + // GAME_SCREEN_SIZE.x, 270 + // ); // englishBG.printText( // "영 문 타 자", // game.world.centerX, 370, @@ -50,12 +43,13 @@ class MenuTypingTest { // ); + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { + location.href = '../../web/client/menu_app.html'; + }); + screenTopUI.makeFullScreenButton(); - // bottom - let screenBottom = new ScreenBottom(); - // screenBottom.printBottomLeftText("게임 진행 정보"); - screenBottom.printBottomCenterText("메뉴 > 타자 시험"); - screenBottom.printBottomRightText(sessionStorageManager.playerName); // typing tab buttons let typingPracticeTabButton = new TypingTabButton( @@ -77,6 +71,13 @@ class MenuTypingTest { typingTestTabButton.inputEnabled = false; this.makeActiveTypingTestAppButtons(); + + + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + // screenBottomUI.printLeftText("게임 진행 정보"); + screenBottomUI.printCenterText("메뉴 > 타자 시험"); + screenBottomUI.printRightText(sessionStorageManager.playerName); } diff --git a/src/game/menu/welcome_player_text.js b/src/game/menu/welcome_player_text.js index 5197577..fe4f1ac 100644 --- a/src/game/menu/welcome_player_text.js +++ b/src/game/menu/welcome_player_text.js @@ -1,7 +1,7 @@ class WelcomePlayerText extends Phaser.Text { constructor(playerName) { - super(game, game.world.width / 2, 32, "어서오세요, " + playerName + "님", WelcomePlayerText.DEFAULT_TEXT_FONT); + super(game, game.world.width / 2, game.world.height / 2 - 40, "어서오세요, " + playerName + "님", WelcomePlayerText.DEFAULT_TEXT_FONT); this.anchor.set(0.5); this.inputEnabled = false; @@ -14,9 +14,9 @@ class WelcomePlayerText extends Phaser.Text { this.stroke = '#000'; this.strokeThickness = 5; - this.alpha = 0; + this.alpha = 1; let tweenAlpha = game.add.tween(this); - tweenAlpha.to( { alpha: 1 }, 500, Phaser.Easing.Linear.None, true); + tweenAlpha.to( { alpha: 0 }, 2000, Phaser.Easing.Back.In, true); game.add.existing(this); }; @@ -28,7 +28,7 @@ class WelcomePlayerText extends Phaser.Text { } WelcomePlayerText.DEFAULT_TEXT_FONT = { - font: "40px Arial", + font: "60px Arial", boundsAlignH: "center", // left, center. right boundsAlignV: "middle", // top, middle, bottom fill: "#fff" diff --git a/src/game/mouse/space_invaders/game.js b/src/game/mouse/space_invaders/game.js index 320fb7c..d679836 100644 --- a/src/game/mouse/space_invaders/game.js +++ b/src/game/mouse/space_invaders/game.js @@ -8,20 +8,13 @@ class Game { sessionStorageManager.isNewBestRecrd = false; - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { sessionStorageManager.resetPlayingAppData(); location.href = '../../web/client/menu_app.html'; }); - - let heartGauge = new HeartGauge(heartManager); - heartManager.addOnChangeGameOverListener( - () => { this.gameOver(); } - ); - heartGauge.start(); - - let fullscreenButton = new FullscreenButton(this.game); - + screenTopUI.makeFullScreenButton(); let scoreBoard = new ScoreBoard(); scoreManager.addOnChangeScoreListener( score => { @@ -32,9 +25,15 @@ class Game { console.log(highScore); sessionStorageManager.bestRecord = highScore; sessionStorageManager.isNewBestRecrd = true; - screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); + screenBottomUI.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); }); + let heartGauge = new HeartGauge(heartManager); + heartManager.addOnChangeGameOverListener( + () => { this.gameOver(); } + ); + heartGauge.start(); + // waiting room this.game.add.graphics() @@ -61,11 +60,11 @@ class Game { this.alienTimer = new AlienTimer(this.aliens); - // bottom - let screenBottom = new ScreenBottom(); - screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); - screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.bestRecord); + screenBottomUI.printCenterText(sessionStorageManager.playingAppKoreanName); + screenBottomUI.printRightText(sessionStorageManager.playerName); this.startGame(); diff --git a/src/game/result/result.js b/src/game/result/result.js index b32db1b..d0adb16 100644 --- a/src/game/result/result.js +++ b/src/game/result/result.js @@ -16,8 +16,9 @@ class Result { this.chartGraphics = game.add.graphics(100, game.world.height - 120); - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { if(isTypingPracticeStage()) location.href = '../../web/client/menu_typing_practice.html'; else if(isTypingTestStage()) @@ -27,8 +28,7 @@ class Result { sessionStorageManager.resetPlayingAppData(); }); - - let fullscreenButton = new FullscreenButton(this.game); + screenTopUI.makeFullScreenButton(); // contents @@ -45,11 +45,11 @@ class Result { let recordBoard = new RecordBoard(RecordBoard.TYPE_DB); } - // bottom - let screenBottom = new ScreenBottom(); - screenBottom.printBottomLeftTextWithBestRecord(Math.floor(sessionStorageManager.bestRecord)); - screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + screenBottomUI.printLeftTextWithBestRecord(Math.floor(sessionStorageManager.bestRecord)); + screenBottomUI.printCenterText(sessionStorageManager.playingAppKoreanName); + screenBottomUI.printRightText(sessionStorageManager.playerName); } printRecord() { diff --git a/src/game/start/start.js b/src/game/start/start.js index f8a1f89..c7de1de 100644 --- a/src/game/start/start.js +++ b/src/game/start/start.js @@ -15,8 +15,9 @@ class Start { this.chart = new Chart(); - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { if(isTypingPracticeStage()) location.href = '../../web/client/menu_typing_practice.html'; else if(isTypingTestStage()) @@ -26,8 +27,7 @@ class Start { sessionStorageManager.resetPlayingAppData(); }); - - let fullscreenButton = new FullscreenButton(this.game); + screenTopUI.makeFullScreenButton(); // contents @@ -42,11 +42,11 @@ class Start { } - // bottom - let screenBottom = new ScreenBottom(); - screenBottom.printBottomLeftText("오늘의 최고 기록 : "); - screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + screenBottomUI.printLeftText("오늘의 최고 기록 : "); + screenBottomUI.printCenterText(sessionStorageManager.playingAppKoreanName); + screenBottomUI.printRightText(sessionStorageManager.playerName); this.dbConnectManager.requestTodayBestRecord( sessionStorageManager.maestroID, @@ -54,11 +54,11 @@ class Start { sessionStorageManager.playingAppID, replyJSON => { sessionStorageManager.bestRecord = Number(replyJSON["BestRecord"]); - screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); + screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.bestRecord); }, replyJSON => { // no data sessionStorageManager.bestRecord = 0; - screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); + screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.bestRecord); } ); } diff --git a/src/game/typing/practice/game.js b/src/game/typing/practice/game.js index bcd7415..a04f3eb 100644 --- a/src/game/typing/practice/game.js +++ b/src/game/typing/practice/game.js @@ -13,12 +13,14 @@ class TypingPractice { game.stage.backgroundColor = '#4d4d4d'; - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { sessionStorageManager.resetPlayingAppData(); - location.href = '../../web/client/menu_typing_practice.html'; }); + screenTopUI.makeFullScreenButton(); + // this.animalOnTitle = new Animal(Animal.TYPE_ON_TITLE, game.world.centerX - 200, 30); this.animalOnTitle = new Animal(Animal.TYPE_ON_TITLE, game.world.centerX, 90); @@ -34,8 +36,6 @@ class TypingPractice { self.gameOver(); }); - let fullscreenButton = new FullscreenButton(game); - // typing content let typingContentBG = new TypingContentBG(); @@ -102,11 +102,11 @@ class TypingPractice { - // bottom - let screenBottom = new ScreenBottom(); - // screenBottom.printBottomLeftText(""); - screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + // screenBottomUI.printBottomUILeftText(""); + screenBottomUI.printCenterText(sessionStorageManager.playingAppKoreanName); + screenBottomUI.printRightText(sessionStorageManager.playerName); this.startGame(); diff --git a/src/game/typing/test/game.js b/src/game/typing/test/game.js index 9ad6b22..366b0ec 100644 --- a/src/game/typing/test/game.js +++ b/src/game/typing/test/game.js @@ -11,12 +11,14 @@ class TypingTest { game.stage.backgroundColor = '#4d4d4d'; - // top - let backButton = new BackButton( () => { + // top ui + let screenTopUI = new ScreenTopUI(); + screenTopUI.makeBackButton( () => { sessionStorageManager.resetPlayingAppData(); - location.href = '../../web/client/menu_typing_test.html'; }); + screenTopUI.makeFullScreenButton(); + // this.animalOnTitle = new Animal(Animal.TYPE_ON_TITLE, game.world.centerX - 200, 30); this.animalOnTitle = new Animal(Animal.TYPE_ON_TITLE, game.world.centerX, GAME_SCREEN_SIZE.y - 110); @@ -27,8 +29,6 @@ class TypingTest { this.averageTypingSpeedText = new AverageTypingSpeed(); this.contentProgressText = new ContentProgress(); - let fullscreenButton = new FullscreenButton(game); - // typing content let typingContentBG = new TypingContentBG(); @@ -103,11 +103,11 @@ class TypingTest { } - // bottom - let screenBottom = new ScreenBottom(); - screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord); - screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName); - screenBottom.printBottomRightText(sessionStorageManager.playerName); + // bottom ui + let screenBottomUI = new ScreenBottomUI(); + screenBottomUI.printLeftTextWithBestRecord(sessionStorageManager.bestRecord); + screenBottomUI.printCenterText(sessionStorageManager.playingAppKoreanName); + screenBottomUI.printRightText(sessionStorageManager.playerName); this.startGame(); diff --git a/src/web/client/login.html b/src/web/client/login.html index aa4aa96..5942a90 100644 --- a/src/web/client/login.html +++ b/src/web/client/login.html @@ -18,6 +18,7 @@ + diff --git a/src/web/client/menu_app.html b/src/web/client/menu_app.html index 3a0e214..31c7a80 100644 --- a/src/web/client/menu_app.html +++ b/src/web/client/menu_app.html @@ -20,7 +20,8 @@ - + + diff --git a/src/web/client/menu_app_play_free.html b/src/web/client/menu_app_play_free.html index d76f5eb..e4d3b27 100644 --- a/src/web/client/menu_app_play_free.html +++ b/src/web/client/menu_app_play_free.html @@ -20,7 +20,8 @@ - + + diff --git a/src/web/client/menu_typing_practice.html b/src/web/client/menu_typing_practice.html index 10fc9c9..909c267 100644 --- a/src/web/client/menu_typing_practice.html +++ b/src/web/client/menu_typing_practice.html @@ -20,7 +20,8 @@ - + + diff --git a/src/web/client/menu_typing_test.html b/src/web/client/menu_typing_test.html index d86e226..cdbf9b5 100644 --- a/src/web/client/menu_typing_test.html +++ b/src/web/client/menu_typing_test.html @@ -20,7 +20,8 @@ - + + diff --git a/src/web/client/result.html b/src/web/client/result.html index 5f2cf20..60aa7b8 100644 --- a/src/web/client/result.html +++ b/src/web/client/result.html @@ -24,7 +24,8 @@ - + + diff --git a/src/web/client/space_invaders.html b/src/web/client/space_invaders.html index 7048d57..2c739ff 100644 --- a/src/web/client/space_invaders.html +++ b/src/web/client/space_invaders.html @@ -26,7 +26,8 @@ - + + diff --git a/src/web/client/start.html b/src/web/client/start.html index 7bfdc31..7bb36ac 100644 --- a/src/web/client/start.html +++ b/src/web/client/start.html @@ -23,7 +23,8 @@ - + + diff --git a/src/web/client/typing_practice.html b/src/web/client/typing_practice.html index 638173a..456e6a1 100644 --- a/src/web/client/typing_practice.html +++ b/src/web/client/typing_practice.html @@ -24,7 +24,8 @@ - + + diff --git a/src/web/client/typing_test.html b/src/web/client/typing_test.html index 9705422..75aaee3 100644 --- a/src/web/client/typing_test.html +++ b/src/web/client/typing_test.html @@ -24,7 +24,8 @@ - + +