Wireless Halloween ljudeffekter (5 / 6 steg)

Steg 5: HTML-koden för tablet

HTML/Javascript koden jag använde för tabletten är kopplad till detta steg. JQuery Mobile används för att skapa en enkel 2 sida användargränssnitt. Första sidan visar status för ansökan, medan andra sidan innehåller inställningarna.

Inställningarna är användbara för att fånga specifika för din Imp Imp Agent URL. Du behöver bara ange teckensekvensen efter URL som Javascript-koden läggs automatiskt bas-URL: se nedan

'https://agent.electricimp.com/' + halloweenSettings.URLKey

APIKey är en grundläggande säkerhetsmekanism för att säkerställa att om din URL äventyras, du fortfarande kan förhindra obehörig åtkomst till dina API. Agent koden körs i Imp molnet kontrollerar alla inkommande begäranden att se till att nyckeln matchar. Nyckeln kan vara någon random alfanumerisk sträng - du behöver bara se till att strängen är samma i Agent kod och HTML-koden. (API-nyckel idé från http://forums.electricimp.com/discussion/comment/...

Javascript-kod begär regelbundet PIR sensor status från den integrerade havspolitiken. När PIR har detekterat rörelse, genererar klientkoden ett slumptal som är ett index i en matris med ljudeffekter. På mobila enheter läses inte ljud för att bevara din mobildata panna så en user interface element krävs att starta dem lastning. Knappen "Tryck för att starta" initierar inläsningen av alla ljudeffekter och döljs sedan. Detta initierar också polling cykeln för ajax samtal till imp agent för PIR sensor status. De ljud som jag använde är alla allmän egendom och var finns på soundbible.com. Det finns många offentliga webbplatser där ute och du behöver inte begränsa dig till 10 ljudeffekter... Använd så många som du behöver!

Polling cykeln format JSON begäran för Imp Agent. URL: en innehåller en tidsstämpel för att förhindra webbläsaren från att cache-lagra utgående begäran.

Svar från Imp Agent är status på PIR-sensorn. Om sensor status är "1" då ett slumptal genereras till index i tabellen ljud.

Funktionen PlaySound spelar ljudet och visar aktuellt ljud på skärmen. Detta är användbart för felsökning och också ger dig något att titta på när du blir uttråkad!

Om du har en webbserver, kan du enkelt kopiera filer som tillhandahålls med detta steg till webbservern, peka din Tablet PC/PC/Smartphone till URL och du är klar. Om du inte har en webbserver och du använder en PC eller laptop, kan du kopiera filer direkt till en mapp och öppna filen i.html från mappen du använt.

Om du inte använder en webbserver, kan du kopiera filerna direkt till tabletten. Detta är ett lite knepigt eftersom sökvägen till mappen på tabletten inte är självklart. Med en Android tablett ansluten till en PC USB-port, kommer du att kunna se tablettens mappstrukturen. Lägga till en mapp som heter Halloween och kopiera alla filer till den mappen. Använda Google Chrome på tabletten, använda file:/// protokollet öppna filen i.html.

För att hitta sökvägen på Android tabletten, ladda ner någon av de fria fil Explorer program från Android App Store och navigera till mappen Halloween. File Explorer app kommer att avslöja sökvägen till mappen. Exempelvis file:///storage/emulated/0/halloween/i.html