
Mark Lucas
0
5041
727
Przez kilka ostatnich tygodni przekazałem kontrolę nastrojowego oświetlenia w moim studiu widzom podczas transmisji na żywo Technophilia Podcast - wyniki tego można zobaczyć w nagranym odcinku tutaj. Dzisiaj myślałem, że wyjaśnię dokładnie, jak to zrobiłem, używając trochę JavaScript, Przetwarzanie, i an Arduino. Metoda, którą przedstawię, nie wymaga osłony Ethernet dla twojego Arduino, i dostarczę pełne próbki kodu, których również możesz użyć.
Wymagania:
- Arduino
- Światła do sterowania odpowiednim obwodem w Arduino; zobacz mój samouczek podświetlania otoczenia Zbuduj własne dynamiczne oświetlenie otoczenia dla centrum multimedialnego Zbuduj własne dynamiczne oświetlenie otoczenia dla centrum multimedialnego Jeśli oglądasz dużo filmów na swoim komputerze lub centrum multimedialnym, jestem pewien, że napotkałeś dylemat dotyczący oświetlenia ; czy całkowicie wyłączasz wszystkie światła? Czy utrzymujesz je w pełnej krasie? Lub… z zeszłego tygodnia na schemat połączeń i podział komponentów.
- Oprogramowanie do przetwarzania na komputerze PC lub Mac
- Hosting stron internetowych Wyjaśnienie różnych form hostingu stron internetowych [Technologia wyjaśniona] Hosting różnych form hostingu stron internetowych - wyjaśnienie technologii]
- Podstawowe umiejętności kodowania w JavaScript i PHP, ale podam pełny kod, który możesz dostosować.
Konfiguracja Arduino
Po pierwsze, powróć do samouczka z ostatnich tygodni po stronie Arduino. Zbuduj własne dynamiczne oświetlenie otoczenia dla centrum multimedialnego Zbuduj własne dynamiczne oświetlenie otoczenia dla centrum multimedialnego Jeśli oglądasz dużo filmów na swoim komputerze lub centrum multimedialnym, ja jestem pewien, że stanąłeś przed dylematem dotyczącym oświetlenia; czy całkowicie wyłączasz wszystkie światła? Czy utrzymujesz je w pełnej krasie? Lub…; kod, którego będziemy używać, jest identyczny, ponieważ używam tego samego obwodu sterującego taśmą LED RGB, więc nie powtórzę tego tutaj. Podsumowując, Arduino będzie odczytywać wartości RGB z połączenia szeregowego USB z komputerem.
Aplikacja do przetwarzania
Aplikacja do przetwarzania, której będziemy używać, jest bardzo prosta (PASTEBIN); używa podstawowego loadStrings () funkcja do odczytu pliku tekstowego zapisanego pod zdalnym adresem internetowym - w tym przypadku użyłem http://jamesbruce.me/lights/LED.txt. Utwórz przykładowy plik tekstowy na swoim hoście, aby go przetestować i odpowiednio go dostosuj. Plik tekstowy powinien mieć tylko 3 linie wartości dla R, G i B.. Musisz także zmienić port szeregowy na cokolwiek, do czego podłączony jest twój USB. Tak jak poprzednio, pierwszą rzeczą, którą zrobi aplikacja, jest wyświetlenie listy portów szeregowych do konsoli - zaznacz to, aby użyć właściwego portu, a następnie uruchom ponownie. Taśma LED Arduino powinna świecić dowolnymi losowymi wartościami dodanymi do pliku tekstowego.
Arduino Web Control
Po stronie kontroli sieci wybrałem prostą próbnik kolorów jQuery o nazwie Spectrum; są inni, ale czułem, że było to tak proste, jak było potrzebne, a także działa z dotykiem na telefonie komórkowym, podczas gdy inne, których próbowałem, nie zrobiłyby tego. Umieść widmo.js i widmo.css pliki w tym samym katalogu, co wszystko inne (Stworzyłem podkatalog / lights na moim serwerze, aby utrzymać porządek). Będziemy używać PHP zarówno do wyświetlania kontroli sieci, jak i obsługi LED.txt zapis pliku, jeśli zmienne są podane w żądaniu POST. Gdy użytkownik odwiedza tę stronę i wybiera kolor, wysyła do siebie żądanie AJAX ze zmiennymi kolorów. Dzięki temu całość jest zawarta w jednym pliku. Pełne PHP / HTML można znaleźć w tym pastebin (zapisz jako index.php w podkatalogu wraz z innymi plikami), ale pozwólcie, że przedstawię krótki zarys tego kodu.
- PHP: Wykryj, czy istnieje zmienna wpisu o nazwie „kolory”. Jeśli tak, otwórz plik LED.txt do zapisu i zastąp zmiennymi wpisu.
- HTML: Import jQuery, Spectrum.js, i Spectrum.css
- JavaScript: funkcja getRGB zwraca tablicę wartości RGB oddzielonych przecinkami przy różnych formatach kolorów CSS, takich jak #aaaaa.
- JavaScript: utwórz kontrolkę Spectrum i dołącz wywołanie AJAX do wybranego zdarzenia o zmienionym kolorze. AJAX wywołuje ten plik procedury obsługi z wartościami RGB podanymi przez kontrolkę.
Wreszcie, upewnij się, że LED.txt plik jest zapisywalny przez serwer. ZA 655 lub 777 pozwolenie powinno to zrobić. Uruchom plik i wypróbuj; aplikacja Przetwarzanie będzie musiała działać i będzie odświeżać plik co sekundę. Jeśli próbnik kolorów nie pojawia się nawet na stronie, sprawdź konsolę JavaScript pod kątem błędów.
Pułapki i dalsza praca
Jak wspomniałem, ta metoda nie wykorzystywała celowo tarczy Ethernet, więc każdy, kto ma podstawowy hosting stron internetowych, może ustawić ją bardzo szybko i niedrogo. Oznacza to jednak, że musimy użyć aplikacji Przetwarzanie, aby działać jako brama do pobierania danych; bez działającego komputera po prostu nie będzie działać. Dzięki dodatkowej osłonie Ethernet lub WiFi możemy przenieść Arduino w dowolne miejsce bez połączenia z komputerem i zdalnie pobierać polecenia lub przekazywać je bezpośrednio do Arduino z niewielkim przekierowaniem portów. Zajmę się tym następnego dnia. Istnieje również kwestia współbieżności - sposób, w jaki go skonfigurowaliśmy, polega na tym, że plik zostanie po prostu nadpisany za każdym razem, gdy ktoś wybierze nowy kolor, a opóźnienie między zmianami kolorów jest określone w kodzie przetwarzania. Jeśli chcesz, aby wielu użytkowników stale dostosowywało kolor, bardziej odpowiedni może być system w kolejce z bazą danych; użycie płaskiego pliku do przechowywania wartości może spowodować zignorowanie niektórych zmian, jeśli aktualizacje będą występować częściej niż podczas odświeżania pliku. W takim razie oczywiście nie możesz wiedzieć, czy to zadziałało, chyba że oglądałeś naszą transmisję na żywo. Idealnie byłoby ustawić kamerę internetową i osadzić ją na stronie sterowania. Jako demo technologiczne myślę, że jest to całkiem niesamowite; Mam nadzieję, że zobaczysz potencjał zdalnego sterowania w zasadzie wszystko przez Internet za pośrednictwem Arduino. Justin zasugerował, że przekażemy moją kontrolę piekarnik; Odmówiłem. Czy masz jakieś ciekawe projekty, które mogą pomóc?