Edmund Richardson
0 
4406
1283
I de sidste par uger overleverede jeg kontrol over stemningsbelysningen i mit studie til seerne under direktesendelsen af Technophilia Podcast - du kan se resultaterne af det i den indspillede episode her. I dag troede jeg, at jeg ville forklare nøjagtigt, hvordan jeg opnåede det ved hjælp af lidt JavaScript, Forarbejdning, og en Arduino. Metoden, jeg skitserer, kræver ikke et Ethernet-skjold til din Arduino, og jeg vil give fuld kodeprøver, som du også kan bruge.
Krav:
- Arduino
- Lys til kontrol af det passende kredsløb på Arduino; se min tutorial for baggrundsbelysning Byg din egen dynamiske omgivelsesbelysning til et mediecenter Byg dit eget dynamiske omgivelsesbelysning til et mediecenter Hvis du ser en masse film på din pc eller mediecenter, er jeg sikker på, at du har stået over for lysdilemmaet ; slukker du alle lys helt? Holder du dem på fuld eksplosion? Eller ... fra sidste uge til et kredsløbsdiagram og opdeling af komponenter.
- Behandler software på din pc eller Mac
- Webstedshosting De forskellige former for webstedshosting forklaret [Teknologi forklaret] De forskellige former for webstedshosting forklaret [Teknologi forklaret]
- Grundlæggende kodningsfærdigheder med JavaScript og PHP, selvom jeg giver den fulde kode, som du kan tilpasse.
Arduino-opsætning
Først op, se tilbage til sidste uges tutorial til den Arduino side af tingene Byg din egen dynamiske omgivelsesbelysning til et mediecenter Byg din egen dynamiske omgivelsesbelysning til et mediecenter Hvis du ser en masse film på din pc eller mediecenter, er sikker på, at du har stået over for lysdilemmaet; slukker du alle lys helt? Holder du dem på fuld eksplosion? Eller ...; koden, vi bruger, er identisk, da jeg bruger det samme RGB LED-stripkontrolkredsløb, så jeg vil ikke gentage det her. For at opsummere læser Arduino RGB-værdier fra USB-seriens forbindelse til computeren. 
Behandler app
Processing-appen, vi bruger, er meget enkel (PASTEBIN); det bruger en grundlæggende loadStrings () funktion til at læse en tekstfil, der er gemt på en ekstern webadresse - i dette tilfælde har jeg brugt http://jamesbruce.me/lights/LED.txt. Opret en eksempeltekstfil på din webhost for at teste dette og juster dem i overensstemmelse hermed. Tekstfilen skal blot være 3 værdelinjer for R, G og B. 
Du bliver også nødt til at ændre den serielle port til, hvad din USB-forbindelse er tilsluttet. Som før er den første ting, appen vil gøre, at sende en liste over serielle porte til konsollen - kontroller, om dette er det rigtige, der skal bruges, og kør derefter igen. Din Arduino LED-strip skal lyse med uanset tilfældige værdier, du tilføjede til tekstfilen.
Arduino Web Control
På webkontrollsiden valgte jeg et simpelt farvevælger jQuery plugin kaldet Spectrum; der er andre derude, men jeg følte, at dette var så enkelt som nødvendigt, og fungerer også med touch på en mobil, mens andre, jeg prøvede, ikke ville. Placer spectrum.js og spectrum.css filer i det samme bibliotek som alt andet (Jeg lavede en /-lys undermappe på min server for at holde tingene rene). 
Vi bruger PHP til både at vise webkontrollen og håndtere LED.txt filskrivning, hvis der er angivet variabler i POST-anmodningen. Når brugeren besøger denne side og vælger en farve, sender den en AJAX-anmodning med farvevariablerne tilbage til sig selv. Dette holder det hele inde i en fil. Den fulde PHP / HTML kan findes på denne pastebin (gem det som index.php i en undermappe sammen med de andre filer), men lad mig give en kort oversigt over den involverede kode.
- PHP: Find, om der er en postvariabel kaldet 'farver'. Åbn i så fald LED.txt-filen til skrivning og overskriv med postvariablerne.
- HTML: Import jQuery, Spectrum.js, og Spectrum.css
- JavaScript: getRGB-funktion returnerer en række komma-adskilte RGB-værdier givet en række forskellige CSS-farveformater, f.eks #aaaaa.
- JavaScript: Opret Spectrum-kontrol og vedhæft et AJAX-opkald til den valgte farve, der er ændret. AJAX kalder denne behandlingsfil med de RGB-værdier, der er givet af kontrollen.
Endelig skal du sørge for din LED.txt filen kan skrives af serveren. EN 655 eller 777 tilladelse skal gøre det. Start filen og giv den en gang; Processing-appen skal køre og opdaterer filen hvert sekund. Hvis farvevælgeren ikke engang vises på siden, skal du kontrollere JavaScript-konsollen for fejl.
Faldgruber og videre arbejde
Som jeg nævnte, brugte denne metode ikke et Ethernet-skjold med vilje, så alle med grundlæggende webstedshosting kunne få den opsat meget hurtigt og billigt. Dette betyder dog, at vi er nødt til at bruge Processing-appen til at fungere som en gateway til hentning af data; uden at pc'en kører, fungerer den simpelthen ikke. Med tilføjelsen af et Ethernet- eller WiFi-skjold kunne vi flytte Arduino overalt uden at være bundet til en pc, og enten hente kommandoer eksternt eller skubbe dem direkte til Arduino med en lille portvideresendelse. Jeg adresserer dette en anden dag. Der er også et spørgsmål om samtidighed - den måde, vi har den oprettet på, er, at filen simpelthen vil blive overskrevet, hver gang nogen vælger en ny farve, og forsinkelsen mellem farveændringer afgøres i behandlingskoden. Hvis du vil have masser af brugere, der konstant justerer farven, kan et køsystem med en database muligvis være mere passende; at bruge en flad fil til at gemme værdierne kan resultere i, at nogle ændringer ignoreres, hvis opdateringerne forekommer hyppigere, end vi opdaterer filen. Derefter har du selvfølgelig ingen måde at vide, om det endda fungerede lige så, medmindre du så vores live udsendelse. Ideelt set ville der være et webcam oprettet og indlejret på kontrolsiden. Som en tech-demo synes jeg dog, det er ret fantastisk; Jeg håber, du kan se potentialet for fjernbetjening stort set alt over internettet via en Arduino. Justin foreslog, at vi overleverer kontrol over min ovn; Jeg afviste. Har du nogle interessante projekter, du tror, at dette kan hjælpe med?