145 lines
3.9 KiB
JavaScript
145 lines
3.9 KiB
JavaScript
|
function KeyboardInputManager() {
|
||
|
this.events = {};
|
||
|
|
||
|
if (window.navigator.msPointerEnabled) {
|
||
|
//Internet Explorer 10 style
|
||
|
this.eventTouchstart = "MSPointerDown";
|
||
|
this.eventTouchmove = "MSPointerMove";
|
||
|
this.eventTouchend = "MSPointerUp";
|
||
|
} else {
|
||
|
this.eventTouchstart = "touchstart";
|
||
|
this.eventTouchmove = "touchmove";
|
||
|
this.eventTouchend = "touchend";
|
||
|
}
|
||
|
|
||
|
this.listen();
|
||
|
}
|
||
|
|
||
|
KeyboardInputManager.prototype.on = function (event, callback) {
|
||
|
if (!this.events[event]) {
|
||
|
this.events[event] = [];
|
||
|
}
|
||
|
this.events[event].push(callback);
|
||
|
};
|
||
|
|
||
|
KeyboardInputManager.prototype.emit = function (event, data) {
|
||
|
var callbacks = this.events[event];
|
||
|
if (callbacks) {
|
||
|
callbacks.forEach(function (callback) {
|
||
|
callback(data);
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
KeyboardInputManager.prototype.listen = function () {
|
||
|
var self = this;
|
||
|
|
||
|
var map = {
|
||
|
38: 0, // Up
|
||
|
39: 1, // Right
|
||
|
40: 2, // Down
|
||
|
37: 3, // Left
|
||
|
75: 0, // Vim up
|
||
|
76: 1, // Vim right
|
||
|
74: 2, // Vim down
|
||
|
72: 3, // Vim left
|
||
|
87: 0, // W
|
||
|
68: 1, // D
|
||
|
83: 2, // S
|
||
|
65: 3 // A
|
||
|
};
|
||
|
|
||
|
// Respond to direction keys
|
||
|
document.addEventListener("keydown", function (event) {
|
||
|
var modifiers = event.altKey || event.ctrlKey || event.metaKey ||
|
||
|
event.shiftKey;
|
||
|
var mapped = map[event.which];
|
||
|
|
||
|
if (!modifiers) {
|
||
|
if (mapped !== undefined) {
|
||
|
event.preventDefault();
|
||
|
self.emit("move", mapped);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// R key restarts the game
|
||
|
if (!modifiers && event.which === 82) {
|
||
|
self.restart.call(self, event);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// Respond to button presses
|
||
|
this.bindButtonPress(".retry-button", this.restart);
|
||
|
this.bindButtonPress(".restart-button", this.restart);
|
||
|
this.bindButtonPress(".keep-playing-button", this.keepPlaying);
|
||
|
|
||
|
// Respond to swipe events
|
||
|
var touchStartClientX, touchStartClientY;
|
||
|
var gameContainer = document.getElementsByClassName("game-container")[0];
|
||
|
|
||
|
gameContainer.addEventListener(this.eventTouchstart, function (event) {
|
||
|
if ((!window.navigator.msPointerEnabled && event.touches.length > 1) ||
|
||
|
event.targetTouches.length > 1) {
|
||
|
return; // Ignore if touching with more than 1 finger
|
||
|
}
|
||
|
|
||
|
if (window.navigator.msPointerEnabled) {
|
||
|
touchStartClientX = event.pageX;
|
||
|
touchStartClientY = event.pageY;
|
||
|
} else {
|
||
|
touchStartClientX = event.touches[0].clientX;
|
||
|
touchStartClientY = event.touches[0].clientY;
|
||
|
}
|
||
|
|
||
|
event.preventDefault();
|
||
|
});
|
||
|
|
||
|
gameContainer.addEventListener(this.eventTouchmove, function (event) {
|
||
|
event.preventDefault();
|
||
|
});
|
||
|
|
||
|
gameContainer.addEventListener(this.eventTouchend, function (event) {
|
||
|
if ((!window.navigator.msPointerEnabled && event.touches.length > 0) ||
|
||
|
event.targetTouches.length > 0) {
|
||
|
return; // Ignore if still touching with one or more fingers
|
||
|
}
|
||
|
|
||
|
var touchEndClientX, touchEndClientY;
|
||
|
|
||
|
if (window.navigator.msPointerEnabled) {
|
||
|
touchEndClientX = event.pageX;
|
||
|
touchEndClientY = event.pageY;
|
||
|
} else {
|
||
|
touchEndClientX = event.changedTouches[0].clientX;
|
||
|
touchEndClientY = event.changedTouches[0].clientY;
|
||
|
}
|
||
|
|
||
|
var dx = touchEndClientX - touchStartClientX;
|
||
|
var absDx = Math.abs(dx);
|
||
|
|
||
|
var dy = touchEndClientY - touchStartClientY;
|
||
|
var absDy = Math.abs(dy);
|
||
|
|
||
|
if (Math.max(absDx, absDy) > 10) {
|
||
|
// (right : left) : (down : up)
|
||
|
self.emit("move", absDx > absDy ? (dx > 0 ? 1 : 3) : (dy > 0 ? 2 : 0));
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
KeyboardInputManager.prototype.restart = function (event) {
|
||
|
event.preventDefault();
|
||
|
this.emit("restart");
|
||
|
};
|
||
|
|
||
|
KeyboardInputManager.prototype.keepPlaying = function (event) {
|
||
|
event.preventDefault();
|
||
|
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));
|
||
|
};
|