Template Example: Weather Binding

Hey @Andrew_Pawelski, did you end up posting this code somewhere? I’ve been searching high and low and can’t seem to find it… looks pretty sweet. I’ve integrated all the other bits of code - working fine, it’s just the pretty bits I’m looking for now… Cheers.

Hi i never did as noone ever asked and the BOM stuff is a fairly small audience I guess.
since then IOS 10 came out and that stuffed all the HABPanel svg stuff up ad I abandoned the animated images

Fair enough. I’ve been pulling the BOM data for the past 12 months, using it in plain text boxes, on the app, and using the data in rules. ie Watering etc.
I’ve been working on some HABPanel for 2x 24inch Touchscreens. Was looking to upgrade the weather graphics before they go ‘live’… I’ll keep using the statics for now until I can find some code…

Well I do have this now…code isnt tidy, nor perfect, but responsive and has everything I need

That looks pretty sweet. Clean and simple. Would love to take a look at your ‘untidy’ code if you’re willing to share…the stuff I’ve ‘hacked’ together isn’t going to plan so far…

OK It’s pretty bespoke and many layers of yuky CSS - mix from @pmpkk’s awesome work and I bastardised the weather widget from @bastiaan_van_h which is awesome and responsive but I needed something specific for the space left on my iPad.

here is my widget - if you need items etc let me know
Weather widget.json (9.2 KB)

Thanks @Andrew_Pawelski Appreciate the Widget. Changed a couple of the mapped items to match mine, but most were already there. When you get a minute, could you post the CSS as well? I’m wondering if that is why I can’t get the images to display. Tried direct mapping them, but still no images…I’ll keep tinkering…not played with CSS much before this…

OK there are two css files - one from the master css setting in habpanel and the other which is based on the other weather widget already referenced - both hacked up a bit certainly could do with a tidy up buth here they are in their raw form
love to hear if you get it up and running
weather12345.css (4.7 KB)

aj-theme.css (16.2 KB)

Thanks Andrew. Plugged them in, tiny bit more tinkering in the Widget, and this is where I’m at so far… nothing different from yours as yet, but running. Once i’ve finished the whole panel and mounted the screen, I’ll post another photo… thanks again…

Thanks again @Andrew_Pawelski. These are the updates I’ve made so far…hoping to get the screen mounted next week…need another trip into the roof to run some more Cat6 before I can mount…

@greg_lamont I see you also are suffering from BOM inconsistent naming meaning things roll onto 3 lines and muck up row borders (also messes up the icon selection - that’s what the array at the top of the code is for)

Are you happy with those icons? I personally prefer the flat ones - I can share where I got them if you prefer

Yes, the lines are a little annoying. I was going to edit them somehow so they are a fixed size.

I decided not to use the array because of inconsistent issue, and renamed my icon files to match the BOM icon code in the XML. Then as an example, I just display the file 1.png for a sunny day.

class="weather-icon-row pulse" src="{{config.server_path}}/images/{{itemValue('BOM_Forecast_Icon_Code_1')}}.png"/>

I found this easier that adding to the array when something different comes up.

Always happy to look at new icons. Need to get a good WAF on this install… :grinning:

aha i dont recall seeing this in the XML when I first started playing - can you share more details?

for the icons, I use the ones referenced in this post:

Using the Icon codes makes it much easier than relying on the description to be consistent…

My XML is pulled from here: (yours would be different)

Here’s a snip from the XML

<forecast-period index="1" start-time-local="2018-08-30T00:00:00+10:00" end-time-local="2018-08-31T00:00:00+10:00" start-time-utc="2018-08-29T14:00:00Z" end-time-utc="2018-08-30T14:00:00Z">

<element type="forecast_icon_code">12</element>

<element type="precipitation_range">0 to 2 mm</element>
<element type="air_temperature_minimum" units="Celsius">2</element>
<element type="air_temperature_maximum" units="Celsius">13</element>
<text type="precis">Patchy rain developing.</text>
<text type="probability_of_precipitation">50%</text>

Icon codes are referenced here:

I referenced this page and your array, and manually renamed the files to match. There were lots of left over files as not all files had a matching code. I do remember seeing a .bat file to do it once, but it took me less than 5 minutes to rename them.

I haven’t moved the XML parsing into OpenHAB yet, I’m still running the Python script to pull the data from BOM and put it into the OpenHAB api every hour. Below is one of the lines in the Python script that sets the Icon code to your OpenHAB item. (I have 7 lines, one for each forecast day)


It’s been running like this for probably a year now, no issues. I just hadn’t got a widget to work nicely. I was using individual blocks in HABpanel…worked, but wasn’t pretty…seeing how you had put your together was an awesome help…

Something I did also was at 6pm, copy the minimum temp from tomorrow’s forecast into today’s forecast, as the BOM data is no longer available, and a NULL value is set. Doing this stopped the NULL value…

That’s brilliant I will revisit this again and add in the icon codes (unless the SA XML is missing this and that’s why I never did it…)

I’m running python as well still


Happy to return some help. When I transfer the XML parsing over to OpenHAB, i’ll flick you a copy as well…

I was almost done with the configuration using yahoo api. I had just a little problem regarding the condition id being null …
Then i restarted OH, now yahoo is not working anymore. Tried OpenWeather (log says API key invalid, despite working in browser just fine), ForecastIO (throws exception). Best: my OH log keeps logging info about locations i used to test which are long gone from all cfg and item files. Restarted OH numerous times, cant get anything to work now, everything regarding weather fails.
I deleted everything from weather.cfg instead of commenting out, but even the old api keys i used still show up in the log! I have no idea what is going on. I can even have the binding uninstalled and get values for condition (i dont get them when the binding is installed).

Any idea where this binding/OH stores or caches (and uses …) historical configuration? What must i clean to get this working again? If i delete all that’s in cache then my Z-Wave devices are mostly gone :frowning:

Im kinda desperate now … even after complete reinstall of the binding and setting up Hamweather for the first time i still get alot errors about long gone locations (and it’s not working).

is there a way to get the max & min forecast temperatures in HABpanel without each of them having the ‘°C’ suffix?

Yes, just search the HTML for °C and delete or replace with your chosen suffix.

For example, the line:

{{'%.0f' | sprintf:itemValue('Temp_Max0')}} °C

For Fahrenheit:

{{'%.0f' | sprintf:itemValue('Temp_Max0')}} °F

Or for no suffix:

{{'%.0f' | sprintf:itemValue('Temp_Max0')}}

There are multiple instances, so be sure to get them all and take care not to inadvertently replace / delete something else. If the html ends up being invalid the whole thing will stop working (learn from my mistakes) :wink:


thanks, but it’s not in the HTML, it’s being returned by the wunderground channel.

FYI: i’m running v.2.4-M3, and have updated my wunderground thing to the new bridge & location format. I’ve also cleared the cache and restarted with no change.