Anslut enheten Carriots till Paniks Status styrelsen - Enhetsstatus (4 / 8 steg)

Steg 4: om status.html



Låt oss gå igenom varje fil i din web app, efter allt detta är limmet som möjliggör anslutande Carriots och Status styrelsen . När du förstår hur dessa delar av arbetet som system, kan du ändra dem för att skapa egna widgets för Status styrelsen.

Kanske är den enklaste filen att förstå status.html. Denna fil är i huvudsak mini webbsidan som kallas av Status styrelsen. Just denna fil dock ställs in som en mall i kolven. Det innebär att data från vår web ansökan fylls i den här mallen innan den serveras.

Just denna fil är byggd baserat på panik egen "människor i rymden" exempel. I Status Board är en DIY Panel i grunden en mini webbsida som är speciellt formaterad. Vår webbsida måste därför vara korrekt formaterad. Om du vill veta mer, kan du hitta den DIY Panel guide här. En stor sak om denna mini webbformat är att det betyder du kan också visa den här filen i en webbläsare om du inte använder Status styrelsen. Mer om det senare.

Speciell formatering är i CSS av webbsidan. CSS är inbyggd i HTML-filen i stället för att kräva en separat CSS-fil.

Det finns också ett par javascripts i filen. Den första manus, kallas jstimezonedetect, hjälper DIY panelen för att få mottagande systemets tidszon namn. Tidszonen är nödvändigt så att vår webbapplikation kan automatiskt konfigurera den tiden visas i Status styrelsen widget. Javascript får Tidszonens namn från en standardlista med namn och skickar den till application server som en parameter i en AJAX uppdateringsbegäran.

Övriga funktioner script skapa en AJAX samtal som uppstår varje så ofta, i vårt fall är det 60 sekunder. Denna uppdatering uppmaning är en särskild del av vår applikationsserver som kommer tillbaka en JSON svar i stället för en HTML-webbsida. Det vill säga returnerar den endast data. När skriptet tar emot ett svar, data analyseras och uppdateras fälten så att widgeten visar de senaste uppgifterna.

Minns hur jag sa att du inte behöver en iPad att prova denna widget? Här är varför. Panelen DIY är egentligen bara en mini webbsida med vissa specialformatering. Det betyder bara om något innehåll kan visas i Status styrelsen. Eller, för den delen, i en webbläsare. Nu är del av den specialformatering en genomskinlig bakgrund så att Status styrelsen kan återge en lämplig bakgrund. En genomskinlig bakgrund med vit text oftast kommer inte se bra ut i en vanlig webbläsare, så att en särskild parameter för "? skrivbordet" kan läggas till i slutet av Webbadressen för att visa bilden i webbläsaren. Se bilder i det här steget för ett exempel.

Vidare till nästa fil.

Se Steg
Relaterade Ämnen

Ansluta Arduino Uno till Android via Bluetooth

I detta projekt används en seriell Bluetooth-modul för att skapa en anslutning mellan Arduino Uno och en Android app som jag skapat med MIT App Inventor.Arduino lyssnar efter kommandon att tända några lysdioder eller visa sin status. Dessutom en time...

Montering och ansluter din Edison till Wyliodrin

Den Wyliodrin plattformen kan du bygga program med block. Detta instructable visar dig hur du förbereder Edison styrelsen att ansluta med Wyliodrin-plattformen.Steg 1: Förbereda styrelsens Edison Edison är en liten dator. Det har anslutningar för mak...

Hur: Anslut din Wiimote till datorn via Bluetooth

Visste du den Wiimotes kapacitet nå långt utanför de användningsområden Nintendo är att begränsa det till? Det är sant, och i denna tutorial kommer jag visa dig hur du ansluter din Wiimote till datorn och öppna upp ett obegränsat utbud av möjligheter...

Ansluta en Linkit till ubidots för IoT

IoT är USP av denna styrelse. I detta instructable, jag kommer att samla avläsningar av temperatur och höjd från MS5607 sensor och ladda upp den till webbplatsen ubidots och se hur det kan användas för att i världen av internetSteg 1: förutsättningar...

HD44780 LCD till I2C adapter styrelsen för buss pirat

billigt tecken LCD-skärmar baserat på HD44780 chipset kommer i olika storlekar: 2 x 16, 4 x 20, etc. Dessa skärmar har två standardgränssnitt lägen, 4 och 8 bitars parallellt. 8 bitar kräver sammanlagt 11 data linjer, 4 bitar kräver 7 (6 för lässkydd...

Hur man ansluta flera enheter till en TV (Xbox, Wii, DVD, Blu-Ray, etc)

stort tack till min vän Rob för att hjälpa mig få samarbetar med YouTube!I den här videon Visa jag hur man ansluta flera enheter till en High Definition TV (HDTV) med en "komponent växel". En komponent växel kan du ansluta flera enheter till en...

Hur till: ansluta din Arduino till Internet som en webbserver

SAKERNAS INTERNET... < kö blixtar och åska >Det är vad alla coola barnen gör dessa dagar. Varför ska de ha allt roligt? Låt oss ställa in en Arduino som en webbserver som vem som helst, var som helst kan visa. Varför skulle vi göra en sådan sak? Möj...

Hur du ansluter raspberry pi till bärbar dator skärm

Anledningen till varför jag kom med detta Svårbemästrade är att: en dag mig tillsammans med mina vänner kämpar för att arbeta på raspberry pi, eftersom vi inte hade någon HDMI/AV skärmar. Därför, jag kom upp med den här guiden så att andra som också...

Ansluta en gitarr till en Ipad

Hej i detta instructable jag ska visa dig hur du ansluter din gitarr till din ipad!Om du ansluter din gitarr till din ipad kan du: Använd din ipad som en förstärkare, finjustera det enkelt, spela in din sköna gitarr låtar på din ipadSteg 1: Du behöve...

Ansluta din elgitarr till din dator Analog stil

ljudgränssnitt världen är en ogudaktiga ogudaktiga. Detta instructable kan du kringgå USB, firewire eller Thunderipple gränssnitt och använda en mindre ekonomiskt beskatta metod för praktiskt taget sparkar sylt ute på din ensam.Men varför i hela frid...

Ansluta en mikrofon till en högtalare, PA System

med detta Instructable vi ansluta en karaoke typ mic till en powered speaker för sjunger främst.Jag hade en gammal powered speaker sorten med bas låda och de 2 andra högtalarna separat från basen och en gammal mikrofon från en karaoke-spelare.Så jag...

Ansluta en 360 till PC-skärm (via DVI)

enkelt sätt att ansluta en 360 till en bildskärm via dviSteg 1: köpa adaptrar det finns två adaptrar som du behöver och en HDMI-kabel som du kan behöva köpa1st adapter hdmi till dvi och den 2: a är det 3mm till röda och vita kontakterSteg 2: ändra 36...

Anslut ditt projekt till Internet.

Kontrollerar dina projekt via Internet eller använda data från en webbsida med E-Net modul, en addon för Propeller plattform.Modulen E-Net är ett open source projekt som använder mikrochip ENC28J60 ge Propeller plattformen möjligheten att bli inbädda...

Hur du ansluter din iPad till A Chromecast

i detta instructable jag ska visa dig hur du ansluter din iPad till din Chromecast.Steg 1: Först få Chromecast App Steg 2: Öppna App När du har öppnat app, det bör ta dig igenom en process för att ställa in din chromecastSteg 3: Kör din Chromecast Nä...

Ansluta en telefonlur till din mobiltelefon

kolla författarens hemsida, http://www.neatinformation.com/, för massor av intressanta artiklar. Om du länkar till detta instructable från en annan webbplats, vänligen inkludera en länk till webbplatsen Ordentlig Information .Obs - du behöver grundlä...

Ansluta Arduino Uno till Crystalfontz 16 x 2 OLED med bara 4 trådar!

Dessa moduler är ganska trevligt. De är i samma storlek som våra CFAH1602C serien 16 x 2 tecken LCD-moduler, och tunnare som en bonus. Den OLED kontrasten är fantastiska, och de har en skarp blick som är svårslagen. En annan trevlig sak är att de har...

Ansluta ESP8266-01 till Arduino UNO / MEGA och BLYNK

Detta är en handledning för att visa dig hur du flash en firmware-ESP8266-01 och ansluter till Blynk med hjälp av en ESP8266 - 01 som en Arduino wifi sköld.Maskinvara som behövs:* Arduino Uno/Mega* Hoppare ledningar* USB A till USB B-kabelESP8266-01P...

Ansluta en telefon till ditt ljudkort

kolla författarens hemsida, http://www.neatinformation.com/, för massor av intressanta artiklar. Om du länkar till detta instructable från en annan webbplats, vänligen inkludera en länk till webbplatsen Ordentlig Information .Obs - du behöver grundlä...

Hur du ansluter din iPod till din bilstereo

jag har en äldre bil som inte har ett direkt sätt att ansluta min iPod till min bilstereo. Jag trodde att FM transistorerna var det bästa sättet att ansluta min iPod, men efter slösa $50 på en, jag trodde det skulle vara värt mödan att dela mina resu...