Fix: draw history graph with ranking record

This commit is contained in:
2018-05-17 15:47:15 +09:00
parent bf7a136ed8
commit 60a00056bb
5 changed files with 22 additions and 406 deletions
+20 -46
View File
@@ -8,7 +8,7 @@ class Start {
}
create() {
this.historyRecordManager = new HistoryRecordManager();
this.dbConnectManager = new DBConnectManager();
this.game.stage.backgroundColor = '#4d4d4d';
this.chartGraphics = game.add.graphics(100, game.world.height - 120);
@@ -26,8 +26,22 @@ class Start {
this.printHowToPlay(appInfoManager.getHowToPlayText(sessionStorageManager.playingAppName));
this.makeStartButton();
this.loadHistoryRecords();
this.printHistoryRecords();
this.printChartBaseLine();
let self = this;
this.dbConnectManager.requestTempPlayerHistory( historyRecordManager => {
let underValue = historyRecordManager.underValueForGraph();
let upperValue = historyRecordManager.upperValueForGraph();
for(let i = 0; i < historyRecordManager.count; i++) {
if(i > 6)
break;
let data = historyRecordManager.getAt(i);
this.drawRecordGraph(i, data.date, data.score, underValue, upperValue);
}
});
// bottom
@@ -37,8 +51,6 @@ class Start {
let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
screenBottom.printBottomCenterText(playingAppName);
screenBottom.printBottomRightText(sessionStorageManager.playerName);
// this.loadTypingStageData();
}
printHowToPlay(text) {
@@ -57,32 +69,14 @@ class Start {
startButton.move(game.world.centerX, game.world.centerY);
}
loadHistoryRecords() {
this.historyRecordManager.clear();
this.historyRecordManager.push(new HistoryRecord("05/10", 15460));
this.historyRecordManager.push(new HistoryRecord("05/11", 13040));
this.historyRecordManager.push(new HistoryRecord("05/12", 16460));
this.historyRecordManager.push(new HistoryRecord("05/13", 15060));
this.historyRecordManager.push(new HistoryRecord("05/14", 19800));
}
printHistoryRecords(historyRecords) {
let underValue = this.historyRecordManager.underValueForGraph();
let upperValue = this.historyRecordManager.upperValueForGraph();
for(let i = 0; i < this.historyRecordManager.count; i++) {
let data = this.historyRecordManager.getAt(i);
this.printRecord(i, data.date, data.score, underValue, upperValue);
}
printChartBaseLine() {
this.chartGraphics.lineStyle(3, 0xffd900, 1);
this.chartGraphics.moveTo(0, 0);
this.chartGraphics.lineTo(game.world.width - 200, 0);
}
printRecord(index, date, score, min, max) {
const CHART_GAP_PX = 180;
drawRecordGraph(index, date, score, min, max) {
const CHART_GAP_PX = 120;
const style = { font: "32px Arial", fill: "#fff", align: "left", boundsAlignH: "center", boundsAlignV: "middle" };
let dateText = game.add.text(100 + index * CHART_GAP_PX, game.world.height - 140, date, style);
@@ -101,26 +95,6 @@ class Start {
this.chartGraphics.lineTo(50 + index * CHART_GAP_PX, -100 * ( (score - min) / (max - min) ));
}
loadTypingStageData() {
var self = this;
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);
var jsonData = JSON.parse(xhr.responseText);
self.updateStageButton(jsonData);
}
}
xhr.open('GET', 'activated_stage_list.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send();
}
startStage() {
location.href = "../../web/client/" + sessionStorageManager.playingAppName + ".html";
}