Fix: start and stop timer

src/game/mouse/just_on_time/main.js

@@ -18,7 +18,9 @@ WebFontConfig = {
 	//  The Google Fonts we want to load (specify as many as you like in the array)
 	google: {
 		families: [
-			'Orbitron:800',
+			'Major Mono Display',
+			// 'VT323',
+			// 'Orbitron:800',
 			'Nanum Gothic:400, 700, 800',
 			'Nanum Gothic Coding:400, 700',
 			// 'Nanum Brush Script',

src/game/mouse/just_on_time/time_score_record.js

@@ -18,7 +18,7 @@ TimeScoreRecord.prototype.makeScoreText = function(x, y) {
 	scoreText.style.fill = "white";
 	scoreText.stroke = "#000000";
 	scoreText.strokeThickness = 6;
-	scoreText.text = "3";
+	scoreText.text = "0";
 
 	return scoreText;
 }
@@ -33,5 +33,5 @@ TimeScoreRecord.prototype.setTextColorString = function(colorString) {
 	this.scoreText.style.fill = colorString;
 }
 
-TimeScoreRecord.TIMER_OFFSET_X	= -50;
-TimeScoreRecord.SCORE_OFFSET_X	= 90;
+TimeScoreRecord.TIMER_OFFSET_X	= 0;
+TimeScoreRecord.SCORE_OFFSET_X	= 100;

src/game/mouse/just_on_time/timer_stage.js

@@ -5,32 +5,32 @@ function TimerStage(x, y) {
 	this.posX = x;
 	this.posY = y;
 
-	this.mainTimerText = new TimerText(x, y, 60);
+	this.mainTimerText = new TimerText(x + TimerStage.TIMER_OFFSET_X, y, 60);
 	this.timerButton = this.makeTimeStopButton(x, y + TimerStage.BUTTON_OFFSET_Y);
 	this.timeScoreRecordArray = new Array();
 
 	this.makeTimeScoreRecordArray();
 
+	this.initialize();
+	this.mainTimerText.setMSTimeText(this.timeLimitMS);
+
 	return this;
 }
 
 
 TimerStage.prototype.makeTimeStopButton = function(x, y) {
-	var setting = new RoundRectButtonSetting(x, y, 200, 100);
+	var setting = new RoundRectButtonSetting(x, y, 240, 100);
 	setting.fontStyle.fontWeight = "bold";
 
 	var timerButton = new RoundRectButton(
 		setting,
-		RoundRectButton.NONE_ICON, "시작",
+		RoundRectButton.NONE_ICON,
+		"시작",
 		(function() { this.buttonClicked(); }).bind(this)
 	);
 	return timerButton;
 }
 
-TimerStage.prototype.buttonClicked = function() {
-	this.mainTimerText.setText("02.00");
-}
-
 TimerStage.prototype.makeTimeScoreRecordArray = function() {
 	for(var i = 0; i < TimerStage.RECORD_COUNT; i++) {
 		var timeScoreRecord = new TimeScoreRecord(
@@ -41,6 +41,109 @@ TimerStage.prototype.makeTimeScoreRecordArray = function() {
 	}
 }
 
+
+TimerStage.prototype.initialize = function() {
+	this.timeLimitMS = TimerStage.START_LIMIT_TIME_MS;
+
+	this.startTime = 0.0;
+	this.timeLeft = 0.0;
+	this.isTimerStarted = false;
+	this.isTimerPaused = true;
+
+	this.onTimeUpdate = null;
+	this.onTimeOver = null;
+
+	this.mainTimer = game.time.create(false);
+
+	this.timerEvent = null;
+	this.timerEvent = this.mainTimer.loop(
+		10,
+		(function() { this.updateTimer(); }).bind(this),
+		this
+	);
+	// this.mainTimer.start();
+}
+
+TimerStage.prototype.updateTimer = function() {
+	// console.log(game.time.totalElapsedSeconds());
+	// console.log(this.mainTimer.ms);
+	var timeLeft = this.timeLimitMS - this.mainTimer.ms;
+	this.mainTimerText.setMSTimeText(timeLeft);
+
+	if(timeLeft < 0) {
+		console.log("Game Over");
+	}
+}
+
+TimerStage.prototype.buttonClicked = function() {
+	// 시작
+	if(!this.isTimerStarted) {
+		// console.log("start");
+		this.mainTimer.start();
+
+		this.isTimerStarted = true;
+		this.timerButton.text.text = "정지";
+
+		return;
+	}
+
+
+	// 정지
+	// console.log("stop");
+	this.decideGrade(this.timeLimitMS - this.mainTimer.ms);
+
+	this.mainTimer.stop(false);
+	this.updateTimer();
+
+	this.mainTimerText.setMSTimeText(this.timeLimitMS);
+	this.isTimerStarted = false;
+	this.timerButton.text.text = "시작";
+
+
+	/*
+	if(this.mainTimer.paused)
+		this.mainTimer.resume();
+	else if(this.mainTimer.running)
+		this.mainTimer.pause();
+	*/
+}
+
+TimerStage.prototype.decideGrade = function(timeLeft) {
+	console.log(timeLeft);
+	if(timeLeft < 0) {
+		console.log("Game Over")
+	}
+	else if(timeLeft < 200)		this.gradeGreat();
+	else if(timeLeft < 500)		this.gradeGood();
+	else if(timeLeft < 1000)	this.gradeSoSo();
+	else						this.gradeBad();
+}
+
+TimerStage.prototype.gradeGreat = function(timeLeft) {
+	console.log("Great")
+	this.timeLimitMS = this.timeLimitMS + 3000;
+}
+
+TimerStage.prototype.gradeGood = function(timeLeft) {
+	console.log("Good")
+	this.timeLimitMS = this.timeLimitMS + 1000;
+}
+
+TimerStage.prototype.gradeSoSo = function(timeLeft) {
+	console.log("SoSo")
+	this.timeLimitMS = this.timeLimitMS + 500;
+}
+
+TimerStage.prototype.gradeBad = function(timeLeft) {
+	console.log("Bad")
+}
+
+
+
+TimerStage.START_LIMIT_TIME_MS	= 1000;
+
+TimerStage.TIMER_OFFSET_X		= 120;
+
 TimerStage.BUTTON_OFFSET_Y		= 100;
 
 TimerStage.RECORD_OFFSET_Y		= 200;

src/game/mouse/just_on_time/timer_text.js

@@ -3,7 +3,6 @@ TimerText.constructor = TimerText;
 
 function TimerText(x, y, fontSize) {
 	this.digitText = this.makeTimerText(x, y, fontSize);
-	console.log(this.digitText);
 
 	return this;
 }
@@ -11,14 +10,14 @@ function TimerText(x, y, fontSize) {
 
 TimerText.prototype.makeTimerText = function(x, y, fontSize) {
 	var digitText = game.add.text(x, y, "");
-	digitText.anchor.set(0.5, 0.5);
-	digitText.font = "Orbitron";
+	digitText.anchor.set(1, 0.5);
+	digitText.font = "Major Mono Display";	// "VT323";	// "Orbitron";
 	digitText.fontSize = fontSize;
 	digitText.fontWeight = "bold";	// "normal";
 	digitText.style.fill = "white";
 	digitText.stroke = "#000000";
 	digitText.strokeThickness = 6;
-	digitText.text = "03.00";
+	digitText.text = "00.00";
 
 	return digitText;
 }
@@ -30,3 +29,18 @@ TimerText.prototype.setText = function(contents) {
 TimerText.prototype.setTextColorString = function(colorString) {
 	this.digitText.style.fill = colorString;
 }
+
+TimerText.prototype.setMSTimeText = function(ms) {
+	var sec = Math.floor(ms / 1000);
+	var sec2Digit = ("00" + sec).slice(-2);
+
+	var millisec = ms % 1000;
+	var millisec2Digit = ("00" + millisec).slice(-2);
+
+	this.setText(sec2Digit + "." + millisec2Digit);
+}
+
+TimerText.prototype.pad = function (n, width) {
+  var n = n + '';
+  return n.length >= width ? n : new Array(width - n.length + 1).join('0') + n;
+}