Custom Widget: Ecobee thermostat

Tim, congratulations for your widget. But somehow the vertical slider doesn’t work in my configuration, see screenshot.

Using the standard slider widget, vertical sliders works as intended.
Anyone having any idea?

Not sure what is going on ther @DEy; The slider is not just a minimal size, it is also orange, when it should be blue when the system is set to cooling. Thats very strange.

I have nothing to really help, but I do have a more ‘final’ version of the widget. It uses the widget-slider instead of just the direct rzslider from angularJS. This makes the slider update actually work, and the whole thing seems to be a lot better.

Here is a screenshot:

Here is the updated json:
Ecobee.widget.json (13.6 KB)

Finally, I made 1 change to the rules file, so that the “resuming schedule” thing works. Update the ComfortHold rule to look like the following:

rule ComfortHold
when
  Item ecobee_schedule received command
then
  if (receivedCommand.toString.equals("resume")) {
    // the 1.9 onwards action bundle uses a selection string instead of an item as the first parameter
    ecobeeResumeProgram("319281956903", true)
    ecobee_eventType.postUpdate(receivedCommand.toString)
  } else {
    // the 1.9 onwards action bundle uses a selection string instead of an item as the first parameter
    ecobeeSetHold("319281956903", null, null, receivedCommand.toString, null, null, null, null)
  }
end

I don’t see how that change could fix your issue, but give it a shot, and if it’s still not working, we can try some debugging.

Great, it’s working now…
It probably might not have been connected to the new implementation of the slider. I don’t have an Ecobee and simulated most items; maybe I’ve made a mistake there.
But thanks a lot for your help @Sensor11 which will hopefully help me a lot in implementing other widgets - it’s still a steep learning curve for me as I’m neither a css nor JavaScript expert…

Hi,
I just got started with OH because i wanted to see what i can do with my ecobee.
This widget is great, thanks for making it.

I have absolutely 0 experience with angularJS, but I managed to add all three of my sensors to your widget.
However, I’m having problems with using Celsius.

The slider’s bounds are hard coded to F
I could just make a second copy in the code under a

but my gut tells me that’s kind of garbage code (unless thats just how things are done in AngularJS). Any chance you could provide a cleaner solution?
Also that would only get me past the first problem, i think i would then have to convert back to F to pass into the API

Hello,
Yes, the slider bounds are set to Fahrenheit. Well, specifically, the limits are something like 50 to 90. I tried to do something clever, like setting the limits as 15 below and 15 above the current setting, but that went badly… as the value changed, the limits changed, and it all went terribly wrong.

I think you can set your ecobee up for Fahrenheit or Celsius. There is a setting for it, and I use that for the main display to show either F or C in the main widget.

My suggestion would be to make sure the ecobee is set to Celsius, and then to modify the widget. Once you import it, you can edit the code and change all the “floor” and “ceil” settings; Those are the ones that set the low and high end of the sliders.

If I get some time, I will try to set my ecobee to Celsius and see if that works, or if you have to do the conversion; If so, I can probably make a Celsius version of the widget for anyone with the same issues.

Hi,
I modified your file to support Celsius a little better.
Ecobee.widget.json (15.7 KB)

It just copies your code with different values if using Celsius, It could use a little refactoring but it seems to work for me. No need to make any item or rule changes luckily.

I seem to be missing something - I have it changing heat/cool/auto properly, but the slider seems to do nothing. The sensor also refuses to read for some reason. Should I post my rules/items files?

EDIT: I got it! Never mind. Now I’m looking into a fan control method.

I got something working to mimic the quick settings menu, and I eventually want to expand it and add custom comfort settings.

But I need an Icon and some guidance on layout, the menu opens downward and it would work better going up.
Anyone want to help me out?

Here is the snippet for a quick settings row.
Notice I’m using the wrong icon, and the menu opens down which might be a problem.

  <tr>
    <td class="quicksettings-row" colspan=3 align="right">
        <div class="quickSettings" uib-dropdown>
          <button id="single-button" class="mode" uib-dropdown-toggle>
            <img class="mode-icon" src="/static/images/ecobee/{{itemValue(config.hvac_mode) | lowercase}}.png"/>
          </button>
          <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
            <li role="menuitem"><a ng-click="sendCmd(config.schedule, 'home')"><b>Home and hold</b></a></li>
            <li role="menuitem"><a ng-click="sendCmd(config.schedule, 'away')"><b>Away and hold</b></a></li>
            <li role="menuitem"><a ng-click="sendCmd(config.schedule, 'sleep')"><b>Sleep and hold</b></a></li>
          </ul>
        </div>
    </td>
  </tr>

If you get this working for Nest I would love to see it :slight_smile:

1 Like

Any update on the mapping to Nest?

TypeError: [sprintf] expecting number but found string vendor.js

I see this error in the viewer and the widget has 2 slider one for heat and one for cool not the single one in your pic copied your code a number of times and seem to be going no where fast any thoughts running 2.1

I haven’t encountered this myself, but I haven’t updated OpenHab in a while.

Do you see an issue with me repurposing this for a Nest thermostat widget or is there a lot of specific Ecobee variables?

Thanks for all of this, but my question is how do I use that? Currently I have the ecobee bindings from the bindings section and working on basic ui, but I’d prefer this and I’m unsure how to incorporate this into my sitemap.

thank you

Why is mine like this?

Also when I change settings from the HABPanel it changes on the thermostat. But when I change temperature on the thermostat it doesn’t update on the HABPanel. What could be causing that?

I think there is a refresh interval in the ecobee config that sets it to
read every few min. I’m guessing you have to wait that out?

The now its correct its showing 72 and holding but the slider is still at 74.

degree ecobee
Also does anyone know why there is a “A” with a arrow above it before the degree symbol?