diff --git a/static/juice.css b/static/juice.css index 2cd0187..346e45c 100644 --- a/static/juice.css +++ b/static/juice.css @@ -54,7 +54,7 @@ nav span:hover { .ip_address { font-size: 0.8em; font-style: italic; - color: darkgray; + color: dimgray; margin: 0.2em; } diff --git a/static/juice.js b/static/juice.js index a6fb643..7334841 100644 --- a/static/juice.js +++ b/static/juice.js @@ -2,7 +2,7 @@ function load() { Object.entries(init_state).forEach(([device_id, sub_devs]) => { let device = document.querySelector('#' + device_id); Object.entries(sub_devs).forEach(([sub_dev_id, state]) => { - let sub_dev = device.querySelector('#' + sub_dev_id); + let sub_dev = device.querySelector('.' + sub_dev_id); let svg = sub_dev.querySelector('object').getSVGDocument().firstElementChild; if (state) { svg.classList.remove('off'); @@ -26,7 +26,7 @@ function toggle_outlet(svg) { let sub_dev = get_object_from_svg(svg).parentElement; let params = { device_id: sub_dev.parentElement.parentElement.id, - sub_dev_id: sub_dev.id + sub_dev_id: sub_dev.querySelector('.id').innerText, }; let query = Object.keys(params) .map(k => encodeURIComponent(k) + '=' + encodeURIComponent(params[k])) @@ -37,7 +37,7 @@ function toggle_outlet(svg) { }) .then(function(json) { if (!json.ok) { throw new Error('HTTP error, status = ' + json.status + ', message = ' + json.message); } - if (json[sub_dev.id]) { + if (json[sub_dev.querySelector('.id').innerText]) { svg.classList.remove('off'); svg.classList.add('on'); } else { diff --git a/templates/index.html b/templates/index.html index 44d5b81..709355a 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,11 +1,13 @@ - +