Add: ranking for app

This commit is contained in:
2018-09-05 09:21:48 +09:00
parent 3a1be0744c
commit 3d4852c42c
7 changed files with 529 additions and 19 deletions
+12 -19
View File
@@ -22,25 +22,18 @@ const GAME_SCREEN_SIZE = { x: 1024, y: 768 }
let sessionStorageManager = new SessionStorageManager();
{
// if(isDebugMode()) {
// sessionStorageManager.playerName = "부현율";
// sessionStorageManager.playerID = 8;
// sessionStorageManager.playingAppID = 101;
// sessionStorageManager.playingAppName = "space_invaders";
// sessionStorageManager.score = 1000;
// sessionStorageManager.highScore = 2000;
// }
console.log("maestroID : " + sessionStorageManager.maestroID);
console.log("maestroAccountType : " + sessionStorageManager.maestroAccountType);
console.log("playerName : " + sessionStorageManager.playerName);
console.log("playerID : " + sessionStorageManager.playerID);
console.log("playerAccountType : " + sessionStorageManager.playerAccountType);
console.log("playingAppID : " + sessionStorageManager.playingAppID);
console.log("playingAppName : " + sessionStorageManager.playingAppName);
console.log("playingAppKoreanName : " + sessionStorageManager.playingAppKoreanName);
console.log("record : " + sessionStorageManager.record);
console.log("bestRecord : " + sessionStorageManager.bestRecord);
if(isDebugMode()) {
console.log("maestroID : " + sessionStorageManager.maestroID);
console.log("maestroAccountType : " + sessionStorageManager.maestroAccountType);
console.log("playerName : " + sessionStorageManager.playerName);
console.log("playerID : " + sessionStorageManager.playerID);
console.log("playerAccountType : " + sessionStorageManager.playerAccountType);
console.log("playingAppID : " + sessionStorageManager.playingAppID);
console.log("playingAppName : " + sessionStorageManager.playingAppName);
console.log("playingAppKoreanName : " + sessionStorageManager.playingAppKoreanName);
console.log("record : " + sessionStorageManager.record);
console.log("bestRecord : " + sessionStorageManager.bestRecord);
}
if(sessionStorageManager.maestroID === null && !isLogin()) {
goLogin();
+20
View File
@@ -402,6 +402,26 @@ class DBConnectManager {
);
}
requestAppRanking(maestroID, appID, onSucceededListener, onFailedListener) {
let xhr = new XMLHttpRequest();
xhr.open("POST", this.phpPath + "server/record/app_ranking.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
if(xhr.readyState == 4 && xhr.status == 200) {
let replyJSON = JSON.parse(xhr.responseText);
if(replyJSON != null)
onSucceededListener(replyJSON);
else
onFailedListener(replyJSON);
}
};
xhr.send(
"MaestroID=" + maestroID
+ "&AppID=" + appID
);
}
loadTempPlayerHistory(historyRecordManager) {
+13
View File
@@ -0,0 +1,13 @@
/////////////////////////////
// Main game
const CONTENT_ID = "Ranking";
let game = new Phaser.Game(
GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y,
Phaser.CANVAS, CONTENT_ID,
this, false, false
);
game.state.add('Ranking', Ranking);
game.state.start('Ranking');
+316
View File
@@ -0,0 +1,316 @@
/////////////////////////////
// Ranking
class Ranking {
preload() {
game.load.image('icon_fullscreen', '../../../resources/image/icon/fullscreen_white.png');
}
create() {
self = this;
this.dbConnectManager = new DBConnectManager();
this.jsonData = null;
this.mode = Ranking.MODE_HOUR;
this.game.stage.backgroundColor = '#4d4d4d';
// let phaser = game.add.image(game.world.centerX, game.world.centerY, 'phaser');
// phaser.anchor.set(0.5);
// phaser.alpha = 0.1;
// top ui
let screenTopUI = new ScreenTopUI();
screenTopUI.makeBackButton( () => {
location.href = '../../web/client/start.html';
});
screenTopUI.makeFullScreenButton();
let resultTextStyle = textStyleBasic;
resultTextStyle.font = "bold 42px Arial";
this.textTitle = game.add.text(GAME_SCREEN_SIZE.x / 2, 32, "수업시간 순위", resultTextStyle)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
this.textTitle.anchor.set(0.5);
this.textTitle.addColor("#ff6666", 0);
// let typingRecordTextStyle = textStyleBasic;
// typingRecordTextStyle.font = "bold 62px Arial";
// let bestRecordTextStyle = textStyleBasic;
// bestRecordTextStyle.font = "32px Arial";
// rank
let rankAreaPositionY = 280;
let typingTextStyle = textStyleBasic;
// typingTextStyle.font = "bold 84px Arial";
rankAreaPositionY = 90;
let style = { font: "34px Arial", fill: "#fff", tabs: [ 60, 160, 160 ] };
let rankAreaPositionX = 160;
this.textRanking1to10 = game.add.text(rankAreaPositionX, rankAreaPositionY , '', style)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
this.textRanking11to20 = game.add.text(rankAreaPositionX + 420, rankAreaPositionY, '', style)
.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
let buttonPositionY = 640;
let buttonHour = this.makeTextButton(game.world.centerX - 220, buttonPositionY, "수업시간 순위", this.showRankingHour);
// buttonHour.startButton.inputEnabled = false;
let buttonDay = this.makeTextButton(game.world.centerX, buttonPositionY, "오늘의 순위", this.showRankingDay);
// buttonDay.startButton.inputEnabled = false;
let buttonMonth = this.makeTextButton(game.world.centerX + 220, buttonPositionY, "이달의 순위", this.showRankingMonth);
// buttonMonth.startButton.inputEnabled = false;
// bottom ui
let screenBottomUI = new ScreenBottomUI();
// ScreenBottomUI.printLeftText("게임 진행 정보");
// let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
// ScreenBottomUI.printCenterText(playingAppName);
screenBottomUI.printCenterText("랭킹");
screenBottomUI.printRightText(sessionStorageManager.playerName);
this.getRecordToRankingServer();
game.time.events.loop(Phaser.Timer.SECOND * 10, this.getRecordToRankingServer, this);
}
makeTextButton(x, y, buttonText, eventListener) {
let setting = new RoundRectButtonSetting(x, y, 200, 100);
setting.fontStyle.fontWeight = "bold";
switch(buttonText) {
case "수업시간 순위":
setting.strokeColors = {
out: 0xddcccc,
over: 0xccaaaa,
down: 0xbb9999,
disabled: 0x333333
};
setting.buttonColors = {
out: 0xffeeee,
over: 0xddcccc,
down: 0xccaaaa,
disabled: 0x333333
};
setting.textColors = {
out: "#f00",
over: "#f00",
down: "#f00",
disabled: "#999"
};
break;
case "오늘의 순위":
setting.strokeColors = {
out: 0xccccdd,
over: 0xaaaacc,
down: 0x9999bb,
disabled: 0x333333
};
setting.buttonColors = {
out: 0xeeeeff,
over: 0xccccdd,
down: 0xaaaacc,
disabled: 0x333333
};
setting.textColors = {
out: "#00f",
over: "#00f",
down: "#00f",
disabled: "#999"
};
break;
case "이달의 순위":
setting.strokeColors = {
out: 0xccddcc,
over: 0xaaccaa,
down: 0x99bb99,
disabled: 0x333333
};
setting.buttonColors = {
out: 0xeeffee,
over: 0xccddcc,
down: 0xaaccaa,
disabled: 0x333333
};
setting.textColors = {
out: "#0f0",
over: "#0f0",
down: "#0f0",
disabled: "#999"
};
break;
}
return new RoundRectButton(setting, RoundRectButton.NONE_ICON, buttonText, eventListener);
}
getRecordToRankingServer() {
// console.log("getRecordToRankingServer : " + this.mode);
let self = this;
this.showRanking(null);
// let totalInfo = new Object();
// this.showRanking(totalInfo);
this.dbConnectManager.requestAppRanking(
sessionStorageManager.maestroID,
sessionStorageManager.playingAppID,
(jsonData) => {
self.showRanking(jsonData);
},
(jsonData) => {
self.showRanking(null);
}
);
// console.log('playerUserID : ' + playerUserID);
// console.log('playerName : ' + playerName);
// console.log('playingStageData.language : ' + playingStageData.language);
// console.log('playingStageData.level : ' + playingStageData.level + ", " + getStageCodeByStageNo(playingStageData.level));
// let xhr = new XMLHttpRequest();
// xhr.onreadystatechange = function() {
// // console.log("onreadystatechange : " + xhr);
// // console.log("xhr.readyState : " + xhr.readyState);
// // console.log("xhr.status : " + xhr.status);
// if(xhr.readyState == 4 && xhr.status == 200) {
// // console.log(xhr.responseText);
// self.jsonData = JSON.parse(xhr.responseText);
// // console.log(JSON.stringify(jsonData));
// self.showRanking(self.jsonData);
// }
// }
// xhr.open('POST', 'stage_ranking.php', true);
// xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// let param = 'maestro_id=' + sessionStorageManager.maestroID + 'app_id=' + sessionStorageManager.playingAppID;
// // console.log(param);
// xhr.send(param);
}
showRankingHour() {
self.mode = Ranking.MODE_HOUR;
self.textTitle.text = "수업시간 순위";
self.textTitle.addColor("#ff6666", 0);
self.getRecordToRankingServer();
}
showRankingDay() {
self.mode = Ranking.MODE_DAY;
self.textTitle.text = "오늘의 순위";
self.textTitle.addColor("#9999ff", 0);
self.getRecordToRankingServer();
}
showRankingMonth() {
self.mode = Ranking.MODE_MONTH;
self.textTitle.text = "이달의 순위";
self.textTitle.addColor("#99ff99", 0);
self.getRecordToRankingServer();
}
showRanking(jsonRankingData) {
// console.log(jsonRankingData);
if(jsonRankingData === null) {
let rankEmpty = [ ];
this.textRanking1to10.parseList(rankEmpty);
this.textRanking11to20.parseList(rankEmpty);
return;
}
let jsonRankingList = null;
if(this.mode === Ranking.MODE_HOUR)
jsonRankingList = jsonRankingData.rankingHour;
else if(this.mode === Ranking.MODE_DAY)
jsonRankingList = jsonRankingData.rankingDay;
else if(this.mode === Ranking.MODE_MONTH)
jsonRankingList = jsonRankingData.rankingMonth;
if(jsonRankingList === null) {
let rankEmpty = [ ];
this.textRanking1to10.parseList(rankEmpty);
this.textRanking11to20.parseList(rankEmpty);
return;
}
let recordArray = this.getRankingArrayFromJSON(jsonRankingList);
let recordTop10 = [];
let recordTop20 = [];
for(let i = 0; i < 10; i++) {
if(i < recordArray.length)
recordTop10.push(recordArray[i]);
if(i + 10 < recordArray.length)
recordTop20.push(recordArray[i + 10]);
}
this.textRanking1to10.parseList(recordTop10);
this.textRanking11to20.parseList(recordTop20);
}
getRankingArrayFromJSON(jsonRankingList) {
// if(isDebugMode())
// return this.getDummyArray();
let rankingListCount = jsonRankingList.length;
let recordArray = [];
for(let i = 0; i < rankingListCount; i++) {
let bestRecordRow = [];
// bestRecordRow[0] = jsonRankingList[i]['UserID'];
bestRecordRow[0] = i + 1;
bestRecordRow[1] = jsonRankingList[i]['Name'];
bestRecordRow[2] = Math.floor(jsonRankingList[i]['BestRecord']);
// console.log("$BestRecordRow : " + bestRecordRow[0] + ", " + bestRecordRow[1] + ", " + bestRecordRow[2]);
recordArray.push(bestRecordRow);
}
return recordArray;
}
getDummyArray() {
let recordArray2 = [
[ '1', '박지상', '22' ],
[ '2', '박지상', '21' ],
[ '3', '박지상', '20' ],
[ '4', '박지상', '19' ],
[ '5', '박지상', '18' ],
[ '6', '박지상', '17' ],
[ '7', '박지상', '16' ],
[ '8', '박지상', '15' ],
[ '9', '박지상', '14' ],
[ '10', '박지상', '13' ],
[ '11', '박지상', '12' ],
[ '12', '박지상', '11' ],
[ '13', '박지상', '10' ],
[ '14', '박지상', '9' ],
[ '15', '박지상', '8' ],
[ '16', '박지상', '7' ],
[ '17', '박지상', '6' ],
[ '18', '박지상', '5' ],
[ '19', '박지상', '4' ],
[ '20', '박지상', '3' ],
[ '21', '박지상', '2' ],
[ '22', '박지상', '1' ],
];
return recordArray2;
}
}
Ranking.MODE_HOUR = "mode_hour";
Ranking.MODE_DAY = "mode_day";
Ranking.MODE_MONTH = "mode_month";
Ranking.OFFSET_RIGHT_ALIGN = 10;
+18
View File
@@ -33,6 +33,8 @@ class Start {
// contents
this.loadHowToPlay(sessionStorageManager.playingAppID);
this.makeStartButton();
this.makeRankingButton();
if(sessionStorageManager.maestroAccountType >= 100) { // experience account
this.printSampleChart();
this.announceBox = new AnnounceBox(50, 648);
@@ -141,6 +143,22 @@ class Start {
let startButton = new RoundRectButton(setting, RoundRectButton.NONE_ICON, "시작", this.startStage);
}
makeRankingButton() {
let setting = new RoundRectButtonSetting(game.world.centerX + 160, game.world.centerY, 60, 60);
setting.fontStyle = {
font: "18px Arial",
boundsAlignH: "center", // left, center. right
boundsAlignV: "middle", // top, middle, bottom
fill: "#fff"
};
let rankingButton = new RoundRectButton(
setting, RoundRectButton.NONE_ICON, "순위\n보기",
() => {
location.href = '../../web/client/ranking.html';
});
}
startStage() {
if(isTypingPracticeStage())
+53
View File
@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ranking</title>
<!-- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> -->
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.6.2/phaser.js"></script> -->
<script src="../../../resources/js/phaser.min.js"></script>
<!-- global source files -->
<script src="../../game/lib/session_storage_manager.js"></script>
<script src="../../game/lib/score_manager.js"></script>
<script src="../../game/lib/heart_manager.js"></script>
<script src="../../game/global/global_variables.js"></script>
<!-- library source files -->
<script src="../../game/lib/string_util.js"></script>
<script src="../../game/lib/number_util.js"></script>
<script src="../../game/lib/history_record_manager.js"></script>
<script src="../../game/lib/input_type_text.js"></script>
<script src="../../game/lib/button/round_rect_button.js"></script>
<script src="../../game/lib/button/back_button.js"></script>
<script src="../../game/lib/button/fullscreen_button.js"></script>
<script src="../../game/lib/db_connect_manager.js"></script>
<script src="../../game/lib/screen_top_ui.js"></script>
<script src="../../game/lib/screen_bottom_ui.js"></script>
<script src="../../game/lib/game_over_text.js"></script>
<script src="../../game/lib/animal.js"></script>
<!-- Ranking : source files -->
<script src="../../game/ranking/ranking.js"></script>
<script src="../../game/ranking/main.js"></script>
<style>
body{
padding: 0;
margin: 0;
}
canvas{
margin: 0 auto;
}
</style>
</head>
<body>
<div id="Ranking" style="text-align:center;" />
</body>
</html>
+97
View File
@@ -0,0 +1,97 @@
<?php
header('Content-Type: application/json');
include "./../lib/send_reply_json.php";
include "./../setup/connect_db.php";
$maestroID = $_POST["MaestroID"];
$appID = $_POST["AppID"];
$rankingHour = get_ranking_hour($maestroID, $appID);
$rankingDay = get_ranking_day($maestroID, $appID);
$rankingMonth = get_ranking_month($maestroID, $appID);
set_data("rankingHour", $rankingHour);
set_data("rankingDay", $rankingDay);
set_data("rankingMonth", $rankingMonth);
send_result_success();
exit;
function get_ranking_hour($maestroID, $appID) {
global $db_conn;
$query = "
SELECT BR.PlayerID As PlayerID, P.Name AS Name, MAX(BR.BestRecord) AS BestRecord
FROM best_record BR, player P
WHERE BR.PlayerID = P.PlayerID AND DATE(BR.RecordDateTime) = DATE(NOW()) AND HOUR(BR.RecordDateTime) = HOUR(NOW()) AND BR.MaestroID = ? AND BR.AppID = ?
GROUP BY BR.PlayerID
ORDER BY max(BR.BestRecord) DESC;
";
$stmt = $db_conn->prepare($query);
$stmt->bind_param('ii', $maestroID, $appID);
$stmt->execute();
$stmt->bind_result($playerID, $name, $bestRecord);
$bestRecordArray = array();
while($stmt->fetch()) {
$best_record['PlayerID'] = $playerID;
$best_record['Name'] = $name;
$best_record['BestRecord'] = $bestRecord;
array_push($bestRecordArray, $best_record);
}
return $bestRecordArray;
}
function get_ranking_day($maestroID, $appID) {
global $db_conn;
$query = "
SELECT BR.PlayerID As PlayerID, P.Name AS Name, MAX(BR.BestRecord) AS BestRecord
FROM best_record BR, player P
WHERE BR.PlayerID = P.PlayerID AND DATE(BR.RecordDateTime) = DATE(NOW()) AND BR.MaestroID = ? AND BR.AppID = ?
GROUP BY BR.PlayerID
ORDER BY max(BR.BestRecord) DESC;
";
$stmt = $db_conn->prepare($query);
$stmt->bind_param('ii', $maestroID, $appID);
$stmt->execute();
$stmt->bind_result($playerID, $name, $bestRecord);
$bestRecordArray = array();
while($stmt->fetch()) {
$best_record['PlayerID'] = $playerID;
$best_record['Name'] = $name;
$best_record['BestRecord'] = $bestRecord;
array_push($bestRecordArray, $best_record);
}
return $bestRecordArray;
}
function get_ranking_month($maestroID, $appID) {
global $db_conn;
$query = "
SELECT BR.PlayerID As PlayerID, P.Name AS Name, MAX(BR.BestRecord) AS BestRecord
FROM best_record BR, player P
WHERE BR.PlayerID = P.PlayerID AND MONTH(BR.RecordDateTime) = MONTH(NOW()) AND BR.MaestroID = ? AND BR.AppID = ?
GROUP BY BR.PlayerID
ORDER BY max(BR.BestRecord) DESC;
";
$stmt = $db_conn->prepare($query);
$stmt->bind_param('ii', $maestroID, $appID);
$stmt->execute();
$stmt->bind_result($playerID, $name, $bestRecord);
$bestRecordArray = array();
while($stmt->fetch()) {
$best_record['PlayerID'] = $playerID;
$best_record['Name'] = $name;
$best_record['BestRecord'] = $bestRecord;
array_push($bestRecordArray, $best_record);
}
return $bestRecordArray;
}
?>