Add: LicenseTimer - html, js

2018-12-07 23:08:32 +09:00
parent 5b58e5faf5
commit b72ff11b0e
6 changed files with 595 additions and 2 deletions
@@ -0,0 +1,213 @@
+var LicenseTimer = {
+
+	create: function() {
+		game.stage.backgroundColor = '#4d4d4d';
+
+		this.initVariables();
+
+		// keyboard shortcut
+		this.keyboardShortcut = new KeyboardShortcut();
+		this.keyboardShortcut.addCallback(
+			Phaser.KeyCode.ESC,	// keyCode
+			null,	// keyDownHandler
+			(function() { this.back(); }).bind(this),	// keyUpHandler
+			"keyboard_test"	// callerClassName
+		);
+
+		// top ui
+		var screenTopUI = new ScreenTopUI();
+		screenTopUI.makeBackButton( (function() { this.back(); }).bind(this) );
+		screenTopUI.makeFullScreenButton();
+
+		var titleTextStyle = { font: "36px Arial", fill: "#fff", align: "center"};
+		this.titleText = game.add.text(game.world.centerX, 35, "자격증 타이머", titleTextStyle);
+		this.titleText.anchor.set(0.5);
+
+		this.makeTimer();
+
+
+		// bottom ui
+		this.screenBottomUI = new ScreenBottomUI();
+		// screenBottomUI.printLeftText();
+		this.screenBottomUI.printCenterText("점수 등록은 선생님에게 부탁하세요.");
+		// screenBottomUI.printRightText();
+	},
+
+
+	initVariables: function() {
+		this.subject = "ITQ 파워포인트";
+
+		this.prevTime = null;
+
+		this.timeLeft = 0;
+		this.timeLeftHour = 0;
+		this.timeLeftMinute = 0;
+		this.timeLeftSecond = 0;
+
+		this.timerEvent = null;
+	},
+
+	makeTimer: function() {
+		// top
+		var bar = game.add.graphics();
+		bar.beginFill(0x000000, 0.2);
+		bar.drawRect(0, 60, GAME_SCREEN_SIZE.x, 180);
+
+		// Timer
+		var timerCenterX = game.world.centerX - 30;
+		var timerTextStyle = { font: "bold 120px Arial", fill: "#fff", align: "center"};
+		this.timerText = game.add.text(timerCenterX, 160, "00:00:00", timerTextStyle);
+		this.timerText.anchor.set(0.5);
+		// .setTextBounds(-200, 0, 400, 200)
+		this.timerText.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
+
+		var watchPosY = 100;
+		var watchTextStyle = { font: "24px Arial", fill: "#555", align: "center"};
+		this.hourText = game.add.text(timerCenterX - 175, watchPosY, "시간", watchTextStyle);
+		this.hourText.anchor.set(0.5);
+
+		this.minText = game.add.text(timerCenterX, watchPosY, "분", watchTextStyle);
+		this.minText.anchor.set(0.5);
+
+		this.secText = game.add.text(timerCenterX + 170, watchPosY, "초", watchTextStyle);
+		this.secText.anchor.set(0.5);
+
+
+		var setting = new RoundRectButtonSetting(0, 0, 0, 0);
+		setting.fontStyle.boundsAlignH = "center";	// left, center. right
+		setting.fontStyle.boundsAlignV = "middle";	// top, middle, bottom
+		setting.strokeWidthPx = 5;
+
+
+		// set timer buttons
+		setting.x = 100;
+		setting.y = 150;
+		setting.width = 140;
+		setting.height = 140;
+		var set60SecButton = new RoundRectButton(
+			setting,
+			null, "1시간",
+			(function() { console.log("1 hour"); }).bind(this)
+		);
+
+		// modify timer buttons
+		setting.x = GAME_SCREEN_SIZE.x - 210;
+		setting.y = 120;
+		setting.width = 100;
+		setting.height = 50;
+		var plus10minButton = new RoundRectButton(
+			setting,
+			null, "+10분",
+			(function() { console.log("+10 min"); }).bind(this)
+		);
+
+		setting.x = GAME_SCREEN_SIZE.x - 80;
+		var plus1minButton = new RoundRectButton(
+			setting,
+			null, "+1분",
+			(function() { console.log("+1 min"); }).bind(this)
+		);
+
+		setting.x = GAME_SCREEN_SIZE.x - 210;
+		setting.y = 180;
+		var minus10minButton = new RoundRectButton(
+			setting,
+			null, "-10분",
+			(function() { console.log("-10 min"); }).bind(this)
+		);
+
+		setting.x = GAME_SCREEN_SIZE.x - 80;
+		var minus1minButton = new RoundRectButton(
+			setting,
+			null, "-1분",
+			(function() { console.log("-1 min"); }).bind(this)
+		);
+	},
+
+	makeStartButtonGroup: function() {
+
+	},
+
+	makePlayingButtonGroup: function() {
+
+	},
+
+	makePausedButtonGroup: function() {
+
+	},
+
+	makeStopedButtonGroup: function() {
+
+	},
+
+	back: function() {
+		sessionStorageManager.resetPlayingAppData();
+		// location.href = '../../web/client/menu_typing_test.html';
+		game.state.start('Login');
+	},
+
+
+	setTime: function(sec) {
+		// console.log("time up : " + min);
+
+		this.timeLeft += sec;
+		this.updateTimeText();
+	},
+
+	timeUp: function(sec) {
+		// console.log("time up : " + sec);
+
+		this.timeLeft += sec;
+		this.updateTimeText();
+		// this.sendTimeLeftToServer();
+	},
+
+	timeDown: function(sec) {
+		// console.log("time down : " + sec);
+
+		this.timeLeft -= sec;
+		if(this.timeLeft < 0)
+			this.timeLeft = 0;
+		this.updateTimeText();
+		// this.sendTimeLeftToServer();
+	},
+
+	updateTimeVariables: function() {
+		this.timeLeftHour = parseInt(this.timeLeft / (60 * 60));
+		this.timeLeftMinute = parseInt((this.timeLeft % (60 * 60)) / 60);
+		this.timeLeftSecond = this.timeLeft % 60;
+	},
+
+	updateTimeText: function() {
+		this.updateTimeVariables();
+		this.timerText.text = this.getTimeWithTimeFormat();
+	},
+
+	getTwoDigitNumber: function(value) {
+		var absValue = value;
+		if(absValue < 0)
+			absValue *= -1;
+
+		if(absValue < 10)
+			return "0" + absValue;
+		else
+			return absValue;
+	},
+
+	getTimeWithTimeFormat: function() {
+		if(this.timeLeft > 0)
+			return this.getTwoDigitNumber(this.timeLeftHour)
+				+ ":" + this.getTwoDigitNumber(this.timeLeftMinute)
+			  	+ ":" + this.getTwoDigitNumber(this.timeLeftSecond);
+		else
+			return "-" + this.getTwoDigitNumber(this.timeLeftHour)
+				+ ":" + this.getTwoDigitNumber(this.timeLeftMinute)
+			  	+ ":" + this.getTwoDigitNumber(this.timeLeftSecond);
+	},
+
+}
+
+
+LicenseTimer.TIME_DEFAULT_SEC	= 60 * 60;	// 60 min * 60 sec
+LicenseTimer.TIME_MILLISECONDS	= 1000;
+