Q: I want to add my cameras live video to the ioBroker Visualization. But adding the Snapshot or MJPEG Stream URL to an Image or iFrame Element doesn't seem to be very stable. The stream often stops and cannot be restarted. I saw your guide to use MotionEye to solve this problem. But that is too complicated for me. Is there a better solution?
A: Displaying a stream of single snapshots inside your browser can quickly lead to cache problems. To mediate this issue we recommend to display a preview of your cameras video with a low refresh rate (e.g. 1 snapshot every 5 seconds). By clicking on that preview we want to be able to open a floating window that displays the full resolution stream of our camera with the max. refresh rate of 1fps that the iobroker Vis supports.
Start by installing the jQuery-UI-Stil Widget Adapter from the adapter menu:
Now open the Vis configuration window and add a Cam/Snapshot Dialog widget:
For a camera with the IP address 192.168.2.117, the HTTP Port 80 and the user login admin/instar (change thos according to your camera setup) add the following URL in the group_icon / icon field and give it an Update Interval in milliseconds, e.g. 5000 to update the image every five seconds:
http://192.168.2.117:80/tmpfs/auto.jpg?usr=admin&pwd=instarEvery camera has 3 snapshots with different resolutions - auto.jpg is the snapshot with a medium resolution.
For the Dialog URL we want to use the highest resolution instead - with snap.jpg - and an Update Interval of 1000 ms:
http://192.168.2.117:80/tmpfs/snap.jpg?usr=admin&pwd=instar