Page 1 of 10

Dashticz IP Cameras - Features, Fixes & Updates

Posted: Saturday 07 March 2020 10:55
by clinkadink
In Dashticz, users can display their cameras using buttons, like this:

Code: Select all

var buttons = {}
buttons.webcam = {width:12, isimage:true, refresh:2000, btnimage: 'http://ip_url_to_webcam', url: 'http://ip_url_to_webcam', framewidth:500, frameheight:400}
I have been using this with 8 of my Hikvision IP cameras. They display the image fine in the dashboard. But when I click on the image, all I see is an empty popup window (modal), that fills less than half my screen.

Is there any demand for a dedicated block in Dashticz, specifically for IP cameras?

If so, what kind of block settings would we like to see? Mock-up below as a starter for ten ...

Code: Select all

blocks['garage_cam] = {
   type: 'camera'
   imageUrl: 'http://192.168.1.234:5678?res=640x480&snapshot=1',
   videoUrl: 'http://192.168.1.234:5678?res=1920x1080&fps=15', 
   refresh: 1000,
   width: 6,
   height: 300
}
Understandably, only certain camera stream protocols are supported. Browsers can natively play HTTP streams, but not RTSP streams. The latter requires client side plugins (e.g. VLC, ActiveX, etc) or server side conversion. If you have IP cameras, and you can view your streams via HTTP protocol (as shown in the example above), then you will be able to view them in Dashticz - using the current 'buttons' method, or any new 'dedicated' block method (if implemented).

Re: Dashticz IP Cameras

Posted: Wednesday 11 March 2020 21:02
by clinkadink
This is a prototype camera block in Dashticz ...
Spoiler: show

Code: Select all

blocks['camera_1'] = {
	imageUrl: 'http://192.168.1.234/ISAPI/Streaming/channels/102/picture',
	videoUrl: 'http://192.168.1.234/ISAPI/Streaming/channels/101/httppreview',
	refresh: 500,
	width: 6,
	height: 300
}
Image

Re: Dashticz IP Cameras

Posted: Wednesday 11 March 2020 22:36
by EdwinK
Looks nice ;)

Re: Dashticz IP Cameras

Posted: Thursday 02 April 2020 21:05
by jjnh
Yes, looks great. Looking forward to it!!

Re: Dashticz IP Cameras

Posted: Thursday 02 April 2020 21:19
by Minglarn
Looks promising!
Good work!

Re: Dashticz IP Cameras

Posted: Friday 03 April 2020 16:58
by clinkadink
This is now available in the latest beta, as of today.

Code: Select all

blocks['garage_cam] = {
   type: 'camera',
   imageUrl: 'http://192.168.1.234:5678?res=640x480&snapshot=1',
   videoUrl: 'http://192.168.1.234:5678?res=1920x1080&fps=15', 
   refresh: 1000,
   width: 6,
   height: 300
}
imageUrl - this is the url for the static image of the camera. The refresh property will be used to refresh the image.
videoUrl - this is the url for the fullscreen live video stream. I have tested with an mjpeg stream and it works well.

The above IP camera block will show a preview (image that is refreshed) in your Dashticz screen. When you click on the preview, the camera block will become fullscreen, and switch to the live video stream. There will be a handle at the bottom center of the screen, used to display the camera tray. When clicked any other cameras will be presented in the tray. If you click on them, it will update the fullscreen video stream.

This has been designed mainly for those users with several cameras, which provide both an image stream and a video stream.

Image

If anyone wishes to test this and has any issues, please can you provide the IP camera's make, model and url (without credentials) in your reply.

Cheers ;)

Re: Dashticz IP Cameras

Posted: Friday 03 April 2020 20:02
by Minglarn
Great work!
Works flawless with IPCAMERA for Android devices.
Using IP Webcam for Android witch streams in mjpeg format.

Thanks!

Re: Dashticz IP Cameras

Posted: Friday 03 April 2020 20:06
by clinkadink
That's great news!! Thanks for the feedback :D

Re: Dashticz IP Cameras

Posted: Saturday 04 April 2020 16:51
by jon205
Just tested this, works great. When you add the cameras to Domoticz, you can use the Domoticz camera url to get a live camerastream (updated every x millisecs) in Dashticz.

Code: Select all

blocks['cam1'] = {
   type: 'camera',
   imageUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=1',
   videoUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=1', 
   refresh: 1000,
   width: 12,
   height: 300
}

blocks['cam2'] = {
   type: 'camera',
   imageUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=2',
   videoUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=2', 
   refresh: 1000,
   width: 12,
   height: 300
}
This results in a small live preview and when clicked on, it's fullscreen. So if Domoticz supports the cam, so does Dashticz. Whether a RTSP or HTTP stream..

Thanks for the update!

Jon.

Re: Dashticz IP Cameras

Posted: Saturday 04 April 2020 19:50
by clinkadink
Good spot with the Domoticz camera urls, forgot about those (and I have them). Glad it works with them too :)

Re: Dashticz IP Cameras

Posted: Tuesday 07 April 2020 11:16
by nfuse
nice work on the camera plugin i also try'd days to get the popup screen to work with iframe scaling but it was a pain and never workt the way i wanted it.

i only have a small problem (not a big one for me) but the focussed icons from dashtics are seeing true the popup when i click my camera picture.
i apply'd the latest beta but i cant figure it out.

here is an example:

Image

any ideas?

Re: Dashticz IP Cameras

Posted: Tuesday 07 April 2020 17:47
by clinkadink
It sounds as if your icons have a high z-index. Try adding this to your custom.css file.

Code: Select all

.cam-container .stream {
    z-index: 10000;
}

Re: Dashticz IP Cameras

Posted: Tuesday 07 April 2020 20:48
by nfuse
jon205 wrote: Saturday 04 April 2020 16:51 Just tested this, works great. When you add the cameras to Domoticz, you can use the Domoticz camera url to get a live camerastream (updated every x millisecs) in Dashticz.

Code: Select all

blocks['cam1'] = {
   type: 'camera',
   imageUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=1',
   videoUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=1', 
   refresh: 1000,
   width: 12,
   height: 300
}

blocks['cam2'] = {
   type: 'camera',
   imageUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=2',
   videoUrl: 'http://192.168.1.201:8080/camsnapshot.jpg?idx=2', 
   refresh: 1000,
   width: 12,
   height: 300
}
This results in a small live preview and when clicked on, it's fullscreen. So if Domoticz supports the cam, so does Dashticz. Whether a RTSP or HTTP stream..

Thanks for the update!

Jon.
Great! was looking for this because with hikvision i always need to login first (hikvision does not accept username and pass in url)

Re: Dashticz IP Cameras

Posted: Tuesday 07 April 2020 21:38
by clinkadink
nfuse wrote: Tuesday 07 April 2020 20:48 Great! was looking for this because with hikvision i always need to login first (hikvision does not accept username and pass in url)
My Hikvision cameras do support username and password in the URL. Are you using the old or new format?

This is what I used to develop the camera block in Dashticz (on Chrome), which I am using now:

Code: Select all

var hikvisionUrl = 'http://192.168.1.99/Streaming/Channels/101?user=username&pwd=password'
However, Chrome (and other browsers) did stop the old method below, which will no longer work:

Code: Select all

var hikvisionUrl = 'http://username:[email protected]/Streaming/Channels/101'
Make sure you have web authenticaton set to "digest/basic" under Security in the camera(s). You shouldn't get prompted when passing user/pwd then.
Image

Re: Dashticz IP Cameras

Posted: Tuesday 07 April 2020 23:18
by nfuse
clinkadink wrote: Tuesday 07 April 2020 21:38
nfuse wrote: Tuesday 07 April 2020 20:48 Great! was looking for this because with hikvision i always need to login first (hikvision does not accept username and pass in url)
My Hikvision cameras do support username and password in the URL. Are you using the old or new format?

This is what I used to develop the camera block in Dashticz (on Chrome), which I am using now:

Code: Select all

var hikvisionUrl = 'http://192.168.1.99/Streaming/Channels/101?user=username&pwd=password'
However, Chrome (and other browsers) did stop the old method below, which will no longer work:

Code: Select all

var hikvisionUrl = 'http://username:[email protected]/Streaming/Channels/101'
Make sure you have web authenticaton set to "digest/basic" under Security in the camera(s). You shouldn't get prompted when passing user/pwd then.
Image
i try'd those settings but they didn't work for me, maybe i have an older recorder (DS-7604NI-E1 / 4P/A with webversion V4.0.1 build 170814)thanks for the help anyway

Re: Dashticz IP Cameras

Posted: Wednesday 08 April 2020 18:50
by HFman
Nice one.. but don't get it working...

With the Hikvision directly, the picture showes up corectly, but after that NO updates.

buttons.webcam = {width:12, isimage:true, refresh:1000, btnimage: 'http://192.168.1.10/Streaming/Channels/1/picture?', url: 'http://192.168.1.10/Streaming/Channels/1/picture?', framewidth:500, frameheight:400}

any clue.. (via Domoticz server works).

Re: Dashticz IP Cameras

Posted: Wednesday 08 April 2020 19:10
by clinkadink
The camera block is designed for IP cameras that can provide MJPEG streams.
The imageUrl is for the image (snapshot) and the refresh parameter refreshes this image every [n] milliseconds. However, that is just preview image on the block. Domoticz uses the same method, they do not receive/show a video stream. It is just displaying multiple images per second.
The videoUrl is for the MJPEG stream, i.e. the video. You have added the image url to this, which is why it isn't working.

A lot of Hikvision cameras support MJPEG streaming. You need to find the url for yours, and add that as the videoUrl.

Re: Dashticz IP Cameras

Posted: Wednesday 08 April 2020 19:30
by HFman
This i fully get... it should update every second right.. just like in domoticz, this it doesn't do. not at the frontpage, and not when I open the camera URL. I can open a RTSP stream with VLC, but the MPEG stream i didn't find yet...

Re: Dashticz IP Cameras

Posted: Wednesday 08 April 2020 19:45
by clinkadink
When you paste your url into a browser, do you see the picture or are you prompted for credentials?

Re: Dashticz IP Cameras

Posted: Wednesday 08 April 2020 20:37
by HFman
first time credentials, but when I fill and remember, then it will not ask again. (your way doesn't work..)
Before i used : forcerefresh:1 but this seems now also not to work..

So every time i when i reload (F5) it update to the lastest picture but after that, no update... (without asking for the credentials)