Putting live video from (almost) any webcam/ip camera into your dashboard

Put your web/ip cam into tinyCam (or suchlike).
Activate the webserver in tinyCam.
Get the url for that camera (for example, for tinyCam it is like this):

http(s)://your_tinyCam_webserver_ip:your_tinyCam_webserver_port/axis-cgi/mjpg/video.cgi?user=blah&pwd=blahdeblah&camera=1&resolution=320x240

Add this driver to your Hubitat system:

preferences {
        input("src", "text", title: "iFrame Url",  required: true)
    }
metadata {
    definition (name: "iFrame", namespace: "srp", author: "srp") {
        capability "Switch"
        attribute "myFrame", "text"
    }
}
def on() {
    sendEvent(name: "switch", value: "on")
    sendEvent(name: "myFrame", value: "<div style='height: 100%; width: 100%'><iframe src='${src}' style='height: 100%; width:100%; border: none;'></iframe><div>")
}
def off() {
    sendEvent(name: "switch", value: "off")
}
def installed() {
    on()
}

Create a new device using this driver, and put your webcam url above into the html address for this device.

Create or access the dashboard you want to add your cameras to. Add the iFrame device you just created.

Presto!

(sorry the house is a bit of a mess, we have the in-laws staying :weary:) :rofl:

[updated: - see below, no need for the iFrame driver, just use an Image tile]

15 Likes

Update:

Woops, its even easier than that.
No need to add the iFrame driver.

Just create a simple image tile.
Put the url into either the image or the background image field. Using background scales the image to fill the tile which is perfect. You can adjust the resolution in the url itself of course.

Presto!
(and yes, the view updates live video, without needing any refresh parameter)

3 Likes

This work great. Thanks.

I tried something like this driver awhile back. It worked however after the video was activated the driver details page would just spin and spin and never load. Did you see any similar issues?

Definitely use the image tile instead of iframe. Click on the image tile will give you full screen of the tile image. One downside to image tile is that the refresh rate can not go lower than 1 second.

1 Like

Don't you wish cam drivers had built in barrel distortion correction :slight_smile:

i didnt put any refresh rate/time into the tile. Just leave it blank and it was playing live video feed from the webcam for me no problem :slight_smile:

Can this work with RTSP directly from a camera?

Not sure. I doubt it. This method uses the webserver of tinyCam to provide a url that the image tile can display. TinyCam does support RTSP cameras (it's the connection type I'm using for my Samsung cam) but I'm not sure if it's possible to connect that directly to a dashboard.

1 Like

No, this method will not work with an RTSP stream.

It is possible to place a link to the RTSP stream over top of an image or MJPEG stream, upon which you can click the link and open the RTSP stream. If the background of the image is completely transparent and the link name is just whitespace, you don't even notice it's above the image. That's what I do with my cameras.

2 Likes

Yeah, I didnt think it would work using the RTSP stream directly to an image tile. But it will work with RTSP if you put that stream first into tinyCAM (it supports RTSP) and then use tinyCAM's webserver to stream its video out as per the instructions above. So that's a very effective and cheap solution.

Yes, if you can create a different MJPEG stream than the RTSP that comes from the camera, that would work, with the image tile pointing to that other stream. I just use a built-in MJPEG stream directly from my cameras, so I don't have to make a new one.

I tried some options to see if this works. My Doorbird D101 has an MJPEG http options. The URL looks like this: http://admin:admin12@192.168.1.49/axis-cgi/mjpg/video.cgi
I cant get this to work in the background or the image of a tile. Did anyone have more luck?

I also have an option to use an HTML5 widget, which would be even beter if possible!

@pim.fortuyn.2002 Stick it in an image tile.

image

If the suggestion directly above doesn't work then I guess the html5 widget should display using the iframe driver in the 1st post of this thread. But the image tile should be able to show your mjpeg directly as mentioned by Lewis above.

So to run tinycam, do you have it running on a spare phone via WiFi or something. I have used tinycam, but would prefer to host it on a pi or docker or something. Any way to do that?

You might be able to load tinyCam Pro on the Pi with Android installed. I'm not sure if the app would be compatible though.

I know tinyCam Pro is also compatible with Fire TV, but I'm not sure how well that would work as a server.

tinyCAM doesn't run on a Pi. You have to use an old always-on smart phone or tablet.

Last night, based on this thread, I got Android virtual machine running in VirtualBox, installed Tinycam Pro and got a couple of cameras installed. It was late so I didn't go as far as trying to run the server. Stay tuned!

It will work fine, I guarantee it! Plus remember you can then also avail yourself of tinyCam's motion and object (people/vehicle/face/pet) tracking as per my other thread...