WeatherFlow Widget for iOS/iPadOS 14

I created a simple widget to display data from my Tempest using the Scriptable app on iOS/iPadOS 14. If you’d like to try it out, instructions and the code are available on GitHub.

20 Likes

Thanks for sharing the script and for the detailed instructions; added it to my home screen today and it looks great!

2 Likes

Bonjour, merci beaucoup. Cependant avez vous un script pour version européenne avec les bonnes unités. Vent, températures, pression. Merci :blush:

Very nice work, thank you very much!
Although Tempest has not arrived yet, I have already installed the Widget …
Thanks again for your work!
Best Regards,
Csaba Palmay
from Hungary

I’m glad people are finding this useful!

I’m planning to add an option for swapping the units and displaying wind gusts this weekend. I’ll update the gist and make a note here when that’s done. I’m also happy to incorporate any changes from those more fluent in Javascript than I am. :slight_smile:

2 Likes

Yeah I figure I can modify this to match Australian measurements. I know JavaScript well.

2 Likes

Considering that you’re using REST, you can actually gather these units directly from station_units Tempest API

It means whatever the user has set in settings, it will show via the script with ease.

1 Like

I decided to fix this function up for you. I matched the fahrenheit measurements with the celsius ones so they display the same colours for the same temperatures.

function temperatureColor(temp_unit,temperature)
{
	if(temp_unit == "c")
	{
	if ( temperature >= 49 ) {
    color = "#af3190"
  } else if( temperature >= 46 && temperature < 49) {
    color = "#bd2f82"
  } else if( temperature >= 43 && temperature < 46) {
    color = "#cb2e73"
  } else if( temperature >= 41 && temperature < 43) {
    color = "#d82d6e"
  } else if( temperature >= 38 && temperature < 40) {
    color = "#e62c51"
  } else if( temperature >= 35 && temperature < 38) {
    color = "#ff2e1f"
  } else if( temperature >= 32 && temperature < 35) {
    color = "#ff6e35"
  } else if( temperature >= 30 && temperature < 32) {
    color = "#f3934e"
  } else if( temperature >= 27 && temperature < 30) {
    color = "#f3ad63"
  } else if( temperature >= 24 && temperature < 27) {
    color = "#eaca73"
  } else if( temperature >= 21 && temperature < 24) {
    color = "#f4e376" 
  } else if( temperature >= 18 && temperature < 21) {
    color = "#fcf574"
  } else if( temperature >= 16 && temperature < 18) {
    color = "#deec62"
  } else if( temperature >= 13 && temperature < 16) {
    color = "#b1ea3e"
  } else if( temperature >= 10 && temperature < 13) {
    color = "#20e93b"
  } else if( temperature >= 7 && temperature < 10) {
    color = "#18eca5"
  } else if( temperature >= 5 && temperature < 7) {
    color = "#11e1be"
  } else if( temperature >= 2 && temperature < 5) {
    color = "#06d8d8"
  } else if( temperature >= -1 && temperature < 2) {
    color = "#29cff0"
  } else if( temperature >= -4 && temperature < -1) {
    color = "#4fb2ef"
  } else if( temperature >= -7 && temperature < -4) {
    color = "#4e99ee" 
  } else if( temperature >= -9 && temperature < -7) {
    color = "#4b6bf9"
  } else if( temperature >= -12 && temperature < -9) {
    color = "#8e4cf9" 
  } else if( temperature >= -15 && temperature < -12) {
    color = "#a051e1"
  } else if( temperature >= -18 && temperature < -15) {
    color = "#ae4fd4" 
  } else if( temperature >= -21 && temperature < -18) {
    color = "#bd4dc7" 
  } else if( temperature >= -23 && temperature < -21) {
    color = "#ae61ba"
  } else if( temperature >= -26 && temperature < -23) {
    color = "#a07aad"
  } else if( temperature >= -29 && temperature < -26) {
    color = "#9286a0"
  } else if( temperature >= -32 && temperature < -29) {
    color = "#a19511"
  } else if( temperature >= -34 && temperature < -32) {
    color = "#afa4bc"
  } else if( temperature >= -37 && temperature < -34) {
    color = "#bdb2ca"
  } else if( temperature >= -40 && temperature < -37) {
    color = "#d2c3d1"
  } else if( temperature >= -43 && temperature < -40) {
    color = "#e3dbe2"
  } else if( temperature >= -46 && temperature < -43) {
    color = "#e4e4eb"
  } else if( temperature < -46 ) {
    color = "#eaeaea"
  }
  }
  else if(temp_unit == "f")
  {
    if ( temperature >= 120 ) {
    color = "#af3190"
  } else if( temperature >= 115 && temperature < 120) {
    color = "#bd2f82"
  } else if( temperature >= 110 && temperature < 115) {
    color = "#cb2e73"
  } else if( temperature >= 105 && temperature < 110) {
    color = "#d82d6e"
  } else if( temperature >= 100 && temperature < 105) {
    color = "#e62c51"
  } else if( temperature >= 95 && temperature < 100) {
    color = "#ff2e1f"
  } else if( temperature >= 90 && temperature < 95) {
    color = "#ff6e35"
  } else if( temperature >= 85 && temperature < 90) {
    color = "#f3934e"
  } else if( temperature >= 80 && temperature < 85) {
    color = "#f3ad63"
  } else if( temperature >= 75 && temperature < 80) {
    color = "#eaca73"
  } else if( temperature >= 70 && temperature < 75) {
    color = "#f4e376" 
  } else if( temperature >= 65 && temperature < 70) {
    color = "#fcf574"
  } else if( temperature >= 60 && temperature < 65) {
    color = "#deec62"
  } else if( temperature >= 55 && temperature < 60) {
    color = "#b1ea3e"
  } else if( temperature >= 50 && temperature < 55) {
    color = "#20e93b"
  } else if( temperature >= 45 && temperature < 50) {
    color = "#18eca5"
  } else if( temperature >= 40 && temperature < 45) {
    color = "#11e1be"
  } else if( temperature >= 35 && temperature < 40) {
    color = "#06d8d8"
  } else if( temperature >= 30 && temperature < 35) {
    color = "#29cff0"
  } else if( temperature >= 25 && temperature < 30) {
    color = "#4fb2ef"
  } else if( temperature >= 20 && temperature < 25) {
    color = "#4e99ee" 
  } else if( temperature >= 15 && temperature < 20) {
    color = "#4b6bf9"
  } else if( temperature >= 10 && temperature < 15) {
    color = "#8e4cf9" 
  } else if( temperature >= 5 && temperature < 10) {
    color = "#a051e1"
  } else if( temperature >= 0 && temperature < 5) {
    color = "#ae4fd4" 
  } else if( temperature >= -5 && temperature < 0) {
    color = "#bd4dc7" 
  } else if( temperature >= -10 && temperature < -5) {
    color = "#ae61ba"
  } else if( temperature >= -15 && temperature < -10) {
    color = "#a07aad"
  } else if( temperature >= -20 && temperature < -15) {
    color = "#9286a0"
  } else if( temperature >= -25 && temperature < -20) {
    color = "#a19511"
  } else if( temperature >= -30 && temperature < -25) {
    color = "#afa4bc"
  } else if( temperature >= -35 && temperature < -30) {
    color = "#bdb2ca"
  } else if( temperature >= -40 && temperature < -35) {
    color = "#d2c3d1"
  } else if( temperature >= -45 && temperature < -40) {
    color = "#e3dbe2"
  } else if( temperature >= -50 && temperature < -45) {
    color = "#e4e4eb"
  } else if( temperature < -50 ) {
    color = "#eaeaea"
  }
  }
        
  return color
}
1 Like

Thanks for this @93ben! I’ve incorporated that color scale and I’m working on picking up and converting to the display units specified by the station owner. I’ll update the gist and post a note here when it’s ready.

1 Like

You’re welcome. I’m glad I could help :slight_smile:

The gist is updated with the latest incarnation of the script. All parameters should now respect the units you’ve specified in your Tempest settings.

1 Like

Very cool, tried this out and really like it! Just a few questions since I’m not very knowledgeable with coding. Is there a way to replace the humidity with the dewpoint, rain rate, wind gust, etc or add those in? Also how often does it update and can it be set to update at more frequent intervals like every 1 min or so? Also the widget is a small square but is there a way to get it into the longer rectangle option with more data points added in?

Merci beaucoup, très utile :slight_smile:

1 Like

Changing the variables displayed is only possible by editing the code. The script is using the “latest station observation” API (Tempest API). I’ve tried to make the code as readable as possible, so it shouldn’t be too difficult to customize through trial and error.

I’m waiting to see how some changes the author of Scriptable is making turn out, then I’d like to make a more data-rich Widget option using the medium or large variants. iOS controls the update frequency of the widget (that’s why I added the timestamp).

Love what you did! I added mine to my phone and I think it looks great.

I wondered if the API allows for the high/low in the history section? Would love to add that part to my widget.

(I attached some of the edits I made to your original set up. Thank you so much for adding this for us)

1 Like

Can you post the source code for this “white on black” design? (I prefer monochrome look)

@grantharrison, your tweaks make it a lot more readable–I like it! This is where I’m at right now incorporating your layout and setting the color of the temperature text instead of the background (I may make this configurable).

Edit: Regarding the high and low. It’s definitely something I’d like to do, but need to research some more. The API doesn’t make this as straightforward to do as I was hoping.

1 Like

Oh I like that! Great idea on the color temp. I’m no coding expert, I can honesty just make simple changes to codes that people already write…which is you…so thanks! :slight_smile:

1 Like

This might be the coolest things I’ve seen since getting my Tempest. Thanks for sharing!

The gist is updated with the latest incarnation of the script.

image

4 Likes