Camera widget doesn't work

xbmcnut · November 6, 2018, 1:01am

I have no issue with that. Script works brilliantly, thank you again. Just what the Doctor ordered.

ReneTode · November 6, 2018, 1:20am

for someone like you i order to read the docs from beginning to end and back. and then 2 more times.
and with your power of imagination i know you will come up with a lot more stuff you can use

xbmcnut · November 6, 2018, 1:22am

Agreed, I’m a reader but a hardware guy, not a coder. The docs are great though and seeing as you can’t really break anything thanks to CTRL+Z, I’ll just keep tinkering.

ReneTode · November 6, 2018, 1:25am

i understand where you are coming from.
but believe me hardware guys can often do software stuff that software guys cant
and just the fact that you recognise that you can try without breaking, makes you more powerfull then a lot of other users.

budlyte · November 15, 2018, 9:45pm

I have read this tread from top to bottom and still can’t get my camera’s to work in HAD. Here is my definition
URL works fine in a browser except the camera is slow to respond.

Thanks

Blockquote

front_door_camera:
widget_type: camera
entity_picture: https://xxxxxxxx.duckdns.org:8123/api/camera_proxy/camera.front_door_camera?api_password=xxxxxxxxxxxxxx
layout:

include: navigation-definition
front_door_camera (6x3)

ReneTode · November 15, 2018, 11:12pm

did you set the api password in the http section from homeassistant?
hmm i guess so.

but you probably have no ssl in your dashboard.
mixing http and https is almost always asking for trouble.

the same with connecting to an outside DNS with appdaemon.

if you are not able to connect to a local ip address for HA, that is probably because you have ssl inside HA and opened up HA to the duckdns server.

a better way is to use a proxyserver like nginx or caddy.
that way you can remove ssl from your homeassistant and connect to your homeassistant locally without the need for internet (which slows things like camera and dashboards extremely down in some cases)

you probably use the mostly used solution, which is causing your troubles.

budlyte · November 16, 2018, 10:12pm

ReneTode: Thanks for the advice. Tried to install nginx from the addons repository. Configured it with my ducks dns but it will not start. No logs just nothing. I would think it would spit out some kind of error but just nothing. Will continue to search unless you know something that might help.

Thanks

ReneTode · November 17, 2018, 12:25am

sorry i would love to help but i have no clue about hassio and how the addon is created.
i heard from others that caddy was more easy to configure, so you could also try that (off course uninstall nginx before you try)
if you dont get it to work i think you better seek and or ask in the hassio section, because there will be more there that helps you (or try the hassio channel on discord)

budlyte · November 20, 2018, 10:50pm

ReneTode: Thanks for you response. I am looking at implementing caddy or nginx. In the mean time I would like to get hadashboard working with my camera’s. My camera widget is set up to use

https://budskiha.duckdns.org:8123/api/camera_proxy/camera.living_room?api_password=pswdforhassio

This works perfectly in both an in network browser as well as one located outside the network. It will not work in hadashboard. I get a black box with a little box in the upper left corner. My appdaemon.yaml looks like this.

secrets: /config/secrets.yaml
log:
logfile: STDOUT
errorfile: STDERR
appdaemon:
threads: 10
app_dir: /config/appdaemon/apps
plugins:
HASS:
type: hass
ha_url: http://hassio/homeassistant
token: d1027f3…
hadashboard:
dash_url: http://192.168.1.104:5050
dash_dir: /config/appdaemon/dashboards
accessfile: /config/log/dash_access
dash_ssl_certificate: /ssl/fullchain.pem
dash_ssl_key: /ssl/privkey.pem

Thanks again for you help.

ReneTode · November 20, 2018, 11:11pm

did you set

http:
  api_password: pswdforhassio

in your configuration.yaml from HA?
then your problem is probably because you use a http url (dashboard) to reach an https url (camera)
which browsers dont allow.

you could try to use ssl inside the dashboard (dash_url: https) but im not sure if it will solve your trouble.

but i also see you use http://hassio/homeassistant as url for home assistant, so you could try
http://hassio/homeassistant/api/camera_proxy/camera.living_room?api_password=pswdforhassio

edit: and please provide yaml as codeblock. the way you have presented it now, is useless.

marco.mortari · December 5, 2018, 9:57am

ho impostato il refresh a 1 sec Tutto funziona correttamente su pc ,ma quando vado su tablet il refresh non funziona.
uso chrome su entrambi, ho provato safari su tablet ma non fa refresh.
ci sono delle impostazioni browser diverse di sul tablet ?

ReneTode · December 5, 2018, 10:25am

sorry english only

marco.mortari · December 5, 2018, 10:53am

All work fine on pc with Chrome, but when i use tablet camera image not refresh.
I test Chrome and safari on tablet but same problem ,any idea?

ReneTode · December 5, 2018, 11:06am

yes thats probably a cache problem.
disable cache on the tablet.

on the tablet also use chrome not the default browser.

if that doesnt work and the tablet is really old, it could be that you got an to old version from chrome

marco.mortari · December 5, 2018, 11:54am

tablet ipad air ,i use chrome but same problem. i use unknown navigation for cache ,i have empty cache, butnothing.

ReneTode · December 5, 2018, 11:57am

unknown navigation still uses cache.
the problem is that the picture is loaded and not reloaded because your browser thinks its the same, so to speed things up it loads it from the tablet itself.

marco.mortari · December 5, 2018, 12:15pm

i don’t find any solution for ddissable cache on the tablet. not for chrom and not for safari,
any suggestions…

ReneTode · December 5, 2018, 12:20pm

searching google for disable cache and the type from your tablet.
i am no expert on tablet settings.

just to make sure 1 question: do your other widgets update their status?
if not then its another problem.

ccullen · December 6, 2018, 3:06am

How did you get it to work??

rds76 · December 23, 2018, 10:32pm

For those who are looking for fullscreen images on HADash, I made a little hack.You just need to add short code to variables.yaml in your skin definiton folder.
here is code:

head_includes:
 - <! head tags go here ->
 - |
      <style>
         #fullImgHack .title {position: absolute; bottom: 0px; margin: 0px 0px 0px 0px; width: 100%; font-size: 120%;}
         #fullImgHack .outer-image {width: 100%; height: 100%;}
         /* use 'max-height' instead of 'height' to prevent smaller images to stretch */
         #fullImgHack .img-frame {height: 100%; display: block; margin: auto;}
      </style>

body_includes:
 - <! body tags go here ->
 - |
      <script>
        /**
        * ** Fullscreen on img click hack - good for fullview cameras **
        */

       var
       // set timeout in sec to auto hide fullscreen mode, 0 to stay untill you click again
        ihRetainTimeout = 30,
       // based on widget name (be carefull as non alfa letters are replaced with '-'; leave empty [] for all images with 'img-frame' class
        ihIdKeywords = ['cam', 'radar'];

       $(function(){var b=null;var c=null;var d=function(a){if(b){$('#fullImgHack').hide();$('#fullImgHack').children().appendTo(b);b=null;if(c){clearTimeout(c);c=null}}else{b=$(a.target).parents().eq(1);$(a.target).parent().siblings('h1').appendTo($('#fullImgHack'));$(a.target).parent().prependTo($('#fullImgHack'));$('#fullImgHack').show();if(ihRetainTimeout>0)c=setTimeout(d,ihRetainTimeout*1000)}};$('img').parent().prev('.outer-frame.iframe').hide();$('<div id="fullImgHack" class=""></div>').attr('style',$('.gridster ul').attr('style')).css({'z-index':1,'position':'absolute','overflow':'hidden'}).hide().prependTo($('.gridster'));$(ihIdKeywords.length>0?ihIdKeywords.map(item=>'[id*='+item+'] .img-frame').join(', '):'.img-frame').click(d)});
      </script>

original unshrinked js code:

    $(function() {
         var lastParent = null, imgHackTimer = null;
         var onImgClickHack = function(evnt){
           // if(evnt) console.log(evnt.target.src);
           if (lastParent) {
             $('#fullImgHack').hide();
             $('#fullImgHack').children().appendTo(lastParent);
             lastParent = null;
             if (imgHackTimer) { clearTimeout(imgHackTimer); imgHackTimer = null;}
           } else {
             lastParent = $(evnt.target).parents().eq(1);
             $(evnt.target).parent().siblings('h1').appendTo($('#fullImgHack'));
             $(evnt.target).parent().prependTo($('#fullImgHack'));
             $('#fullImgHack').show();
             if (ihRetainTimeout > 0)
               imgHackTimer = setTimeout(onImgClickHack, ihRetainTimeout * 1000);
           }
         }
         // hide iframe element which overlaps img due z-index +1
         $('img').parent().prev('.outer-frame.iframe').hide();
         // crate nice hidden absulute div which has same dimensions as <ul> and put it inside gridster
         $('<div id="fullImgHack" class=""></div>')
               .attr('style', $('.gridster ul').attr('style'))
               .css({'z-index': 1, 'position':'absolute', 'overflow': 'hidden'})
               .hide()
               .prependTo($('.gridster'));
         // hook on click to selected images
         $(ihIdKeywords.length > 0 ?  ihIdKeywords.map(item => '[id*='+item+'] .img-frame').join(', ') : '.img-frame').click(onImgClickHack);
    });