Dashticz IP Cameras - Features, Fixes & Updates

[Lokonli]

Ok, changed the block as follows:


blocks['cam_stairs'] = {
type: 'camera',
imageUrl: 'http://192.168.90.10:8080/camsnapshot.jpg?idx=9',
refresh: 1,
width: 12,
height: 300
}

column section still:

columns[22] = {}
columns[22]['blocks'] = ['cam_stairs']
columns[22]['width'] = 12;

But still a blanco screen, only

Console:

A cookie associated with a cross-site resource at http://192.168.90.20/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.

VM1192:116 Error in response from calendar with icalurl http://192.168.90.10/repochalet/dashtic ... /basic.ics

(calendar is not working anymore, traffic map also stopped working, strange..)

In network section I don't see a request to: http://192.168.90.10:8080/camsnapshot.jpg?idx=9

The (Foscam) camera's are working in Domoticz and in Dashticz as a button..

Dashticz settings/info says I'm running 2020.2, 3.5 master, Python 3.5.3, PHP 7.3.12, dzVents 3.0.2

Don't even see a frame or something, just background and title/header.

Any suggestions?

There seems to be a problem with your calendar block. Can you temporarily remove it from you column and retest?

Sent from my SM-A320FL using Tapatalk

[repoman]

Ok, added forcerefresh and deleted the agenda. Here is the output:

Spoiler: show

bundle.js?t=2:102 The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. https://goo.gl/7K7WLu
(anonymous) @ bundle.js?t=2:102
js/domoticz-api.js:112 Setting up websocket
js/domoticz-api.js:169 [open] Connection established
bundle.js?t=2:37 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
send @ bundle.js?t=2:37
js/blocks.js:235 key not defined for block undefined
js/blocks.js:625 unknown string block Object
js/blocks.js:625 unknown string block Object
js/components/graph.js:27 TypeError: Cannot use 'in' operator to search for 'length' in 8
at isArrayLike (bundle.js?t=2:26)
at Function.each (bundle.js?t=2:26)
at Initialize (js/components/graph.js:43)
at Object.run (js/components/graph.js:17)
at js/dashticz.js:117
at fire (bundle.js?t=2:37)
at Object.add [as done] (bundle.js?t=2:37)
at _mountSpecialBlock (js/dashticz.js:111)
at Object._mount [as mount] (js/dashticz.js:266)
at getBlock (js/blocks.js:59)
run @ js/components/graph.js:27
js/blocks.js:235 key not defined for block undefined
js/blocks.js:625 unknown string block Object$mountPoint: jQuery.fn.init [div#block_121]c: 22entry: "block_121"key: "cam_stairs"mountPoint: "#block_121"type: "cam_stairs"width: 12__proto__: Object
index.html:1 A cookie associated with a cross-site resource at http://192.168.195.196/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
index.html:1 A cookie associated with a cross-site resource at http://192.168.90.20/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
index.html:1 A cookie associated with a cross-site resource at https://nu.nl/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
index.html:1 A cookie associated with a cross-site resource at http://nu.nl/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
js?key=AIzaSyD9fNWJVBKWzJwwPiovjDYabTFc0n22AAw&_=1593071557153:70 Google Maps JavaScript API error: InvalidKeyMapError
https://developers.google.com/maps/docu ... -map-error
_.me @ js?key=XXX_=1593071557153:70

The relevant part (I think):

unknown string block $
mountPoint: jQuery.fn.init [div#block_121]
c: 22
entry: "block_121"
key: "cam_stairs"
mountPoint: "#block_121"
type: "cam_stairs"
width: 12

[aghababaei]

nice, looks great
Good work!

[clinkadink]

The relevant part (I think):

Code: Select all

unknown string block  $
mountPoint: jQuery.fn.init [div#block_121]
c: 22
entry: "block_121"
key: "cam_stairs"
mountPoint: "#block_121"
type: "cam_stairs"
width: 12

There is no such type as "cam_stairs" in Dashticz. I think you mean "camera".

[repoman]

Yes, it's strange. In the block the type is camera:

blocks['cam_stairs'] = {
type: 'camera',
imageUrl: 'http://192.168.90.10:8080/camsnapshot.jpg?idx=9',
refresh: 1,
width: 12,
height: 300,
forcerefresh: 1
}

[Lokonli]

Yes, it's strange. In the block the type is camera:

blocks['cam_stairs'] = {
type: 'camera',
imageUrl: 'http://192.168.90.10:8080/camsnapshot.jpg?idx=9',
refresh: 1,
width: 12,
height: 300,
forcerefresh: 1
}

There seems to be an error in one of your graph blocks.
Maybe you used 'devices:8' instead of 'devices:[8]'.

If it's something else I propose that you start with empty column definitions and then start adding blocks one by one until you see errors in DevTools.

[repoman]

I also noticed the error in the graphs. Was my next problem to fix. (calendar already fixed)

Cleaned my config

Spoiler: show

var config = {}
config['domoticz_ip'] = 'http://192.168.90.10:8080';
config['login_timeout'] = '60';
config['user_name'] = 'domoticz username';
config['pass_word'] = 'domoticz password';
config['app_title'] = 'RepoChalet';
config['room_plan'] = '0';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '60';
config['default_news_url'] = 'http://www.nu.nl/rss/algemeen';
config['news_scroll_after'] = '10';
config['default_cors_url'] = '';
config['dashticz_php_path'] = 'http://192.168.90.10/repochalet/dashtic ... /dashticz/';
config['standby_call_url'] = '';
config['standby_call_url_on_end'] = '';
config['theme'] = 'default';
config['background_image'] = 'img/bg2.jpg';
config['standby_after'] = '5';
config['start_page'] = '1';
config['enable_swiper'] = '2';
config['vertical_scroll'] = '2';
config['auto_swipe_back_to'] = '0';
config['auto_swipe_back_after'] = '120';
config['auto_slide_pages'] = '0';
config['slide_effect'] = 'slide';
config['standard_graph'] = 'day';
config['blink_color'] = '255, 255, 255, 1';
config['language'] = 'nl_NL';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'nl_NL';
config['boss_stationclock'] = 'RedBoss';
config['speak_lang'] = 'en-US';
config['loginEnabled'] = 0;
config['disable_update_check'] = 0;
config['no_rgb'] = 1;
config['auto_positioning'] = 0;
config['use_favorites'] = 0;
config['disable_googleanalytics'] = 0;
config['last_update'] = 1;
config['hide_topbar'] = 0;
config['security_button_icons'] = 0;
config['edit_mode'] = 0;
config['hide_seconds'] = 1;
config['hide_seconds_stationclock'] = 0;
config['owm_days'] = 1;
config['owm_min'] = 1;
config['use_fahrenheit'] = 0;
config['use_beaufort'] = 0;
config['translate_windspeed'] = 1;
config['static_weathericons'] = 1;
config['hide_mediaplayer'] = 1;


var blocks = {}

blocks['cameras'] = {
type: "camera",
cameras: [
{
title: "Taw Hill, West View",
imageUrl: "http://192.168.90.10:8080/camsnapshot.jpg?idx=10",
},
{
title: "Taw Hill, North View",
imageUrl: "http://192.168.90.10:8080/camsnapshot.jpg?idx=9",
},
{
title: "Front Garden",
imageUrl: "http://192.168.90.10:8080/camsnapshot.jpg?idx=5",
},
],
width: 6,
height: 250,
refresh: 0.5, // seconds to refresh the image [***BREAKING CHANGE***]
traytimeout: 3, // seconds to keep the camera tray open
slidedelay: 3, // seconds before sliding to the next camera
forcerefresh: 1, // caching-prevention mechanism of the images
};



blocks['cam_stairs'] = {
type: 'camera',
imageUrl: 'http://192.168.90.10:8080/camsnapshot.jpg?idx=5',
refresh: 1,
width: 12,
height: 300,
forcerefresh: 1
}


blocks['cam_upstairs'] = {
type: 'camera',
imageUrl: 'http://192.168.90.10:8080/camsnapshot.jpg?idx=9',
refresh: 1,
width: 12,
height: 300,
forcerefresh: 1
}



var columns = {}
columns['bar'] = {}
columns['bar']['blocks'] = ['logo','miniclock','sunrise']

columns[1] = {}
columns[1]['blocks'] = ['çameras']
columns[1]['width'] = 12;

columns[2] = {}
columns[2]['blocks'] = ['cam_stairs','cam_upstairs']
columns[2]['width'] = 12;



var screens = {}
screens[1] = {}
screens[1]['background'] = 'bg4.jpg';
screens[1]['columns'] = [1]

screens[2] = {}
screens[2]['background'] = 'bg4.jpg';
screens[2]['columns'] = [2]

The first screen with the multi cam block is still empty but the second screens works

[Lokonli]

There is, literally, a little error in the following line:

Code: Select all

columns[1]['blocks'] = ['çameras']

The first c is cameras should be a normal c instead of c-cedille.

So try:

Code: Select all

columns[1]['blocks'] = ['cameras']

[madpatrick]

Gents,

I hope somebody can help me with my Hikvision cameras.
The cameras are working in Domoticz, but not in Dashticz

I'm trying to setup the cameras in Dashticz, but i can not a image to be displayed.

I've tried : http://192.168.1.235/ISAPI/Streaming/Ch ... &pwd=PASSW

Which is getting :

Code: Select all

(anonymous) @ js/components/camera.js:118
picture:1 GET http://192.168.1.236/ISAPI/Streaming/Channels/102/picture?user=admin&t=56564&pwd=PASSW 401 (Unauthorized)
Image (async)
attr @ bundle.js?t=3:303
access @ bundle.js?t=3:303
attr @ bundle.js?t=3:303
(anonymous) @ js/components/camera.js:118

When I paste the link in the chrome browser, I get a popup to login. This should not be the case, i think ??
Also when I fill in Username and Password, i see suddenly in Dashticz the webcam.
Clearing cache and i don't see anything anymore

I've also tried : http://admin:[email protected]/ISAPI/ ... 02/picture?
But then Chrome is saying http://USER:PASSW@IP is depreciated

On my tablet no cameras visible at all, both android as IOS

[Lokonli]

Try the url with basic-auth:

Code: Select all

http://admin:[email protected]/ISAPI/Streaming/channels/102/picture

while adding the following block parameter:

Code: Select all

   forcerefresh:2

Then the CORS proxy will be used to load the image. Maybe it works ...

[madpatrick]

Hi Lonli,

as mentioned:

I've also tried : http://admin:[email protected]/ISAPI/ ... 02/picture?
But then Chrome is saying http://USER:PASSW@IP is depreciated

[Ashitaka]

Hello,

I tested the new camera block, and it worked very well on Chrome, I tried it on Edge, and humm. I guess it doesn't worked well on Edge ^^'

All the camera are showing, there is no carousel, then when you click on a camera feed to show the stream, it crashed in console showing nothing and you are locked into the black popup ^^'.

Thanks for the hard work on the project!

Edit: I've got the same behavior on fully kiosk browser, but it disappeared(working well right now).... after several hours. really weird, still happening on Edge though.

[buck]

Hi,

I would like to see one camera on two different screens.
The problem is that on both screens the blocks have a height of 600 instead of one block 280px and one block of 600px. Does anyone have solution?
I got the following in my CONFIG.js:

Code: Select all

blocks['voordeur_cam'] = {
        title: 'Voordeur',
	type: 'camera',
        imageUrl: 'http://192.168.X:XX/camsnapshot.jpg?idx=X',
        refresh: 1,
	width: 12,
        height: 280, 
	forcerefresh: 1,
	key: 'voordeur_cam'
}

blocks['voordeur_cam2'] = {
	title: 'Voordeur',
        type: 'camera',
        imageUrl:'http://192.168.X:XX/camsnapshot.jpg?idx=X',
        refresh: 1,
	width: 10,
        height: 600,
	forcerefresh: 1,
	key: 'voordeur_cam2'
}

[geertvercamer]

I have the same problem as repoman: no image of the camera

Block definition:

Code: Select all

blocks['camera1'] = {
	type: 'camera',
	imageUrl: 'http://192.168.XXX.XXX:ZZZZ/camsnapshot.jpg?idx=1',
	refresh: 1,
	width: 6,
	height: 300,
	forcerefresh: 2,
	key: 'camera1'
}

Column definition:

Code: Select all

columns[3]['blocks'] = ['camera1'];

When I add the buttons.webcam method, both cameras are displayed.


I do see an error in the Chrome debug panel:
unknown string block

Object
$mountPoint: jQuery.fn.init [div#block_38]
c: 3
entry: "block_38"
key: "camera1"
mountPoint: "#block_38"
type: "camera1"

The type in the code definition is clearly set to 'camera' (see above)

so, it looks like the function handleStringBlock(blocktype, columndiv, c) on line 239 of blocks.js is called with a blocktype = 'camera1'
on line 60, typeof cols['blocks'][ b ] is 'camera1'
Haven't figured out anything more, maybe this is created in main.js? Couldn't have debugging stop at a breakpoint there.

[mojojojo490]

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.

Hi Jon, what IP do you use? From your Domoticz server?
When i use the ip from Domoticz of from my ipcamera, both it won't work...
Maybe is my problem that i work remotely at the moment

[jon205]

Hi Jon, what IP do you use? From your Domoticz server?
...

I use the IP-address of the Domoticz server:

Code: Select all

imageUrl: 'http://192.168.*.*:8080/camsnapshot.jpg?idx=2',
videoUrl: 'http://192.168.*.*:8080/camsnapshot.jpg?idx=2', 

Working remotely shouldn't be a problem. As long as Dashticz is able to communicate with the server, it should work. Doesn't matter if you're using Dashticz locally or remotely.

[mojojojo490]

Thanks. I did change the adress to my Domo serveradres, but unfortunately I don't get a picture.
Also the same with Microsoft Edge. (My default explorer is Chrome)
As you can see:

[clinkadink]

Gents,

I hope somebody can help me with my Hikvision cameras.
The cameras are working in Domoticz, but not in Dashticz

I'm trying to setup the cameras in Dashticz, but i can not a image to be displayed.

I've tried : http://192.168.1.235/ISAPI/Streaming/Ch ... &pwd=PASSW

When I paste the link in the chrome browser, I get a popup to login. This should not be the case, i think ??
Also when I fill in Username and Password, i see suddenly in Dashticz the webcam.
Clearing cache and i don't see anything anymore

I've also tried : http://admin:[email protected]/ISAPI/ ... 02/picture?
But then Chrome is saying http://USER:PASSW@IP is depreciated

On my tablet no cameras visible at all, both android as IOS

Chrome (and many other browsers/systems) are now preventing using basic authentication, i.e. passing your username/password like this:

Code: Select all

http://admin:[email protected]

Before, the browser would extract the username and password, and pass them in the Authorization header, allowing the user to authenticate. But due to security issues/exploits, depending on what camera/browser combo you have - this is or already has been removed. Instead, you will need to base encode your credentials, and pass them at the end of the url as parameter. This does get passed as a Authorization header. To base encode your credentials, visit the link below:

https://www.base64encode.org/

Enter your username and password in the top box, like this:

Code: Select all

username:password

Then press the "> ENCODE <" button. This will produce a base64 encoded string in the box below, like this:

Code: Select all

YWRtaW46cGFzc3dvcmQ=

In almost all IP cameras, they support passing credentials as a parameter. For Hikvision, the parameter is "auth", other cameras may differ.

For Hikvision cameras, this is what works for me, in Dashticz with my 8 Hikvision cameras.

To get the still image:

Code: Select all

http://192.168.1.10/ISAPI/Streaming/channels/2/picture?auth=base64encodedUsernamePassword

To get the live video:

Code: Select all

http://192.168.1.10/ISAPI/Streaming/channels/102/httppreview?auth=base64encodedUsernamePassword

You will also need to ensure your camera settings are configured correctly. Below are the settings that work for me. Edit the camera settings (I use iVMS-4200 on my PC, but they can be accessed via the IP address of the camera on Internet Explorer):

- System > Security > Authentication Type > Web = digest/basic
- System > Network > Integration Protocol > Hikvision CGI = ticked
- System > Network > Integration Protocol > Enable ONVIF = ticked
- System > Network > Integration Protocol > ONVIF Users List = add user, e.g. admin / Administrator / password

Then save the settings, update your CONFIG.js with the new URLs and try again.

I hope that helps.

[clinkadink]

I have the same problem as repoman: no image of the camera
Block definition:

Spoiler: show

Code: Select all

blocks['camera1'] = {
	type: 'camera',
	imageUrl: 'http://192.168.XXX.XXX:ZZZZ/camsnapshot.jpg?idx=1',
	refresh: 1,
	width: 6,
	height: 300,
	forcerefresh: 2,
	key: 'camera1'
}

Please can you try changing forcerefresh from 2 to 1 as shown below?

Code: Select all

blocks['camera1'] = {
  type: 'camera',
  imageUrl: 'http://192.168.XXX.XXX:ZZZZ/camsnapshot.jpg?idx=1',
  refresh: 1,
  width: 6,
  height: 300,
  forcerefresh: 1,
  key: 'camera1'
}

[clinkadink]

Thanks. I did change the adress to my Domo serveradres, but unfortunately I don't get a picture.
Also the same with Microsoft Edge. (My default explorer is Chrome)
As you can see:

See my comment in post above, check your forcerefresh setting on the block. If this doesn't work, post your block config for the camera.