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

Add: timer for LicenseTimer

Browse Source
This commit is contained in:
Jisang Park
2018-12-10 07:49:37 +09:00
parent 496ddbcde0
commit 13f59aee71
3 changed files with 251 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/license_timer/game.js
+2 -229
View File
@@ -29,7 +29,7 @@ var LicenseTimer = {
// this.fullscreenButton = new FullscreenButton();
this.makeTimer();
this.timer = new Timer();
this.chart = new Chart();
@@ -53,167 +53,7 @@ var LicenseTimer = {
this.timerEvent = null;
},
makeTimerTextContent(x, y, sizePx, content) {
// style setting
var timerTextStyle = { font: "bold 160px Arial", fill: "#fff", align: "right"};
timerTextStyle.fontSize = sizePx;
// text
var timerText = game.add.text(x, y, content, timerTextStyle);
timerText.anchor.set(0.5);
timerText.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
return timerText;
},
makeTimePlusButton(x, y, buttonText, eventHandler) {
var setting = this.makeTimerButtonSetting(x, y);
setting.setStrokeColor(
0xffffff,
0xeeeeff,
0xccccdd,
0x333333
);
setting.setButtonColor(
0xeeeeff,
0xddddee,
0xccccdd,
0x666666
);
setting.setTextColor(
"#66c",
"#66c",
"#66c",
"#333"
);
return this.makeTimeButton(setting, buttonText, eventHandler);
},
makeTimeMinusButton(x, y, buttonText, eventHandler) {
var setting = this.makeTimerButtonSetting(x, y);
setting.setStrokeColor(
0xffffff,
0xffeeee,
0xddcccc,
0x333333
);
setting.setButtonColor(
0xffeeee,
0xeedddd,
0xddcccc,
0x666666
);
setting.setTextColor(
"#a66",
"#a66",
"#a66",
"#333"
);
return this.makeTimeButton(setting, buttonText, eventHandler);
},
makeTimerButtonSetting(x, y) {
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
// setting.fontStyle.boundsAlignH = "center"; // left, center. right
// setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 3;
setting.roundAmount = 1;
setting.x = x;
setting.y = y;
setting.width = 70;
setting.height = 25;
return setting;
},
makeTimeButton(setting, buttonText, eventHandler) {
var button = new RoundRectButton(setting, null, buttonText, eventHandler);
button.text.fontSize = 18;
return button;
},
makeTimer: function() {
// bar
var bar = game.add.graphics();
bar.beginFill(0x202020);
bar.drawRect(0, 60, GAME_SCREEN_SIZE.x, 240);
// Timer
var timerCenterX = game.world.centerX + LicenseTimer.Timer_CENTER_OFFSET_X;
var timerCenterY = 183;
this.timeHourText = this.makeTimerTextContent(timerCenterX - 240, timerCenterY, 160, "00");
this.makeTimerTextContent(timerCenterX - 120, timerCenterY, 160, ":");
this.timeMinuteText = this.makeTimerTextContent(timerCenterX, timerCenterY, 160, "00");
this.makeTimerTextContent(timerCenterX + 110, timerCenterY + 20, 100, ":");
this.timeSecondText = this.makeTimerTextContent(timerCenterX + 190, timerCenterY + 20, 100, "00");
// buttons
var hour10PosX = timerCenterX - 285;
var hour1PosX = timerCenterX - 195;
var minute10PosX = timerCenterX - 45;
var minute1PosX = timerCenterX + 45;
var plusPosY = timerCenterY - 82;
var minusPosY = timerCenterY + 75;
// hour button
this.hourPlus10Button = this.makeTimePlusButton(hour10PosX, plusPosY, "▲",
(function() { this.timePlus(10, "hour"); }).bind(this)
);
// this.hourPlus10Button.setInputEnabled(false);
this.hourMinus10Button = this.makeTimeMinusButton(hour10PosX, minusPosY, "▼",
(function() { this.timeMinus(-10, "hour"); }).bind(this)
);
this.hourPlus1Button = this.makeTimePlusButton(hour1PosX, plusPosY, "▲",
(function() { this.timePlus(1, "hour"); }).bind(this)
);
this.hourMinus1Button = this.makeTimeMinusButton(hour1PosX, minusPosY, "▼",
(function() { this.timeMinus(-1, "hour"); }).bind(this)
);
// minute button
this.minutePlus10Button = this.makeTimePlusButton(minute10PosX, plusPosY, "▲",
(function() { this.timePlus(10, "minute"); }).bind(this)
);
this.minuteMinus10Button = this.makeTimeMinusButton(minute10PosX, minusPosY, "▼",
(function() { this.timeMinus(-10, "minute"); }).bind(this)
);
this.minutePlus1Button = this.makeTimePlusButton(minute1PosX, plusPosY, "▲",
(function() { this.timePlus(1, "minute"); }).bind(this)
);
this.minuteMinus1Button = this.makeTimeMinusButton(minute1PosX, minusPosY, "▼",
(function() { this.timeMinus(-1, "minute"); }).bind(this)
);
},
timePlus(amount, type) {
console.log(amount + type);
// if(type == "hour")
this.timeLeft += amount * 60;
this.updateTimeText();
this.sendTimeLeftToServer();
},
timeMinus(amount, type) {
console.log(amount + type);
// if(type == "hour") {
// var totalMinusMinute = amount * LicenseTimer.TIME_MINUTES_FOR_HOUR;
// if(totalMinusMinute - )
// }
this.timeLeft -= amount * 60;
if(this.timeLeft < 0)
this.timeLeft = 0;
this.updateTimeText();
this.sendTimeLeftToServer();
},
makeInputScoreGroup: function() {
@@ -303,64 +143,6 @@ var LicenseTimer = {
},
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);
},
makeInputTextSetting(width, placeHolder) {
return {
font: "32px Arial",
@@ -391,13 +173,4 @@ var LicenseTimer = {
}
LicenseTimer.Timer_CENTER_OFFSET_X = 40;
LicenseTimer.INPUT_SCORE_GROUP_OFFSET_Y = 70;
LicenseTimer.TIME_MILLISECONDS = 1000;
LicenseTimer.TIME_MINUTES_FOR_HOUR = 60;
LicenseTimer.TIME_SECONDS_FOR_MINUTE = 60;
LicenseTimer.TIME_DEFAULT_SEC
= LicenseTimer.TIME_MINUTES_FOR_HOUR * LicenseTimer.TIME_SECONDS_FOR_MINUTE; // 60 min * 60 sec
LicenseTimer.INPUT_SCORE_GROUP_OFFSET_Y = 70;
src/game/license_timer/timer.js
+248
View File
@@ -0,0 +1,248 @@
function Timer() {
// bar
var bar = game.add.graphics();
bar.beginFill(0x202020);
bar.drawRect(0, 60, GAME_SCREEN_SIZE.x, 240);
// Timer
var timerCenterX = game.world.centerX + Timer.Timer_CENTER_OFFSET_X;
var timerCenterY = 183;
this.timeHourText = this.makeTimerTextContent(timerCenterX - 240, timerCenterY, 160, "00");
this.makeTimerTextContent(timerCenterX - 120, timerCenterY, 160, ":");
this.timeMinuteText = this.makeTimerTextContent(timerCenterX, timerCenterY, 160, "00");
this.makeTimerTextContent(timerCenterX + 110, timerCenterY + 20, 100, ":");
this.timeSecondText = this.makeTimerTextContent(timerCenterX + 190, timerCenterY + 20, 100, "00");
// buttons
var hour10PosX = timerCenterX - 285;
var hour1PosX = timerCenterX - 195;
var minute10PosX = timerCenterX - 45;
var minute1PosX = timerCenterX + 45;
var plusPosY = timerCenterY - 82;
var minusPosY = timerCenterY + 75;
// hour button
this.hourPlus10Button = this.makeTimePlusButton(hour10PosX, plusPosY, "▲",
(function() { this.timePlus(10, "hour"); }).bind(this)
);
// this.hourPlus10Button.setInputEnabled(false);
this.hourMinus10Button = this.makeTimeMinusButton(hour10PosX, minusPosY, "▼",
(function() { this.timeMinus(-10, "hour"); }).bind(this)
);
this.hourPlus1Button = this.makeTimePlusButton(hour1PosX, plusPosY, "▲",
(function() { this.timePlus(1, "hour"); }).bind(this)
);
this.hourMinus1Button = this.makeTimeMinusButton(hour1PosX, minusPosY, "▼",
(function() { this.timeMinus(-1, "hour"); }).bind(this)
);
// minute button
this.minutePlus10Button = this.makeTimePlusButton(minute10PosX, plusPosY, "▲",
(function() { this.timePlus(10, "minute"); }).bind(this)
);
this.minuteMinus10Button = this.makeTimeMinusButton(minute10PosX, minusPosY, "▼",
(function() { this.timeMinus(-10, "minute"); }).bind(this)
);
this.minutePlus1Button = this.makeTimePlusButton(minute1PosX, plusPosY, "▲",
(function() { this.timePlus(1, "minute"); }).bind(this)
);
this.minuteMinus1Button = this.makeTimeMinusButton(minute1PosX, minusPosY, "▼",
(function() { this.timeMinus(-1, "minute"); }).bind(this)
);
}
Timer.prototype.makeTimerTextContent = function(x, y, sizePx, content) {
// style setting
var timerTextStyle = { font: "bold 160px Arial", fill: "#fff", align: "right"};
timerTextStyle.fontSize = sizePx;
// text
var timerText = game.add.text(x, y, content, timerTextStyle);
timerText.anchor.set(0.5);
timerText.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
return timerText;
}
Timer.prototype.makeTimePlusButton = function(x, y, buttonText, eventHandler) {
var setting = this.makeTimerButtonSetting(x, y);
setting.setStrokeColor(
0xffffff,
0xeeeeff,
0xccccdd,
0x333333
);
setting.setButtonColor(
0xeeeeff,
0xddddee,
0xccccdd,
0x666666
);
setting.setTextColor(
"#66c",
"#66c",
"#66c",
"#333"
);
return this.makeTimeButton(setting, buttonText, eventHandler);
}
Timer.prototype.makeTimeMinusButton = function(x, y, buttonText, eventHandler) {
var setting = this.makeTimerButtonSetting(x, y);
setting.setStrokeColor(
0xffffff,
0xffeeee,
0xddcccc,
0x333333
);
setting.setButtonColor(
0xffeeee,
0xeedddd,
0xddcccc,
0x666666
);
setting.setTextColor(
"#a66",
"#a66",
"#a66",
"#333"
);
return this.makeTimeButton(setting, buttonText, eventHandler);
}
Timer.prototype.makeTimerButtonSetting = function(x, y) {
var setting = new RoundRectButtonSetting(0, 0, 0, 0);
// setting.fontStyle.boundsAlignH = "center"; // left, center. right
// setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 3;
setting.roundAmount = 1;
setting.x = x;
setting.y = y;
setting.width = 70;
setting.height = 25;
return setting;
}
Timer.prototype.makeTimeButton = function(setting, buttonText, eventHandler) {
var button = new RoundRectButton(setting, null, buttonText, eventHandler);
button.text.fontSize = 18;
return button;
}
Timer.prototype.timePlus = function(amount, type) {
console.log(amount + type);
// if(type == "hour")
this.timeLeft += amount * 60;
this.updateTimeText();
this.sendTimeLeftToServer();
}
Timer.prototype.timeMinus = function(amount, type) {
console.log(amount + type);
// if(type == "hour") {
// var totalMinusMinute = amount * Timer.TIME_MINUTES_FOR_HOUR;
// if(totalMinusMinute - )
// }
this.timeLeft -= amount * 60;
if(this.timeLeft < 0)
this.timeLeft = 0;
this.updateTimeText();
this.sendTimeLeftToServer();
}
Timer.prototype.setTime =function(sec) {
// console.log("time up : " + min);
this.timeLeft += sec;
this.updateTimeText();
}
Timer.prototype.timeUp = function(sec) {
// console.log("time up : " + sec);
this.timeLeft += sec;
this.updateTimeText();
// this.sendTimeLeftToServer();
}
Timer.prototype.timeDown = function(sec) {
// console.log("time down : " + sec);
this.timeLeft -= sec;
if(this.timeLeft < 0)
this.timeLeft = 0;
this.updateTimeText();
// this.sendTimeLeftToServer();
}
Timer.prototype.updateTimeVariables = function() {
this.timeLeftHour = parseInt(this.timeLeft / (60 * 60));
this.timeLeftMinute = parseInt((this.timeLeft % (60 * 60)) / 60);
this.timeLeftSecond = this.timeLeft % 60;
}
Timer.prototype.updateTimeText = function() {
// this.updateTimeVariables();
// this.timerText.text = this.getTimeWithTimeFormat();
}
Timer.prototype.getTwoDigitNumber = function(value) {
var absValue = value;
if(absValue < 0)
absValue *= -1;
if(absValue < 10)
return "0" + absValue;
else
return absValue;
}
Timer.prototype.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);
}
Timer.prototype.sendTimeLeftToServer = function() {
return;
// console.log(this.timeLeft);
// console.log(playerUserID);
xhr = new XMLHttpRequest();
xhr.open('POST', 'make_last_timestamp.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
var param = 'UserID=' + playerUserID + '&Time=' + this.timeLeft;
xhr.send(param);
},
Timer.Timer_CENTER_OFFSET_X = 40;
Timer.TIME_MILLISECONDS = 1000;
Timer.TIME_MINUTES_FOR_HOUR = 60;
Timer.TIME_SECONDS_FOR_MINUTE = 60;
Timer.TIME_DEFAULT_SEC
= Timer.TIME_MINUTES_FOR_HOUR * Timer.TIME_SECONDS_FOR_MINUTE; // 60 min * 60 sec
src/web/client/license_timer.html
+1
View File
@@ -56,6 +56,7 @@
<!-- game : source files -->
<script src="../../game/license_timer/loading.js"></script>
<script src="../../game/license_timer/login.js"></script>
<script src="../../game/license_timer/timer.js"></script>
<script src="../../game/license_timer/chart.js"></script>
<script src="../../game/license_timer/game.js"></script>
<script src="../../game/license_timer/main.js"></script>