300 lines
8.1 KiB
JavaScript
300 lines
8.1 KiB
JavaScript
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();
|
|
|
|
this.makeInputScoreGroup();
|
|
|
|
// bottom ui
|
|
this.screenBottomUI = new ScreenBottomUI();
|
|
// this.screenBottomUI.printLeftText();
|
|
this.screenBottomUI.printCenterText("점수 등록은 선생님에게 부탁하세요.");
|
|
this.screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
|
|
},
|
|
|
|
|
|
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() {
|
|
// bar
|
|
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 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 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 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() {
|
|
|
|
},
|
|
|
|
makeInputScoreGroup: function() {
|
|
var InputScoreGruopPosY = GAME_SCREEN_SIZE.y - 120;
|
|
// bar
|
|
var bar = game.add.graphics();
|
|
bar.beginFill(0x000000, 0.2);
|
|
bar.drawRect(0, InputScoreGruopPosY, GAME_SCREEN_SIZE.x, 70);
|
|
|
|
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;
|
|
|
|
|
|
// subject input text
|
|
this.inputTextSubject = new InputTypeText(220, InputScoreGruopPosY + 35);
|
|
this.setInputTextWidth(this.inputTextSubject, 300);
|
|
this.inputTextSubject.anchor.set(0.5);
|
|
this.inputTextSubject.canvasInput.value(this.subject);
|
|
this.inputTextSubject.canvasInput.focus();
|
|
this.inputTextSubject.canvasInput.placeHolder("과목 입력");
|
|
|
|
var titleTextStyle = { font: "36px Arial", fill: "#fff", align: "center"};
|
|
this.titleText = game.add.text(350, InputScoreGruopPosY + 40, "과목에서", titleTextStyle);
|
|
this.titleText.anchor.set(0, 0.5);
|
|
|
|
|
|
// subject input text
|
|
this.inputTextScore = new InputTypeText(game.world.centerX + 200, InputScoreGruopPosY + 35);
|
|
this.setInputTextWidth(this.inputTextScore, 200);
|
|
this.inputTextScore.anchor.set(0.5);
|
|
this.inputTextScore.canvasInput.value('');
|
|
this.inputTextScore.canvasInput.focus();
|
|
this.inputTextScore.canvasInput.placeHolder("점수 입력");
|
|
// inputTextScore.canvasInput._onkeydown = this.checkInputText;
|
|
// inputTextScore.canvasInput._onkeyup = function() {
|
|
// this.inputTextScore.canvasInput._onkeyup = function() {
|
|
// self.checkTypingContents(event);
|
|
// }
|
|
|
|
this.titleText = game.add.text(740, InputScoreGruopPosY + 40, "점 획득", titleTextStyle);
|
|
this.titleText.anchor.set(0, 0.5);
|
|
|
|
|
|
// set timer buttons
|
|
setting.x = GAME_SCREEN_SIZE.x - 80;
|
|
setting.y = InputScoreGruopPosY + 35;
|
|
setting.width = 100;
|
|
setting.height = 50;
|
|
var set60SecButton = new RoundRectButton(
|
|
setting,
|
|
null, "저장",
|
|
(function() { console.log("save score"); }).bind(this)
|
|
);
|
|
|
|
},
|
|
|
|
setInputTextWidth(inputText, width) {
|
|
inputText.canvasInput.width = width;
|
|
console.log(inputText.canvasInput);
|
|
inputText.canvasInput._shadowCanvas.setAttribute('width', self._width + self._padding * 2);
|
|
inputText.canvasInput._hiddenInput.style.width = self._width + 'px';
|
|
|
|
inputText.canvasInput._width = width;
|
|
inputText.canvasInput._calcWH();
|
|
inputText.canvasInput._updateCanvasWH();
|
|
inputText.canvasInput.render();
|
|
},
|
|
|
|
makeInputTypeText: function(x, y, text) {
|
|
var inputText = new InputTypeText(x, y);
|
|
inputText.anchor.set(0.5);
|
|
inputText.canvasInput.value('');
|
|
if(isDebugMode()) {
|
|
inputText.canvasInput.value(text);
|
|
}
|
|
inputText.canvasInput._onkeyup = (function() {
|
|
if(event.keyCode == Phaser.Keyboard.ENTER) {
|
|
this.startMenu();
|
|
}
|
|
}).bind(this);
|
|
|
|
return inputText;
|
|
},
|
|
|
|
|
|
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;
|
|
|