[Abandoned] Weather Widget Custom Tile Collection

These are awesome! Have you considered uploading the images to somewhere like github so its easier to use the tile with the backgrounds?

I’ve updated the Live Weather Widget to include an action to change the forecast (hourly/daily) view ‘on-the-fly’. Simply tap (click) somewhere (middle/upper area) on the tile to display the modal. This does not change the default (view when dashboard/tile loads) setting but gives you a way to toggle the forecast without having to edit the tile.

modal

1 Like

Took me some time to find. I’m sharing for everyone that wants to change the language . It can be found here:

in my case Hebrew is he

Didn’t worked for me. Still getting:
image
I’m suspecting that my API key is too long. I have 32 digits, in your example it is only 11 digits. also my Lat, Lon looks like that"
image
No minus sign. If that have a meaning.

@James I’m not in your beta program , can I use Custom Tiles ?

@Shai_Dotan it may be easier for @Michael or others to help troubleshooting if you post a screenshot. Custom Tiles is production released, so you don’t need to be in beta to use it.

Hard to tell for sure, but it looks like the custom tile definition was edited.

When you import a custom tile, you typically would not change any of the settings in the developer tools. You would usually just scroll down and save the custom tile definition. Then go to your dashboard and add the custom tile to it. From there you would edit the tile to add your desired settings for each tile instance.

See further below for steps on how to reset a custom tile to it’s original imported definition.

Example Installation

https://imgur.com/LKGleEI

And configuring the tile…

https://imgur.com/i7zZLh7

:warning: It usually takes a few hours before OpenWeatherMap API keys become enabled, so you may have to wait a few hours before setting things up.

Restore Custom Tile Definition

To restore the custom tile to the original definition from the author:

  1. Open your SharpTools.io Developer Tools
  2. Select the desired Custom Tile definition from the list
  3. In the code editor, tap the :gear: icon and select ‘Update from Source’
    image
3 Likes

The tile settings screen shot above is only a representation - The API Key is currently 32 characters (letters/numbers) and the Longitude/Latitude could be a positive or negative number depending on your location.

@Shai_Dotan, I replied to your PM - Your screen shot (tile settings) looks different. I suspect the original code is being changed/adapted?

@Shai_Dotan I updated my reply above with some additional details and example videos. Please let me know if it helps. :slight_smile:

OK !!! THAT’S did the job…
I follow @josh movie and entered the parameters within my DASHBOARD. Before I entered the parameters in the Custom Tile Editor and pressed Preview which didn’t showed nothing.
I used to do a PREVIEW for Media Tiles. I thought PREVIEW work for Custom Tiles as well… apparently not.
Thanks a lot (as usual) for the great support !!!

@Michael, I really love your new widget and it’s "smart background!

However I have gone back to the version based on your prior work. The reason is that the current weather takes so little space on the tile that it’s difficult to read. I haven’t discovered a solution to that. Maybe if I delved into the code I might see how to enlarge it.

I would use the new version to show the hourly forecast, and continue to use the prior version for the daily forecast.

To show what I’m trying to describe, this is the dashboard using your prior effort:

In this dashboard I’ve replaced the current weather info with the new widget:

Shows how you’ve spoiled us: if I didn’t have the previous app I would have eagerly used the new widget.

Thanks for the good stuff!

@Stan_Silverman, Thanks

The ‘Live’ Weather Widget was designed and intended to fill (majority) a screen - All about the graphic! The content will scale but at some point… if the tile is too small (relative to the dashboard) the text may then become unreasonably too small to read.

You could insert your own HTML/JavaScript and create a new widget that is specific to your set up. There are specific/identified areas in the Weather Widget (original) where you can safely place your custom markup.

Here’s an example that may give you some ideas.

img

2 Likes

Thanks Josh,

i’ve got most of that working but can’t get the images to load, iv’e got them saved Here but it keeps coming up with this

any ideas?

Tony

What’s the background image URL path used in the tile editor? Looks like it is not pointing to raw images correctly.

Per @Michael’s comment above…

It sounds like imgur won’t work since it won’t keep the URLs / image names consistent with what the custom tile is expecting.

PS. I moved your reply over to the original Weather Widget Custom Tile Collection thread so you can get relevant help. :grinning:

I haven’t used imgur before, but it does look like the files get renamed.
Because of that… You will need to change the image references (i.e. thunderstorm = “your_file_name”) and or the file (image) extension (i.e. “png”) in the getWeatherBkgrd function.

NOTE: For imgur - Use the URL: https://i.imgur.com/

1 Like

Hello everyone, Newbie here but can someone explain how do I go about loading the images to a server, I can’t seem to figure this part out to get the animated images, Thanks.

It varies, depending on the hosting provider. Most provide an “Upload” button (select files), and or a “drag and drop” option. Before you upload… Be sure to unzip the file.

A couple (free) options are:
imgur.com, github.com

NOTE : Imgur will rename the uploaded image files - You will need to update the getWeatherBkgrd function (code) to reflect the new file name(s) (i.e. thunderstorm = “new_file_name”).

Thanks for the response Michael, I am new to this so forgive my knowledge issue, I went to GitHub and tried to upload an image but it is saying they have to be less than 1mb, after unzipping to I need to do anything to the files they are named 200, 300 500 and so on, thanks.

You do not want to change the file names (200, 300, etc) - Choose a hosting service and upload the files as is. IF they get renamed… you will have to change the function variables (i.e thunderstorm = “new name”, rain = “new_name”, and so on).


You should be able to upload the images to GitHub - (100 MB Limit)
After signing up for an account and creating a repository… you should see a set of buttons inside the repository that looks like this:

upload

Click ‘Add file’ > ‘Upload files’ which will then take you here:

Click ‘choose your files’ (which will open up the file window) and select the folder which contains the images. Then, drag the entire folder and drop it in the boxed area. After it finishes adding all the files > Scroll to the bottom and click the ‘Commit changes’ button. You should now have a folder (presumably named “images”) containing the images in your repository.

Thanks again MIchael, I did as you mentioned, now question is how do I get the url to put into the weather tile, thanks.