resoai / TileBoard

A simple yet highly configurable Dashboard for HomeAssistant
MIT License
1.63k stars 277 forks source link

IP Camera stream #577

Open Poli88 opened 3 years ago

Poli88 commented 3 years ago

Hi, I setup 2 x IP cameras in home assistant by using the ONVIF Integration and generated the two related entities "camera.ipcam_profile1" and "camera.ipcam_profile1_2". I would like to have a "Cameras" popup button on my home page, which will show the two cameras live stream one I touch the popup. I added the below code, but what I obtained is just the respective snapshot inside the popup page, but when I click each camera there is no live stream. Could you please help ?

                    {
                      position: [1,0],
                      width: 1,
                      type: TYPES.POPUP,
                      id: {},
                      state: false,
                      title: 'Cameras',
                      icon: 'mdi-cctv',
                      popup: {
                          titleSize: 100,
                          items: [
                            {
                               position: [0, 0],
                               id: 'camera.ipcam_profile1',
                               type: TYPES.CAMERA_THUMBNAIL,
                               bgSize: 'cover',
                               width: 2,
                               state: false,
                               fullscreen: {
                                  type: TYPES.CAMERA_STREAM,
                               },
                            },
                              {
                               position: [2, 0],
                               id: 'camera.ipcam_profile1_2',
                               type: TYPES.CAMERA_THUMBNAIL,
                               bgSize: 'cover',
                               width: 2,
                               state: false,
                               fullscreen: {
                                  type: TYPES.CAMERA_STREAM,
                               },
                            },
                          ]
                      }
                  },
alphasixtyfive commented 3 years ago

Set the type to TYPES.CAMERA_STREAM instead of TYPES.CAMERA_THUMBNAIL and remove fullscreen. bgsize would also need to be changed to objFit for TYPES.CAMERA_STREAM.

Poli88 commented 3 years ago

Thanksfor your reply, I tried to modify as per your suggestion (see below), but now even the snapshot disappeared and no stream. Any other hint ?

{
                      position: [1,0],
                      width: 1,
                      type: TYPES.POPUP,
                      id: {},
                      state: false,
                      title: 'Cameras',
                      icon: 'mdi-cctv',
                      popup: {
                          titleSize: 100,
                          items: [
                            {
                               position: [0, 0],
                               id: 'camera.ipcam_profile1',
                               type: TYPES.CAMERA_STREAM,
                               bgSize: 'objFit',
                               width: 2,
                               state: false,
                            },
                              {
                               position: [2, 0],
                               id: 'camera.ipcam_profile1_2',
                               type: TYPES.CAMERA_STREAM,
                               bgSize: 'objFit',
                               width: 2,
                               state: false,
                            },
                          ]
                      }
                  },
alphasixtyfive commented 3 years ago

bgsize must be changed to objFit, not assigned as a value :) does the camera support stream?

Poli88 commented 3 years ago

Ops :D corrected. But still not working. The camera supports RTSP...maybe shall we use that instead of the entity created in hassio ?

{
                      position: [1,0],
                      width: 1,
                      type: TYPES.POPUP,
                      id: {},
                      state: false,
                      title: 'Cameras',
                      icon: 'mdi-cctv',
                      popup: {
                          titleSize: 100,
                          items: [
                            {
                               position: [0, 0],
                               id: 'camera.ipcam_profile1',
                               type: TYPES.CAMERA_STREAM,
                               objFit: 'cover',
                               width: 2,
                               state: false,
                            },
                              {
                               position: [2, 0],
                               id: 'camera.ipcam_profile1_2',
                               type: TYPES.CAMERA_STREAM,
                               objFit: 'cover',
                               width: 2,
                               state: false,
                            },
                          ]
                      }
                  },
alphasixtyfive commented 3 years ago

You can't display RTSP directly. Is stream: even enabled? Any errors in browser console?

akloeckner commented 3 years ago

Also, could it be, that the stream is paused? There is some code which pauses the stream, if the tile is not on the current page. I'm not 100% sure, I patched that correctly when I fixed the camera in popups for the door entry popup.

Maybe you can spot an obvious mistake? I don't have stream cameras to test... https://github.com/resoai/TileBoard/blob/a057d2a146492eb62faaa9d819ef723efcaa42cb/index.html.ejs#L702

https://github.com/resoai/TileBoard/blob/a057d2a146492eb62faaa9d819ef723efcaa42cb/scripts/controllers/main.js#L1427

(This could be the issue with @alphasixtyfive's suggested changes applied, not with your original setup.)

akloeckner commented 3 years ago

Second thought that comes to my mind, the camera popup shows all cameras as per that function: https://github.com/resoai/TileBoard/blob/a057d2a146492eb62faaa9d819ef723efcaa42cb/scripts/controllers/main.js#L1652

As you can see, it does not deep-dive into popups. So, I guess your camera is not found for the standard camera popup (which opens when you click the camera thumbnail in your custom popup).

Try to

That might fix your original setup.

alphasixtyfive commented 3 years ago

I'm using two MJPEG and 18 (don't ask) STREAM cameras with no issues and freezing/unfreezing appears to be working fine in my setup.

akloeckner commented 3 years ago

freezing/unfreezing appears to be working fine

OK, then that's not it...

(don'task)

That's when I usually ask. ;-)

alphasixtyfive commented 3 years ago

I am feeling paranoid and proxy cameras from my parents house after they have been burgled. I’m now running TensorFlow on all of them...

akloeckner commented 3 years ago

😕 Sad to read that. And +1 for the techy helpout!

rchl commented 3 years ago

How to enable the 'stream' ? Home assistant Log viewer doesn't report any error...

https://www.home-assistant.io/integrations/stream/

Poli88 commented 3 years ago

Yes, I enabled the stream and tried to put the camera not in a popup, but in a tile on my main page. But without success. But I just noticed that I get an error on tileboard regarding the entity name...but entity name is copy pasted directly from Developers Tools:

image

image

So it seems like he cannot find the entity...any idea ?

Here the full Developers Tools description:

image

rchl commented 3 years ago

I have no idea how this could be the case. I'd maybe log this.states object to see if it's just cameras that are missing from the list or something more also. Maybe that will give some clue.

alphasixtyfive commented 3 years ago

This is very strange indeed, I can't even think about any circumstance under which an entity would be missing like this. At some point you did see a still image when using CAMERA tile instead of CAMERA_STREAM, right?

Poli88 commented 3 years ago

Yes, correct. By using CAMERA at the beginning I was able indeed to see the still image...but not live view. Anyway I temporary put the topic aside and I will keep doing some test in another moment ! Thanks a lot for the support :)

Il giorno gio 21 gen 2021 alle ore 16:26 άλφα 65 notifications@github.com ha scritto:

This is very strange indeed, I can't even think about any circumstance under which an entity would be missing like this. At some point you did see a still image when using CAMERA tile instead of CAMERA_STREAM, right?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/resoai/TileBoard/issues/577#issuecomment-764720778, or unsubscribe https://github.com/notifications/unsubscribe-auth/ARQACVQKIUJQN7FJEBVDE3TS3BBS3ANCNFSM4VRMG26Q .