From 7be6c6536af4cbac2568e225d5afbd2de6c2f8f6 Mon Sep 17 00:00:00 2001 From: Andrew Zaborowski Date: Thu, 9 Apr 2020 16:12:21 +0200 Subject: [PATCH] Add webserver-v1.js click handlers for Cover buttons (#521) Add js click handlers for the web UI buttons added in b1f9c9a6e0a3dce73507e6b60782987ee2459f48 in the esphome repository. Since this change doesn't make the .js file incompatible with esphome versions before the referenced commit I guess there's no need to rename the file to -v2. There are probably better ways to write those click handlers, for example we could have a common function to launch the POST request to a URL that it reads from the button object like this: var button_onclick = function(evt) { const xhr = new XMLHttpRequest(); xhr.open("POST", evt.target.onlick_post_url, true); xhr.send(); }; row.children[2].children[0].addEventListener('click', button_onlick); row.children[2].children[0].onclick_post_url = '/light/' + id.substr(6) + '/toggle'; The only problem with this is that iirc ``evt.target`` is browser-specific. --- _static/webserver-v1.js | 14 ++++++++++++++ _static/webserver-v1.min.js | 2 +- 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/_static/webserver-v1.js b/_static/webserver-v1.js index 0b4744a1c..483284b86 100644 --- a/_static/webserver-v1.js +++ b/_static/webserver-v1.js @@ -56,4 +56,18 @@ for (; row = states.rows[i]; i++) { }); })(row.id); } + if (row.classList.contains("cover")) { + (function(id) { + row.children[2].children[0].addEventListener('click', function () { + const xhr = new XMLHttpRequest(); + xhr.open("POST", '/cover/' + id.substr(6) + '/open', true); + xhr.send(); + }); + row.children[2].children[1].addEventListener('click', function () { + const xhr = new XMLHttpRequest(); + xhr.open("POST", '/cover/' + id.substr(6) + '/close', true); + xhr.send(); + }); + })(row.id); + } } diff --git a/_static/webserver-v1.min.js b/_static/webserver-v1.min.js index eabd23055..e2cbb4b4e 100644 --- a/_static/webserver-v1.min.js +++ b/_static/webserver-v1.min.js @@ -1 +1 @@ -const source=new EventSource("/events");source.addEventListener("log",function(a){const b=document.getElementById("log");let c="";a.data.startsWith("\x1B[1;31m")?c="e":a.data.startsWith("\x1B[0;33m")?c="w":a.data.startsWith("\x1B[0;32m")?c="i":a.data.startsWith("\x1B[0;35m")?c="c":a.data.startsWith("\x1B[0;36m")?c="d":a.data.startsWith("\x1B[0;37m")?c="v":b.innerHTML+=a.data+"\n",b.innerHTML+=""+a.data.substr(7,a.data.length-10)+"\n"}),source.addEventListener("state",function(a){const b=JSON.parse(a.data);document.getElementById(b.id).children[1].innerText=b.state});const states=document.getElementById("states");for(let a,b=0;a=states.rows[b];b++)a.classList.contains("switch")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/switch/"+b.substr(7)+"/toggle",!0),a.send()})}(a.id),a.classList.contains("fan")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/fan/"+b.substr(4)+"/toggle",!0),a.send()})}(a.id),a.classList.contains("light")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/light/"+b.substr(6)+"/toggle",!0),a.send()})}(a.id); \ No newline at end of file +const source=new EventSource("/events");source.addEventListener("log",function(a){const b=document.getElementById("log");let c="";a.data.startsWith("\x1B[1;31m")?c="e":a.data.startsWith("\x1B[0;33m")?c="w":a.data.startsWith("\x1B[0;32m")?c="i":a.data.startsWith("\x1B[0;35m")?c="c":a.data.startsWith("\x1B[0;36m")?c="d":a.data.startsWith("\x1B[0;37m")?c="v":b.innerHTML+=a.data+"\n",b.innerHTML+=""+a.data.substr(7,a.data.length-10)+"\n"}),source.addEventListener("state",function(a){const b=JSON.parse(a.data);document.getElementById(b.id).children[1].innerText=b.state});const states=document.getElementById("states");for(let a,b=0;a=states.rows[b];b++)a.classList.contains("switch")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/switch/"+b.substr(7)+"/toggle",!0),a.send()})}(a.id),a.classList.contains("fan")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/fan/"+b.substr(4)+"/toggle",!0),a.send()})}(a.id),a.classList.contains("light")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/light/"+b.substr(6)+"/toggle",!0),a.send()})}(a.id),a.classList.contains("cover")&&function(b){a.children[2].children[0].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/cover/"+b.substr(6)+"/open",!0),a.send()}),a.children[2].children[1].addEventListener("click",function(){const a=new XMLHttpRequest;a.open("POST","/cover/"+b.substr(6)+"/close",!0),a.send()})}(a.id); \ No newline at end of file