jisangs/chocomae
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add: timer buttons - clear, play, pause

Browse Source
This commit is contained in:
Jisang Park
2018-12-10 22:07:26 +09:00
parent e84248106a
commit 6becc05aab
3 changed files with 186 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/lib/button/round_rect_button.js
+10 -2
View File
@@ -251,12 +251,20 @@ RoundRectButton.prototype.buttonDisabled = function() {
RoundRectButton.prototype.getPosX = function() {
return this.buttonStroke.x + this.setting.width / 2;
}
RoundRectButton.prototype.getPosY = function() {
return this.buttonStroke.y + y - this.setting.height / 2;
}
RoundRectButton.prototype.move = function(x, y) {
this.buttonStroke.x = x - this.setting.width / 2;
this.buttonStroke.y = y - this.setting.height / 2;
this.button.x = x - this.setting.width / 2+ this.setting.strokeWidthPx;
this.button.y = y - this.setting.height / 2+ this.setting.strokeWidthPx;
this.button.x = x - this.setting.width / 2 + this.setting.strokeWidthPx;
this.button.y = y - this.setting.height / 2 + this.setting.strokeWidthPx;
}
RoundRectButton.prototype.getInputEnabled = function() {
src/game/license_timer/input_score.js
+23 -20
View File
@@ -15,39 +15,42 @@ function InputScore(chart) {
bar.drawRect(0, inputScorePosY, GAME_SCREEN_SIZE.x, 70);
var subjectTextSetting = this.makeInputTextSetting(300, "과목 입력");
this.subjectText = this.makeInputText(20, inputScorePosY + 10, subjectTextSetting);
// contents
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
setting.strokeWidthPx = 5;
setting.x = 60;
setting.y = inputScorePosY + 35;
setting.width = 100;
setting.height = 50;
setting.fontStyle.fontSize = 24;
this.subjectButton = new RoundRectButton(
setting,
null, "과목",
(function() { console.log("과목 선택"); }).bind(this)
);
var subjectTextSetting = this.makeInputTextSetting(280, "과목 입력");
this.subjectText = this.makeInputText(120, inputScorePosY + 10, subjectTextSetting);
this.subjectText.setText(this.subject);
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
setting.fontStyle.boundsAlignH = "left"; // left, center. right
setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 5;
var titleTextStyle = { font: "36px Arial", fill: "#fff", align: "center"};
this.titleText = game.add.text(350, inputScorePosY + 40, "과목", titleTextStyle);
this.titleText = game.add.text(440, inputScorePosY + 40, "점수", titleTextStyle);
this.titleText.anchor.set(0, 0.5);
// subject input text
// var inputTextSetting = this.makeInputTextSetting(200, "점수 입력");
var recordTextSetting = this.makeInputTextSetting(150, "점수 입력");
this.recordText = this.makeInputText(game.world.centerX - 50, inputScorePosY + 10, recordTextSetting);
// this.subjectText.setText(this.subject);
this.recordText = this.makeInputText(game.world.centerX, inputScorePosY + 10, recordTextSetting);
this.titleText = game.add.text(640, inputScorePosY + 40, "점", titleTextStyle);
this.titleText = game.add.text(game.world.centerX + 190, inputScorePosY + 40, "마에", titleTextStyle);
this.titleText.anchor.set(0, 0.5);
var passwordTextSetting = this.makeInputTextSetting(150, "비밀번호");
var passwordTextSetting = this.makeInputTextSetting(110, "비밀번호");
passwordTextSetting.type = PhaserInput.InputType.password;
this.passwordText = this.makeInputText(GAME_SCREEN_SIZE.x - 330, inputScorePosY + 10, passwordTextSetting);
this.passwordText = this.makeInputText(game.world.centerX + 260, inputScorePosY + 10, passwordTextSetting);
// set timer buttons
setting.x = GAME_SCREEN_SIZE.x - 80;
setting.x = GAME_SCREEN_SIZE.x - 60;
setting.y = inputScorePosY + 35;
setting.width = 100;
setting.height = 50;
src/game/license_timer/timer.js
+153 -20
View File
@@ -7,24 +7,48 @@ function Timer() {
bar.drawRect(0, 60, GAME_SCREEN_SIZE.x, 240);
// Timer
var timerCenterX = game.world.centerX + Timer.Timer_CENTER_OFFSET_X;
var timerCenterY = 183;
this.timerCenterX = game.world.centerX + Timer.Timer_CENTER_OFFSET_X;
this.timerCenterY = 183;
this.timeHourText = this.makeTimerTextContent(timerCenterX - 240, timerCenterY, 160, "00");
this.timeHourMinuteSeperator = this.makeTimerTextContent(timerCenterX - 185, timerCenterY, 160, ":");
this.timeMinuteText = this.makeTimerTextContent(timerCenterX, timerCenterY, 160, "00");
this.timeMinuteSecondSeperator = this.makeTimerTextContent(timerCenterX + 40, timerCenterY + 20, 100, ":");
this.timeSecondText = this.makeTimerTextContent(timerCenterX + 160, timerCenterY + 20, 100, "00");
this.makeTimer();
this.makeTimerButtons();
// buttons
var hour10PosX = timerCenterX - 285 - 90;
var hour1PosX = timerCenterX - 195 - 90;
this.resetButton = this.makeResetButton();
this.pauseButton = this.makePauseButton();
this.showButton(this.pauseButton, false);
// this.showButton(this.pauseButton, true);
this.playButton = this.makePlayButton();
var minute10PosX = timerCenterX - 45 - 90;
var minute1PosX = timerCenterX + 45 - 90;
var plusPosY = timerCenterY - 82;
var minusPosY = timerCenterY + 75;
this.startTimer();
}
Timer.prototype.initVariables = function() {
this.prevTime = null;
this.timeLeft = Timer.TIME_DEFAULT_SEC;
this.timerEvent = null;
}
Timer.prototype.makeTimer = function() {
this.timeHourText = this.makeTimerTextContent(this.timerCenterX - 240, this.timerCenterY, 160, "00");
this.timeHourMinuteSeperator = this.makeTimerTextContent(this.timerCenterX - 185, this.timerCenterY, 160, ":");
this.timeMinuteText = this.makeTimerTextContent(this.timerCenterX, this.timerCenterY, 160, "00");
this.timeMinuteSecondSeperator = this.makeTimerTextContent(this.timerCenterX + 40, this.timerCenterY + 20, 100, ":");
this.timeSecondText = this.makeTimerTextContent(this.timerCenterX + 160, this.timerCenterY + 20, 100, "00");
}
Timer.prototype.makeTimerButtons = function() {
var hour10PosX = this.timerCenterX - 285 - 90;
var hour1PosX = this.timerCenterX - 195 - 90;
var minute10PosX = this.timerCenterX - 45 - 90;
var minute1PosX = this.timerCenterX + 45 - 90;
var plusPosY = this.timerCenterY - 82;
var minusPosY = this.timerCenterY + 75;
// hour button
this.hourPlus10Button = this.makeTimePlusButton(hour10PosX, plusPosY, "▲",
@@ -56,17 +80,126 @@ function Timer() {
this.minuteMinus1Button = this.makeTimeMinusButton(minute1PosX, minusPosY, "▼",
(function() { this.timeMinus(1, Timer.TYPE_MINUTE); }).bind(this)
);
this.startTimer();
}
Timer.prototype.makeResetButton = function() {
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
setting.x = 100;
setting.y = this.timerCenterY;
setting.width = 80;
setting.height = 80;
setting.strokeWidthPx = 5;
setting.roundAmount = 60;
setting.fontStyle.fontSize = 40;
setting.setStrokeColor(
0x903030,
0x802020,
0x502020,
0x666666
);
setting.setButtonColor(
0xc04040,
0xa03030,
0x802020,
0x666666
);
setting.setTextColor(
"#fff",
"#edd",
"#dbb",
"#333"
);
return new RoundRectButton(
setting,
null, "C",
(function() { console.log("리셋"); }).bind(this)
);
}
Timer.prototype.makePlayButton = function() {
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
setting.x = game.world.width - 100;
setting.y = this.timerCenterY;
setting.width = 120;
setting.height = 120;
setting.strokeWidthPx = 5;
setting.roundAmount = 90;
setting.fontStyle.fontSize = 80;
// blue tone
setting.setStrokeColor(
0x208080,
0x106060,
0x004040,
0x333333
);
setting.setButtonColor(
0x40c0c0,
0x30a0a0,
0x209090,
0x666666
);
setting.setTextColor(
"#fff",
"#fff",
"#fff",
"#333"
);
return new RoundRectButton(
setting,
null, "▶",
(function() { console.log("플레이"); }).bind(this)
);
}
Timer.prototype.makePauseButton = function() {
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
setting.x = game.world.width - 200;
setting.y = this.timerCenterY;
setting.width = 120;
setting.height = 120;
setting.strokeWidthPx = 5;
setting.roundAmount = 90;
setting.fontStyle.fontSize = 50;
// gray tone
setting.setStrokeColor(
0xa0a0a0,
0x808080,
0x606060,
0x333333
);
setting.setButtonColor(
0xf0f0f0,
0xd0d0d0,
0xb0b0b0,
0x666666
);
setting.setTextColor(
"#333",
"#222",
"#111",
"#333"
);
Timer.prototype.initVariables = function() {
this.prevTime = null;
return new RoundRectButton(
setting,
null, "∥",
(function() { console.log("일시 정지"); }).bind(this)
);
}
this.timeLeft = Timer.TIME_DEFAULT_SEC;
this.timerEvent = null;
Timer.prototype.showButton = function(button, flag) {
var backupPosX = button.getPosX();
if(flag)
button.move(backupPosX, this.timerCenterY);
else
button.move(backupPosX, -200);
}
Timer.prototype.startTimer = function() {