Visa Vädret Med Serverlösa och Färger

0
43

Jag gillar att jogga. Ibland är det kallt ute. Ibland är det kallt ute, men det ser ut som det är det inte. Solen skiner, fåglarna kvittrar. Då du steg utanför i shorts och en t-shirt och inser att du har ungefär 2 minuter innan exponering sätter in.

Jag bestämde mig för att lösa detta första problem med hjälp av en glödlampa) för att visa en viss färg baserat på vad temperaturen utanför. Det fungerar bättre än jag förväntade mig, och det är att säga något eftersom oftast ingenting fungerar som jag vill.

Detta var ett kul projekt att bygga, och eftersom det i huvudsak är en tjänst som körs på en timer, det är en perfekt användningsfall för Serverlösa.

Nu kanske du tänker, “äh, skulle det inte vara lättare att bara kolla vädret?” Tja, skulle det, men då skulle jag inte ha en ursäkt för att köpa en dyr glödlampa eller skriva en artikel med ordet “Serverlösa.”

Så låt oss titta på hur du kan bygga din egen Vädret Lampa. Den slutliga koden är inte komplicerad, men den har en del intressanta bitar som är värt att notera. Förresten, nämnde jag att det är Serverlösa?

Byggnaden Vädret Lampa

Det första du kommer att behöva är glödlampan. Du kan inte ha en Väder-Lampa sans-lampa. Säga ordet “lampa” högt ca 10 gånger och du kommer att märka vad en bisarr ord det är. Lampa, glödlampa, lampa, lampa — se? Konstigt.

Jag använder LIFX Mini Färg. Det är inte *för* dyra, men viktigare är att den har ett API som är vidöppen.

API har två metoder för autentisering. Den första innehåller ordet “OAuth” och jag är redan ledsen att du var tvungen att läsa det. Oroa dig inte, det finns ett enklare sätt som inte medför OAu…. det som inte kommer att namnges.

Det andra sättet är att registrera en ansökan med LIFX. Du får tillbaka en nyckel och allt du behöver göra är att förmedla det viktiga med varje HTTP-begäran. Det är vad jag använder för denna demo.

Till exempel, om vi ville byta glödlampa färg till blått, och vi kan bara passera färg: blå /staten slutpunkt.

API stöder ett par olika färg, format, inklusive heter färger (som röd, blå), hex-värden, RBG, Kevlin, ljusstyrka färgton och mättnad. Detta är viktigt eftersom det faktorer i vad som visade sig vara den svåraste delen i det här projektet: att vrida temperatur i färg.

Representerar Temperaturen Med Färg

Om du någonsin sett en väder rapport, kommer du att vara förtrogen med det sätt som meteorologi representerar väderförhållanden med färg på en karta.

Vanligtvis görs detta för att visualisera nederbörd. Du har förmodligen sett att illavarslande grön remsa av stormar slå ned på dig på en väderkarta medan du försöker lista ut om du ska få i badkaret för att du är i vägen för en tornado. Eller kanske är det bara för oss alla olyckliga själar här i America ‘ s Tornado Alley.

Färg är också används för att representera temperatur. Detta är exakt vad jag ville göra med lampan. Den tuffa sak är att det inte verkar vara ett standardiserat sätt att göra detta. Vissa kartor visa det som solida färger i band. I detta fall, blå kan representera bandet från 0℉ – 32℉.

Andra har det som en ” gradientskala som är mer exakta. Detta är vad jag var ute efter för Väder Lampa.

Mitt första hugg på att lösa detta var bara för att Google “temperatur färg skala” och andra olika iterationer för att söka sikt. Jag fick tillbaka en hel del information om Kelvin.

Kelvin är en representation av temperaturen i en färg. Bokstavligt. För någon ljuskälla (lampa, solen, ect) den faktiska temperaturen för källan kommer att påverka färgen på det ljus den avger. En eld brinner med en gul-röd färg. Varmare att elden blir, ju mer den rör sig mot vita. Därav ordspråket, “white hot”. Så om någon någonsin säger “red hot” du kan korrigera dem framför alla, eftersom den som inte älskar en pedantisk jerk?

Den LIFX-lampa stöder Kelvin, så du kanske tror att detta skulle fungera. Efter alla, detta är Kelvin-skalan….

Problemet är att det är helt enkelt inte tillräckligt med färgvariation eftersom dessa inte är verkliga färger, utan snarare en nyans av färg som ett ljus som avger bygger på att det är “temperatur.” Här är Kelvin färg hjul som kommer med LIFX app.

Dessa färger är knappt urskiljbara från varandra på lampan. Inte precis vad jag var ute efter.

Det lämnar mig med att försöka konvertera färg till antingen Hex, RGB eller något annat format. Detta är svårt eftersom var vill du börja? Jag tillbringade en pinsam tid justera RGB-skalan värden mellan blått för kallt (0, 0, 255) och rött för varmt (255, 0, 0). Det var vid denna tid som det gick upp för mig att det kanske HSL skulle vara en bättre väg att gå här. Varför? Eftersom nyans är en hel del lättare att förstå.

Nyans

Hue är en representation av färg på en skala mellan 0 och 360. Det är därför vi ofta ser färgen som representeras på ett hjul (360°). Det är en stor förenkling, men om du vill att jag ska börja prata om våglängder, låt oss med denna definition.

Nyans färg hjulet ser ut så här….

Om vi plattar ut, det är lättare att resonera om.

Vi är redo att konvertera temperatur och färg. Det första vi måste göra är att räkna ut en inställd temperatur. Jag gick med 0℉ till 100℉. Vi kan inte arbeta med oändlig temperatur färg kombinationer. Siffrorna går på för evigt, färger inte. Det kan bara bli så varm innan vår lampa är bara ljusa röda hela tiden, och det är 100℉. Det samma är sant för kallt.

Om ljus blå representerar 0℉, jag kan börja på ca 200 mark på nyans skala. Rött representerar 100℉. Du kan se att rött på båda ytterligheter, så att jag kan flytta antingen till vänster ELLER höger, beroende på vilka färger jag vill använda för att representera temperatur. Det är inte samma sak som att de färger de använder i själva väder-program, men vem bryr sig? Uppenbarligen inte mig.

Jag valde att gå till höger eftersom det inte finns något rosa på vänster och rosa är min favorit färg. Jag kände också som rosa representerar varmt lite bättre än gröna. Grönt är regn och tornados.

Nu kan vi tillbaka till en färgton baserad på temperatur. Redo? Här går vi.

Låt oss låtsas att det är en rask 50℉ utanför.

Om 100℉ är det hetaste vi gå (360) och 0℉ är som kallast (200), då har vi en färg skala 160 poäng. För att räkna ut var i 160 punkt utbud som vi behöver, kan vi dela upp den aktuella temperaturen genom att den övre gräns på 100℉ som kommer att ge oss den exakta procentsatsen vi måste röra oss i vårt sortiment, eller 50%. Om vi går 50% av vägen in i en 160 led-sortiment, som lämnar oss vid 80. Eftersom vi börjar på 200, som ger oss en nyans av 280.

Det låter komplicerat, men bara för att ordet problem i matte SUGER. Här är hur koden ser ut när allt är sagt och gjort…

låt nyans = 200 + (160 * ( temperatur / 100 ));

OK! Vi har fått en dynamisk färg skala baserat på nyans, och skulle du inte veta det, vi kan bara klara nyans till LIFX som helt enkelt när vi passerar en namngiven färg.

Nu måste vi bara ta reda på vad den nuvarande temperaturen är tillbaka i en nyans och gör att varje par minuter. Serverlösa, här kommer vi!

Serverlösa Timer-Funktioner

Serverlösa är i ropet. Det är som HTML5 används för att: det spelar ingen roll vad det är, det är bara viktigt att du vet ordet och är inte rädd för att använda den i ett blogginlägg.

För detta exempel kommer vi att använda Azure Funktioner eftersom det finns stöd för timer utlöser, och vi kan testa dem timer utlöser lokalt innan vi distribuerar med hjälp av VS-Kod. En av de sakerna som Serverlösa som irriterar mig att det inte finns något slut när jag inte kan felsöka det lokalt.

Med hjälp av Azure Funktioner Core Tools och Azure Funktioner Förlängning för VS-Kod, kan jag skapa en ny Serverlösa projekt och välja en Timer Utlöser.

Timer Utlöser i Azure Funktioner som är angivna som Cron Uttryck. Oroa dig inte, jag visste inte vad det var heller.

Cron Uttryck gör att du kan få väldigt specifik med intervall definition. Cron bryter ner saker i sekund, minut, timme, dag, månad, år. Så om man ville köra något varje sekund av varje minut av varje timme av varje dag, varje år, ditt uttryck skulle se ut så här…

* * * * * *

Om du ville ha för att köra det varje dag kl 10:15, det skulle se ut så här…

* 15 10 * * *

Om du ville ha för att köra det varje 5 minuter (vilket är vad Azure standard), kan du ange det genom att säga “när protokollet är delbart med 5.”

0 */5 * * * *

För tillämpningen av denna funktion, vi sätter det på 2 minuter.

Jag använder en 2 minuters intervall, eftersom det är så ofta vi kan kalla väder API för gratis 💰.

Få Prognosen Från DarkSky

DarkSky har ett underbart väder API som du kan ringa upp till 1000 gånger per dag. Om det är 1 440 minuter på en dag (och det är), det innebär att vi kan ringa DarkSky varje 1.44 minuter per dag och bo i den fria zonen. Jag bara rundade upp till 2 minuter eftersom temperaturen inte ändra på det snabbt.

Detta är vad vår funktion ser ut som när vi kallar DarkSky API. Alla mina polletter, nycklar, latitud och longitud inställningar finns i miljö-variabler så att de inte är hårdkodad. De är inställd på den lokala.inställningar.json-fil. Jag använde axios för min HTTP önskemål eftersom det är en magisk, magisk paket.

const axios = require(‘axios’);

modulen.exporten = funktion (sammanhang, myTimer) {
// bygga upp DarkSky endpoint
låt endpoint = `${processen.env.DS_API}/${processen.env.DS_SECRET}/${processen.env.LAT},
${processen.env.SPR}`;

// använd axios att ringa DarkSky för väder
axios
.få(endpoint)
.sedan(som svar => {
låt temp = Matematik.rundan(som svar.uppgifter.närvarande.temperaturen);

// Att GÖRA: sätt färg på LIFX-lampa
})
.catch(err => {
sammanhanget.log(err.meddelande);
});
};

Nu när jag har temperaturen, jag måste ringa LIFX API. Och skulle du inte veta det, någon har redan skapat ett npm-paket för att göra detta kallas lifx-http-api. Det är därför du älskar JavaScript.

Inställning Lampan Nyans

Efter vädret resultat kommer tillbaka, jag behöver använda LIFX API exempel och kallar setState metod. Denna metod returnerar ett löfte som innebär att vi måste bo löften. Häckande löften kan få ut i handen och kunde landa oss rätten återuppringning tillbaka i helvetet, vilket är vad vi försöker undvika med löften i första hand.

Istället, vi kommer att hantera det första löftet och sedan tillbaka Löftet.alla som vi kan hantera på ett annat högsta nivån sedan. Det bara hindrar oss från att häckande då uttalanden.

Kom ihåg barn, löften är bara socialt acceptabelt callbacks.

const axios = require(‘axios’);
const LIFX = require(‘lifx-http-api’);

låt klienten = new LIFX({
bearerToken: process.env.LIFX_TOKEN
});

modulen.exporten = funktion (sammanhang, myTimer) {
// bygga upp DarkSky endpoint
låt endpoint = <code>${processen.env.DS_API}/${processen.env.DS_SECRET}/${
– processen.env.LAT
},${processen.env.SPR}<code>;

// använd axios att ringa DarkSky för väder
axios
.få(endpoint)
.sedan(som svar => {
låt temp = Matematik.rundan(som svar.uppgifter.närvarande.temperaturen);

// kontrollera att temp är inte överstiger 100 eftersom det är så högt vi kan gå
temp = temp < 100 ? temp : 100;

// ta reda på nyans
låt nyans = 200 + (160 * (temp / 100));

// tillbaka Löftet.alla så att vi kan lösa på högsta nivå
tillbaka Löftet.alla([
data,
klient.setState(‘alla’, { color: <code>nyans:${nyans}<code> })
]);
})
.då(resultat => {
// resultat[0] innehåller darksky resultat
// resultat[1] innehåller LIFX resultat
sammanhanget.log(resultat[1]);
})
.catch(err => {
sammanhanget.log(err.meddelande);
});
};

Nu kan vi köra den här saken lokalt och titta på våra timer göra det thang.

Det är det! Låt oss använda det.

Utbyggnaden Av Väder-Lampa

Jag kan skapa en ny Funktioner projektet från VS Kod förlängning.

Jag kan högerklicka på att “Öppna i portal” där jag kan definiera en utbyggnad källa så det suger min koden från Github och utnyttjar det. Detta är idealiskt för nu när jag trycker på en förändring till Github, min ansökan automatiskt får omfördelas.

All Hail Vädret Lampa

Nu är det bara att luta sig tillbaka och se det mjuka skenet av Vädret Lampa! Varför titta på den faktiska temperaturen när du kan titta på detta vackra nyans av rosa istället?

Kan du gissa vad temperaturen är baserat på vad du känner från den här artikeln? Den person som lämnar en kommentar och blir närmast kommer att få en gratis LIFX glödlampa från mig (eftersom jag ❤️ alla), eller kostnaden för lampan om du är utanför USA (~$40).

Du kan ta all kod för detta projekt från Github.