This is the forum archive of Homey. For more information about Homey, visit the Official Homey website.
The Homey Community has been moved to https://community.athom.com.
This forum is now read-only for archive purposes.
The Homey Community has been moved to https://community.athom.com.
This forum is now read-only for archive purposes.
Official
Comments
angular.js:11630 XMLHttpRequest cannot load file:///C:/Users/Robert/Desktop/HomeyDash-master/config.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
The page is just showing the blue background color, that's it.
Do you know how to solve this? Also I found in the index.html 2 hardcoded IP addresses, presumably from your Homey? 192.168.2.72 ....Modified these to match my Homeys IP but still no luck.
Keep up the good work
Oh ye, need to fix those hardcoded ip's
The api key is the bearer token. If you go to my.athom.com and login it blinks in the adress bar. you can find it in the cookies or sniff the rest api as well.
Not sure if it runs ok without a webserver tho, haven't tried that
You might need something like xampp to run it on.
I think I should indead set it up on a webserver but I wanted to test it first. In Microsoft Edge, Internet Explorer and Google Chrome the page was just empty. Opened the index.html in Mozilla Firefox and the page loads and I can control my devices, although they do not show device icons.
Also I would like to say the performance seems to be really good. When I click on one of my Hue lights on your page the devices switches on or off instantly, really really cool! Thumbs up!
Currently i am testing it in chrome, so if you run it on a web server it should work in chrome as well. (since its working for me as well) The device icons are the ones hardcode in the index.html you should change the ip there, and they should work.
Currently working on the dim function
Not sure why, but might have something to do with css styling. But i am only testing in Chrome at the moment
Good that it works tho!
Dimming now works, had to change the "steps" to 10% instead of 1%. Otherwise it where to many api calls (every 1% one call).
To dim long press the device and drag left to decrease and right to increase.
On/off swithing is a single tap on the device.
A debouncer delays the call a few hundred milliseconds. If in the meantime another call is scheduled, the original get's cancelled. Some example code:
var debouncer = null;
function updateValue(val) {
if (debouncer) clearTimeout(debouncer);
setTimeout(function() {
actualUpdateValue(val);
}, 300);
}
This code would delay the call to the API until there hasn't been an update for 300ms.
Alternatively; if you do want to update the value whilst the user is sliding the dimmer, but want to limit the amount of API requests within a given time, you could implement the debouncer like this:
var lastValue = null;
var nextCall = null;
function updateValue(val) {
lastValue = val;
if (nextCall) return;
setTimeout(function() {
nextCall = null;
actualUpdateValue(val);
}, 300);
}
This makes sure the API is called, but it leaves at least 300ms between the calls. (This makes sure that when the user is sliding the dimmer, the user does see the target device change even though he/she doesn't take his/her finger of the screen).
Please note that the 300ms is just an example, you could try to use other values. In my personal experience 300ms works just fine for generic applications, but YMMV.
Thanks for the suggestion, going to try it out.
Not sure if the api couldn't handle it (on the desktop i had (almost) no issues with the 1%) or that it was the fact i was testing it on a touch device (that the device couldn't handle so much api requests).
Would u advise to use timeout or interval? I noticed that timeout triggerd really late on slow devices (since it builds up the requests). But interval gave me some disco lights so now and then
So it's not in the readme, you should read above comments.
I query the api for every zone. On first start you need to select a zone, and it saves it to the localstorage.
Every time you change to a zone, this setting gets updated to the new zone id.
Then i get a list of all the devices, and filter them based on the parent zone id.
What browser are you using? And did you check if you didn't move the device by accident?
thanks in advance.
@HansieNL I guess there are allot of tutorials on how to get a simple webserver running. The most common way for testing would be to install xampp or something similar. Then clone the git or download the zip and add it to the htdocs folder.
How to get the api key is in the readme.
Will have a look tonight to fix the hardcoded ip's in the html.
If you just have raspberry pi without a webserver you can install Apache using the command:
sudo su
apt-get install apache2
Files can be placed in /var/www
This is just to get a simple webserver up and running to try out the nice work @swttt is doing. I would not recommend making it accessible from the internet without doing some more configuration.
@swttt nice update with sliding to control the dimming level. It does work, although the actual dimming seems to have some delay after adjusting the dim level using the web interface. Perhaps this is due to my webserver which runs on a low performance raspberry pi 1....
Not sure, happend to me when controlling trough my iphone 6s and cheap tablet.
Going to edit the code as suggested by Superice, might improve the speed
Also, setTimeout and setInterval are by design specified wait AT LEAST the time you give it. Because JavaScript is single threaded, and has an event loop to handle asynchronous code, it'll never break a running piece of code to execute something asynchronous. Everything that does not happen right now (e.g. asynchronous) is scheduled in the event loop. Only if the engine is idle (every function has returned, but there are still HTTP requests running) then it'll run all other stuff from the event loop. So if you do a computationally expensive operation while the timeout is supposed to fire, it'll first finish the action you're doing and fire the setTimeout whenever the JS engine becomes idle. Normally this is close enough, but if you're doing expensive computations (lots of DOM updates, heavy algorithms etc.) it might fire later than expected. (This should be seen as a red flag, there are almost no cases where it's acceptable to compute heavy stuff without breaking it into tiny pieces so the event loop doesn't get blocked.)
Perhaps you're doing a lot of DOM operations when the user selects a percentage? Ideally, for 60fps silky smooth performance, you should allocate as little memory and do as few DOM operations as possible while the user is interacting with the page, or animations are playing. Garbage collection (when JS looks for old unused data in memory and throws it away, because it needs more space) may block code execution for tens or even hundreds of milliseconds on slow devices, which causes frames to drop, setTimeouts to fire later, and the UI to feel stuttery. Desktops don't suffer from this as much because they're much faster, but especially older mobile devices tend to freeze up when you're not careful. Writing high performance mobile UIs in a garbage collected languages is hard
Didn't had allot of time last week, so no progress.
Since z-wave is working, it took some time to add everything to the homey. And set up everything.
I also bought a cheap 7 inch tablet and noticed the current UI is too small for the tablet.
In chrome i checked with the "mobile device view", had it on 100% but still that isn't the true size. (might had something to do with pixels per inch or something)
Will look at the code posted above to get the dimmer more fluent and will investigate if there are alternative ways to control the dimmers. 7 inc is really smaller as expected, so the panning on the "device card" is really precies/small.
It looks amazing!
I am