Inhoudsopgave:

Bluetooth-enabled joystickcontroller - Ajarnpa
Bluetooth-enabled joystickcontroller - Ajarnpa

Video: Bluetooth-enabled joystickcontroller - Ajarnpa

Video: Bluetooth-enabled joystickcontroller - Ajarnpa
Video: 🎮 Order Link in Comments 🎮 Smart Size Phone Gamepad Bluetooth Controller 2024, November
Anonim
Bluetooth-enabled joystickcontroller
Bluetooth-enabled joystickcontroller

Verbaas je vrienden en verbaas je familie met de "HypnoEllipse", een interactieve A/V-webapp. Bouw een joystickbehuizing met Bluetooth, verbind deze met de webbrowser en voer om de beurt zelfhypnose uit.

Dit is een met Bluetooth verbonden joystick die HID-berichten (toetsenbord/muis) naar een p5.js-schets stuurt, die een draaiende optische illusie en een wervelend geluidsvoorbeeld presenteert.

Stap 1: Benodigde materialen

Benodigde materialen
Benodigde materialen
Benodigde materialen
Benodigde materialen
Benodigde materialen
Benodigde materialen

Gereedschap

soldeerbout

soldeer

draadstrippers

oefening

boor 1/4"

gatenzaag 3/4”

Onderdelen

Bluetooth-compatibele computer

Behuizing

www.adafruit.com/product/905

Bluefruit EZ-Key

www.adafruit.com/product/1535

mini modulair breadboard

www.sparkfun.com/products/12047

jumperdraden

www.sparkfun.com/products/8431

joystick

www.sparkfun.com/products/9182

USB micro-B breakout-kaart

www.sparkfun.com/products/1833

5vdc oplaadbare microUSB-batterij

www.sparkfun.com/products/14167

SOFTWARE

Hypnoellipse web-app

hypnoellipse.netlify.com/

Verwerking 1.5.1 (om EZ Key opnieuw toe te wijzen)

processing.org/download/?processing

Besturing P5 (verwerkingsbibliotheek)

www.sojamo.de/libraries/controlP5/

Firefoxhttps://www.mozilla.org/en-US/firefox/new/

Als je je eigen versie van de Hypnoellipse wilt maken!

p5.js

p5js.org/download/

Atom-editor

atom.io/

Stap 2: Bereid de joystick voor op Bluefruit EZ Key Jumper Wires

Bereid de joystick voor op Bluefruit EZ Key Jumper Wires
Bereid de joystick voor op Bluefruit EZ Key Jumper Wires

Knip en strip het ene uiteinde van elk van de vier paar verschillend gekleurde jumperdraden.

Elk van de kleurenparen komt overeen met de unieke (links, rechts, omhoog, omlaag) joystickrichting - een van elk paar gaat naar een EZ Key-ingang en de andere naar GND.

Met deze geest soldeert u zorgvuldig de jumperdraden aan de joystick.

Stap 3: Behuizing voorbereiden

Behuizing voorbereiden
Behuizing voorbereiden

U hebt een 1/2" gat aan de zijkant van de behuizing nodig voor de microUSB-kabel en vier 1/4" gaten in de bovenklep voor het monteren van de joystick. De joystick zelf heeft een gat van 3/4" nodig.

Ik heb een stuk papier en potlood gebruikt om de gaten te traceren die nodig zijn voor de joystick, voordat ik daadwerkelijk in de bovenkant van de plastic behuizing boor.

Stap 4: Installeer de joystick, Bluefruit EZ Key en USB Breakout Board

Joystick, Bluefruit EZ Key en USB Breakout Board installeren
Joystick, Bluefruit EZ Key en USB Breakout Board installeren
Joystick, Bluefruit EZ Key en USB Breakout Board installeren
Joystick, Bluefruit EZ Key en USB Breakout Board installeren
Joystick, Bluefruit EZ Key en USB Breakout Board installeren
Joystick, Bluefruit EZ Key en USB Breakout Board installeren

Zorg ervoor dat u zorgvuldig bepaalt hoe de vier uniek gekleurde draadjumpers van de joystick worden aangesloten op de pinnen #0 - #4 op de EZ Key. Dit definieert hoe de vier microschakelaars op de joystick de waarden van mouseX en mouseY in de p5.js-schets zullen veranderen.

Zodra u de oriëntatie van uw behuizing hebt bepaald, gaat u met de klok mee rond de joystickverbindingen, bevestigt u de jumpers aan de ingangen van de EZ-sleutel en past u deze zo nodig aan (trial-and-error-methode!).

De grondpennen van de joystick vormen samen met een grondpen van de Bluefruit EZ Key een grondbus.

De aarde en +5vdc van de microUSB-connector zullen ook worden aangesloten op de Bluefruit EZ Key.

Stap 5: EZ Key GUI

EZ Key GUI
EZ Key GUI

U moet een oudere versie van Processing 2.2.1 gebruiken om deze GUI-tool uit te voeren.

De joystick omhoog/omlaag/links/rechts contacten emuleren mouseX- en mouseY-bewegingen om de p5.js-schets (HypnoEllipse) te besturen.

Deze Adafruit-tutorial biedt alle benodigde informatie om de Bluefruit EZ-Key te gebruiken:

learn.adafruit.com/introducing-bluefruit-ez-key-diy-bluetooth-hid-keyboard

Stap 6: Power en koppel Bluefruit EZ Key

Power en koppel Bluefruit EZ Key
Power en koppel Bluefruit EZ Key
Power en koppel Bluefruit EZ Key
Power en koppel Bluefruit EZ Key
Power en koppel Bluefruit EZ Key
Power en koppel Bluefruit EZ Key

Zet de Bluefruit EZ-Key aan en druk op de koppelknop.

U zou de rode LED moeten zien knipperen. Druk vervolgens gedurende 5 seconden op de mini-knop op de EZ Key en laat deze los. Hierdoor wordt de eerdere koppelingsinformatie gewist en kunt u opnieuw koppelen met uw computer. De rode LED gaat nu knipperen.

Schakel Bluetooth in in Systeemvoorkeuren en klik op "Nieuw apparaat instellen".

Laat de assistent rennen totdat hij de EZ-Key-module vindt en weergeeft - selecteer deze en klik op "Doorgaan".

Stap 7: De knoppen op de Bluefruit EZ-Key opnieuw toewijzen

De knoppen op de Bluefruit EZ-Key opnieuw toewijzen
De knoppen op de Bluefruit EZ-Key opnieuw toewijzen

Noteer in de schermafbeelding de mouseX- en mouseY-waarden die zijn gekoppeld aan de sleutelpinnen:

pin 0: x5

pin 1: x-5

pin2: y5

pin3: y-5

Download de ControlP5-bibliotheek:

www.sojamo.de/libraries/controlP5/

Download het zip-bestand met de draadloze remapper-code:

learn.adafruit.com/system/assets/assets/000/013/042/original/GUI_EZKey_remapper_12-20-13.zip?1387568625

Decomprimeer en open de GUI_EZKey_remapper.pde in Processing.

Controleer nogmaals of de Bluefruit aan uw computer is gekoppeld.

Selecteer Sketch -> Run om de grafische remapper te starten.

Kies nu de pinnen en gebruik de menu's om de muisrapporten te selecteren.

Klik vervolgens op "SEND_MAP" om het naar je Bluefruit EZ-Key te sturen.

Een tekstrapport in het verwerkingsvenster moet aangeven dat het een Bluefruit heeft gevonden en dat het gegevens heeft verzonden met een Checksum Match.

Stap 8: Bestaande P5.js-schets beheren met Firefox-webbrowser op volledig scherm

Bestaande P5.js-schets beheren met Firefox-webbrowser op volledig scherm
Bestaande P5.js-schets beheren met Firefox-webbrowser op volledig scherm

Hier is mijn p5.js-schets gehost op Netlify:

hypnoellipse.netlify.com

U kunt met uw muis experimenteren voordat u de joystickinterface bouwt en aansluit om de audiovisuele patroonvariaties te zien en te horen.

Stap 9: Bewerk, herzie of maak uw eigen web-app

Bewerk, reviseer of maak uw eigen web-app
Bewerk, reviseer of maak uw eigen web-app

Hier is de code voor de web-app zelf:

github.com/dkonha01/HypnoEllipse

Je kunt eenvoudig je eigen versie ontwikkelen door de waarden in regels 44, 51 en 66 van sketch.js te veranderen - bekijk de becommentarieerde regels voor voorbeelden hiervan.

Aanbevolen: