timer, 7 bag, fixes
parent
3a48117175
commit
bf1dba8d47
106
css/styles.css
106
css/styles.css
|
@ -2,51 +2,6 @@ html,body{
|
||||||
height:100%;
|
height:100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Dropdown Button */
|
|
||||||
.dropbtn {
|
|
||||||
background-color: #3498DB;
|
|
||||||
color: white;
|
|
||||||
padding: 16px;
|
|
||||||
font-size: 16px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Dropdown button on hover & focus */
|
|
||||||
.dropbtn:hover, .dropbtn:focus {
|
|
||||||
background-color: #2980B9;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The container <div> - needed to position the dropdown content */
|
|
||||||
.dropdown {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Dropdown Content (Hidden by Default) */
|
|
||||||
.dropdown-content {
|
|
||||||
display: none;
|
|
||||||
position: absolute;
|
|
||||||
background-color: #f1f1f1;
|
|
||||||
min-width: 160px;
|
|
||||||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Links inside the dropdown */
|
|
||||||
.dropdown-content a {
|
|
||||||
color: black;
|
|
||||||
padding: 12px 16px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Change color of dropdown links on hover */
|
|
||||||
.dropdown-content a:hover {background-color: #ddd}
|
|
||||||
|
|
||||||
/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
|
|
||||||
.show {display:block;}
|
|
||||||
|
|
||||||
|
|
||||||
body{
|
body{
|
||||||
background: #000000;
|
background: #000000;
|
||||||
|
@ -87,7 +42,7 @@ body{
|
||||||
top:0px;
|
top:0px;
|
||||||
left:0px;
|
left:0px;
|
||||||
width:210px;
|
width:210px;
|
||||||
text-align: center;
|
text-align: left;
|
||||||
background:rgba(1,1,1,.20);
|
background:rgba(1,1,1,.20);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -103,6 +58,7 @@ body{
|
||||||
#leftInfo ul {padding:2%;}
|
#leftInfo ul {padding:2%;}
|
||||||
|
|
||||||
#hold{
|
#hold{
|
||||||
|
text-align:right;
|
||||||
position:relative;
|
position:relative;
|
||||||
width:80px;
|
width:80px;
|
||||||
height:435px;
|
height:435px;
|
||||||
|
@ -118,7 +74,7 @@ body{
|
||||||
left:210px;
|
left:210px;
|
||||||
background:rgba(0,0,0,.75);
|
background:rgba(0,0,0,.75);
|
||||||
z-index:999;
|
z-index:999;
|
||||||
color:#ffe100;
|
color:#2f2f2f;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
@ -128,12 +84,12 @@ body{
|
||||||
}
|
}
|
||||||
|
|
||||||
#gameOver a,#gameOver a:visited{
|
#gameOver a,#gameOver a:visited{
|
||||||
color:#66bc29;
|
color:dodgerblue;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#gameOver h3{
|
#gameOver h3{
|
||||||
color:orange;
|
color:AliceBlue;
|
||||||
}
|
}
|
||||||
|
|
||||||
#side{
|
#side{
|
||||||
|
@ -171,7 +127,7 @@ body{
|
||||||
background:rgba(.9,.9,.9,.70);
|
background:rgba(.9,.9,.9,.70);
|
||||||
}
|
}
|
||||||
#level{
|
#level{
|
||||||
color:orange;
|
color:dodgerblue;
|
||||||
font-size:32px;
|
font-size:32px;
|
||||||
background:rgba(.9,.9,.9,.70);
|
background:rgba(.9,.9,.9,.70);
|
||||||
}
|
}
|
||||||
|
@ -184,59 +140,15 @@ body{
|
||||||
}
|
}
|
||||||
|
|
||||||
#score{
|
#score{
|
||||||
color:orange;
|
color:dodgerblue;
|
||||||
font-family: 'Chalkboard SE';
|
font-family: 'Arial';
|
||||||
background:rgba(.9,.9,.9,.70);
|
background:rgba(.9,.9,.9,.70);
|
||||||
|
|
||||||
}#linesInfo{
|
}#linesInfo{
|
||||||
color:#fff;
|
color:#fff;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
margin-top:0;
|
margin-top:0;
|
||||||
background:rgba(.9,.9,.9,.70);
|
background:rgba(.9,.9,.9,.70);c
|
||||||
}
|
|
||||||
|
|
||||||
#lines{
|
|
||||||
color:orange;
|
|
||||||
font-family: 'Chalkboard SE';
|
|
||||||
background:rgba(.9,.9,.9,.70);
|
|
||||||
}
|
|
||||||
#rewardInfo{
|
|
||||||
color:yellow;
|
|
||||||
font-weight: bold;
|
|
||||||
height:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.invisible{
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.animated {
|
|
||||||
-webkit-animation-duration: 1.5s;
|
|
||||||
animation-duration: 1.5s;
|
|
||||||
-webkit-animation-fill-mode: both;
|
|
||||||
animation-fill-mode: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@-webkit-keyframes fadeOutUp {
|
|
||||||
0% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
-webkit-transform: translate3d(0, -100%, 0);
|
|
||||||
transform: translate3d(0, -100%, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes fadeOutUp {
|
|
||||||
0% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
|
|
|
@ -457,6 +457,7 @@ var UserInputs = {
|
||||||
},
|
},
|
||||||
incTickCounter() {
|
incTickCounter() {
|
||||||
this.ticks++;
|
this.ticks++;
|
||||||
|
if(this.ticks > 1200000)this.ticks = 0; // set to 0 every 12 seconds?
|
||||||
},
|
},
|
||||||
getTickCounter() {
|
getTickCounter() {
|
||||||
return this.ticks;
|
return this.ticks;
|
||||||
|
@ -682,17 +683,17 @@ var UserInputs = {
|
||||||
"Gamepad DAS", "Gamepad ARR", "Gamepad Harddrop", "Gamepad Hold",
|
"Gamepad DAS", "Gamepad ARR", "Gamepad Harddrop", "Gamepad Hold",
|
||||||
"Gamepad Left", "Gamepad Right", "Gamepad Rotateccw", "Gamepad Rotate",
|
"Gamepad Left", "Gamepad Right", "Gamepad Rotateccw", "Gamepad Rotate",
|
||||||
"Gamepad Down","Gamepad Pophold", "Gamepad Reset", "Gamepad Background",
|
"Gamepad Down","Gamepad Pophold", "Gamepad Reset", "Gamepad Background",
|
||||||
"path", "SameSite"],
|
"path", "High Score"],
|
||||||
|
|
||||||
settingsDefault: ["true",
|
settingsDefault: ["true",
|
||||||
"65.0", "20.0", "32", "16",
|
"50.0", "16.0", "32", "16",
|
||||||
"37", "39", "90", "88",
|
"37", "39", "90", "88",
|
||||||
"40", "17", "82", "81",
|
"40", "17", "82", "81",
|
||||||
|
|
||||||
"65.0", "20.0", "RB", "LB",
|
"50.0", "16.0", "RB", "LB",
|
||||||
"DPad-Left", "DPad-Right", "A", "B",
|
"DPad-Left", "DPad-Right", "A", "B",
|
||||||
"DPad-Down", "DPad-Up", "Back", "",
|
"DPad-Down", "DPad-Up", "Back", "",
|
||||||
"=/", "Strict"],
|
"=/"],
|
||||||
settingsMap: []
|
settingsMap: []
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -859,7 +860,8 @@ Tetris.prototype = {
|
||||||
inputs.init();
|
inputs.init();
|
||||||
this.createSettings();
|
this.createSettings();
|
||||||
// if true no openers. just random tetrinos
|
// if true no openers. just random tetrinos
|
||||||
this.isFreePlay = true;
|
this.isFreePlay = true;1
|
||||||
|
this.isTimerOn = false;
|
||||||
this.currentOpener = 0;
|
this.currentOpener = 0;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.matrix = initMatrix(consts.ROW_COUNT, consts.COLUMN_COUNT);
|
this.matrix = initMatrix(consts.ROW_COUNT, consts.COLUMN_COUNT);
|
||||||
|
@ -870,8 +872,15 @@ Tetris.prototype = {
|
||||||
this._fireShape();
|
this._fireShape();
|
||||||
|
|
||||||
},
|
},
|
||||||
|
toggleTimer: function() {
|
||||||
|
document.getElementById("Timer").value = (this.isTimerOn = !this.isTimerOn) ? "Seconds:" : "Timer Off";
|
||||||
|
},
|
||||||
setFreePlay: function()
|
setFreePlay: function()
|
||||||
{
|
{
|
||||||
|
document.getElementById("Timer").value = "Timer Off";
|
||||||
|
document.getElementById("Time").value = "";
|
||||||
|
document.getElementById("besttime").value = "";
|
||||||
|
this.isTimerOn = false;
|
||||||
this.isFreePlay = true;
|
this.isFreePlay = true;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.hintQueue = [];
|
this.hintQueue = [];
|
||||||
|
@ -883,6 +892,7 @@ Tetris.prototype = {
|
||||||
},
|
},
|
||||||
setCurrentOpener(opener)
|
setCurrentOpener(opener)
|
||||||
{
|
{
|
||||||
|
document.getElementById("besttime").value = "";
|
||||||
this.isFreePlay = false;
|
this.isFreePlay = false;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.currentOpener = opener;
|
this.currentOpener = opener;
|
||||||
|
@ -928,6 +938,7 @@ Tetris.prototype = {
|
||||||
this.startTime = new Date().getTime();
|
this.startTime = new Date().getTime();
|
||||||
this.currentTime = this.startTime;
|
this.currentTime = this.startTime;
|
||||||
this.prevTime = this.startTime;
|
this.prevTime = this.startTime;
|
||||||
|
this.sequencePrevTime = this.startTime;
|
||||||
//todo:get rid of extra
|
//todo:get rid of extra
|
||||||
this.levelTime = this.startTime;
|
this.levelTime = this.startTime;
|
||||||
this.prevInputTime = this.startTime;
|
this.prevInputTime = this.startTime;
|
||||||
|
@ -943,6 +954,7 @@ Tetris.prototype = {
|
||||||
// timer for srs extened piece lockdown
|
// timer for srs extened piece lockdown
|
||||||
this.lockdownTimer = 0;
|
this.lockdownTimer = 0;
|
||||||
this.landed = false;
|
this.landed = false;
|
||||||
|
this.isSequenceCompleted = false;
|
||||||
|
|
||||||
clearMatrix(this.matrix);
|
clearMatrix(this.matrix);
|
||||||
views.setLevel(this.level);
|
views.setLevel(this.level);
|
||||||
|
@ -1018,10 +1030,21 @@ Tetris.prototype = {
|
||||||
this.shape = this.shapeQueue.shift();
|
this.shape = this.shapeQueue.shift();
|
||||||
|
|
||||||
this.currentMinoInx++;
|
this.currentMinoInx++;
|
||||||
|
|
||||||
|
// Opener sequence completed
|
||||||
if(this.currentMinoInx > openers.getLength()) {
|
if(this.currentMinoInx > openers.getLength()) {
|
||||||
|
if(this.isTimerOn) {
|
||||||
|
var besttime = document.getElementById("besttime").value;
|
||||||
|
var deltaTime = new Date().getTime() - this.sequencePrevTime;
|
||||||
|
if(besttime == "" || deltaTime/1000.0 < parseInt(besttime)) {
|
||||||
|
document.getElementById("besttime").value = (deltaTime/1000.0).toString();
|
||||||
|
}
|
||||||
|
this.isSequenceCompleted = true;
|
||||||
|
|
||||||
|
}
|
||||||
this.hintQueue = [];
|
this.hintQueue = [];
|
||||||
this.shapeQueue = [];
|
this.shapeQueue = [];
|
||||||
|
|
||||||
// Recursion warning
|
// Recursion warning
|
||||||
this._restartHandler();
|
this._restartHandler();
|
||||||
}
|
}
|
||||||
|
@ -1083,11 +1106,13 @@ Tetris.prototype = {
|
||||||
canvas.drawGhostShape(clone, bottomY);
|
canvas.drawGhostShape(clone, bottomY);
|
||||||
}
|
}
|
||||||
canvas.drawMatrix(this.matrix);
|
canvas.drawMatrix(this.matrix);
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
// tick input data
|
// tick input data
|
||||||
_processTick: async function() {
|
_processTick: async function() {
|
||||||
|
|
||||||
var deltaTime = 1.0; // 1 millisecond
|
var deltaTime = 1.0; // 1 millisecond
|
||||||
var tenthOfFrame = 1.0 //1.6; // 1.6ms = 1 fram
|
var tenthOfFrame = 1.0 //1.6; // 1.6ms = 1 fram
|
||||||
var halfFrame = 5.0 //8.0;
|
var halfFrame = 5.0 //8.0;
|
||||||
var halfFramePlus = 10.0;
|
var halfFramePlus = 10.0;
|
||||||
|
@ -1107,6 +1132,15 @@ Tetris.prototype = {
|
||||||
// Don't process game related events if game over
|
// Don't process game related events if game over
|
||||||
if(this.isGameOver) return;
|
if(this.isGameOver) return;
|
||||||
|
|
||||||
|
|
||||||
|
if(this.isTimerOn) {
|
||||||
|
var deltaPlayTime = new Date().getTime() - this.sequencePrevTime;
|
||||||
|
|
||||||
|
if(inputs.getTickCounter() >= 20) {
|
||||||
|
document.getElementById("Time").value = (deltaPlayTime/1000).toString();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// drain gamepad queue
|
// drain gamepad queue
|
||||||
if(inputs.getTickCounter() > halfFrame) // 8 millisecons
|
if(inputs.getTickCounter() > halfFrame) // 8 millisecons
|
||||||
{
|
{
|
||||||
|
@ -1249,8 +1283,6 @@ Tetris.prototype = {
|
||||||
if (!this.isGameOver) {
|
if (!this.isGameOver) {
|
||||||
window.requestAnimationFrame(utils.proxy(this._refresh, this));
|
window.requestAnimationFrame(utils.proxy(this._refresh, this));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
// check if the current piece is in the same location as the hint piece
|
// check if the current piece is in the same location as the hint piece
|
||||||
_checkHint: function() {
|
_checkHint: function() {
|
||||||
|
@ -1307,7 +1339,8 @@ Tetris.prototype = {
|
||||||
side1 = 1;
|
side1 = 1;
|
||||||
if(matrix[side2Y][side2X] != 0)
|
if(matrix[side2Y][side2X] != 0)
|
||||||
side2 = 1;
|
side2 = 1;
|
||||||
if(matrix[side3Y][side3X] != 0)
|
// TODO: figure out why this occasionally is undefined
|
||||||
|
if(matrix[side3Y] != undefined && matrix[side3Y][side3X] != 0)
|
||||||
side3 = 1;
|
side3 = 1;
|
||||||
if(matrix[side4Y][side4X] != 0)
|
if(matrix[side4Y][side4X] != 0)
|
||||||
side4 = 1;
|
side4 = 1;
|
||||||
|
@ -1800,6 +1833,7 @@ module.exports.reset = reset;
|
||||||
|
|
||||||
},{"./shapes.js":7}],7:[function(require,module,exports){
|
},{"./shapes.js":7}],7:[function(require,module,exports){
|
||||||
var consts = require('./consts.js');
|
var consts = require('./consts.js');
|
||||||
|
var utils = require('./utils.js');
|
||||||
// import * as consts from './const.js';
|
// import * as consts from './const.js';
|
||||||
var COLORS = consts.COLORS;
|
var COLORS = consts.COLORS;
|
||||||
var COLUMN_COUNT = consts.COLUMN_COUNT;
|
var COLUMN_COUNT = consts.COLUMN_COUNT;
|
||||||
|
@ -2489,7 +2523,7 @@ ShapeZR.prototype = {
|
||||||
// 0 - no, 1 - up,left, 2 - up,right, 3 - down,left, 4 - down, right
|
// 0 - no, 1 - up,left, 2 - up,right, 3 - down,left, 4 - down, right
|
||||||
kickShape: function(matrix, rotationDirection) {
|
kickShape: function(matrix, rotationDirection) {
|
||||||
|
|
||||||
let clone = Object.assign(Object.create(Object.getPrototypeOf(this)), this);
|
let clone = utils.deepClone(this);
|
||||||
|
|
||||||
for(var j = 0; j < 4; j++) {
|
for(var j = 0; j < 4; j++) {
|
||||||
if(this.state == j) {
|
if(this.state == j) {
|
||||||
|
@ -2744,7 +2778,7 @@ module.exports.getShape = getShape;
|
||||||
// export randomShape;
|
// export randomShape;
|
||||||
// export getShape;
|
// export getShape;
|
||||||
|
|
||||||
},{"./consts.js":2}],8:[function(require,module,exports){
|
},{"./consts.js":2,"./utils.js":8}],8:[function(require,module,exports){
|
||||||
|
|
||||||
var exports = module.exports = {};
|
var exports = module.exports = {};
|
||||||
|
|
||||||
|
|
21
index.html
21
index.html
|
@ -38,7 +38,12 @@
|
||||||
|
|
||||||
|
|
||||||
<div id="divbg">
|
<div id="divbg">
|
||||||
|
<!-- https://www.shadertoy.com/view/3tXBWj# -->
|
||||||
|
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/Xlf3Rj?gui=true&t=10&paused=true&muted=false" allowfullscreen></iframe> -->
|
||||||
|
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/tdjyzz?gui=true&t=10&paused=true&muted=false" allowfullscreen></iframe> -->
|
||||||
|
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/3lVfDm?gui=true&t=10&paused=true&muted=false" allowfullscreen></iframe> -->
|
||||||
<iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/WldfWX?gui=&paused=false&muted=false" ></iframe>
|
<iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/WldfWX?gui=&paused=false&muted=false" ></iframe>
|
||||||
|
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/3sy3Wy?gui=true&t=10&paused=true&muted=false" ></iframe> -->
|
||||||
<script>
|
<script>
|
||||||
document.getElementById("bg").width = window.innerWidth;
|
document.getElementById("bg").width = window.innerWidth;
|
||||||
document.getElementById("bg").height = window.innerHeight;
|
document.getElementById("bg").height = window.innerHeight;
|
||||||
|
@ -112,8 +117,15 @@ document.getElementById("divbg").removeAttribute("tabIndex");
|
||||||
</ul>
|
</ul>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<canvas id="hold"></canvas>
|
<canvas id="hold"></canvas>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<input style="padding:1px;text-decoration:underline;overflow:visible;font-size:12px;background:black;color:dodgerblue;border:1px solid black;text-align:left;" type="button" id="Timer" value="Timer Off"/>
|
||||||
|
<input disabled=true style="padding:1px;overflow:visible;width:80px;font-size:12px;background:black;color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="Time" value=""/>
|
||||||
|
|
||||||
|
<input disabled=true style="overflow:visible;width:40%;font-size:12px;background:black;color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="besttimetext" value="Best Time:"/>
|
||||||
|
<input disabled=true style="overflow:visible;width:80px;font-size:12px;background:black;color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="besttime" value=""/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="gameOver">
|
<div id="gameOver">
|
||||||
|
@ -135,9 +147,9 @@ document.getElementById("divbg").removeAttribute("tabIndex");
|
||||||
<option selected="">Settings:</option>
|
<option selected="">Settings:</option>
|
||||||
|
|
||||||
</select>
|
</select>
|
||||||
<input style="width:80px;font-size:13px;background:black;color:dodgerblue;text-align:left;" type="text" id="setting_value">
|
<input style="width:80px;font-size:13px;background:black;color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="setting_value">
|
||||||
<input id="submitsetting" type="submit" value="Set Setting">
|
<input style="width:80px;font-size:12px;background:black;color:dodgerblue;border:1px solid black;" id="submitsetting" type="submit" value="Set Setting"></input>
|
||||||
<input id="test" type="submit" value="Test Yourself">
|
<input style="width:80px;font-size:12px;background:black;color:dodgerblue;border:1px solid black;" id="test" type="submit" value="Test Yourself"></input>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -160,6 +172,7 @@ document.getElementById("divbg").removeAttribute("tabIndex");
|
||||||
document.getElementById("setAlbatrossVar").addEventListener("click", function() { tetrion.setCurrentOpener(7); } );
|
document.getElementById("setAlbatrossVar").addEventListener("click", function() { tetrion.setCurrentOpener(7); } );
|
||||||
document.getElementById("setNumberOneVar").addEventListener("click", function() { tetrion.setCurrentOpener(8); } );
|
document.getElementById("setNumberOneVar").addEventListener("click", function() { tetrion.setCurrentOpener(8); } );
|
||||||
|
|
||||||
|
document.getElementById("Timer").addEventListener("click", function() { tetrion.toggleTimer(); } );
|
||||||
|
|
||||||
document.getElementById("test").addEventListener("click", function() { tetrion.setDoTest(); } );
|
document.getElementById("test").addEventListener("click", function() { tetrion.setDoTest(); } );
|
||||||
document.getElementById("settings").addEventListener("change", function() { tetrion.updateSettingTextBox(); } );
|
document.getElementById("settings").addEventListener("change", function() { tetrion.updateSettingTextBox(); } );
|
||||||
|
|
|
@ -33,6 +33,7 @@ var UserInputs = {
|
||||||
},
|
},
|
||||||
incTickCounter() {
|
incTickCounter() {
|
||||||
this.ticks++;
|
this.ticks++;
|
||||||
|
if(this.ticks > 1200000)this.ticks = 0; // set to 0 every 12 seconds?
|
||||||
},
|
},
|
||||||
getTickCounter() {
|
getTickCounter() {
|
||||||
return this.ticks;
|
return this.ticks;
|
||||||
|
@ -258,17 +259,17 @@ var UserInputs = {
|
||||||
"Gamepad DAS", "Gamepad ARR", "Gamepad Harddrop", "Gamepad Hold",
|
"Gamepad DAS", "Gamepad ARR", "Gamepad Harddrop", "Gamepad Hold",
|
||||||
"Gamepad Left", "Gamepad Right", "Gamepad Rotateccw", "Gamepad Rotate",
|
"Gamepad Left", "Gamepad Right", "Gamepad Rotateccw", "Gamepad Rotate",
|
||||||
"Gamepad Down","Gamepad Pophold", "Gamepad Reset", "Gamepad Background",
|
"Gamepad Down","Gamepad Pophold", "Gamepad Reset", "Gamepad Background",
|
||||||
"path", "SameSite"],
|
"path", "High Score"],
|
||||||
|
|
||||||
settingsDefault: ["true",
|
settingsDefault: ["true",
|
||||||
"65.0", "20.0", "32", "16",
|
"50.0", "16.0", "32", "16",
|
||||||
"37", "39", "90", "88",
|
"37", "39", "90", "88",
|
||||||
"40", "17", "82", "81",
|
"40", "17", "82", "81",
|
||||||
|
|
||||||
"65.0", "20.0", "RB", "LB",
|
"50.0", "16.0", "RB", "LB",
|
||||||
"DPad-Left", "DPad-Right", "A", "B",
|
"DPad-Left", "DPad-Right", "A", "B",
|
||||||
"DPad-Down", "DPad-Up", "Back", "",
|
"DPad-Down", "DPad-Up", "Back", "",
|
||||||
"=/", "Strict"],
|
"=/"],
|
||||||
settingsMap: []
|
settingsMap: []
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
44
src/main.js
44
src/main.js
|
@ -158,7 +158,8 @@ Tetris.prototype = {
|
||||||
inputs.init();
|
inputs.init();
|
||||||
this.createSettings();
|
this.createSettings();
|
||||||
// if true no openers. just random tetrinos
|
// if true no openers. just random tetrinos
|
||||||
this.isFreePlay = true;
|
this.isFreePlay = true;1
|
||||||
|
this.isTimerOn = false;
|
||||||
this.currentOpener = 0;
|
this.currentOpener = 0;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.matrix = initMatrix(consts.ROW_COUNT, consts.COLUMN_COUNT);
|
this.matrix = initMatrix(consts.ROW_COUNT, consts.COLUMN_COUNT);
|
||||||
|
@ -169,8 +170,15 @@ Tetris.prototype = {
|
||||||
this._fireShape();
|
this._fireShape();
|
||||||
|
|
||||||
},
|
},
|
||||||
|
toggleTimer: function() {
|
||||||
|
document.getElementById("Timer").value = (this.isTimerOn = !this.isTimerOn) ? "Seconds:" : "Timer Off";
|
||||||
|
},
|
||||||
setFreePlay: function()
|
setFreePlay: function()
|
||||||
{
|
{
|
||||||
|
document.getElementById("Timer").value = "Timer Off";
|
||||||
|
document.getElementById("Time").value = "";
|
||||||
|
document.getElementById("besttime").value = "";
|
||||||
|
this.isTimerOn = false;
|
||||||
this.isFreePlay = true;
|
this.isFreePlay = true;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.hintQueue = [];
|
this.hintQueue = [];
|
||||||
|
@ -182,6 +190,7 @@ Tetris.prototype = {
|
||||||
},
|
},
|
||||||
setCurrentOpener(opener)
|
setCurrentOpener(opener)
|
||||||
{
|
{
|
||||||
|
document.getElementById("besttime").value = "";
|
||||||
this.isFreePlay = false;
|
this.isFreePlay = false;
|
||||||
this.doTest = false;
|
this.doTest = false;
|
||||||
this.currentOpener = opener;
|
this.currentOpener = opener;
|
||||||
|
@ -227,6 +236,7 @@ Tetris.prototype = {
|
||||||
this.startTime = new Date().getTime();
|
this.startTime = new Date().getTime();
|
||||||
this.currentTime = this.startTime;
|
this.currentTime = this.startTime;
|
||||||
this.prevTime = this.startTime;
|
this.prevTime = this.startTime;
|
||||||
|
this.sequencePrevTime = this.startTime;
|
||||||
//todo:get rid of extra
|
//todo:get rid of extra
|
||||||
this.levelTime = this.startTime;
|
this.levelTime = this.startTime;
|
||||||
this.prevInputTime = this.startTime;
|
this.prevInputTime = this.startTime;
|
||||||
|
@ -242,6 +252,7 @@ Tetris.prototype = {
|
||||||
// timer for srs extened piece lockdown
|
// timer for srs extened piece lockdown
|
||||||
this.lockdownTimer = 0;
|
this.lockdownTimer = 0;
|
||||||
this.landed = false;
|
this.landed = false;
|
||||||
|
this.isSequenceCompleted = false;
|
||||||
|
|
||||||
clearMatrix(this.matrix);
|
clearMatrix(this.matrix);
|
||||||
views.setLevel(this.level);
|
views.setLevel(this.level);
|
||||||
|
@ -317,10 +328,21 @@ Tetris.prototype = {
|
||||||
this.shape = this.shapeQueue.shift();
|
this.shape = this.shapeQueue.shift();
|
||||||
|
|
||||||
this.currentMinoInx++;
|
this.currentMinoInx++;
|
||||||
|
|
||||||
|
// Opener sequence completed
|
||||||
if(this.currentMinoInx > openers.getLength()) {
|
if(this.currentMinoInx > openers.getLength()) {
|
||||||
|
if(this.isTimerOn) {
|
||||||
|
var besttime = document.getElementById("besttime").value;
|
||||||
|
var deltaTime = new Date().getTime() - this.sequencePrevTime;
|
||||||
|
if(besttime == "" || deltaTime/1000.0 < parseInt(besttime)) {
|
||||||
|
document.getElementById("besttime").value = (deltaTime/1000.0).toString();
|
||||||
|
}
|
||||||
|
this.isSequenceCompleted = true;
|
||||||
|
|
||||||
|
}
|
||||||
this.hintQueue = [];
|
this.hintQueue = [];
|
||||||
this.shapeQueue = [];
|
this.shapeQueue = [];
|
||||||
|
|
||||||
// Recursion warning
|
// Recursion warning
|
||||||
this._restartHandler();
|
this._restartHandler();
|
||||||
}
|
}
|
||||||
|
@ -382,11 +404,13 @@ Tetris.prototype = {
|
||||||
canvas.drawGhostShape(clone, bottomY);
|
canvas.drawGhostShape(clone, bottomY);
|
||||||
}
|
}
|
||||||
canvas.drawMatrix(this.matrix);
|
canvas.drawMatrix(this.matrix);
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
// tick input data
|
// tick input data
|
||||||
_processTick: async function() {
|
_processTick: async function() {
|
||||||
|
|
||||||
var deltaTime = 1.0; // 1 millisecond
|
var deltaTime = 1.0; // 1 millisecond
|
||||||
var tenthOfFrame = 1.0 //1.6; // 1.6ms = 1 fram
|
var tenthOfFrame = 1.0 //1.6; // 1.6ms = 1 fram
|
||||||
var halfFrame = 5.0 //8.0;
|
var halfFrame = 5.0 //8.0;
|
||||||
var halfFramePlus = 10.0;
|
var halfFramePlus = 10.0;
|
||||||
|
@ -406,6 +430,15 @@ Tetris.prototype = {
|
||||||
// Don't process game related events if game over
|
// Don't process game related events if game over
|
||||||
if(this.isGameOver) return;
|
if(this.isGameOver) return;
|
||||||
|
|
||||||
|
|
||||||
|
if(this.isTimerOn) {
|
||||||
|
var deltaPlayTime = new Date().getTime() - this.sequencePrevTime;
|
||||||
|
|
||||||
|
if(inputs.getTickCounter() >= 20) {
|
||||||
|
document.getElementById("Time").value = (deltaPlayTime/1000).toString();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// drain gamepad queue
|
// drain gamepad queue
|
||||||
if(inputs.getTickCounter() > halfFrame) // 8 millisecons
|
if(inputs.getTickCounter() > halfFrame) // 8 millisecons
|
||||||
{
|
{
|
||||||
|
@ -548,8 +581,6 @@ Tetris.prototype = {
|
||||||
if (!this.isGameOver) {
|
if (!this.isGameOver) {
|
||||||
window.requestAnimationFrame(utils.proxy(this._refresh, this));
|
window.requestAnimationFrame(utils.proxy(this._refresh, this));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
// check if the current piece is in the same location as the hint piece
|
// check if the current piece is in the same location as the hint piece
|
||||||
_checkHint: function() {
|
_checkHint: function() {
|
||||||
|
@ -606,7 +637,8 @@ Tetris.prototype = {
|
||||||
side1 = 1;
|
side1 = 1;
|
||||||
if(matrix[side2Y][side2X] != 0)
|
if(matrix[side2Y][side2X] != 0)
|
||||||
side2 = 1;
|
side2 = 1;
|
||||||
if(matrix[side3Y][side3X] != 0)
|
// TODO: figure out why this occasionally is undefined
|
||||||
|
if(matrix[side3Y] != undefined && matrix[side3Y][side3X] != 0)
|
||||||
side3 = 1;
|
side3 = 1;
|
||||||
if(matrix[side4Y][side4X] != 0)
|
if(matrix[side4Y][side4X] != 0)
|
||||||
side4 = 1;
|
side4 = 1;
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
var consts = require('./consts.js');
|
var consts = require('./consts.js');
|
||||||
|
var utils = require('./utils.js');
|
||||||
// import * as consts from './const.js';
|
// import * as consts from './const.js';
|
||||||
var COLORS = consts.COLORS;
|
var COLORS = consts.COLORS;
|
||||||
var COLUMN_COUNT = consts.COLUMN_COUNT;
|
var COLUMN_COUNT = consts.COLUMN_COUNT;
|
||||||
|
@ -688,7 +689,7 @@ ShapeZR.prototype = {
|
||||||
// 0 - no, 1 - up,left, 2 - up,right, 3 - down,left, 4 - down, right
|
// 0 - no, 1 - up,left, 2 - up,right, 3 - down,left, 4 - down, right
|
||||||
kickShape: function(matrix, rotationDirection) {
|
kickShape: function(matrix, rotationDirection) {
|
||||||
|
|
||||||
let clone = Object.assign(Object.create(Object.getPrototypeOf(this)), this);
|
let clone = utils.deepClone(this);
|
||||||
|
|
||||||
for(var j = 0; j < 4; j++) {
|
for(var j = 0; j < 4; j++) {
|
||||||
if(this.state == j) {
|
if(this.state == j) {
|
||||||
|
|
Loading…
Reference in New Issue