Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Gamepad API events #302

Open
wants to merge 5 commits into
base: gh-pages
Choose a base branch
from
Open

Gamepad API events #302

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
83e9205
Refactored code : introduce functions to switch UI between keyboard e…
poirierlouis Jul 23, 2021
382d300
Merge branch 'gh-pages' into gamepad
poirierlouis Jul 24, 2021
8489f51
Gamepad polyfill : implements a function to returns an array of gamep…
poirierlouis Jul 24, 2021
6af9989
Fix gamepad loop: waits for SVG document to be loaded before running …
poirierlouis Jul 24, 2021
f4d87f1
Describes gamepad feature.
poirierlouis Jul 24, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

![](http://wes.io/sQyC/content.gif)

A simple webpage that responds to the key pressed and returns the JavaScript 'on-key pressed' keycode.
A simple webpage that :
- responds to the key pressed and returns the JavaScript 'on-key pressed' keycode.
- responds to gamepad events and returns the JavaScript button index and joystick positions.

## Help Out :ok_hand::ok_hand::ok_hand:

Expand Down
56 changes: 47 additions & 9 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,11 @@
</table>
<div class="wrap" aria-live="polite" aria-atomic="true">
<p class="keycode-display"></p>
<object type="image/svg+xml" data="standard_gamepad.svg"
onload="prepareGamepadDisplayOverlay()" class="gamepad-display hide"></object>
<p class="text-display">Press any key to get the JavaScript event keycode</p>
<div class="cards hide">
<p class="text-display">Plug a gamepad to get the JavaScript events</p>
<div id="keyboard" class="cards hide">
<div class="card item-key">
<div class="card-header">event.key</div>
<div class="card-main">
Expand Down Expand Up @@ -66,6 +69,32 @@
</div>
</div>
</div>
<div id="gamepad" class="cards hide">
<div class="card item-id">
<div class="card-header">gamepad.id</div>
<div class="card-main">
<div class="main-description">xinput</div>
</div>
</div>
<div class="card item-mapping">
<div class="card-header">gamepad.mapping</div>
<div class="card-main">
<div class="main-description">standard</div>
</div>
</div>
<div class="card item-buttons">
<div class="card-header">gamepad.buttons</div>
<div class="card-main">
<div class="main-description"></div>
</div>
</div>
<div class="card item-axes">
<div class="card-header">gamepad.axes</div>
<div class="card-main">
<div class="main-description"></div>
</div>
</div>
</div>
<div class="mobile-input">
</div>
</div>
Expand All @@ -75,18 +104,27 @@
</div>
</div>

<span class="love">Made with love by
<a href="https://wesbos.com" target="_blank" rel="noopener">Wes Bos</a> — fork or suggest edits on
<a href="https://github.com/wesbos/keycodes" target="_blank" rel="noopener">GitHub</a> —
<footer>
<span class="love">Made with love by
<a href="https://wesbos.com" target="_blank" rel="noopener">Wes Bos</a> & <a href="https://louispoirier.io" target="_blank">Louis Poirier</a> — fork or suggest edits on
<a href="https://github.com/wesbos/keycodes" target="_blank" rel="noopener">GitHub</a> —

<a href="https://twitter.com/wesbos" class="twitter-follow-button" data-show-count="false" target="_blank" rel="noopener">Follow
@wesbos</a>
<a href="https://twitter.com/wesbos" class="twitter-follow-button" data-show-count="false" target="_blank" rel="noopener">Follow
@wesbos</a>

<a href="https://twitter.com/share" class="twitter-share-button" data-url="https://keycode.info" data-text="Nice tool for finding JavaScript event keycodes"
data-via="wesbos" data-related="wesbos" target="_blank" rel="noopener">Tweet</a>
<a href="https://twitter.com/share" class="twitter-share-button" data-url="https://keycode.info" data-text="Nice tool for finding JavaScript event keycodes"
data-via="wesbos" data-related="wesbos" target="_blank" rel="noopener">Tweet</a>
</span>

<br>

</span>
<span class="copyright">
This software or document includes material copied from or derived from<br>
<a href="https://w3c.github.io/gamepad/" target="_blank">Gamepad W3C Editor's Draft</a> —
<a href="https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document" target="_blank">
Copyright © 2021 W3C® (MIT, ERCIM, Keio, Beihang)</a>
</span>
</footer>

<script type='text/javascript'>
if ('serviceWorker' in navigator) {
Expand Down
Loading