Add: TypingAppButton(flat button) (incompleted)

src/game/lib/flat_button/basic_button.js

@@ -301,6 +301,19 @@ BasicButton.prototype.buttonDisabled = function() {
 
 
 
+BasicButton.prototype.setActive = function(flag) {
+	this.setInputEnabled(flag);
+
+	if(flag) {
+		this.buttonSprite.alpha = 1;
+		this.strokeSprite.alpha = 1;
+	} else {
+		this.buttonSprite.alpha = 0;
+		this.strokeSprite.alpha = 0;
+	}
+
+}
+
 BasicButton.prototype.getPosX = function() {
 	return this.strokeSprite.x + this.setting.width / 2;
 }

src/game/lib/flat_button/setting_button.js

@@ -38,11 +38,11 @@ function SettingButton(clickEvent) {
 
 	BasicButton.call(this, setting, clickEvent);
 
-	this.setMainText("세팅");
+	this.setMainText("설정");
 	// this.setMainText("Setting");
 	// this.addIcon("tile_choco");
 	// this.setIconSize(40);
-	this.setShortcutText("세팅");
+	// this.setShortcutText("[단축키]");
 	// this.setShortcutText("Setting");
 }
 

src/game/lib/flat_button/typing_app_button.js

@@ -0,0 +1,96 @@
+TypingAppButton.prototype = Object.create(BasicButton.prototype);
+TypingAppButton.constructor = TypingAppButton;
+
+function TypingAppButton(x, y, appData) {
+	console.log(appData);
+	this.appData = appData;
+
+	var setting = new ButtonSetting(x, y, 400, 80);
+	setting.setStrokeWidth(0);
+	setting.setRound(30);
+	// setting.setFont("Nanum Brush Script");
+	setting.setFont("Nanum Gothic");
+	setting.setFontSize(20);
+	setting.fontStyle.boundsAlignH = "center";	// left, center. right
+	setting.fontStyle.boundsAlignV = "middle";	// top, middle, bottom
+	setting.setStrokeColor(
+		TypingAppButton.STROKE_COLOR_OUT_HEX,
+		TypingAppButton.STROKE_COLOR_OVER_HEX,
+		TypingAppButton.STROKE_COLOR_DOWN_HEX,
+		TypingAppButton.STROKE_COLOR_DISABLED_HEX
+	);
+	setting.setButtonColor(
+		TypingAppButton.BUTTON_COLOR_OUT_HEX,
+		TypingAppButton.BUTTON_COLOR_OVER_HEX,
+		TypingAppButton.BUTTON_COLOR_DOWN_HEX,
+		TypingAppButton.BUTTON_COLOR_DISABLED_HEX
+	);
+	setting.setIconColor(
+		TypingAppButton.BUTTON_COLOR_OUT_HEX,
+		TypingAppButton.BUTTON_COLOR_OVER_HEX,
+		TypingAppButton.BUTTON_COLOR_DOWN_HEX,
+		TypingAppButton.BUTTON_COLOR_DISABLED_HEX
+	);
+	setting.setTextColor(
+		TypingAppButton.TEXT_COLOR_OUT_HEX,
+		TypingAppButton.TEXT_COLOR_OVER_HEX,
+		TypingAppButton.TEXT_COLOR_DOWN_HEX,
+		TypingAppButton.TEXT_COLOR_DISABLED_HEX
+	);
+
+
+	BasicButton.call(this, setting, this.clickEvent);
+
+	this.setMainText(this.appData.koreanName);
+	// this.setMainText("Setting");
+	// this.addIcon("tile_choco");
+	// this.setIconSize(40);
+	// this.setShortcutText("[단축키]");
+	// this.setShortcutText("Setting");
+
+	this.setInputEnabled(this.appData.activated);
+}
+
+TypingAppButton.prototype.clickEvent = function() {
+	sessionStorageManager.setPlayingAppID(this.appData.AppID);
+	sessionStorageManager.setPlayingAppName(this.appData.AppName);
+	sessionStorageManager.setPlayingAppKoreanName(this.appData.KoreanName);
+
+	if(isExperiencePlayerAccount())
+		location.href = '../../web/client/ads.html';
+	else
+		location.href = '../../web/client/start.html';
+}
+
+/*
+TypingAppButton.prototype.onClick = function() {
+	sessionStorageManager.setPlayingAppID(TypingAppButton.TYPING_APP_ID);
+	sessionStorageManager.setPlayingAppName(TypingAppButton.TYPING_APP_NAME);
+	sessionStorageManager.setPlayingAppKoreanName(TypingAppButton.TYPING_APP_KOREAN_NAME);
+	sessionStorageManager.setWritingID(this.writingData.writingID);
+	// location.href = '../../web/client/typing_exam.html';
+	location.href = '../../web/client/start.html';
+	// printSessionStorage();
+}
+
+
+TypingAppButton.TYPING_APP_ID				= 200;
+TypingAppButton.TYPING_APP_NAME				= "typing_exam";
+TypingAppButton.TYPING_APP_KOREAN_NAME		= "타자검정";
+*/
+
+
+TypingAppButton.STROKE_COLOR_OUT_HEX			= MainColor.DARK_CHOCO_HEX;
+TypingAppButton.STROKE_COLOR_OVER_HEX			= MainColor.DARK_CHOCO_HEX;
+TypingAppButton.STROKE_COLOR_DOWN_HEX			= MainColor.DARK_CHOCO_HEX;
+TypingAppButton.STROKE_COLOR_DISABLED_HEX		= MainColor.DARK_CHOCO_HEX;
+
+TypingAppButton.BUTTON_COLOR_OUT_HEX			= MainColor.DARK_CHOCO_HEX;
+TypingAppButton.BUTTON_COLOR_OVER_HEX			= MainColor.LIGHTER_CHOCO_HEX;
+TypingAppButton.BUTTON_COLOR_DOWN_HEX			= MainColor.LIGHT_CHOCO_HEX;
+TypingAppButton.BUTTON_COLOR_DISABLED_HEX		= MainColor.BLACK_HEX;
+
+TypingAppButton.TEXT_COLOR_OUT_HEX			= MainColor.WHITE_STRING;
+TypingAppButton.TEXT_COLOR_OVER_HEX			= MainColor.DARK_CHOCO_STRING;
+TypingAppButton.TEXT_COLOR_DOWN_HEX			= MainColor.LIGHTER_CHOCO_STRING;
+TypingAppButton.TEXT_COLOR_DISABLED_HEX		= MainColor.GREY_STRING;

src/game/main_menu/main_menu.js

@@ -64,6 +64,10 @@ MainMenu.prototype.create = function() {
 	this.appGroupTabLayout = null;
 	this.languageTabLayout = null;
 
+	this.typingAppButtons = new Array();
+	this.writingAppButtons = new Array();
+	this.mouseAppButtons = new Array();
+
 	this.selectedAppGroup = MainMenu.APP_GROUP_TYPING_PRACTICE;
 	this.selectedLanguage = MainMenu.LANGUAGE_KOREAN;
 	// this.animalRecordList.printScore(Animal.TYPE_PRACTICE);
@@ -196,9 +200,70 @@ MainMenu.prototype.updateAppButtons = function(appGroup, appData) {
 	}
 }
 
+MainMenu.prototype.clearTypingAppButtons = function(appData) {
+	var count = this.typingAppButtons.length;
+	for(var i = 0; i < count; i++) {
+		var tempButton = this.typingAppButtons.pop();
+		tempButton.setActive(false);
+		delete tempButton;
+	}
+}
+
+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.appID)
+			return highestRecordList[i].highestRecord;
+	}
+
+	return 0;
+}
+
+MainMenu.prototype.makeTypingPracticeAppDataList = 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.makeTypingPracticeAppButtons = function(appData) {
 	console.log("makeTypingPracticeAppButtons");
-	console.log(appData);
+	this.clearTypingAppButtons();
+
+	var buttonIndex = 0;
+	var appDataList = this.makeTypingPracticeAppDataList(appData);
+	var count = appDataList.length;
+	for(var i = 0; i < count; i++) {
+		var x = (i % 2) === 0 ? 300 : 800;
+		var y = 200 + Math.floor(i / 2) * 100;
+
+		var leftButton = new TypingAppButton(x, y,appDataList[i]);
+		this.typingAppButtons.push(leftButton);
+	}
 }
 
 MainMenu.prototype.makeTypingTestAppButtons = function(appData) {

src/web/client/main_menu.html

@@ -65,6 +65,7 @@
 		<script src="../../game/lib/flat_button/app_group_tab.js"></script>
 		<script src="../../game/lib/flat_button/language_tab.js"></script>
 		<script src="../../game/lib/flat_button/tab_layout.js"></script>
+		<script src="../../game/lib/flat_button/typing_app_button.js"></script>
 
 		<script src="../../game/lib/animal.js"></script>
 		<script src="../../game/lib/animal_list.js"></script>

src/web/php/db/menu_collection.php

@@ -86,18 +86,19 @@ class MenuCollection extends DBMethodContainer
 	public function getTypingAppList($maestroID, $playerID, $appGroup, $language)
 	{
 		$query = "
-			SELECT AppID, KoreanName
+			SELECT AppID, AppName, KoreanName
 			FROM app
 			WHERE AppType=? AND Status=1";
 		$stmt = $this->mysqli->prepare($query);
 		$stmt->bind_param("i", $this->getTypingAppType($appGroup, $language));
 		$stmt->execute();
-		$stmt->bind_result($appID, $koreanName);
+		$stmt->bind_result($appID, $appName, $koreanName);
 
 		$resultArray = array();
 		while($stmt->fetch()) {
 			$rowArray = array();
 		    $rowArray["appID"] = $appID;
+		    $rowArray["appName"] = $appName;
 		    $rowArray["koreanName"] = $koreanName;
 			array_push($resultArray, $rowArray);
 		}
@@ -109,17 +110,18 @@ class MenuCollection extends DBMethodContainer
 	public function getMouseAppList()
 	{
 		$query = "
-			SELECT AppID, KoreanName
+			SELECT AppID, AppName, KoreanName
 			FROM app
 			WHERE AppType=100 AND Status=1";
 		$stmt = $this->mysqli->prepare($query);
 		$stmt->execute();
-		$stmt->bind_result($appID, $koreanName);
+		$stmt->bind_result($appID, $appName, $koreanName);
 
 		$resultArray = array();
 		while($stmt->fetch()) {
 			$rowArray = array();
 		    $rowArray["appID"] = $appID;
+		    $rowArray["appName"] = $appName;
 		    $rowArray["koreanName"] = $koreanName;
 			array_push($resultArray, $rowArray);
 		}
@@ -221,7 +223,7 @@ class MenuCollection extends DBMethodContainer
 		for($i = 0; $i < $count; $i++) {
 			$writingID = $appList[$i]["writingID"];
 			$highestRecord["writingID"] = $writingID;
-			$highestRecord["HighestRecord"] = $writingCollection->getWritingHighestRecord($maestroID, $playerID, $writingID);
+			$highestRecord["highestRecord"] = $writingCollection->getWritingHighestRecord($maestroID, $playerID, $writingID);
 			array_push($highestRecordArray, $highestRecord);
 		}
 
@@ -235,7 +237,7 @@ class MenuCollection extends DBMethodContainer
 		for($i = 0; $i < $count; $i++) {
 			$appID = $appList[$i]["appID"];
 			$highestRecord["appID"] = $appID;
-			$highestRecord["HighestRecord"] = $this->getTypingHighestRecord($maestroID, $playerID, $appID);
+			$highestRecord["highestRecord"] = $this->getTypingHighestRecord($maestroID, $playerID, $appID);
 			array_push($highestRecordArray, $highestRecord);
 
 		}