Kako postaviti Arduino web kontrolu bez ethernet štita

Posljednjih nekoliko tjedana predao sam nadzor nad osvjetljenjem raspoloženja u svom studiju gledateljima tijekom prijenosa uživo Technophilia Podcast - rezultate toga možete vidjeti u snimljenoj epizodi ovdje. Danas sam mislio da ću točno objasniti kako sam to postigao koristeći malo JavaScript, Obrada, i an Težak. Metoda koju ću navesti ne zahtijeva Ethernet štit za vaš Arduino, a ja ću vam pružiti pune uzorke koda koje također možete koristiti.

zahtjevi:

• Težak
• Svjetla za kontrolu odgovarajućeg kruga na Arduinu; pogledajte moj priručnik za pozadinsko osvjetljenje pozadine Izgradite vlastiti dinamički ambijentalni osvjetljenje za medijski centar Izradite vlastiti dinamički ambijentalni osvjetljenje za medijski centar Ako gledate puno filmova na računalu ili medijskom centru, siguran sam da ste se suočili s dilemom rasvjete ; potpuno isključite sva svjetla? Držite li ih u punoj eksploziji? Ili ... od prošlog tjedna za krug dijagrama i kvar komponenata.
• Obrada softvera na računalu ili Macu
• Objašnjeni različiti oblici hostinga web stranica [Objasnio tehnologiju] Objašnjeni različiti obrasci hostinga [Razjašnjena tehnologija]
• Osnovne vještine kodiranja JavaScript i PHP, mada ću vam pružiti cijeli kôd koji možete prilagoditi.

Postavljanje Arduino-a

Prvo, vratite se na udžbenik prošlih tjedana za Arduinovu stranu stvari Izgradite vlastitu dinamičku ambijentalnu rasvjetu za medijski centar Izradite vlastitu dinamičku ambijentalnu rasvjetu za medijski centar Ako gledate puno filmova na računalu ili medijskom centru, ja Siguran sam da ste se suočili s dilemom rasvjete; potpuno isključite sva svjetla? Držite li ih u punoj eksploziji? Ili… ; kôd koji koristimo je identičan jer koristim isti RGB upravljački krug LED traka, tako da ovdje neću ponoviti. Da sumiram, Arduino će čitati RGB vrijednosti s USB serijske veze na računalo.

Aplikacija za obradu

Aplikacija za obradu koju koristimo vrlo je jednostavna (PASTEBIN); koristi osnovnu loadStrings () funkcija za čitanje tekstualne datoteke pohranjene na udaljenoj web adresi - u ovom slučaju to sam koristio http://jamesbruce.me/lights/LED.txt. Napravite primjernu tekstualnu datoteku na svom web domaćinu kako biste to testirali i prilagodite je. Tekstualna datoteka treba sadržavati samo 3 retka vrijednosti za R, G i B. Također ćete morati promijeniti serijski ulaz na sve na koji je vaš USB spojen. Kao i prije, prva stvar koju će aplikacija učiniti jest ispisati popis serijskih portova na konzolu - provjerite je li ispravna za upotrebu, a zatim je ponovo pokrenite. Vaša Arduino LED traka trebala bi zasvijetliti bez obzira na slučajne vrijednosti koje ste dodali u tekstualnu datoteku.

Arduino web kontrola

Na strani web kontrole izabrao sam jednostavan dodatak za odabir jQuery boja pod nazivom Spectrum; ima i drugih vani, ali smatrao sam da je ovo jednostavno kao što je potrebno i da također radi na dodir na mobitelu, dok drugi koji sam pokušao ne bi. Postaviti spectrum.js i spectrum.css datoteke u istom direktoriju kao i sve ostalo (Napravio sam podimenik / svjetla na svom poslužitelju da bi stvari bile čiste). PHP ćemo koristiti i za prikaz web kontrole i za rukovanje LED.txt pisanje datoteke ako su varijable date u zahtjevu POST. Kad korisnik posjeti ovu stranicu i odabere boju, šalje AJAX zahtjev s varijablama boje natrag u sebe. To zadržava cijelu stvar koja se nalazi u jednoj datoteci. Potpuni PHP / HTML možete pronaći na ovom pastebinu (spremite kao index.php u podmap zajedno s ostalim datotekama), ali dopustite mi da dam kratki pregled uključenog koda.

1. PHP: Otkrijte postoji li varijabla posta koja se zove "boje". Ako je to slučaj, otvorite datoteku LED.txt za pisanje i prebrisati s varijablama posta.
2. HTML: Uvoz jQuery, Spectrum.js, i Spectrum.css
3. JavaScript: getRGB funkcija vraća niz RGB vrijednosti razdvojenih zarezima s obzirom na različite formate CSS boja, kao što su #aaaaa.
4. JavaScript: izradite kontrolu spektra i dodajte AJAX poziv odabranom događaju izmijenjene boje. AJAX poziva ovu datoteku upravljača s RGB vrijednostima koje daje kontrola.

Konačno, provjerite svoje LED.txt datoteku može upisati poslužitelj. 655 ili 777 dopuštenje bi to trebalo učiniti. Pokrenite datoteku i pokrenite je; aplikacija za obradu trebat će se pokrenuti i datoteku će osvježavati svake sekunde. Ako se alat za odabir boja uopće ne pojavi na stranici, provjerite na JavaScript konzoli da ima grešaka.

Zamke i daljnji rad

Kao što sam napomenuo, ova metoda nije koristila Ethernet štit namjerno, tako da ga je svatko sa osnovnim hostingom mogao postaviti vrlo brzo i jeftino. Međutim, to ne znači da moramo koristiti aplikaciju Processing da bismo djelovali kao gateway za dohvaćanje podataka; bez pokretanja računala jednostavno neće raditi. Dodavanjem Etherneta ili WiFi štita mogli bismo premjestiti Arduino bilo gdje bez veze na računalo i daljinsko donošenje naredbi ili ih gurnuti ravno u Arduino s malim prosljeđivanjem priključaka. O tome ću se pozabaviti neki drugi dan. Tu je i problem istodobnosti - način na koji smo ga postavili je da će se datoteka jednostavno prebrisati svaki put kad netko odabere novu boju, a o kašnjenju između promjena boja odlučuje se u kodu za obradu. Ako želite imati puno korisnika koji stalno prilagođavaju boju, sustav čekanja u redu s bazom podataka može biti prikladniji; Korištenje ravne datoteke za pohranjivanje vrijednosti može rezultirati ignoriranjem nekih promjena ako se ažuriranja događaju češće nego što datoteku osvježavamo. Tada, naravno, nemate pojma da li je to tada i uspjelo, osim ako niste gledali naš prijenos uživo. U idealnom slučaju, web kamera bi bila postavljena i ugrađena na kontrolnu stranicu. Kao tehnološki demo, mislim da je ovo prilično fenomenalno; Nadam se da možete vidjeti potencijal za daljinsko upravljanje u osnovi bilo čega preko Interneta putem Arduino-a. Justin mi je predložio da predamo kontrolu nad mojim pećnica; Odbio sam. Imate li zanimljivih projekata za koje mislite da bi vam ovo moglo pomoći?