Fix: graph for record/date

src/game/lib/app_info_manager.js

@@ -24,7 +24,7 @@ class AppInfoManager {
 		this.registerAppInfo(new AppInfo("login", "로그인", ""));
 		this.registerAppInfo(new AppInfo("menu", "메뉴", ""));
 		this.registerAppInfo(new AppInfo("space_invaders", "외계인 침공",
-			"외계인이 나타났다 사라집니다.\n마우스 왼쪽 버튼으로 외계인을 클릭해서\n물리쳐 주세요."
+			"외계인이 나타났다!\n마우스 왼쪽 버튼으로\n외계인을 클릭해서 물리쳐 주세요."
 		));
 		this.registerAppInfo(new AppInfo("card_matching", "카드 짝 맞추기",
 			"외계인이 나타났다 사라집니다.\n\n마우스 왼쪽 버튼으로 외계인을 클릭해서\n\n물리쳐 주세요."

src/game/start/start.js

@@ -9,6 +9,8 @@ let Start = {
 
 	create: function() {
 		this.game.stage.backgroundColor = '#4d4d4d';
+		this.chartGraphics = game.add.graphics(100, game.world.height - 120);
+
 
 		// top
 		let backButton = new BackButton( () => {
@@ -52,30 +54,37 @@ let Start = {
 	},
 
 	printRecordHistory: function() {
-		let graphics = game.add.graphics(100, game.world.height - 120);
+		this.printRecord(0, "05/10", 15460);
+		this.printRecord(1, "05/11", 13040);
+		this.printRecord(2, "05/12", 16460);
+		this.printRecord(3, "05/13", 15060);
+		this.printRecord(4, "05/14", 19800);
 
+		this.chartGraphics.lineStyle(3, 0xffd900, 1);
+		this.chartGraphics.moveTo(0, 0);
+		this.chartGraphics.lineTo(game.world.width - 200, 0);
+	},
+
+	printRecord: function(index, date, record) {
+		const CHART_GAP_PX	= 180;
 		const style = { font: "32px Arial", fill: "#fff", align: "left", boundsAlignH: "center", boundsAlignV: "middle" };
-		date = game.add.text(100, game.world.height - 140, "05/10", style);
-		date.setTextBounds(0, 0, 100, 100);
-		date.stroke = "#333";
-		date.strokeThickness = 1;
 
-		record = game.add.text(100, game.world.height - 300, "15,460", style);
+		let dateText = game.add.text(100 + index * CHART_GAP_PX, game.world.height - 140, date, style);
-		record.setTextBounds(0, 0, 100, 100);
+		dateText.setTextBounds(0, 0, 100, 100);
-		record.stroke = "#333";
+		dateText.stroke = "#333";
-		record.strokeThickness = 1;
+		dateText.strokeThickness = 1;
 
-		let  = game.add.graphics(100, game.world.height - 120);
+		let recordText = game.add.text(100 + index * CHART_GAP_PX, game.world.height - 300, record, style);
-		graphics.lineStyle(50, 0xffffff, 1);
+		recordText.setTextBounds(0, 0, 100, 100);
-		graphics.beginFill(0xdddddd, 1);
+		recordText.stroke = "#333";
-		// graphics.drawRect(50, 250, 100, 100);
+		recordText.strokeThickness = 1;
-		graphics.moveTo(50, 0);
-		graphics.lineTo(50, -100);
-		graphics.endFill();
 
-		graphics.lineStyle(3, 0xffd900, 1);
+		this.chartGraphics.lineStyle(50, 0xdddddd, 1);
-		graphics.moveTo(0, 0);
+		// this.chartGraphics.beginFill(0xffffff, 1);
-		graphics.lineTo(game.world.width - 200, 0);
+		// this.chartGraphics.drawRect(50, 250, 100, 100);
+		this.chartGraphics.moveTo(50 + index * CHART_GAP_PX, 0);
+		this.chartGraphics.lineTo(50 + index * CHART_GAP_PX, -100 * (record / 20000));
+		// this.chartGraphics.endFill();
 	},