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

add a detected gamepads list in help

Browse Source
This commit is contained in:
e7d 2019-05-07 15:12:07 +02:00
parent cdd2794cb9
commit e2f4509a91
2 changed files with 44 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
index.html
View File

@ -14,14 +14,29 @@
</head>
<body>
<div class="no-gamepad">No active gamepad detected. Press <kbd>H</kbd> to read instructions.</div>
<div class="gamepad"></div>
<div class="help">
<div id="no-gamepad">No active gamepad detected. Press <kbd>H</kbd> to read instructions.</div>
<div id="gamepad"></div>
<div id="help">
<h2>Help</h2>
<h3>Instructions</h3>
<p>Press and hold any of your gamepad buttons for at least 1 second. If your gamepad is supported, it shows up.</p>
<h3>Detected Controllers</h3>
<table id="gamepad-list">
<thead>
<tr>
<th>Index</th>
<th>Controller ID</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2">No gamepad detected.</td>
</tr>
</tbody>
</table>
<h3>Keyboard shortcuts</h3>
<table>
<thead>

30
js/gamepad.js
View File

@ -12,10 +12,10 @@ class Gamepad {
// cached DOM references
this.$body = $('body');
this.$gamepad = $('.gamepad');
this.$nogamepad = $('.no-gamepad');
this.$debug = $('.debug');
this.$help = $('.help');
this.$gamepad = $('#gamepad');
this.$nogamepad = $('#no-gamepad');
this.$help = $('#help');
this.$gamepadList = $('#gamepad-list');
this.backgroundColors = ['transparent', 'dimgrey', 'black', 'lime', 'magenta'];
this.backgroundColorIndex = 0;
@ -190,6 +190,28 @@ class Gamepad {
for (let key in navigatorGamepads) {
this.gamepads[key] = navigatorGamepads[key];
}
this.buildHelpGamepadList();
}
/**
* Builds the help gamepad list
*/
buildHelpGamepadList() {
const $tbody = [];
for (let key in this.gamepads) {
const gamepad = this.gamepads[key];
if (!gamepad) {
continue;
}
$tbody.push('<tr><td>' + gamepad.index + '</td><td>' + gamepad.id + '</td></tr>');
}
if ($tbody.length === 0) {
$tbody.push('<tr><td colspan="2">No gamepad detected.</td></tr>');
}
this.$gamepadList.html($tbody.join(''));
}
/**