remove space to restart game, refactor code slightly
This commit is contained in:
+1
-1
@@ -22,7 +22,7 @@
|
|||||||
<div class="best-container">0</div>
|
<div class="best-container">0</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="game-intro">Join the numbers and get to the <strong>2048 tile!</strong></p>
|
<p class="game-intro">Join the numbers and get the <strong>2048 tile!</strong></p>
|
||||||
<a class="restart-button">New Game</a>
|
<a class="restart-button">New Game</a>
|
||||||
<div class="game-container">
|
<div class="game-container">
|
||||||
<div class="game-message">
|
<div class="game-message">
|
||||||
|
|||||||
@@ -39,16 +39,17 @@ KeyboardInputManager.prototype.listen = function () {
|
|||||||
39: 1, // Right
|
39: 1, // Right
|
||||||
40: 2, // Down
|
40: 2, // Down
|
||||||
37: 3, // Left
|
37: 3, // Left
|
||||||
75: 0, // vim keybindings
|
75: 0, // Vim up
|
||||||
76: 1,
|
76: 1, // Vim right
|
||||||
74: 2,
|
74: 2, // Vim down
|
||||||
72: 3,
|
72: 3, // Vim left
|
||||||
87: 0, // W
|
87: 0, // W
|
||||||
68: 1, // D
|
68: 1, // D
|
||||||
83: 2, // S
|
83: 2, // S
|
||||||
65: 3 // A
|
65: 3 // A
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Respond to direction keys
|
||||||
document.addEventListener("keydown", function (event) {
|
document.addEventListener("keydown", function (event) {
|
||||||
var modifiers = event.altKey || event.ctrlKey || event.metaKey ||
|
var modifiers = event.altKey || event.ctrlKey || event.metaKey ||
|
||||||
event.shiftKey;
|
event.shiftKey;
|
||||||
@@ -59,38 +60,32 @@ KeyboardInputManager.prototype.listen = function () {
|
|||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
self.emit("move", mapped);
|
self.emit("move", mapped);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (event.which === 32) self.restart.bind(self)(event);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
var retry = document.querySelector(".retry-button");
|
// Respond to button presses
|
||||||
retry.addEventListener("click", this.restart.bind(this));
|
this.bindButtonPress(".retry-button", this.restart);
|
||||||
retry.addEventListener(this.eventTouchend, this.restart.bind(this));
|
this.bindButtonPress(".restart-button", this.restart);
|
||||||
|
this.bindButtonPress(".keep-playing-button", this.keepPlaying);
|
||||||
|
|
||||||
var restart = document.querySelector(".restart-button");
|
// Respond to swipe events
|
||||||
restart.addEventListener("click", this.restart.bind(this));
|
|
||||||
restart.addEventListener("touchend", this.restart.bind(this));
|
|
||||||
|
|
||||||
var keepPlaying = document.querySelector(".keep-playing-button");
|
|
||||||
keepPlaying.addEventListener("click", this.keepPlaying.bind(this));
|
|
||||||
keepPlaying.addEventListener("touchend", this.keepPlaying.bind(this));
|
|
||||||
|
|
||||||
// Listen to swipe events
|
|
||||||
var touchStartClientX, touchStartClientY;
|
var touchStartClientX, touchStartClientY;
|
||||||
var gameContainer = document.getElementsByClassName("game-container")[0];
|
var gameContainer = document.getElementsByClassName("game-container")[0];
|
||||||
|
|
||||||
gameContainer.addEventListener(this.eventTouchstart, function (event) {
|
gameContainer.addEventListener(this.eventTouchstart, function (event) {
|
||||||
if (( !window.navigator.msPointerEnabled && event.touches.length > 1) || event.targetTouches > 1) return;
|
if ((!window.navigator.msPointerEnabled && event.touches.length > 1) ||
|
||||||
|
event.targetTouches > 1) {
|
||||||
if(window.navigator.msPointerEnabled){
|
return; // Ignore if touching with more than 1 finger
|
||||||
touchStartClientX = event.pageX;
|
|
||||||
touchStartClientY = event.pageY;
|
|
||||||
} else {
|
|
||||||
touchStartClientX = event.touches[0].clientX;
|
|
||||||
touchStartClientY = event.touches[0].clientY;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (window.navigator.msPointerEnabled) {
|
||||||
|
touchStartClientX = event.pageX;
|
||||||
|
touchStartClientY = event.pageY;
|
||||||
|
} else {
|
||||||
|
touchStartClientX = event.touches[0].clientX;
|
||||||
|
touchStartClientY = event.touches[0].clientY;
|
||||||
|
}
|
||||||
|
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -99,15 +94,19 @@ KeyboardInputManager.prototype.listen = function () {
|
|||||||
});
|
});
|
||||||
|
|
||||||
gameContainer.addEventListener(this.eventTouchend, function (event) {
|
gameContainer.addEventListener(this.eventTouchend, function (event) {
|
||||||
if (( !window.navigator.msPointerEnabled && event.touches.length > 0) || event.targetTouches > 0) return;
|
if ((!window.navigator.msPointerEnabled && event.touches.length > 0) ||
|
||||||
|
event.targetTouches > 0) {
|
||||||
|
return; // Ignore if still touching with one or more fingers
|
||||||
|
}
|
||||||
|
|
||||||
var touchEndClientX, touchEndClientY;
|
var touchEndClientX, touchEndClientY;
|
||||||
if(window.navigator.msPointerEnabled){
|
|
||||||
touchEndClientX = event.pageX;
|
if (window.navigator.msPointerEnabled) {
|
||||||
touchEndClientY = event.pageY;
|
touchEndClientX = event.pageX;
|
||||||
|
touchEndClientY = event.pageY;
|
||||||
} else {
|
} else {
|
||||||
touchEndClientX = event.changedTouches[0].clientX;
|
touchEndClientX = event.changedTouches[0].clientX;
|
||||||
touchEndClientY = event.changedTouches[0].clientY;
|
touchEndClientY = event.changedTouches[0].clientY;
|
||||||
}
|
}
|
||||||
|
|
||||||
var dx = touchEndClientX - touchStartClientX;
|
var dx = touchEndClientX - touchStartClientX;
|
||||||
@@ -132,3 +131,9 @@ KeyboardInputManager.prototype.keepPlaying = function (event) {
|
|||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
this.emit("keepPlaying");
|
this.emit("keepPlaying");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
KeyboardInputManager.prototype.bindButtonPress = function (selector, fn) {
|
||||||
|
var button = document.querySelector(selector);
|
||||||
|
button.addEventListener("click", fn.bind(this));
|
||||||
|
button.addEventListener(this.eventTouchend, fn.bind(this));
|
||||||
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user