Wall Mounted Dashboard (now known as HADashboard)

kenshin · October 21, 2016, 5:06am

I also tried to get the camera-widget to work, but no matter what i do, i can’t get it to write a new file, is that your case too?

I also tried to modify the unifiVideo widget to use hass camera api (/api/camera_proxy/camera.outdoor?token=19391345504), but still no luck, can’t write anything to the image folder, wondering if its permission issue, is there any error log in dashing so I can track down the errors?

gist.github.com

https://gist.github.com/tracstarr/a5648c0d36162c0d1a84

DashingUnifiVideo.md

Dashing.io Widget for UnifiVideo NVR 

This method uses API Key access so I suggest you setup a guest account with API access but limited (Visible and View Feed) access.  Then login as the guest user, enable API access, and generate a new key.  Copy the key for use. 
 
Switch to the Devices tab and open the Configure dialog for the cam.  On the Details tab, right-click the thumbnail view and Copy the image URL to the clipboard.  It will look similar to the following if pasted to an address bar or text editor:
http://192.168.1.105:7443//api/2.0/snapshot/camera/05a2bc63-d1ce-399f-8327-3a19b0cd3e8f?width=%d&force=true

The guid after /camera/ is what you want to use in the unifivideo.rb file.

You can setup as many cameras as you want, just keep adding settings.

This file has been truncated. show original

unifivideo.coffee

class Dashing.unifivideo extends Dashing.Widget  
	ready: ->

	onData: (data) ->

unifivideo.html

<h4 class="title" data-bind="title"></h4>
<img class="image_container" data-bind-src="image | prepend '/assets'" data-bind-width="width"/>
<p data-bind="time"></p>

There are more than three files. show original

https://gist.github.com/peelman/df76ec56978202a47b6e (updated version)

kenshin · October 21, 2016, 10:03am

Guys, found the log file and looked at the errors, and I finally got the camera widget working, stay tune, will test it thoroughly then upload here soon.

kenshin · October 21, 2016, 10:49am

almost there, now the camera widget is working with hass camera api without SSL, can someone help to enable https in this function?

def fetch_image(host,old_file,new_file, cam_port, cam_user, cam_pass, cam_url)
rm #{old_file}
mv #{new_file} #{old_file}
Net::HTTP.start(host,cam_port) do |http|
req = Net::HTTP::Get.new(cam_url)
if cam_user != “None” ## if username for any particular camera is set to ‘None’ then assume auth not required.
req.basic_auth cam_user, cam_pass
end
response = http.request(req)
open(new_file, “wb”) do |file|
file.write(response.body)
end
end
new_file
end

kenshin · October 21, 2016, 5:12pm

Finally got it working using the hass api, so if your camera work on hass interface, now you can use it on hadashboard too. code based on the broken grubernaut/camera-widget

So now, what’s the best way to upload the code or if anyone want it at all, seems like I was talking to myself on all the post above, hahaha

aimc · October 21, 2016, 5:54pm

If you can do a Pull Request I am happy to include it - great work

rogersmj · October 22, 2016, 12:23am

OK, I had some time to go back to the CSS refactoring again today to fix the issue where the application doesn’t work if you don’t have the optional CSS override files (oops…). Unfortunately SASS limitations make it slightly less elegant, but it’s still pretty easy. The branch has been updated. I’m going to open a pull request. New instructions on customizing (from the README):

If you want to customize the styles of your dashboard and widgets, there are two options:

A. You can edit the application.scss file (and the individual widget .scss files) directly (not recommended; if you pull down updates from the master repository, your changes might conflict/be overwritten)

B. Create override files (recommended)

Create a couple of additional files in the assets/stylesheets directory: _application_custom.scss and _variables_custom.scss.

Open _application.scss and go to the bottom of the file. Uncomment the @import line.

Open _variables.scss and go to the bottom of the file. Uncomment the @import line.

Write your own SASS styles in _application_custom.scss (for general style customization) and _variables_custom.scss (for colors). You can customize those files without worrying about your changes getting overwritten if you pull down an update. The most you may have to do, if you update, will be to uncomment the @import lines again from steps 2 and 3.

_Note: The _variables.scss file (and your customizations from _variables_custom.scss) get imported into nearly every widget’s SCSS file, so it is a best practice to define varaibles for colors in _variables.scss or variables_custom.scss and reference those variables in the widget SCSS.

kenshin · October 22, 2016, 2:39am

How do i do the pull request? Sorry, I am not a programmer. Will take a look when I come back home today.

kenshin · October 22, 2016, 8:21am

Just quickly learned how to use github and not sure if this is the correct way to do it, but here you go.

This is a dumb version just to get the camera widget to work, many things is hard coded, including the camera api link, http and https, so pleae improve it if you can. I am not a programmer, just getting lucky to get all the code working.

jgon · October 22, 2016, 3:00pm

Hi,

What browser are you using in iPad in full screen mode for HA?

@kenshin thanks! i’m going to test it with my cameras. After a few changes i got it working but using the JPEG service from the ipcam.

Thanks!

kenshin · October 22, 2016, 3:05pm

I use fully kiosk browser for android.

Yes, I also used the link from my ip cam to get the jpg to test the script then I decided to use the api from HASS as not all my cameras support the jpg from weblink.

aimc · October 23, 2016, 5:23pm

Thanks - this is great work!

I’ll need to make a few changes and I don;t have a camera to test on yet, but I will order one shortly then add this into the dashboard.

jgon · October 23, 2016, 9:41pm

Hi,

How can I use Hameter without round the value?

Thanks!

ReneTode · October 23, 2016, 10:08pm

I am using Hameter also and it gives the whole figure.

how many figures do you want to see? maybe you need to make the character smaller.

jgon · October 24, 2016, 1:27am

Thanks @ReneTode,

I have made a “haenergymeter” widget for show energy meter with diferent background colour based on the value of energy consumption:

The code: https://github.com/gonzalezcalleja/haenergymeter

gustafh · October 26, 2016, 10:00am

Huge thanks for this project! Absolutely brilliant!

Two questions: is it possible to get a 24 hr clock? I tried to edit the clock.coffee but nothing happened, even after restart (and re-run) of the Docker container. I’m now re-building the container but it takes forever and a day so I’d rather not be doing that every time I want to change something (I’m not well versed in neither Linux nor programming so I’m probably missing something obvious here). Second question, is it possible to use other icons than Font Awesome and how would I go about finding/adding those?

ReneTode · October 26, 2016, 11:18am

i changed the clock.coffe and that resulted in a 24 hours clock.
so that should work.

gustafh · October 26, 2016, 11:55am

So perhaps it’s something with me running this in Docker? Rebuilding it now with --no-cache to see if that was the issue.

ReneTode · October 26, 2016, 3:11pm

i dont have docker, so that could be the problem.
cache can be a pain in the ass sometimes.

kenshin · October 26, 2016, 11:54pm

Hi aimc,

Is it normal that each time after dashing restart, the dashboard interface require 10+ secs to load again? The problem I got is that I have a routine to restart the Raspberry pi server everyday, so who ever try to use the dashboard the 1st time after the server restart will need to wait for the page to load before they can turn on any light.

It will be good if this process can be forced behind the scene as soon as dashing is restarted.

Thanks.

aimc · October 27, 2016, 12:09pm

This is expected behavior - Dashing recompiles all the CSS the first time it is started. I am not aware of an easy way to fix this in the product itself, but you could try running a wget command against your dashboard shortly after startup to get the process running. You should be able to automate this via startup scripts or a cron job.