[RELEASE] HousePanel Dashboard for SmartThings and Hubitat

That will always force it to apply. Here is the more elegant answer… I was able to get online at the airport since my fight is delayed. Replace roomname with your real name below.

body { background-color: black; }
div.panel, div.panel-roomname { background-color: black; }
.ui-widget.ui-widget-content { border: 0; }
form.buttons { background-color: black; }

I will also be removing the form background that caused the white line behind the buttons so you won’t need the last line after that.

WOW worked like a charm :slight_smile: Thank you!!

NOW to make a short video for the MM site…I’ll post a link here too!

@snobordir no the slider branch is separate from the experimental icon branch that didn’t work out. The hangup right now with sliders is the jquery slider library doesn’t work with touch and the jquery mobile library that does work with touch does not support draggable icons. So I am a bit stuck. I am research other lighter weight slider libraries that support touch to add to the jquery UI system. Another approach is to find a good draggable solution to add to the jquery mobile library - or extract it from the jquery UI library. i don’t need the draggable library to support touch but I do need the slider library to support touch. Ideally both would but that would be a bonus. I am evaluating a few candidates and will pick one soon. I might even write my own draggable feature to avoid bringing in too much bloat-ware. I don’t think it will be too hard. I really like the jQuery mobile library more than jQuery UI but unfortunately i started with UI so migrating is a pain the arse… might bite the bullet and just move over. Anyway, that’s probably more developer mumbo jumbo than you wanted to hear. If anyone out there has any experience with this stuff I would love to benefit from your wisdom.

So now you can teach me what the deal is with Magic Mirror … what does that give you? Is it just a smart lighted mirror? Or something else? What hardware do you need to implement it? I saw some guy post this huge bathroom mirror project but I couldn’t tell how he got icons on an actual mirror.

Well, I started migrating my Lutron Caseta system to the Pro Bridge. That’s … a pain. You have to delete everything and start over. >.< At least I’ll be able to control it locally now instead of having to use cloud to cloud.

Just the video:

Little OPPS on one of my sensors that seems to be HUGE for some reason LOL

Very cool cowboy. Thanks for the shout out on the MM forum.

1 Like

No problem, I really appreciate all your help!!!

I load HousePanel in a module called iFrame. I then load MM using “node serveronly” then chrome to get the localhost page… Which works out because you can change the port so it doesn’t conflict with the apache server to get HousePanel :grinning:

Objects don’t stay when reload page. What did I break? LOL


No easy way to tell… likely a hmoptions permission issue.

1 Like

Having a small issue…been hunting for it but can’t seem to find out why… any suggestions? :):grinning:

AND is there a way to add % to the humidity?


Use the CSS :after syntax. Look in the default css file for an example. Just search for :after

Hey @kewashi,
quick question: is it possible to set level/hue or any value directly?

I looked into the code and it doesn’t seem to support that at all. Every value change seems ‘hard coded’ with these commands such as level-dn, level-up. I cannot seem to find a function that changes the levelTo(value).

Thanks :slight_smile:

The only methods in the groovy that appear to be doing just that case "level-val": case "hue-val": case "saturation-val": seem not implemented.

Color selection is “on the list”, there’s a couple external libraries being evaluated for fit, I believe. If you search up though Ken’s posts, you’ll probably find reference to them, a few weeks ago (maybe a month?)

At present they are not implemented in the GUI but they do function if you use HousePanel as an API endpoint as described in the Wiki. As Edward pointed out I’m also evaluating a color picker - looks like minicolors will end up getting the nod.

Regarding directly entering numbers, that would be fairly easy to implement but I assumed few people would want to type into a wall-mounted tablet. If there is strong interest I can add it to the list. Would just need to enable an in-line edit to the level-val element and then post an Ajax call. I am presently focused on a project to port over to Hubitat so I’ll add this to the queue.

1 Like

[RELEASE] HouseHubitat Beta

I’m excited to share the first beta release of HousePanel that will interact with both SmartThings and Hubitat things on the same panel. I’m posting it here because I will be keeping this as a single code base for now. Current users without a Hubitat hub can safely ignore these new features and they won’t get in the way.

If you are a proud owner of a Hubitat hub, then grab the “hubitat” branch of HousePanel from the open-dash GitHub as usual. Then update the clientinfo.php file by adding the following three constants:


The first line is the local IP address of your Hubitat Hub. The second is the application ID that you can get from the Hubitat website by clicking on the HousePanel app. The Access Token will be printed in the log when you first install the app.

The only thing you need to do on the Hubitat side is install the HousePanelHubitat.groovy file and name it HousePanel.groovy

This is a separate file from the HousePanel.groovy file that you will still need to put into your SmartThings IDE.

Once you have that then reload your HousePanel web client and you should see the Hubitat devices in the list of devices. You can only tell them apart from the SmartThings devices by their item “id” which is a short integer prefixed with “h_” while the SmartThings id’s are long complicated strings with letters and numbers.

A few benefits of Hubitat will be immediately apparent. First, they respond significantly faster. Second, they refresh every 5 seconds which isn’t possible with the SmartThings cloud system. Finally, this version ONLY works for local rPI installations of HousePanel which must be on the same network as your Hubitat Hub.

I will cross-post this in Hubitat forum and I’d like to ask folks to respond with any Hubitat support stuff over there. I just wanted my user base here to know that this is now available. Future updates will include automatic configuration of the Hub constants. I pushed this now to get early feedback.

Here’s a screenshot of my office things… nothing visually new other than the fact that the light and motion sensor in the bottom right corner are Hubitat devices.

Wait, what’s this “only rPI” nonsense? :stuck_out_tongue:

Of course, my eventual hope is to have the hubitat actually host the website but I don’t know the specifics of the OS or components used as the backend.

I should’ve been more precise, what I really meant was that it only works on the local network installation, which could be a PC or any platform as long as it’s local and on the same network as your habitat

1 Like

Shouldn’t this be working?

div.weather.humidity::after, humidity, div.weather.percentPrecip::after {
content: “%”;

I reverted back to the original css because I thought I did something wrong but it appears something else is wrong… you can see one of the sensors is still wrong despite using the original css file. Any clue to why?