Files
chocomae/src/game/main_menu/main_menu.js
T
2019-09-15 19:25:42 +09:00

681 lines
20 KiB
JavaScript

MainMenu.prototype = Object.create(Phaser.State.prototype);
MainMenu.constructor = MainMenu;
function MainMenu() {
}
MainMenu.prototype.preload = function() {
game.load.image('tile_choco', '../../../resources/image/background/tile_choco.png');
game.load.image('home', '../../../resources/image/icon/home.png');
game.load.image('keyboard', '../../../resources/image/icon/keyboard.png');
game.load.image('mouse', '../../../resources/image/icon/mouse.png');
Animal.loadResources();
TypingAppButton.loadResources();
game.load.image('alien', '../../../resources/image/icon/green_alien.png');
game.load.image('card', '../../../resources/image/icon/card.png');
game.load.image('grill', '../../../resources/image/icon/grill.png');
game.load.image('spaceship', '../../../resources/image/icon/spaceship.png');
game.load.image('chocoball', '../../../resources/image/icon/chocoball.png');
game.load.image('alienship', '../../../resources/image/icon/alienship.png');
game.load.script('webfont', '//ajax.googleapis.com/ajax/libs/webfont/1.4.7/webfont.js');
}
// fontLoaded, create method for Google WebFonts test
/*
MainMenu.prototype.fontLoaded = function() {
console.log("fontLoaded");
// this.loadingImage.alpha = 0;
// this.text.font = 'Nanum Gothic';
// text2.font = 'Nanum Brush Script';
// this.text3.font = 'Nanum Brush Script';
}
MainMenu.prototype.create = function() {
console.log("create");
game.stage.backgroundColor = '#4d4d4d';
this.loadingImage = game.add.sprite(GAME_SCREEN_SIZE.x / 2, GAME_SCREEN_SIZE.y / 2, "tile_choco");
this.text = game.add.text(game.world.centerX, game.world.centerY - 150, "- phaser -\n나눔 고딕 웹 폰트\ngoogle web fonts");
this.text.anchor.setTo(0.5);
this.text.fontSize = 60;
this.text2 = game.add.text(game.world.centerX, game.world.centerY, "기본 default 글꼴");
this.text2.anchor.setTo(0.5);
this.text2.fontSize = 60;
this.text3 = game.add.text(game.world.centerX, game.world.centerY + 150, "- phaser -\n나눔 브러시 스크립트 웹 폰트\ngoogle web fonts");
this.text3.anchor.setTo(0.5);
this.text3.fontSize = 60;
}
*/
MainMenu.prototype.create = function() {
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.BLACK_HEX, 1);
graphics.beginFill(MainColor.CHOCO_HEX, 1);
graphics.drawRect(0, 0, GAME_SCREEN_SIZE.x, MainMenu.MAIN_MENU_HEIGHT);
this.appGroupTabLayout = null;
this.languageTabLayout = null;
this.typingAppButtons = new Array();
this.makeTypingAppButtons();
this.writingAppButtons = new Array();
this.playAppButtons = new Array();
this.makePlayAppButtons();
this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_PRACTICE;
// this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_PLAY;
this.selectedLanguage = MainMenu.LANGUAGE_KOREAN;
// this.animalRecordList.printScore(Animal.TYPE_PRACTICE);
}
MainMenu.prototype.fontLoaded = function() {
// keyboard shortcut
this.keyboardShortcut = new KeyboardShortcut();
this.keyboardShortcut.addCallback(
Phaser.KeyCode.ESC, // keyCode
null, // keyDownHandler
(function() { this.back(); }).bind(this), // keyUpHandler
"menu_app" // callerClassName
);
// top UI
this.makeButtons();
this.makeAppGroupTab();
// bottom UI
this.makeAnimalRecordList();
this.makeLanguageTab();
// this.animalRecordList.hide();
// this.languageTabLayout.hide();
this.backButton.applyLoadedFont();
this.settingButton.applyLoadedFont();
this.appGroupTabLayout.applyLoadedFont();
this.animalRecordList.applyLoadedFont();
this.languageTabLayout.applyLoadedFont();
// welcome message
new WelcomePlayerText(sessionStorageManager.getPlayerName());
if(isExperiencePlayerAccount()) {
game.time.events.add(Phaser.Timer.SECOND * 2.5,
(function() { new NoticeExperiencePlayerText(); } ),
this
);
}
this.loadAppData();
}
MainMenu.prototype.back = function() {
sessionStorageManager.clear();
location.href = '../../web/client/login.html';
}
MainMenu.prototype.loadAllowEditEnterCode = function(screenTopUI) {
/*
var dbConnectManager = new DBConnectManager();
dbConnectManager.requestAllowEditEnterCode(
sessionStorageManager.getMaestroID(),
(function(replyJSON) {
if(replyJSON["AllowEditEnterCode"] == "1") {
screenTopUI.makeSetupButton( (function() {
console.log("setup");
location.href = '../../web/client/setup.html';
}).bind(this) );
}
}).bind(this),
(function(replyJSON) {
this.loadFailed(replyJSON);
}).bind(this)
);
*/
}
MainMenu.prototype.loadAppData = function() {
this.dbService.requestMainMenuAppData(
this.selectedAppGroup,
this.selectedLanguage,
(function(replyJSON) {
// this.updateAppGroupTab(replyJSON.appGroupData);
this.updateAppButtons(replyJSON.appGroup, replyJSON.appData);
// this.updateLanguageTab(replyJSON.appGroup);
}).bind(this),
(function(replyJSON) {
console.log(replyJSON);
}).bind(this)
);
/*
var dbConnectManager = new DBConnectManager();
dbConnectManager.requestMenuAppList(
sessionStorageManager.getMaestroID(),
(function(replyJSON) {
this.loadSucceeded(replyJSON);
}).bind(this),
(function(replyJSON) {
this.loadFailed(replyJSON);
}).bind(this)
);
*/
}
MainMenu.prototype.makeTypingAppButtons = function() {
var offsetX = 95;
var startY = 190;
var offsetY = 110;
var buttonHalfWidth = TypingAppButton.WIDTH / 2;
for(var i = 0; i < MainMenu.TYPING_APP_COUNT; i++) {
var x = (i % 2) === 0 ? buttonHalfWidth + offsetX : GAME_SCREEN_SIZE.x - buttonHalfWidth - offsetX;
var y = startY + Math.floor(i / 2) * offsetY;
var button = new TypingAppButton(x, y);
button.setActive(false);
this.typingAppButtons.push(button);
}
}
MainMenu.prototype.makePlayAppButtons = function() {
var startX = 150;
var startY = 300;
var offsetX = PlayAppButton.WIDTH + 30;
var offsetY = 250;
var buttonHalfWidth = TypingAppButton.WIDTH / 2;
for(var i = 0; i < MainMenu.PLAY_APP_COUNT; i++) {
var x = startX + (i % 5) * offsetX;
var y = Math.floor(i / 5) === 0 ? startY : startY + offsetY;
var button = new PlayAppButton(x, y);
button.setActive(false);
this.playAppButtons.push(button);
}
}
MainMenu.prototype.hideAllButtons = function() {
// hide all buttons
for(var i = 0; i < MainMenu.TYPING_APP_COUNT; i++) {
this.typingAppButtons[i].setActive(false);
}
for(var i = 0; i < MainMenu.PLAY_APP_COUNT; i++) {
this.playAppButtons[i].setActive(false);
}
}
MainMenu.prototype.updateAppButtons = function(appGroup, appData) {
this.hideAllButtons();
switch(parseInt(appGroup)) {
case MainMenu.APP_GROUP_TYPING_PRACTICE:
this.updateTypingPracticeAppButtons(appGroup, appData);
break;
case MainMenu.APP_GROUP_TYPING_TEST:
this.updateTypingTestAppButtons(appGroup, appData);
break;
case MainMenu.APP_GROUP_TYPING_EXAM:
this.updateTypingExamAppButtons(appData);
break;
case MainMenu.APP_GROUP_TYPING_PLAY:
this.updatePlayAppButtons(appData);
// this.updateTypingPlayAppButtons(appData);
break;
case MainMenu.APP_GROUP_MOUSE_PLAY:
this.updatePlayAppButtons(appData);
// this.updateMousePlayAppButtons(appData);
break;
default:
console.log(appGroup);
}
}
MainMenu.prototype.isActivatedApp = function(appID, activeAppList) {
var count = activeAppList.length;
for(var i = 0; i < count; i++) {
if(appID === activeAppList[i].appID)
return true;
}
return false;
}
MainMenu.prototype.getAppHighestRecord = function(appID, highestRecordList) {
var count = highestRecordList.length;
for(var i = 0; i < count; i++) {
if(appID === highestRecordList[i].appID)
return highestRecordList[i].highestRecord;
}
return 0;
}
MainMenu.prototype.makeTypingPracticeAppDataList = function(appGroup, appData) {
var appDataList = new Array();
var appList = appData.appList;
if(appList.length === 0)
return [];
var count = appList.length;
for(var appDataIndex = 0; appDataIndex < count; appDataIndex++) {
var data = {};
data["appGroup"] = appGroup;
data["appID"] = appList[appDataIndex].appID;
data["appName"] = appList[appDataIndex].appName;
data["koreanName"] = appList[appDataIndex].koreanName;
data["activated"] = this.isActivatedApp(appList[appDataIndex].appID, appData.activeAppList);
data["highestRecord"] = this.getAppHighestRecord(appList[appDataIndex].appID, appData.highestRecordList);
appDataList.push(data);
}
return appDataList;
}
MainMenu.prototype.makePlayAppDataList = function(appData) {
var appDataList = new Array();
var appList = appData.appList;
if(appList.length === 0)
return [];
var count = appList.length;
for(var appDataIndex = 0; appDataIndex < count; appDataIndex++) {
var data = {};
data["appID"] = appList[appDataIndex].appID;
data["appName"] = appList[appDataIndex].appName;
data["koreanName"] = appList[appDataIndex].koreanName;
data["activated"] = this.isActivatedApp(appList[appDataIndex].appID, appData.activeAppList);
// data["highestRecord"] = this.getAppHighestRecord(appList[appDataIndex].appID, appData.highestRecordList);
appDataList.push(data);
}
return appDataList;
}
MainMenu.prototype.updateTypingPracticeAppButtons = function(appGroup, appData) {
console.log("updateTypingPracticeAppButtons");
var buttonIndex = 0;
var appDataList = this.makeTypingPracticeAppDataList(appGroup, appData);
var count = appDataList.length;
for(var i = 0; i < MainMenu.TYPING_APP_COUNT; i++) {
var button = this.typingAppButtons[i];
if(i < count) {
button.setActive(true);
button.updateAppData(appDataList[i]);
} else {
button.setActive(true);
button.showEmptyDisabled();
}
}
}
MainMenu.prototype.updateTypingTestAppButtons = function(appGroup, appData) {
console.log("updateTypingTestAppButtons");
var buttonIndex = 0;
var appDataList = this.makeTypingPracticeAppDataList(appGroup, appData);
var count = appDataList.length;
for(var i = 0; i < MainMenu.TYPING_APP_COUNT; i++) {
var button = this.typingAppButtons[i];
if(i < count) {
button.setActive(true);
button.updateAppData(appDataList[i]);
} else {
button.setActive(true);
button.showEmptyDisabled();
}
}
}
MainMenu.prototype.updateTypingExamAppButtons = function(appData) {
console.log("updateTypingExamAppButtons");
console.log(appData);
}
MainMenu.prototype.updatePlayAppButtons = function(appData) {
console.log("updatePlayAppButtons");
var buttonIndex = 0;
var appDataList = this.makePlayAppDataList(appData);
var count = appDataList.length;
for(var i = 0; i < MainMenu.PLAY_APP_COUNT; i++) {
var button = this.playAppButtons[i];
if(i < count) {
button.setActive(true);
button.updateAppData(appDataList[i]);
} else {
button.setActive(true);
button.showEmptyDisabled();
}
}
}
/*
MainMenu.prototype.loadSucceeded = function(replyJSON) {
// console.log(replyJSON);
this.makeMouseAppButtons(
replyJSON.MouseAppList,
replyJSON.MouseActiveAppList
);
this.makeTypingButtons(
replyJSON.TypingPracticeAppCount,
replyJSON.TypingTestAppCount,
replyJSON.TypingAppList,
replyJSON.TypingActiveAppList
);
}
MainMenu.prototype.hasApp = function(appID, appList) {
for(var i = 0; i < appList.length; i++) {
if(appList[i].AppID === appID)
return true;
}
return false;
}
*/
MainMenu.prototype.makeButtons = function() {
this.backButton = new BackButton(
(function() { console.log("back"); }).bind(this)
);
this.settingButton = new SettingButton(
(function() { console.log("setting"); }).bind(this)
);
}
MainMenu.prototype.makeAppGroupTab = function() {
this.appGroupTabLayout = new TabLayout(100, 0, 844, 70);
var typingPracticeGroupTab = new AppGroupTab(
(function() {
console.log("typing finger position");
this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_PRACTICE;
this.animalRecordList.show();
this.animalRecordList.printScore(Animal.TYPE_PRACTICE);
this.languageTabLayout.show();
this.loadAppData();
}).bind(this)
);
typingPracticeGroupTab.reserveIcon("keyboard");
typingPracticeGroupTab.reserveSubText("손가락 연습");
this.appGroupTabLayout.add(typingPracticeGroupTab);
var typingTestGroupTab = new AppGroupTab(
(function() {
console.log("typing practice");
this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_TEST;
this.animalRecordList.show();
this.animalRecordList.printScore(Animal.TYPE_TEST);
this.languageTabLayout.show();
this.loadAppData();
}).bind(this)
);
typingTestGroupTab.reserveIcon("keyboard");
typingTestGroupTab.reserveSubText("시험");
this.appGroupTabLayout.add(typingTestGroupTab);
var typingExamGroupTab = new AppGroupTab(
(function() {
console.log("typing exam");
this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_EXAM;
this.animalRecordList.show();
this.animalRecordList.printScore(Animal.TYPE_EXAM);
this.languageTabLayout.show();
this.loadAppData();
}).bind(this)
);
typingExamGroupTab.reserveIcon("keyboard");
typingExamGroupTab.reserveSubText("검정");
this.appGroupTabLayout.add(typingExamGroupTab);
var typingPlayGroupTab = new AppGroupTab(
(function() {
console.log("typing play");
this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_PLAY;
this.animalRecordList.hide();
this.languageTabLayout.show();
this.loadAppData();
}).bind(this)
);
typingPlayGroupTab.reserveIcon("keyboard");
typingPlayGroupTab.reserveSubText("놀이");
this.appGroupTabLayout.add(typingPlayGroupTab);
var mousePlayGroupTab = new AppGroupTab(
(function() {
console.log("mouse play");
this.selectedAppGroup = MainMenu.APP_GROUP_MOUSE_PLAY;
this.animalRecordList.hide();
this.languageTabLayout.hide();
this.loadAppData();
}).bind(this)
);
mousePlayGroupTab.reserveIcon("mouse");
mousePlayGroupTab.reserveSubText("놀이");
this.appGroupTabLayout.add(mousePlayGroupTab);
this.appGroupTabLayout.createTabs();
// typingPracticeGroupTab.setInputEnabled(false);
// typingTestGroupTab.setInputEnabled(false);
// typingExamGroupTab.setInputEnabled(false);
// typingPlayGroupTab.setInputEnabled(false);
// mousePlayGroupTab.setInputEnabled(false);
}
MainMenu.prototype.makeAnimalRecordList = function() {
this.animalRecordList = new AnimalRecordList(AnimalRecordList.TYPE_MENU);
this.animalRecordList.printScore(Animal.TYPE_PRACTICE);
}
MainMenu.prototype.makeLanguageTab = function() {
var languageTabHeight = 48;
// this.languageTabLayout = new TabLayout(0, GAME_SCREEN_SIZE.y - languageTabHeight, GAME_SCREEN_SIZE.x, languageTabHeight);
this.languageTabLayout = new TabLayout(0, 70, GAME_SCREEN_SIZE.x, languageTabHeight);
var koreanTab = new LanguageTab(
(function() {
console.log("Language : Korean");
this.selectedLanguage = MainMenu.LANGUAGE_KOREAN;
this.loadAppData();
}).bind(this)
);
koreanTab.reserveMainText("한글");
this.languageTabLayout.add(koreanTab);
var englishTab = new LanguageTab(
(function() {
console.log("Language : English");
this.selectedLanguage = MainMenu.LANGUAGE_ENGLISH;
this.loadAppData();
}).bind(this)
);
englishTab.reserveMainText("영어");
this.languageTabLayout.add(englishTab);
this.languageTabLayout.createTabs();
}
/*
MainMenu.prototype.makeMouseAppButtons = function(appList, activeAppList) {
// console.log(appList);
var mouseAppCount = Object.keys(appList).length;
for(var i = 0; i < mouseAppCount; i++) {
var posX = this.getButtonPosX(i, mouseAppCount);
var posY = this.getButtonPosY(i, mouseAppCount, GameAppButton.BUTTON_UPPER_POS_Y);
var app = appList[i];
var gameAppButton = new GameAppButton(
posX, posY,
GameAppButton.TYPE_MOUSE_APP,
RoundRectButton.NONE_ICON, app.KoreanName,
{
AppID: app.AppID,
AppName: app.AppName,
KoreanName: app.KoreanName
}
);
gameAppButton.text.font = "Nanum Brush Script";
if(!this.hasApp(app.AppID, activeAppList))
gameAppButton.setInputEnabled(false);
}
}
MainMenu.prototype.makeTypingButtons = function(typingPracticeAppCount, typingTestAppCount, appList, activeAppList) {
// console.log(typingPracticeAppCount);
// console.log(typingTestAppCount);
// console.log(appList);
var isTypingPracticeAppExist = typingPracticeAppCount > 0 ? true : false;
var isTypingTestAppExist = typingTestAppCount > 0 ? true : false;
var typingAppTotalCount = Object.keys(appList).length;
var typingAppIndex = 0;
// typing tab buttons
var typingPracticeTabButton = new TypingTabButton(
TypingTabButton.PRACTICE_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y,
"", "타자 시험",
(function() {
location.href = '../../web/client/menu_typing_practice.html';
})
);
if(typingPracticeAppCount === 0)
typingPracticeTabButton.setInputEnabled(false);
var typingTestTabButton = new TypingTabButton(
TypingTabButton.TEST_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y,
"", "타자 검정",
(function() {
location.href = '../../web/client/menu_typing_test.html';
})
);
if(typingTestAppCount === 0)
typingTestTabButton.setInputEnabled(false);
// typing app buttons
for(var typingButtonIndex = 0; typingButtonIndex < typingAppTotalCount; typingButtonIndex++) {
var posX = this.getButtonPosX(
typingButtonIndex, typingAppTotalCount
);
var posY = this.getButtonPosY(
typingButtonIndex, typingAppTotalCount, GameAppButton.BUTTON_LOWER_POS_Y
);
var app = appList[typingAppIndex];
var isKoreanTypingApp = app.AppID < 32 ? true : false;
var gameAppButton = new GameAppButton(
posX, posY, GameAppButton.TYPE_TYPING_APP,
RoundRectButton.NONE_ICON, // "icon_fullscreen",
// (isKoreanTypingApp ? "(한글)" : "(영문)") + "\n" + app.KoreanName,
app.KoreanName,
{
AppID: app.AppID,
AppName: app.AppName,
KoreanName: app.KoreanName
}
);
if(!this.hasApp(app.AppID, activeAppList))
gameAppButton.setInputEnabled(false);
typingAppIndex++;
}
}
MainMenu.prototype.getButtonPosX = function(index, buttonCount) {
var gap = GameAppButton.BUTTON_WIDTH + GameAppButton.BUTTON_GAP;
var maxColumnNum = Math.floor( (game.world.width - GameAppButton.MARGIN_VERTICAL) / gap );
// console.log("maxColumnNum : " + maxColumnNum);
var rowCount = Math.ceil(buttonCount / maxColumnNum);
// console.log("rowCount : " + rowCount);
var columnIndex = index % maxColumnNum;
// console.log("columnIndex : " + columnIndex);
var rowIndex = Math.floor(index / maxColumnNum);
// console.log("rowIndex : " + rowIndex);
var columnCountForThisRow = 0;
if(rowIndex < rowCount - 1)
columnCountForThisRow = maxColumnNum;
else
columnCountForThisRow = buttonCount - (maxColumnNum * rowIndex);
// console.log("columnCountForThisRow : " + columnCountForThisRow);
var startX = game.world.width / 2 - ( (gap / 2) * (columnCountForThisRow - 1) );
return startX + gap * columnIndex;
}
MainMenu.prototype.getButtonPosY = function(index, buttonCount, startPosY) {
var gap = GameAppButton.BUTTON_HEIGHT + GameAppButton.BUTTON_GAP;
var maxColumnNum = Math.floor( (game.world.width - GameAppButton.MARGIN_VERTICAL) / gap );
// console.log("maxColumnNum : " + maxColumnNum);
var rowCount = Math.ceil(buttonCount / maxColumnNum);
// console.log("rowCount : " + rowCount);
var rowIndex = Math.floor(index / maxColumnNum);
// console.log("rowIndex : " + rowIndex);
var startY = startPosY - ( (gap / 2) * (rowCount - 1) );
return startY + gap * rowIndex;
}
*/
MainMenu.prototype.loadFailed = function(replyJSON) {
// console.log('login failed, jsonData : ' + JSON.stringify(replyJSON));
}
MainMenu.MAIN_MENU_HEIGHT = 70;
MainMenu.APP_GROUP_TYPING_PRACTICE = 0;
MainMenu.APP_GROUP_TYPING_TEST = 1;
MainMenu.APP_GROUP_TYPING_EXAM = 2;
MainMenu.APP_GROUP_TYPING_PLAY = 3;
MainMenu.APP_GROUP_MOUSE_PLAY = 4;
MainMenu.LANGUAGE_KOREAN = 0;
MainMenu.LANGUAGE_ENGLISH = 1;
MainMenu.TYPING_APP_COUNT = 10;
MainMenu.PLAY_APP_COUNT = 10;