Weather Tile replacement

SmartThings deprecated the SmartWeather device and there's no replacement at this time. The Weather Tile as we know it is probably gone forever. It will be replaced be a native implementation at some point in the future.

The original Virtual devices that were implemented in Groovy are either gone or broken across the board.

To create new Virtual devices under the new platform, please use the new IDE: https://my.smartthings.com/advanced

Thanks...great support!!

If anyone has a replacement implementation in the new IDE, I'd appreciate knowing how I can get it/set it up.  THX!

I could use a replacement implementation as well for the Weather Tile(s)! 

Yeah same problem here... my SmartWeather finally died, and everything else seems to show just a forecast. I need current conditions!

That weather tile was the whole reason my wife let me put an ActionTiles display in the bedroom.  Please see if you can come up with a replacement for the sake of my marriage. ;-)

I did find and try the MTG weather media for a tile and it works great but the temps are way off.  It says Thursday for my zip code with be 109 degrees but weather.com says 100.

same here.  Please let me know if anyone has come up with a simple solution for displaying current temperature!

Got the openweather free version working w/API key with Chris' example in this thread: 

https://support.actiontiles.com/communities/12/topics/1000-how-do-i-add-the-smartweather-tile

Direct link to example: https://support.actiontiles.com/uploaded/file/19647/12/13542/9dacc0afb05e38d93bf0541458e3d09c.html

Just requires a little HTMLediting and waiting a bit for the API key to become active. Not quite as easy, but it's working for me!

this would totally work but I’m not familiar with how to set it up.  Any advice? Thank you 

Looks like you also have to host your own HTML and also I am no programmer.  Eric please keep us updated on your progress.  If you get more conditions figured out I might be willing to give it a try.

All you need is lat/long of your city and AppID = your API key from https://home.openweathermap.org/api_keys after creating an account. You update the 2 URI's in the HTML with those 3 details each, then edit the static HTML to your liking & voila! I think Chris put some placeholders in there <LikeThis> .

Mine was throwing 401 unauthorized for about 15-20 minutes before the API key would actually work.

forgive my lack of knowledge here.  I have the api key but not familiar with where and how to update a uri.  Any guidance would be greatly appreciated!

ok think I figured it out!  Got the same error code 401 invalid app key so I assume api key not validated yet.  Fingers crossed!

ok think I’m close.  How do I create a static html? When I put the above https with my last long and app key, I get the below page.. next steps?

help!

As Eric described above, what you need to do is:

1. Go to the direct link that Eric posted above, view the source HTML code in your browser, and copy the code into a text file, using for example Notepad.
2. Insert your APPID and Lat/Lon in the two lines of code indicated in the HTML code.
3. Sign up and get a free account at FontAwesome https://fontawesome.com/sessions/sign-in and enter your Font Awesome ID in the one place indicated in the HTML code (near the top).
4. Near the bottom of the code, replace 'Your Town' with the name of your town/city.
5. Save the modified file as a '.HTML' file.
6. Find a site online that will host your '.HTML' file for free.  I use a service called DrivetoWeb (enter drv.tw in your browser to go there), but there are multiple options if you just search for 'free HTML hosting'.
7. Once you have the URL for your hosted HTML code, create a shortcut in Action Tiles using that URL.
8. Add an IFrame tile to your Action Tiles panel using the shortcut you just created, with a size 'width 2, height 1'.
9. You now have a weather tile!!
10. If you want to modify it, edit the HTML file as necessary and rehost it.  For example, I changed Chris' code (last 9 lines) to match my tiles and style as shown here: My HTML Mods.txt 

Hope this helps.

wow will give it a try asap. Thank you!

I forgot to mention that you need to add another line of code to Chris' HTML if you want the weather IFrame to automatically update.  Originally I handled updates by having the entire panel update periodically via an Action Tiles setting.  But, I now prefer to have only the weather tile update.  To do that, insert this line at the top of the HTML code, immediately after the <head> line:

                    <meta http-equiv="refresh" content="x">

where x is the number of seconds between weather updates.  I refresh every hour, so for me the inserted line looks like this:

                    <meta http-equiv="refresh" content="3600">

holbrookweather.html

created the above file and found a site to host my link:  https://harlequin-haily-11.tiiny.site/

My output is just the source code.  Clearly i am doing something wrong (not an expert in this stuff!).  You're been great but any more guidance would be appreciated !

You need to remove the <> characters around your lat/lon and your weather and fontawesome ID entries.  I did that and here's the text file and associated html file that now works:

        YourWeather.txt  
        YourWeather.html

If you open (double-click) the html file on your computer it will display the weather tile in your browser. You'll need to reload the corrected html file into your hosting service.  

Amazing,  Worked incredibly well.   Sorry I am no expert here but is there a way to make the font of the actual temperature bigger, like triple the size?

Thanks!

Near the bottom of this file YourWeather.txt you'll see four lines that contain text like this:

       span style="font-size:Xem" 

where 'X' is a number.  Make 'X' bigger if you want the text on that line to be larger. and then save the file as a revised .html file.

Worked beautifully.  Thank you!   I found an HTML hosting site that does add a banner or add.  Created how i wanted it to look but when i upload as an iframe or media. the tile is blank/  Any suggestions?  here's the link: http://tonyweather.atwebpages.com/weather3.html

Thank you!

I beleieve the problem is your URL is http not https.  Here's a discussion of the issue: https://support.actiontiles.com/communities/12/topics/13036-http-on-media-tile-no-longer-working-https-still-works

On to the next question!   I see there is a call for AQI.  Would love to create an AQI tile.  How do i convert this call into a webpage?  http://api.openweathermap.org/data/2.5/air_pollution?lat={lat}&lon={lon}&appid={API key}

Thanks

WUNDERGROUND WEATHER "MEDIA TILE"

I had some time to kill and I coded up a solution for my Personal Weather Station which is a contributing participant on Wunderground.  I dynamically create an image that AT accesses as a media tile. 

I share my solution with you with the following caveats:

1. The code is pretty ugly - you are free to make it whatever you want it to be. 

2. You need to host the code somewhere on a server running PHP that is accessible via the internet, and that you have access to.

3. The color scheme matches my AT theme.  You will need to tweak the base image/font colors if you want something else.

4. This is a 3x3 tile - AT will shrink it down to 2x2 or 1x1 as required with some loss of resolution until you click it to enlarge.

5. This code assume you have a Wunderground PWS and the associated API key needed to access your data -- see this page for discussion of API keys -- https://docs.google.com/document/d/1eKCnKXI9xnoMGRRzOL1xPCBihNV2rOet08qpE_gArAY/edit
6. You should be able to adapt the code to other data sources if you take the time to do it.

7. Don't expect me to debug your implementation if you can't get it to work.

OVERVIEW

1. I have a base image with a three icons embedded in. I made this in photoshop. I borrowed the icons from the defunct weather tile

2. I call the Wunderground API to retrieve the station data that I am interested in.  It returns the data as  json and I convert that into a PHP array.

3. I use imagick (ImageMagick) to place text/numbers from the API data in the appropriate places on the image using the fonts Calibi Light and Calibri Bold

4. I created a cron job to generate a new image every 5 minutes

5. I created a media tile in AT that references the image created in step 4. No heading, refresh every 5 minutes

You can download a zip file here -- > https://k0jdd.netlogger.org/wunderground/wundertile.zip

Below is a link to the solution I created to replace the Weather Tile for my Action Tiles Panels. I have been using it for 6+ months on my panels. Besides the current weather conditions, it can also display upcoming forecast by clicking on it. It currently refreshes itself automatically every 15 minutes.

A couple of friends of mine wanted to use it to, so I decided to create a walk-through process to easily create your own personalized/automatically updating WeatherTile URL that you can then add to your ActionTiles panel as a ‘Shortcut’ within an IFrame.

You can adjust things like tile shape, tile background color, should it use imperial (Fahrenheit/mph) or metric (Celsius/kph) scales, how far out should be displayed for the forecast, etc. Here a few samples of the tile with different settings:

Here are a couple of examples of what it looks like in an ActionTiles Panel (wide and narrow weather tiles):

Even though I use it for an ActionTiles Shortcut/IFrame, it should be able to work on other browsers or applications that can accept/display browser pages.

You can create your own custom WeatherTile at:

https://CodeBuffer.net/wat

Enjoy!

I love it, thanks!  Is there a way to change the refresh rate?  Is it some code in the URL?  Also, can you edit the city?  I used the exact Lat/Long for my address but the "city" came up wrong.

Both good suggestions! I have added parameters to allow changing both.

A couple of notes:

1) The city name comes from OWM by default, but the displayed name can now be overridden.  Don't make it super long or the tile data will be shrunk.

2) On the refresh rate - keep in mind that OWM (which is where the weather information comes from) refreshes their data at a max rate of every 10 minutes.

To see how to use the new parameters, you can go to https://CodeBuffer.net/wat and click on the “WeatherTile Params” button, or you could go through the steps again to setup the new options.

Thanks again.  Success!  I decided to leave the refresh rate at 15 minutes, but its nice to have the option. And my location name is fixed based on long/lat.

A couple of notes.  Reading your detailed note on the additional parameters in the popup notes was very difficult for me.  Regardless of monitor resolution I just couldn't read sufficiently.  I also tried to read the source code for the web site but was unsuccessful.  It could be me, last time I did any serious programming it was in Fortran 4.  Anyway I solved the problem by recreating the URL and copying it to a txt file.  I attached the screen image so you can see what I was trying to read.

Also I noticed the new URL didn't show the parameters for backgroundColor, which I had changed.  I had no problem putting that back in.

I like the iFrame approach, so weather can be checked at a glance.  Doing it that way doesn't seem to give me the option to go full tablet larger.  Tapping the tile toggles it to the forecast and back, which I like. On the Amazon tablet with a 2x3 size tile, some information is too small for me to read, so I bumped it up to 3x4.  The last line of each screen at the bottom is a bit still tough to read.  My eyes are not what they used to be!

Some of my tiles have three little dots in the lower left corner, which brings up supplemental info/actions, depending on the device.  Would it be possible to add something like that to pop up to full screen as an option?  I don't know if ActionTiles would support that capability for iFrames.

Again, Thanks so much.

Gary

Thanks for the notes - I checked the site and did the following:

• I changed the font of the popups, hopefully they all are legible now.
• I checked the custom "backgroundColor" parameter during setup and I couldn't reproduce the problem you described. When I added/changed the custom background color in the Options screen, it was properly added/modified in the final custom URL. Note: The parameter "backgroundColor" is omitted if no custom color is selected - it is not required. But as you did yourself, you can always add/change the color by adjusting the URL anytime.
• I changed the last line that used to be on both the current weather & forecast screens to just show up on the forecast screen. The only information on that line is the date/time of the OWM weather data being displayed, and then the version number of the WeatherTile being used. On a side note, the WeatherTile automatically updates itself if a new version becomes available.
• Since ActionTiles controls what an IFrame can do, I don't know if it can be made to go full screen - I will do a little research to see if it's an option.

Have a good one!
TommyB

Yes, I can read the popups now, thanks.  And I noticed the last line is now only on the forecast screen.  Thanks, we are enjoying using your new Weather Tile.

Thanks for putting this together.  Much appreciated.

It works pretty well! I am still searching for a solution to allow use of my Ambient Weather Personal Weather Station. I find that it can be more accurate at times with hyper local conditions. I found that I could not define the background color using Hexadecimal values and ended up choosing a color for the weather tile that was "close" to the colors of my existing tiles.  Is this correct or did I just miss some area that one clicks to define the color values using Hex? 

I checked the code and I believe any background color should be able to be used.  The old online documentation was wrong on the format needed of the Hex Color Code (the documentation has now been updated online).  My guess is you were using the old documentation, sorry for the confusion

You should be able to use any Hexadecimal color for the background in the following format: #FFxxxxxx

So, for example, if you wanted a specific green color with a hex of #25cf52, you would add/modify your URL to include:

&backgroundColor=#FF25cf52

Also, remember the URL parameter 'themeMode' will control the color of the text. 

'Light' theme = black text

'Dark' theme = white text

Let me know if you have any issues.

Thanks for following up!  Yes I see now that one can enter the Hex Color codes right in the URL itself.   Everything else was button clicks and entering information through the nice web based forms that I missed that. 

The color I use wasn't in the color picker so I updated the URL with a custom hex background color that matches the rest of my tiles. 

I just picked dark mode so I got white text and when I pasted the URL into my AT shortcuts edited the background color number.

The color does not need to be in the color picker (it is a generic color picker).  Editing the color manually in the URL is how to do it if you can't find the color in the picker - Just make sure you only change the 6 hex numbers at the end of the Hex Color and leave the first 3 characters there (the "#FF").  

It sounds like you got it working now.

If not, at https://CodeBuffer.net/wat you can click the "Contact Us" button at the bottom and send me the color code you are trying to get working and I can try it on my end.

is there a way to edit the colors and features easily without going thru all the steps again?

Yes.  You can go to https://codebuffer.net/wat and click on the button "WeatherTile Params" where you can see basic instructions on how to change your custom URL without having to go through the steps again.  

Just a note:  Going through the steps again is actually quite fast.  In the first "step" at https://codebuffer.net/wat click "I already have a API" and enter your email & API info (which was sent to you via email the 1st time you went through the steps).  If both the email & API are valid (checked when you click then "Test Tile API" button on step 1), it will load all of your old choices for all of the subsequent "steps" and you can very quickly move through the steps without needing to re-enter data.

Hope this helps

had mine set up prior to your help. Love the ability to tap and see forecast but love the larger fonts on mine.  See copy here. 

I added a parameter option so you can decide if you want to display the location name at all.  If you decide not to display the location name (like in your screenshot), then the text size of the other elements should become slightly larger.  I don't believe it will be to the scale of your screenshot, but for those who don't care about showing the location name, they may like it.  Also, in your specific example above (3 wide x 4 high tile) I would suggest using a tileWidth of "narrow" for the WeatherTile URL - in my opinion it works better in square or vertical rectangle ActionTile sizes. 

To see how to use the new parameters, you can go to https://CodeBuffer.net/wat and click on the “WeatherTile Params” button, or you could go through the steps again to setup the new options.

There have been several changes to the weather tile by https://CodeBuffer.net/wat in last few months.

• UV Index is now available to optionally be display. If select that you want UV data to be displayed, it will be displayed on both the current conditions and the forecast screens (see below). Note: UV data may not be available for every location.
• Standard ActionTiles Themes are now available to select for the weather tile's theme (sets background/font colors). This way you can easily match your current ActionTiles theme without trying to figure out the background and font hex color codes.
• The current temperature is now larger to be easier to see from a distance (see sample panel below).
• You can display a custom location name (ie. "Our Home"), or hide the location name all together.
• All of your options are saved so that if you want to come back to https://CodeBuffer.net/wat to tweak your custom URL, it is a easy process.  You just enter the email address you initially used when you first set the weather tile up, then enter the API you received from CodeBuffer, and then all of your previous entries/selections should be loaded for you to modify.

Thanks, this tile is great! Question about the Forecast... Is there a way to have it show the High/Low temp for each calendar day? I have forecastTime set to 24hr and each day has a time after it. It looks like it's giving the High/Low temp for a 24 hour period starting at that day and time.

This is difficult to accomplish given the current weather forecast source used.  If there is enough interest, I may take a look at it in the future.  Also,  You are correct on the High/Low being 24hrs from the current time/day.