diff --git a/src/game/lib/button/choco_button.js b/src/game/lib/button/choco_button.js
new file mode 100644
index 0000000..d1469fa
--- /dev/null
+++ b/src/game/lib/button/choco_button.js
@@ -0,0 +1,231 @@
+// ChocoButton.prototype = Object.create();
+ChocoButton.constructor = ChocoButton;
+
+function ChocoButton(setting, clickEvent) {
+ this.setting = setting;
+ this.clickEvent = clickEvent;
+
+ this.icon = null;
+ this.mainText = null;
+ this.shortcutText = null;
+
+ this.buttonStroke = this.makeButtonStroke();
+ // this.buttonStroke.anchor.setTo(0.5, 0.5);
+ this.buttonStroke.inputEnabled = true;
+ this.setEventMethod(this.buttonStroke);
+
+ this.button = this.makeButtonSprite();
+
+ // this.button.anchor.setTo(0.5, 0.5);
+ this.button.inputEnabled = true;
+ this.setEventMethod(this.button);
+
+
+ this.mainText = this.makeText("");
+ this.button.addChild(this.mainText);
+
+ this.shortcutText = this.makeShortcutText();
+ this.button.addChild(this.shortcutText);
+
+ this.mouseOut();
+}
+
+ChocoButton.prototype.addIcon = function(spriteName) {
+ if(spriteName != null && spriteName.length > 0) {
+ this.icon = this.makeIcon(spriteName);
+ this.setIcon(this.icon);
+ }
+}
+
+
+ChocoButton.prototype.setEventMethod = function(target) {
+ target.events.onInputOver.add(function() { this.mouseOver(); }, this);
+ target.events.onInputOut.add(function() { this.mouseOut(); }, this);
+ target.events.onInputDown.add(function() {
+ this.mouseDown();
+
+ if(this.clickEvent) {
+ this.clickEvent();
+ }
+ }, this);
+ target.events.onInputUp.add(function() { this.mouseOver(); }, this);
+}
+
+ChocoButton.prototype.makeButtonStroke = function() { // outter(bigger) round rect sprite
+ var btnTexture = new Phaser.Graphics()
+ .beginFill(0xffffff)
+ .drawRoundedRect(0, 0, this.setting.width, this.setting.height, this.setting.roundAmount)
+ .endFill()
+ .generateTexture();
+
+ return game.add.sprite(
+ this.setting.x - this.setting.width / 2,
+ this.setting.y - this.setting.height / 2,
+ btnTexture
+ );
+}
+
+ChocoButton.prototype.makeButtonSprite = function() { // inner(smaller) round rect sprite
+ var width = this.setting.width - this.setting.strokeWidthPx * 2;
+ var height = this.setting.height - this.setting.strokeWidthPx * 2;
+ var innerRoundAmount = this.setting.roundAmount * (width / this.setting.width / 1.5);
+
+ var btnTexture = new Phaser.Graphics()
+ .beginFill(0xffffff)
+ .drawRoundedRect(this.setting.strokeWidthPx, this.setting.strokeWidthPx, width, height, innerRoundAmount)
+ .endFill()
+ .generateTexture();
+
+ // return game.add.sprite(0, 0, btnTexture);
+ return game.add.sprite(
+ this.setting.x - this.setting.width / 2 + this.setting.strokeWidthPx,
+ this.setting.y - this.setting.height / 2 + this.setting.strokeWidthPx,
+ btnTexture
+ );
+}
+
+ChocoButton.prototype.makeIcon = function(iconName) {
+ var icon = game.add.sprite(0, 0, iconName);
+ icon.width = 40;
+ icon.height = 40;
+
+ return icon;
+}
+
+ChocoButton.prototype.setIconSize = function(size) {
+ this.setIconWidth(size);
+ this.setIconHeight(size);
+}
+
+ChocoButton.prototype.setIconWidth = function(size) {
+ this.buttonIcon.width = size;
+}
+
+ChocoButton.prototype.setIconHeight = function(size) {
+ this.buttonIcon.height = size;
+}
+
+ChocoButton.prototype.makeText = function(textContent) {
+ var width = this.setting.width / 2 - this.setting.strokeWidthPx;
+ var height = this.setting.height / 2;
+
+ // var btnText = game.add.text(0, 0, textContent, this.setting.fontStyle)
+ // .setTextBounds(0, 0, width, this.setting.height);
+
+ var btnText = game.add.text(width, height, textContent, this.setting.fontStyle);
+ btnText.anchor.set(0.5);
+ btnText.lineSpacing = ChocoButtonSetting.DEFAULT_TEXT_LINE_SPACING_PX;
+
+ return btnText;
+}
+
+ChocoButton.prototype.setIcon = function(icon) {
+ this.buttonIcon = this.button.addChild(icon);
+ this.buttonIcon.x = this.button.width / 2;
+ this.buttonIcon.y = this.button.height / 2;
+ this.buttonIcon.anchor.setTo(0.5, 0.5);
+
+ this.mouseOut();
+}
+
+ChocoButton.prototype.makeShortcutText = function() {
+ var shortcutText = game.add.text(this.button.width / 2, this.button.height * 9 / 10, "");
+ shortcutText.anchor.set(0.5);
+
+ shortcutText.fontSize = this.button.height * 2 / 10;
+ // shortcutText.addColor(this.setting.textColors.over, 0);
+ shortcutText.addColor("0xffffff", 0);
+
+ return shortcutText;
+}
+
+ChocoButton.prototype.addShortcutText = function(text) {
+ var scText = "[ " + text + " ]";
+ this.shortcutText.text = scText;
+
+}
+
+
+ChocoButton.prototype.mouseOut = function() {
+ this.mainText.fill = this.setting.textColors.out;
+ if(this.shortcutText != undefined)
+ this.shortcutText.fill = this.setting.textColors.over;
+ this.buttonStroke.tint = this.setting.strokeColors.out;
+ this.button.tint = this.setting.buttonColors.out;
+ if(typeof this.buttonIcon !== "undefined") {
+ this.buttonIcon.tint = this.setting.iconColors.out;
+ }
+}
+
+ChocoButton.prototype.mouseOver = function() {
+ this.mainText.fill = this.setting.textColors.over;
+ if(this.shortcutText != undefined)
+ this.shortcutText.fill = this.setting.textColors.over;
+ this.buttonStroke.tint = this.setting.strokeColors.over;
+ this.button.tint = this.setting.buttonColors.over;
+ if(typeof this.buttonIcon !== "undefined") {
+ this.buttonIcon.tint = this.setting.iconColors.over;
+ }
+}
+
+ChocoButton.prototype.mouseDown = function() {
+ this.mainText.fill = this.setting.textColors.down;
+ if(this.shortcutText != undefined)
+ this.shortcutText.fill = this.setting.textColors.over;
+ this.buttonStroke.tint = this.setting.strokeColors.down;
+ this.button.tint = this.setting.buttonColors.down;
+ if(typeof this.buttonIcon !== "undefined") {
+ this.buttonIcon.tint = this.setting.iconColors.down;
+ }
+}
+
+ChocoButton.prototype.buttonDisabled = function() {
+ this.mainText.fill = this.setting.textColors.disabled;
+ if(this.shortcutText != undefined)
+ this.shortcutText.fill = this.setting.textColors.disabled;
+ this.buttonStroke.tint = this.setting.strokeColors.disabled;
+ this.button.tint = this.setting.buttonColors.disabled;
+ if(typeof this.buttonIcon !== "undefined") {
+ this.buttonIcon.tint = this.setting.iconColors.disabled;
+ }
+}
+
+
+
+ChocoButton.prototype.getPosX = function() {
+ return this.buttonStroke.x + this.setting.width / 2;
+}
+
+ChocoButton.prototype.getPosY = function() {
+ return this.buttonStroke.y + y - this.setting.height / 2;
+}
+
+ChocoButton.prototype.move = function(x, y) {
+ this.buttonStroke.x = x - this.setting.width / 2;
+ this.buttonStroke.y = y - this.setting.height / 2;
+
+ this.button.x = x - this.setting.width / 2 + this.setting.strokeWidthPx;
+ this.button.y = y - this.setting.height / 2 + this.setting.strokeWidthPx;
+}
+
+ChocoButton.prototype.getInputEnabled = function() {
+ return this.button.inputEnabled;
+}
+
+ChocoButton.prototype.setInputEnabled = function(isEnabled) {
+ this.buttonStroke.inputEnabled = isEnabled;
+ this.button.inputEnabled = isEnabled;
+
+ if(isEnabled === true) {
+ this.mouseOut();
+ } else {
+ this.buttonDisabled();
+ }
+}
+
+ChocoButton.prototype.setLineSpacing = function(spacingInPixels) {
+ this.mainText.lineSpacing = spacingInPixels;
+}
+
+ChocoButton.NONE_ICON = "";
+ChocoButton.NONE_BUTTON_TEXT = "";
\ No newline at end of file
diff --git a/src/game/lib/button/choco_button_setting.js b/src/game/lib/button/choco_button_setting.js
new file mode 100644
index 0000000..581f1e8
--- /dev/null
+++ b/src/game/lib/button/choco_button_setting.js
@@ -0,0 +1,93 @@
+function ChocoButtonSetting(x, y, width, height, roundAmount) {
+ this.x = x;
+ this.y = y;
+ this.width = width;
+ this.height = height;
+ this.roundAmount = 0;
+ if(typeof roundAmount === "undefined") {
+ var shorterSide = width > height ? height : width;
+ this.roundAmount = shorterSide * 0.1;
+ } else {
+ this.roundAmount = roundAmount;
+ }
+ this.strokeWidthPx = ChocoButtonSetting.DEFAULT_STROKE_WIDTH_PX;
+
+
+ this.strokeColors = ChocoButtonSetting.DEFAULT_STROKE_COLORS;
+ this.buttonColors = ChocoButtonSetting.DEFAULT_BUTTON_COLORS;
+ this.textColors = ChocoButtonSetting.DEFAULT_TEXT_COLORS;
+ this.iconColors = ChocoButtonSetting.DEFAULT_ICON_COLORS;
+ this.fontStyle = ChocoButtonSetting.DEFAULT_TEXT_FONT;
+};
+
+ChocoButtonSetting.prototype.setStrokeColor = function(out, over, down, disabled) {
+ this.strokeColors = { };
+ this.strokeColors.out = out;
+ this.strokeColors.over = over;
+ this.strokeColors.down = down;
+ this.strokeColors.disabled = disabled;
+}
+
+ChocoButtonSetting.prototype.setButtonColor = function(out, over, down, disabled) {
+ this.buttonColors = { };
+ this.buttonColors.out = out;
+ this.buttonColors.over = over;
+ this.buttonColors.down = down;
+ this.buttonColors.disabled = disabled;
+}
+
+ChocoButtonSetting.prototype.setTextColor = function(out, over, down, disabled) {
+ this.textColors = { };
+ this.textColors.out = out;
+ this.textColors.over = over;
+ this.textColors.down = down;
+ this.textColors.disabled = disabled;
+}
+
+ChocoButtonSetting.prototype.setIconColor = function(out, over, down, disabled) {
+ this.iconColors = { };
+ this.iconColors.out = out;
+ this.iconColors.over = over;
+ this.iconColors.down = down;
+ this.iconColors.disabled = disabled;
+}
+
+
+ChocoButtonSetting.DEFAULT_STROKE_COLORS = {
+ out: 0x666666,
+ over: 0x333333,
+ down: 0x333333,
+ disabled: 0x666666
+};
+
+ChocoButtonSetting.DEFAULT_BUTTON_COLORS = {
+ out: 0xffffff,
+ over: 0xddffdd,
+ down: 0xaaffaa,
+ disabled: 0x333333
+};
+
+ChocoButtonSetting.DEFAULT_TEXT_COLORS = {
+ out: "#000",
+ over: "#333",
+ down: "#666",
+ disabled: "#999"
+};
+
+ChocoButtonSetting.DEFAULT_ICON_COLORS = {
+ out: 0xffffff,
+ over: 0xddffdd,
+ down: 0xaaffaa,
+ disabled: 0x333333
+};
+
+ChocoButtonSetting.DEFAULT_TEXT_FONT = {
+ font: "30px Arial",
+ boundsAlignH: "center", // left, center. right
+ boundsAlignV: "middle", // top, middle, bottom
+ fill: "#fff",
+ align: "center"
+};
+
+ChocoButtonSetting.DEFAULT_TEXT_LINE_SPACING_PX = -10; // in pixel
+ChocoButtonSetting.DEFAULT_STROKE_WIDTH_PX = 5; // in pixel
\ No newline at end of file
diff --git a/src/game/main_menu/main_menu.js b/src/game/main_menu/main_menu.js
index 5265893..2651d09 100644
--- a/src/game/main_menu/main_menu.js
+++ b/src/game/main_menu/main_menu.js
@@ -5,7 +5,7 @@ function MainMenu() {
}
MainMenu.prototype.preload = function() {
- // game.load.image('tile_choco', '../../../resources/image/background/tile_choco.png');
+ game.load.image('tile_choco', '../../../resources/image/background/tile_choco.png');
game.load.script('webfont', '//ajax.googleapis.com/ajax/libs/webfont/1.4.7/webfont.js');
}
@@ -42,7 +42,21 @@ MainMenu.prototype.create = function() {
*/
MainMenu.prototype.create = function() {
- game.stage.backgroundColor = '#4d4d4d';
+ console.log("create");
+
+ this.dbService = new DBService();
+ this.dbService.setMaestroID(sessionStorageManager.getMaestroID());
+ this.dbService.setPlayerID(sessionStorageManager.getPlayerID());
+
+ // bg
+ var graphics = game.add.graphics();
+ graphics.beginFill(MainColor.LIGHT_CHOCO_HEX, 1);
+ graphics.drawRect(0, 0,GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y);
+ graphics.beginFill(MainColor.CHOCO_HEX, 1);
+ graphics.drawRect(0, 0,GAME_SCREEN_SIZE.x, MainMenu.MAIN_MENU_HEIGHT);
+
+ this.appGroupButtons = {};
+ this.makeAppGroupButtons();
}
MainMenu.prototype.fontLoaded = function() {
@@ -56,25 +70,23 @@ MainMenu.prototype.fontLoaded = function() {
"menu_app" // callerClassName
);
- // bg
- game.add.graphics()
- .beginFill(MainColor.LIGHT_CHOCO_HEX, 1)
- .drawRect(0, 0,GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y);
-
// top ui
// var screenTopUI = new ScreenTopUI();
// screenTopUI.makeBackButton( (function() { this.back(); }).bind(this) );
// screenTopUI.makeFullScreenButton();
// this.loadAllowEditEnterCode(screenTopUI);
+ console.log(this.appGroupButtons);
// bottom ui
+ /*
var screenBottomUI = new ScreenBottomUI();
// ScreenBottomUI.printLeftText("게임 진행 정보");
// var playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
// ScreenBottomUI.printCenterText(playingAppName);
screenBottomUI.printCenterText("메뉴");
screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
+ */
new WelcomePlayerText(sessionStorageManager.getPlayerName());
if(isExperiencePlayerAccount()) {
@@ -94,6 +106,7 @@ MainMenu.prototype.back = function() {
}
MainMenu.prototype.loadAllowEditEnterCode = function(screenTopUI) {
+ /*
var dbConnectManager = new DBConnectManager();
dbConnectManager.requestAllowEditEnterCode(
sessionStorageManager.getMaestroID(),
@@ -111,9 +124,18 @@ MainMenu.prototype.loadAllowEditEnterCode = function(screenTopUI) {
this.loadFailed(replyJSON);
}).bind(this)
);
+ */
}
MainMenu.prototype.loadAppData = function() {
+ // this.dbService.requestMainMenuAppData(
+ // (function(replyJSON) {
+ // this.updateAppGroupButton(replyJSON.appGroupData);
+ // this.updateAppButtons(replyJSON.appData);
+ // })
+ // );
+
+ /*
var dbConnectManager = new DBConnectManager();
dbConnectManager.requestMenuAppList(
sessionStorageManager.getMaestroID(),
@@ -124,6 +146,7 @@ MainMenu.prototype.loadAppData = function() {
this.loadFailed(replyJSON);
}).bind(this)
);
+ */
}
MainMenu.prototype.loadSucceeded = function(replyJSON) {
@@ -150,6 +173,25 @@ MainMenu.prototype.hasApp = function(appID, appList) {
return false;
}
+MainMenu.prototype.makeAppGroupButtons = function() {
+ this.makeQuitButton();
+}
+
+MainMenu.prototype.makeQuitButton = function() {
+ var setting = new ChocoButtonSetting(1000, 40, 60, 60, 5);
+ var quitButton = new ChocoButton(
+ setting, // choco button setting,
+ (function() {
+ this.back();
+ }).bind(this)
+ );
+ quitButton.addIcon("tile_choco");
+ quitButton.setIconSize(30);
+ console.log(quitButton);
+
+ this.appGroupButtons.quitButton = quitButton;
+}
+
MainMenu.prototype.makeMouseAppButtons = function(appList, activeAppList) {
// console.log(appList);
@@ -282,4 +324,7 @@ MainMenu.prototype.getButtonPosY = function(index, buttonCount, startPosY) {
MainMenu.prototype.loadFailed = function(replyJSON) {
// console.log('login failed, jsonData : ' + JSON.stringify(replyJSON));
-}
\ No newline at end of file
+}
+
+
+MainMenu.MAIN_MENU_HEIGHT = 80;
\ No newline at end of file
diff --git a/src/web/client/main_menu.html b/src/web/client/main_menu.html
index 4e17e81..bb4fe17 100644
--- a/src/web/client/main_menu.html
+++ b/src/web/client/main_menu.html
@@ -35,15 +35,15 @@
-
+
-
-
-
+
+
+
@@ -52,6 +52,10 @@
+
+
+
+