Rim-Modules/gamepad-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved the no gamepad message

Browse Source
This commit is contained in:
e7d 2016-11-11 09:20:23 +01:00
parent ebb442c218
commit 0ebb16f1ea
3 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
css/main.css
View File

@ -3,11 +3,12 @@ body {
overflow: hidden; overflow: hidden;
} }
.no-gamepad { .no-gamepad {
position: absolute;
bottom: 0;
display: none;
width: 100vw; width: 100vw;
line-height: 100vh; line-height: 2em;
text-align: center; text-align: center;
text-transform: uppercase;
font-weight: 700;
} }
.gamepad { .gamepad {
position: absolute; position: absolute;

2
index.html
View File

@ -11,7 +11,7 @@
<link rel="stylesheet" href="css/main.css?8a342d6"> <link rel="stylesheet" href="css/main.css?8a342d6">
</head> </head>
<body> <body>
<div class="no-gamepad">No gamepad detected</div> <div class="no-gamepad">No active gamepad. Press <kbd>H</kbd> to see how it works.</div>
<div class="gamepad"></div> <div class="gamepad"></div>
<div class="help"> <div class="help">
<h2>Help</h2> <h2>Help</h2>

20
js/gamepad.js
View File

@ -10,6 +10,7 @@ $.urlParam = function(name) {
var haveEvents = 'ongamepadconnected' in window; var haveEvents = 'ongamepadconnected' in window;
var gamepads = {}; var gamepads = {};
var $gamepad = $('.gamepad'); var $gamepad = $('.gamepad');
var $nogamepad = $('.no-gamepad');
var $help = $('.help'); var $help = $('.help');
var gamepadIdentifiers = { var gamepadIdentifiers = {
'ds4': { 'ds4': {
@ -21,6 +22,8 @@ var gamepadIdentifiers = {
'colors': ['black', 'white'] 'colors': ['black', 'white']
} }
}; };
var gamepadHelpTimeout = null;
var gamepadHelpDelay = 10000;
var activeGamepadIndex = null; var activeGamepadIndex = null;
var activeGamepadType = null; var activeGamepadType = null;
var activeGamepadIdentifier = null; var activeGamepadIdentifier = null;
@ -36,6 +39,17 @@ window.addEventListener("gamepadconnected", onGamepadConnect);
window.addEventListener("gamepaddisconnected", onGamepadDisconnect); window.addEventListener("gamepaddisconnected", onGamepadDisconnect);
window.addEventListener("keydown", onKeyDown); window.addEventListener("keydown", onKeyDown);
displayGamepadHelp();
function displayGamepadHelp() {
gamepadHelpTimeout = window.setTimeout(function() {
$nogamepad.fadeIn();
}, gamepadHelpDelay);
}
function hideGamepadHelp() {
window.clearTimeout(gamepadHelpTimeout);
$nogamepad.hide();
}
function onGamepadConnect(e) { function onGamepadConnect(e) {
addGamepad(e.gamepad); addGamepad(e.gamepad);
} }
@ -85,6 +99,8 @@ function removeGamepad(gamepadIndex) {
$gamepad.empty(); $gamepad.empty();
} }
delete gamepads[gamepadIndex]; delete gamepads[gamepadIndex];
displayGamepadHelp();
} }
setInterval(scanGamepads, 500); setInterval(scanGamepads, 500);
@ -117,6 +133,8 @@ function mapGamepad(gamepad) {
activeGamepadIndex = gamepad.index; activeGamepadIndex = gamepad.index;
hideGamepadHelp();
for (var gamepadType in gamepadIdentifiers) { for (var gamepadType in gamepadIdentifiers) {
if (gamepadIdentifiers[gamepadType].id.test(gamepad.id)) { if (gamepadIdentifiers[gamepadType].id.test(gamepad.id)) {
activeGamepadType = gamepadType; activeGamepadType = gamepadType;
@ -167,7 +185,7 @@ function updateVisualStatus() {
return; return;
} }
var gamepads = getGamepads(); gamepads = getGamepads();
var activeGamepad = gamepads[activeGamepadIndex]; var activeGamepad = gamepads[activeGamepadIndex];
if (!activeGamepad) { if (!activeGamepad) {