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

Add: menu bg

Browse Source
This commit is contained in:
Jisang Park
2018-09-01 17:36:17 +09:00
parent 29539e9ce7
commit a291c18ea1
17 changed files with 129 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/lib/button/game_app_button.js
+1 -1
View File
@@ -84,4 +84,4 @@ GameAppButton.BUTTON_GAP = 20;
GameAppButton.MARGIN_VERTICAL = 100;
GameAppButton.BUTTON_UPPER_POS_Y = 200;
GameAppButton.BUTTON_LOWER_POS_Y = 460;
GameAppButton.BUTTON_LOWER_POS_Y = 480;
src/game/lib/button/typing_app_button.js
+3 -3
View File
@@ -44,11 +44,11 @@ class TypingAppButton extends RoundRectButton {
}
TypingAppButton.BUTTON_WIDTH = 160;
TypingAppButton.BUTTON_WIDTH = 220;
TypingAppButton.BUTTON_HEIGHT = 80;
TypingAppButton.BUTTON_GAP = 10;
TypingAppButton.MARGIN_VERTICAL = 100;
TypingAppButton.BUTTON_UPPER_POS_Y = 200;
TypingAppButton.BUTTON_LOWER_POS_Y = 480;
TypingAppButton.BUTTON_UPPER_POS_Y = 205;
TypingAppButton.BUTTON_LOWER_POS_Y = 475;
src/game/lib/button/typing_tab_button.js
+5 -5
View File
@@ -41,13 +41,13 @@ class TypingTabButton extends RoundRectButton {
}
TypingTabButton.BUTTON_WIDTH = 480;
TypingTabButton.BUTTON_WIDTH = 445;
TypingTabButton.BUTTON_HEIGHT = 80;
TypingTabButton.BUTTON_GAP = 20;
TypingTabButton.BUTTON_GAP = 26;
TypingTabButton.MARGIN_VERTICAL = 100;
TypingTabButton.PRACTICE_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 + TypingTabButton.BUTTON_GAP / 2;
TypingTabButton.TEST_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 * 3 - TypingTabButton.BUTTON_GAP / 2;
TypingTabButton.PRACTICE_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 + TypingTabButton.BUTTON_GAP;
TypingTabButton.TEST_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 * 3 - TypingTabButton.BUTTON_GAP;
TypingTabButton.BUTTON_POS_Y = GAME_SCREEN_SIZE.y - (TypingTabButton.BUTTON_HEIGHT / 3 * 4);
TypingTabButton.BUTTON_POS_Y = GAME_SCREEN_SIZE.y - 104;
src/game/lib/screen_bottom.js
+2 -1
View File
@@ -8,6 +8,7 @@ class ScreenBottom {
this.bottomBarCenterY = game.world.height - ScreenBottom.BOTTOM_BAR_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");
@@ -15,7 +16,7 @@ class ScreenBottom {
makeBottomLine() {
game.add.graphics()
.beginFill(0xffffff, 0.1)
.beginFill(0x303030, 1)
.drawRect(
0, game.world.height - ScreenBottom.BOTTOM_BAR_HEIGHT,
game.world.width, ScreenBottom.BOTTOM_BAR_HEIGHT
src/game/menu/app_area_bg.js
+27
View File
@@ -0,0 +1,27 @@
class AppAreaBG {
constructor(color, alpha, x, y, width, height) {
game.add.graphics()
.beginFill(color, alpha)
.drawRect(x, y, width, height);
}
printText(text, x, y, size, color, alpha) {
let fontStyle = { font: "36px Arial", fill: "#fff", align: "left", boundsAlignH: "left", boundsAlignV: "bottom" };
let titleText = game.add.text(x, y, text, fontStyle);
titleText.anchor.set(0.5);
titleText.fontSize = size;
titleText.addColor(color, 0);
titleText.alpha = alpha;
}
};
AppAreaBG.COLOR_MOUSE_APP = 0xffce54;
AppAreaBG.COLOR_TYPING_APP = 0x99ccff;
AppAreaBG.COLOR_TYPING_KOREAN = 0xffccff;
AppAreaBG.COLOR_TYPING_ENGLISH = 0x77aaff;
AppAreaBG.GAP_X = 10;
AppAreaBG.GAP_Y = 10;
src/game/menu/menu_app.js
+25 -3
View File
@@ -12,26 +12,48 @@ class MenuApp {
self = this;
this.game.stage.backgroundColor = '#4d4d4d';
// mouse app area
let mouseBG = new AppAreaBG(AppAreaBG.COLOR_MOUSE_APP, 1,
0, 60,
GAME_SCREEN_SIZE.x, 280
);
mouseBG.printText(
"마 우 스 연 습 앱",
game.world.centerX, 320,
36, "#000", 0.05
);
// typing app area
let typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1,
0, 340,
GAME_SCREEN_SIZE.x, 378
);
typingBG.printText(
"타 자 연 습 앱",
game.world.centerX, 370,
36, "#000", 0.05
);
// top
let backButton = new BackButton( () => {
sessionStorageManager.clear();
location.href = '../../web/client/login.html';
});
new WelcomePlayerText(sessionStorageManager.playerName);
let fullscreenButton = new FullscreenButton();
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
// screenBottom.printBottomLeftText("게임 진행 정보");
// let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
// screenBottom.printBottomCenterText(playingAppName);
screenBottom.printBottomCenterText("메뉴");
screenBottom.printBottomRightText(sessionStorageManager.playerName);
new WelcomePlayerText(sessionStorageManager.playerName);
this.loadAppData();
}
src/game/menu/menu_typing_practice.js
+29 -1
View File
@@ -19,6 +19,35 @@ class MenuTypingPractice {
let fullscreenButton = new FullscreenButton(this.game);
// typing app area
let typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1,
0, 60,
GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y - 110
);
// korean app area
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,
36, "#000", 0.05
);
// english app area
let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1,
0, 340,
GAME_SCREEN_SIZE.x, 270
);
englishBG.printText(
"영 문 타 자",
game.world.centerX, 370,
36, "#000", 0.05
);
// typing tab buttons
let typingPracticeTabButton = new TypingTabButton(
TypingTabButton.PRACTICE_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y,
@@ -40,7 +69,6 @@ class MenuTypingPractice {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
// screenBottom.printBottomLeftText("게임 진행 정보");
screenBottom.printBottomCenterText("메뉴 > 타자 연습");
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/menu/menu_typing_test.js
+30 -1
View File
@@ -19,9 +19,38 @@ class MenuTypingTest {
let fullscreenButton = new FullscreenButton(this.game);
// typing app area
let typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1,
0, 60,
GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y - 110
);
// korean app area
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,
36, "#000", 0.05
);
// english app area
let englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1,
0, 340,
GAME_SCREEN_SIZE.x, 270
);
englishBG.printText(
"영 문 타 자",
game.world.centerX, 370,
36, "#000", 0.05
);
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
// screenBottom.printBottomLeftText("게임 진행 정보");
screenBottom.printBottomCenterText("메뉴 > 타자 시험");
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/menu/welcome_player_text.js
+4 -14
View File
@@ -1,7 +1,7 @@
class WelcomePlayerText extends Phaser.Text {
constructor(playerName) {
super(game, game.world.width / 2, WelcomePlayerText.FONT_HEIGHT_PX, "어서오세요, " + playerName + "님", WelcomePlayerText.DEFAULT_TEXT_FONT);
super(game, game.world.width / 2, 32, "어서오세요, " + playerName + "님", WelcomePlayerText.DEFAULT_TEXT_FONT);
this.anchor.set(0.5);
this.inputEnabled = false;
@@ -14,17 +14,9 @@ class WelcomePlayerText extends Phaser.Text {
this.stroke = '#000';
this.strokeThickness = 5;
this.alpha = 0;
let tweenAlpha = game.add.tween(this);
tweenAlpha.from( { alpha: 0 } ).to( { alpha: 100 }, 1000, Phaser.Easing.Linear.None, true);
/*
let tweenAlpha = game.add.tween(this);
tweenAlpha.to( { alpha: 0 }, 1000, Phaser.Easing.Linear.None, true);
let tweenMoveUp = game.add.tween(this);
tweenMoveUp.to( { y: this.y - WelcomePlayerText.MOVE_UP_AMOUNT_PX }, 1000, Phaser.Easing.Linear.None, true);
tweenMoveUp.onComplete.addOnce(this.destroySelf, this);
*/
tweenAlpha.to( { alpha: 1 }, 500, Phaser.Easing.Linear.None, true);
game.add.existing(this);
};
@@ -40,6 +32,4 @@ WelcomePlayerText.DEFAULT_TEXT_FONT = {
boundsAlignH: "center", // left, center. right
boundsAlignV: "middle", // top, middle, bottom
fill: "#fff"
};
WelcomePlayerText.FONT_HEIGHT_PX = 35;
};
src/game/mouse/space_invaders/game.js
-1
View File
@@ -63,7 +63,6 @@ class Game {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord);
screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/result/result.js
-1
View File
@@ -47,7 +47,6 @@ class Result {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
screenBottom.printBottomLeftTextWithBestRecord(Math.floor(sessionStorageManager.bestRecord));
screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/start/start.js
-1
View File
@@ -44,7 +44,6 @@ class Start {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
screenBottom.printBottomLeftText("오늘의 최고 기록 : ");
screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/typing/practice/game.js
-1
View File
@@ -104,7 +104,6 @@ class TypingPractice {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
// screenBottom.printBottomLeftText("");
screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/game/typing/test/game.js
-1
View File
@@ -105,7 +105,6 @@ class TypingTest {
// bottom
let screenBottom = new ScreenBottom();
screenBottom.makeBottomLine();
screenBottom.printBottomLeftTextWithBestRecord(sessionStorageManager.bestRecord);
screenBottom.printBottomCenterText(sessionStorageManager.playingAppKoreanName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
src/web/client/menu_app.html
+1
View File
@@ -27,6 +27,7 @@
<script src="../../game/menu/menu_app.js"></script>
<script src="../../game/menu/main_menu_app.js"></script>
<script src="../../game/menu/welcome_player_text.js"></script>
<script src="../../game/menu/app_area_bg.js"></script>
<style>
src/web/client/menu_typing_practice.html
+1
View File
@@ -26,6 +26,7 @@
<!-- source files -->
<script src="../../game/menu/menu_typing_practice.js"></script>
<script src="../../game/menu/main_menu_typing_practice.js"></script>
<script src="../../game/menu/app_area_bg.js"></script>
<style>
src/web/client/menu_typing_test.html
+1
View File
@@ -26,6 +26,7 @@
<!-- source files -->
<script src="../../game/menu/menu_typing_test.js"></script>
<script src="../../game/menu/main_menu_typing_test.js"></script>
<script src="../../game/menu/app_area_bg.js"></script>
<style>