4aiman/JS-DualShock3-Monitor
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Pure javascript-driven gamepad monitor (styled for Dualshock 3)
7 commits 1 branch 0 tags 420 KiB
Find a file
ezwrk 927e0ba4af Added more styles
2023-08-24 17:24:39 +03:00
dropdown.png Added more styles 2023-08-24 17:24:39 +03:00
DS.css Added more styles 2023-08-24 17:24:39 +03:00
gpcon.js Added more styles 2023-08-24 17:24:39 +03:00
index.html Added more styles 2023-08-24 17:24:39 +03:00
main.css Add fancy gradients 2020-01-20 15:55:24 +03:00
NES.css Added more styles 2023-08-24 17:24:39 +03:00
README.md Added more styles 2023-08-24 17:24:39 +03:00
Screenshot.png Added more styles 2023-08-24 17:24:39 +03:00
SNES.css Added more styles 2023-08-24 17:24:39 +03:00
Xbox.css Added more styles 2023-08-24 17:24:39 +03:00

README.md

JS-DualShock3-Monitor

Pure javascript-driven gamepad monitor (styled for Dualshock 3, NES, SNES, XBox 360)

Built to be used in OBS an an overlay. That means the controller will be semi-transparent. Compatible with any XInput device (xbox controllers, Mayflash Magic adapters in XInput mode, etc)

How to use

  • Add a browser source
  • Set page size to 500x400
  • Tick the "Local File" box
  • Click "Browse" and select the index.html from this repo
  • Tick the "Shutdown source when not visible" box
  • Tick the "Refresh browser when scene becomes active" box
  • Make suse the browser source has body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; } in the Custom CSS field

To change styles:

  • Right click your browser source
  • Pick the "Ineteract" options
  • Click on dropdown list utill it's open. Note that you won't see any actual items, instead there will be thick border inside the list looks like this
  • Use up/down arrows to chose the desired style

screenshot