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

Add: ScreenBottom

Browse Source
This commit is contained in:
Jisang Park
2018-05-06 18:47:17 +09:00
parent de600603da
commit 8d9e3c49b3
9 changed files with 162 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/global/define_variables_global.js
+3 -6
View File
@@ -25,14 +25,11 @@ let bestRecord = 0;
{
playerName = sessionStorage.getItem("playerName");
console.log("playerName");
console.log(playerName);
console.log("playerName : " + playerName);
playerUserID = sessionStorage.getItem("playerUserID");
console.log("playerUserID");
console.log(playerUserID);
console.log("playerUserID : " + playerUserID);
bestRecord = sessionStorage.getItem("bestRecord");
console.log("bestRecord");
console.log(bestRecord);
console.log("bestRecord : " + bestRecord);
}
let textStyleBasic = { font: "bold 32px Arial", fill: "#fff", align: "center", boundsAlignH: "center", boundsAlignV: "middle" };
src/game/global/screen_bottom.js
+62
View File
@@ -0,0 +1,62 @@
/////////////////////////////
// Screen bottom
class ScreenBottom {
constructor(game) {
this.game = game;
this.BOTTOM_BAR_HEIGHT = 50;
this.BOTTOM_BAR_NAME_WIDTH = 200;
this.BOTTOM_BAR_TEXT_OFFSET = 10;
this.bottomAreaPositionY = this.game.world.height - this.BOTTOM_BAR_HEIGHT;
}
makeBottomLine() {
this.game.add.graphics()
.beginFill(0xffffff, 0.1)
.drawRect(0, this.bottomAreaPositionY, game.world.width, this.BOTTOM_BAR_HEIGHT);
this.printBottomLeftText(playerName);
this.printBottomCenterText("메뉴");
this.printBottomRightText(playerName);
let textStyleInfo = textStyleBasic; //$.extend( {}, textStyleBasic);
textStyleInfo.font = "32px Arial";
textStyleInfo.align = "right";
textStyleInfo.boundsAlignH = "right";
}
printBottomLeftText(text) {
let style = { font: "32px Arial", fill: "#fff", align: "left", boundsAlignH: "left", boundsAlignV: "bottom" };
let posX = this.BOTTOM_BAR_TEXT_OFFSET;
this.game.add.text(posX, this.bottomAreaPositionY, text, style)
.setTextBounds(0, 0, this.BOTTOM_BAR_NAME_WIDTH, this.BOTTOM_BAR_HEIGHT)
.addColor('#ffffff', 0);
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
}
printBottomCenterText(text) {
let style = { font: "32px Arial", fill: "#fff", align: "center", boundsAlignH: "center", boundsAlignV: "bottom" };
let posX = game.world.width / 2 - this.BOTTOM_BAR_NAME_OFFSET_RIGHT;
this.game.add.text(0, this.bottomAreaPositionY, text, style)
.setTextBounds(0, 0, game.world.width, this.BOTTOM_BAR_HEIGHT)
.addColor('#ffffff', 0);
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
}
printBottomRightText(text) {
let style = { font: "32px Arial", fill: "#fff", align: "right", boundsAlignH: "right", boundsAlignV: "bottom" };
let posX = game.world.width - this.BOTTOM_BAR_NAME_WIDTH - this.BOTTOM_BAR_TEXT_OFFSET;
this.game.add.text(posX, this.bottomAreaPositionY, text, style)
.setTextBounds(0, 0, this.BOTTOM_BAR_NAME_WIDTH, this.BOTTOM_BAR_HEIGHT)
.addColor('#ffffff', 0);
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
}
}
src/game/login/login.js
+8 -5
View File
@@ -24,7 +24,7 @@ let Login = {
// name
let textX = this.game.world.centerX - 360;
let inputX = this.game.world.centerX + 60;
const nameTextY = 340;
let nameTextY = 340;
game.add.text(textX, nameTextY, "이름 :", textStyleBasic)
.setTextBounds(0, 0, 200, 0)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2)
@@ -98,7 +98,7 @@ let Login = {
}
}
}
xhr.open('POST', 'login.php', true);
xhr.open('POST', '../../web/client/php/check_user.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
let param = 'name=' + playerName + '&birthday=' + birthday;
// console.log(param);
@@ -126,14 +126,17 @@ let Login = {
// console.log('playerUserID : ' + playerUserID);
// this.state.start('Menu');
sessionStorage.setItem("UserID", playerUserID);
// let userID = sessionStorage.getItem("UserID");
// console.log("userID : " + userID);
sessionStorage.setItem("playerName", playerName);
sessionStorage.setItem("playerUserID", playerUserID);
console.log("playerName : " + sessionStorage.getItem("playerName"));
console.log("playerUserID : " + sessionStorage.getItem("playerUserID"));
location.href = '../../web/client/menu_app.html';
},
loginFailed: function(jsonData) {
sessionStorage.removeItem("playerName");
sessionStorage.removeItem("playerUserID");
// show retry message
console.log('login failed, jsonData : ' + JSON.stringify(jsonData));
}
src/game/menu/menu_app.js
+8 -111
View File
@@ -1,121 +1,18 @@
/////////////////////////////
// MenuApp
var MenuApp = {
let MenuApp = {
create: function() {
this.stageButtonArray = [];
this.game.stage.backgroundColor = '#4d4d4d';
var bar = game.add.graphics();
bar.beginFill(0x000000, 0.2);
bar.drawRect(0, 0, 1000, 80);
let screenBottom = new ScreenBottom(game);
screenBottom.makeBottomLine();
screenBottom.printBottomLeftText(playerName);
screenBottom.printBottomCenterText("메뉴");
screenBottom.printBottomRightText(playerName);
var newTextStyle = $.extend( {}, textStyleBasic);
newTextStyle.font = "bold 64px Arial";
var textPlayerName = game.add.text(0, 2, "연습 내용", newTextStyle)
.setTextBounds(0, 0, 1000, 80)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
var phaser = game.add.image(game.world.centerX, game.world.centerY + 70, 'phaser');
phaser.anchor.set(0.5);
phaser.alpha = 0.1;
game.stage.backgroundColor = '#4d4d4d';
// korean
var buttonPosX = 280;
var buttonKoreanPosY = 140; // 380;
game.add.text(0, 2, "한글", newTextStyle)
.setTextBounds(0, buttonKoreanPosY + 20, 200, 80)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
for(var i = 0; i < 4; i++) {
var button = new TextButton(buttonPosX + i * 200, buttonKoreanPosY,
koreanLessonTitle[i], this.startStage);
button.name = "k" + (i + 1);
button.scaleTo(0.9);
this.stageButtonArray.push(button);
}
for(var i = 0; i < 4; i++) {
var button = new TextButton(buttonPosX + i * 200, buttonKoreanPosY + 100,
koreanLessonTitle[i + 4], this.startStage);
button.name = "k" + (i + 5);
button.scaleTo(0.9);
this.stageButtonArray.push(button);
}
var button = new TextButton(buttonPosX, buttonKoreanPosY + 200,
koreanLessonTitle[8], this.startStage);
button.name = "k9";
button.scaleTo(0.9);
this.stageButtonArray.push(button);
var button = new TextButton(buttonPosX + 200, buttonKoreanPosY + 200,
koreanLessonTitle[9], this.startStage);
button.name = "k10";
button.scaleTo(0.9);
this.stageButtonArray.push(button);
// english
var buttonEnglishPosY = 480;
game.add.text(0, 2, "영문", newTextStyle)
.setTextBounds(0, buttonEnglishPosY + 20, 200, 80)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
for(var i = 0; i < 3; i++) {
var button = new TextButton(buttonPosX + i * 200, buttonEnglishPosY,
englishLessonTitle[i], this.startStage);
button.name = "e" + (i + 1);
button.scaleTo(0.9);
this.stageButtonArray.push(button);
}
for(var i = 0; i < 3; i++) {
var button = new TextButton(buttonPosX + i * 200, buttonEnglishPosY + 100,
englishLessonTitle[i + 3], this.startStage);
button.name = "e" + (i + 4);
button.scaleTo(0.9);
this.stageButtonArray.push(button);
}
var button = new TextButton(buttonPosX, buttonEnglishPosY + 200,
englishLessonTitle[8], this.startStage);
button.name = "e9";
button.scaleTo(0.9);
this.stageButtonArray.push(button);
var button = new TextButton(buttonPosX + 200, buttonEnglishPosY + 200,
englishLessonTitle[9], this.startStage);
button.name = "e10";
button.scaleTo(0.9);
this.stageButtonArray.push(button);
// for(var i = 0; i < this.stageButtonArray.length; i++) {
// console.log("button name : " + this.stageButtonArray[i].name);
// }
// bottom
var bottomAreaPositionY = 750;
var bar = game.add.graphics();
bar.beginFill(0xffffff, 0.1);
bar.drawRect(0, bottomAreaPositionY, 1000, 50);
var textStyleInfo = $.extend( {}, textStyleBasic);
textStyleInfo.font = "32px Arial";
textStyleInfo.align = "right";
textStyleInfo.boundsAlignH = "right";
var textPlayerName = game.add.text(800 - OFFSET_RIGHT_ALIGN, bottomAreaPositionY - 12, playerName, textStyleInfo)
.setTextBounds(0, 0, 200, 80)
.addColor('#ffffff', 0);
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
this.loadTypingStageData();
// this.loadTypingStageData();
},
loadTypingStageData: function() {