Properish gamepad implementation and more work on fullscreen mode
This commit is contained in:
parent
483ea7cc54
commit
a7cce2157c
@ -3,19 +3,6 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>Pong - MomentumEngine</title>
|
<title>Pong - MomentumEngine</title>
|
||||||
<script type="application/javascript" src="./dist/pong.js"></script>
|
<script type="application/javascript" src="./dist/pong.js"></script>
|
||||||
<style>
|
|
||||||
|
|
||||||
#canvas:-webkit-full-screen {
|
|
||||||
width: 100% !important;
|
|
||||||
height: 100% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#canvas:fullscreen {
|
|
||||||
width: 100% !important;
|
|
||||||
height: 100% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<canvas id="canvas"></canvas>
|
<canvas id="canvas"></canvas>
|
||||||
|
@ -167,7 +167,6 @@ class Pong extends MomentumEngine.Classes.Game {
|
|||||||
paddle.balls = this.balls;
|
paddle.balls = this.balls;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -39,6 +39,10 @@ class Game extends Entity {
|
|||||||
// Optional params
|
// Optional params
|
||||||
this.desiredFps = config.desiredFps || 60;
|
this.desiredFps = config.desiredFps || 60;
|
||||||
|
|
||||||
|
this.rescaleOnFullScreen = !!config.rescaleOnFullScreen;
|
||||||
|
|
||||||
|
this.scale = 1;
|
||||||
|
|
||||||
if (config.fixRatio) {
|
if (config.fixRatio) {
|
||||||
|
|
||||||
let deviceRatio = window.devicePixelRatio,
|
let deviceRatio = window.devicePixelRatio,
|
||||||
@ -107,6 +111,7 @@ class Game extends Entity {
|
|||||||
this._lastFrameTimestamp = 0;
|
this._lastFrameTimestamp = 0;
|
||||||
this._lastFrameTotalRenders = 0;
|
this._lastFrameTotalRenders = 0;
|
||||||
this._wantPause = true;
|
this._wantPause = true;
|
||||||
|
this._fullScreenLastFrame = false;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -135,8 +140,60 @@ class Game extends Entity {
|
|||||||
|
|
||||||
this.frameCounter++;
|
this.frameCounter++;
|
||||||
|
|
||||||
|
this._frameMaintenance();
|
||||||
this._updateEntity(delta);
|
this._updateEntity(delta);
|
||||||
this._renderEntity();
|
this._renderEntity();
|
||||||
|
this._updateInputs(); // NK: This happens at the end for reasons
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
_updateInputs () {
|
||||||
|
|
||||||
|
for (let input in this.inputs) {
|
||||||
|
if (this.inputs[input].update) {
|
||||||
|
this.inputs[input].update();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
_frameMaintenance () {
|
||||||
|
|
||||||
|
if (this.isFullScreen) {
|
||||||
|
|
||||||
|
if (this._fullScreenLastFrame == false) {
|
||||||
|
|
||||||
|
this.canvas.style.width = `${screen.width}px`;
|
||||||
|
this.canvas.style.height = `${screen.height}px`;
|
||||||
|
|
||||||
|
if (this.rescaleOnFullScreen) {
|
||||||
|
this.canvas.width = screen.width * this.scale;
|
||||||
|
this.canvas.height = screen.height * this.scale;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
this._fullScreenLastFrame = true;
|
||||||
|
|
||||||
|
} else {
|
||||||
|
|
||||||
|
if (this._fullScreenLastFrame == true) {
|
||||||
|
|
||||||
|
this.canvas.style.width = `${this.width}px`;
|
||||||
|
this.canvas.style.height = `${this.height}px`;
|
||||||
|
|
||||||
|
if (this.rescaleOnFullScreen) {
|
||||||
|
this.canvas.width = this.width * this.scale;
|
||||||
|
this.canvas.height = this.height * this.scale;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
this._fullScreenLastFrame = false;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -229,7 +286,7 @@ class Game extends Entity {
|
|||||||
|
|
||||||
|
|
||||||
get isFullScreen () {
|
get isFullScreen () {
|
||||||
return (!document.mozFullScreen && !document.webkitFullScreen);
|
return document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -27,7 +27,7 @@ class Gamepad {
|
|||||||
|
|
||||||
getAxis (axisId) {
|
getAxis (axisId) {
|
||||||
|
|
||||||
if (this._gamepadObj.axes[axisId]) {
|
if (typeof this._gamepadObj.axes[axisId] !== "undefined") {
|
||||||
return this._gamepadObj.axes[axisId];
|
return this._gamepadObj.axes[axisId];
|
||||||
} else {
|
} else {
|
||||||
throw new Error(`Axis ${axisId} not found on gamepad`);
|
throw new Error(`Axis ${axisId} not found on gamepad`);
|
||||||
@ -48,35 +48,7 @@ class GamepadInput {
|
|||||||
self._gamepadState = {};
|
self._gamepadState = {};
|
||||||
self.gamepadIds = [];
|
self.gamepadIds = [];
|
||||||
|
|
||||||
if (!("ongamepadconnected" in window)) {
|
if ('ongamepadconnected' in window) {
|
||||||
|
|
||||||
let pollGamepads = function () {
|
|
||||||
|
|
||||||
let gamepads = navigator.getGamepads ? navigator.getGamepads() : (navigator.webkitGetGamepads ? navigator.webkitGetGamepads : []);
|
|
||||||
|
|
||||||
for (var i = 0; i < gamepads.length; i++) {
|
|
||||||
|
|
||||||
let gamepad = gamepads[i];
|
|
||||||
|
|
||||||
if (gamepad) {
|
|
||||||
|
|
||||||
if (self.gamepadIds.indexOf(gamepad.index) < 0) {
|
|
||||||
self._gamepadState[gamepad.index] = new Gamepad(gamepad);
|
|
||||||
self.gamepadIds.push(gamepad.index);
|
|
||||||
|
|
||||||
console.log(`Gamepad ${gamepad.index} connected`);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
let interval = setInterval(pollGamepads, 5);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
|
|
||||||
window.addEventListener("gamepadconnected", (event) => {
|
window.addEventListener("gamepadconnected", (event) => {
|
||||||
self._gamepadState[event.gamepad.index] = new Gamepad(event.gamepad);
|
self._gamepadState[event.gamepad.index] = new Gamepad(event.gamepad);
|
||||||
@ -87,7 +59,7 @@ class GamepadInput {
|
|||||||
window.addEventListener("gamepaddisconnected", (event) => {
|
window.addEventListener("gamepaddisconnected", (event) => {
|
||||||
delete self._gamepadState[event.gamepad.index];
|
delete self._gamepadState[event.gamepad.index];
|
||||||
self.gamepadIds.splice(self.gamepadIds.indexOf(event.gamepad.index));
|
self.gamepadIds.splice(self.gamepadIds.indexOf(event.gamepad.index));
|
||||||
console.log(`Gamepad ${event.gamepad.index} connected`);
|
console.log(`Gamepad ${event.gamepad.index} disconnected`);
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -95,6 +67,72 @@ class GamepadInput {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
update () {
|
||||||
|
|
||||||
|
if (!("ongamepadconnected" in window)) {
|
||||||
|
|
||||||
|
let gamepads = navigator.getGamepads ? navigator.getGamepads() : (navigator.webkitGetGamepads ? navigator.webkitGetGamepads : []);
|
||||||
|
|
||||||
|
// If there are more gamepads registered than we know about, make ourselves aware of the new ones
|
||||||
|
if (gamepads.length != this.gamepadIds.length) {
|
||||||
|
|
||||||
|
for (let i = 0; i < gamepads.length; i++) {
|
||||||
|
|
||||||
|
let gamepad = gamepads[i];
|
||||||
|
|
||||||
|
if (gamepad) {
|
||||||
|
|
||||||
|
if (this.gamepadIds.indexOf(gamepad.index) < 0) {
|
||||||
|
this._gamepadState[gamepad.index] = new Gamepad(gamepad);
|
||||||
|
this.gamepadIds.push(gamepad.index);
|
||||||
|
|
||||||
|
console.log(`Gamepad ${gamepad.index} connected`);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// If there is still a mismatch, then we assume some gamepads have been disconnected, so we need to remove them
|
||||||
|
if (gamepads.length != this.gamepadIds.length) {
|
||||||
|
|
||||||
|
for (let i = 0; i < this.gamepadIds.length; i++) {
|
||||||
|
|
||||||
|
let found = false;
|
||||||
|
|
||||||
|
for (let j = 0; j < gamepads.length; j++) {
|
||||||
|
|
||||||
|
let gamepad = gamepads[i];
|
||||||
|
|
||||||
|
if (gamepad && gamepad.index == this.gamepadIds[i]) {
|
||||||
|
found = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!found) {
|
||||||
|
|
||||||
|
console.log(`Gamepad ${this.gamepadIds[i]} disconnected`);
|
||||||
|
|
||||||
|
delete this._gamepadState[this.gamepadIds[i]];
|
||||||
|
this.gamepadIds.splice(this.gamepadIds.indexOf(this.gamepadIds[i]));
|
||||||
|
|
||||||
|
i--;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
get numGamepads () {
|
get numGamepads () {
|
||||||
return this.gamepadIds.length;
|
return this.gamepadIds.length;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user