105 lines
3.7 KiB
JavaScript
105 lines
3.7 KiB
JavaScript
const source = new EventSource("/events");
|
||
|
||
source.addEventListener('log', function (e) {
|
||
const log = document.getElementById("log");
|
||
let klass = '';
|
||
if (e.data.startsWith("[1;31m")) {
|
||
klass = 'e';
|
||
} else if (e.data.startsWith("[0;33m")) {
|
||
klass = 'w';
|
||
} else if (e.data.startsWith("[0;32m")) {
|
||
klass = 'i';
|
||
} else if (e.data.startsWith("[0;35m")) {
|
||
klass = 'c';
|
||
} else if (e.data.startsWith("[0;36m")) {
|
||
klass = 'd';
|
||
} else if (e.data.startsWith("[0;37m")) {
|
||
klass = 'v';
|
||
} else {
|
||
log.innerHTML += e.data + '\n';
|
||
}
|
||
log.innerHTML += '<span class="' + klass + '">' + e.data.substr(7, e.data.length - 10) + "</span>\n";
|
||
});
|
||
|
||
source.addEventListener('state', function (e) {
|
||
const data = JSON.parse(e.data);
|
||
document.getElementById(data.id).children[1].innerText = data.state;
|
||
});
|
||
|
||
const states = document.getElementById("states");
|
||
let i = 0, row;
|
||
for (; row = states.rows[i]; i++) {
|
||
if (!row.children[2].children.length) {
|
||
continue;
|
||
}
|
||
|
||
if (row.classList.contains("switch")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('click', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/switch/' + id.substr(7) + '/toggle', true);
|
||
xhr.send();
|
||
});
|
||
})(row.id);
|
||
}
|
||
if (row.classList.contains("fan")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('click', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/fan/' + id.substr(4) + '/toggle', true);
|
||
xhr.send();
|
||
});
|
||
})(row.id);
|
||
}
|
||
if (row.classList.contains("light")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('click', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/light/' + id.substr(6) + '/toggle', true);
|
||
xhr.send();
|
||
});
|
||
})(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);
|
||
}
|
||
if (row.classList.contains("select")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('change', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/select/' + id.substr(7) + '/set?option=' + encodeURIComponent(this.value), true);
|
||
xhr.send();
|
||
});
|
||
})(row.id);
|
||
}
|
||
if (row.classList.contains("number")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('change', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/number/' + id.substr(7) + '/set?value=' + encodeURIComponent(this.value), true);
|
||
xhr.send();
|
||
});
|
||
})(row.id);
|
||
}
|
||
if (row.classList.contains("button")) {
|
||
(function(id) {
|
||
row.children[2].children[0].addEventListener('click', function () {
|
||
const xhr = new XMLHttpRequest();
|
||
xhr.open("POST", '/button/' + id.substr(7) + '/press', true);
|
||
xhr.send();
|
||
});
|
||
})(row.id);
|
||
}
|
||
}
|