|
|
|
@ -213,6 +213,11 @@ function ajaxJsonSpin(method, url, ok_cb, err_cb) { |
|
|
|
|
|
|
|
|
|
|
|
//===== main menu, header spinner and notification boxes
|
|
|
|
//===== main menu, header spinner and notification boxes
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function hidePopup(el) { |
|
|
|
|
|
|
|
addClass(el, "popup-hidden"); |
|
|
|
|
|
|
|
addClass(el.parentNode, "popup-target"); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
onLoad(function() { |
|
|
|
onLoad(function() { |
|
|
|
var l = $("#layout"); |
|
|
|
var l = $("#layout"); |
|
|
|
var o = l.childNodes[0]; |
|
|
|
var o = l.childNodes[0]; |
|
|
|
@ -229,11 +234,7 @@ onLoad(function() { |
|
|
|
<div class="pure-menu">\ |
|
|
|
<div class="pure-menu">\ |
|
|
|
<a class="pure-menu-heading" href="https://github.com/jeelabs/esp-link">\ |
|
|
|
<a class="pure-menu-heading" href="https://github.com/jeelabs/esp-link">\ |
|
|
|
<img src="/favicon.ico" height="32"> esp-link</a>\ |
|
|
|
<img src="/favicon.ico" height="32"> esp-link</a>\ |
|
|
|
<div class="pure-menu-heading click-to-edit system-name" style="padding: 0px 0.6em">\ |
|
|
|
<div class="pure-menu-heading system-name" style="padding: 0px 0.6em"></div>\ |
|
|
|
<span class="edit-off"></span>\ |
|
|
|
|
|
|
|
<input class="edit-on" maxlength=12 hidden>\ |
|
|
|
|
|
|
|
<div class="edit-on popup" hidden>Short name for this esp-link, 12 chars max</div>\ |
|
|
|
|
|
|
|
</div>\ |
|
|
|
|
|
|
|
<ul id="menu-list" class="pure-menu-list"></ul>\ |
|
|
|
<ul id="menu-list" class="pure-menu-list"></ul>\ |
|
|
|
</div>\ |
|
|
|
</div>\ |
|
|
|
</div>\ |
|
|
|
</div>\ |
|
|
|
@ -251,6 +252,11 @@ onLoad(function() { |
|
|
|
toggleClass(ml, active); |
|
|
|
toggleClass(ml, active); |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// hide pop-ups
|
|
|
|
|
|
|
|
domForEach($(".popup"), function(el) { |
|
|
|
|
|
|
|
hidePopup(el); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
// populate menu via ajax call
|
|
|
|
// populate menu via ajax call
|
|
|
|
var getMenu = function() { |
|
|
|
var getMenu = function() { |
|
|
|
ajaxJson("GET", "/menu", function(data) { |
|
|
|
ajaxJson("GET", "/menu", function(data) { |
|
|
|
@ -267,8 +273,7 @@ onLoad(function() { |
|
|
|
var v = $("#version"); |
|
|
|
var v = $("#version"); |
|
|
|
if (v != null) { v.innerHTML = data.version; } |
|
|
|
if (v != null) { v.innerHTML = data.version; } |
|
|
|
|
|
|
|
|
|
|
|
setEditToClick("system-name", data.name); |
|
|
|
setEditToClick("system-name", data["name"]); |
|
|
|
makeAjaxInput("system", "name"); |
|
|
|
|
|
|
|
}, function() { setTimeout(getMenu, 1000); }); |
|
|
|
}, function() { setTimeout(getMenu, 1000); }); |
|
|
|
}; |
|
|
|
}; |
|
|
|
getMenu(); |
|
|
|
getMenu(); |
|
|
|
@ -313,7 +318,7 @@ function setEditToClick(klass, value) { |
|
|
|
|
|
|
|
|
|
|
|
function showSystemInfo(data) { |
|
|
|
function showSystemInfo(data) { |
|
|
|
Object.keys(data).forEach(function(v) { |
|
|
|
Object.keys(data).forEach(function(v) { |
|
|
|
setEditToClick("system-" + v, data[v]); |
|
|
|
setEditToClick("system-"+v, data[v]); |
|
|
|
}); |
|
|
|
}); |
|
|
|
$("#system-spinner").setAttribute("hidden", ""); |
|
|
|
$("#system-spinner").setAttribute("hidden", ""); |
|
|
|
$("#system-table").removeAttribute("hidden"); |
|
|
|
$("#system-table").removeAttribute("hidden"); |
|
|
|
@ -331,6 +336,8 @@ function makeAjaxInput(klass, field) { |
|
|
|
var eoff = $(".edit-off", div)[0]; |
|
|
|
var eoff = $(".edit-off", div)[0]; |
|
|
|
var url = "/"+klass+"/update?"+field; |
|
|
|
var url = "/"+klass+"/update?"+field; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (eoff === undefined || eon == undefined) return; |
|
|
|
|
|
|
|
|
|
|
|
var enableEditToClick = function() { |
|
|
|
var enableEditToClick = function() { |
|
|
|
eoff.setAttribute('hidden',''); |
|
|
|
eoff.setAttribute('hidden',''); |
|
|
|
domForEach(eon, function(el){ el.removeAttribute('hidden'); }); |
|
|
|
domForEach(eon, function(el){ el.removeAttribute('hidden'); }); |
|
|
|
@ -366,6 +373,7 @@ function showWarning(text) { |
|
|
|
var el = $("#warning"); |
|
|
|
var el = $("#warning"); |
|
|
|
el.innerHTML = text; |
|
|
|
el.innerHTML = text; |
|
|
|
el.removeAttribute('hidden'); |
|
|
|
el.removeAttribute('hidden'); |
|
|
|
|
|
|
|
window.scrollTo(0, 0); |
|
|
|
} |
|
|
|
} |
|
|
|
function hideWarning() { |
|
|
|
function hideWarning() { |
|
|
|
el = $("#warning").setAttribute('hidden', ''); |
|
|
|
el = $("#warning").setAttribute('hidden', ''); |
|
|
|
@ -384,36 +392,70 @@ function showNotification(text) { |
|
|
|
|
|
|
|
|
|
|
|
//===== GPIO Pin mux card
|
|
|
|
//===== GPIO Pin mux card
|
|
|
|
|
|
|
|
|
|
|
|
var currPin; |
|
|
|
var pinPresets = { |
|
|
|
// pin={reset:12, isp:13, LED_conn:0, LED_ser:2}
|
|
|
|
// array: reset, isp, conn, ser, swap, rxpup
|
|
|
|
function createInputForPin(pin) { |
|
|
|
"esp-01": [ 0, -1, 2, -1, 0, 1 ], |
|
|
|
var input = document.createElement("input"); |
|
|
|
"esp-12": [ 12, 14, 0, 2, 0, 1 ], |
|
|
|
input.type = "radio"; |
|
|
|
"esp-12 swap": [ 1, 3, 0, 2, 1, 1 ], |
|
|
|
input.name = "pins"; |
|
|
|
"esp-bridge": [ 12, 13, 0, 14, 0, 0 ], |
|
|
|
input.data = pin.name; |
|
|
|
"wifi-link-12": [ 1, 3, 0, 2, 1, 0 ], |
|
|
|
input.className = "pin-input"; |
|
|
|
}; |
|
|
|
input.value= pin.value; |
|
|
|
|
|
|
|
input.id = "opt-" + pin.value; |
|
|
|
function createPresets(sel) { |
|
|
|
if (currPin == pin.name) input.checked = "1"; |
|
|
|
for (var p in pinPresets) { |
|
|
|
|
|
|
|
var opt = m('<option value="' + p + '">' + p + '</option>'); |
|
|
|
var descr = m('<label for="opt-'+pin.value+'"><b>'+pin.name+":</b>"+pin.descr+"</label>"); |
|
|
|
sel.appendChild(opt); |
|
|
|
var div = document.createElement("div"); |
|
|
|
} |
|
|
|
div.appendChild(input); |
|
|
|
|
|
|
|
div.appendChild(descr); |
|
|
|
function applyPreset(v) { |
|
|
|
return div; |
|
|
|
var pp = pinPresets[v]; |
|
|
|
|
|
|
|
if (pp === undefined) return pp; |
|
|
|
|
|
|
|
console.log("apply preset:", v, pp); |
|
|
|
|
|
|
|
function setPP(k, v) { $("#pin-"+k).value = v; }; |
|
|
|
|
|
|
|
setPP("reset", pp[0]); |
|
|
|
|
|
|
|
setPP("isp", pp[1]); |
|
|
|
|
|
|
|
setPP("conn", pp[2]); |
|
|
|
|
|
|
|
setPP("ser", pp[3]); |
|
|
|
|
|
|
|
setPP("swap", pp[4]); |
|
|
|
|
|
|
|
$("#pin-rxpup").checked = !!pp[5]; |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
bnd(sel, "change", function(ev) { |
|
|
|
|
|
|
|
console.log("preset change:", sel.value); |
|
|
|
|
|
|
|
ev.preventDefault(); |
|
|
|
|
|
|
|
applyPreset(sel.value); |
|
|
|
|
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function displayPins(resp) { |
|
|
|
function displayPins(resp) { |
|
|
|
var po = $("#pin-mux"); |
|
|
|
function createSelectForPin(name, v) { |
|
|
|
po.innerHTML = ""; |
|
|
|
var sel = $("#pin-"+name); |
|
|
|
currPin = resp.curr; |
|
|
|
addClass(sel, "pure-button"); |
|
|
|
resp.map.forEach(function(v) { |
|
|
|
[-1,0,1,2,3,4,5,12,13,14,15].forEach(function(i) { |
|
|
|
po.appendChild(createInputForPin(v)); |
|
|
|
var opt = document.createElement("option"); |
|
|
|
}); |
|
|
|
opt.value = i; |
|
|
|
var i, inputs = $(".pin-input"); |
|
|
|
if (i >= 0) opt.innerHTML = "gpio"+i; |
|
|
|
for (i=0; i<inputs.length; i++) { |
|
|
|
else opt.innerHTML = "disabled"; |
|
|
|
inputs[i].onclick = function() { setPins(this.value, this.data) }; |
|
|
|
if (i===1) opt.innerHTML += "/TX0"; |
|
|
|
|
|
|
|
if (i===2) opt.innerHTML += "/TX1"; |
|
|
|
|
|
|
|
if (i===3) opt.innerHTML += "/RX0"; |
|
|
|
|
|
|
|
if (i==v) opt.selected = true; |
|
|
|
|
|
|
|
sel.appendChild(opt); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
var pup = $(".popup", sel.parentNode); |
|
|
|
|
|
|
|
if (pup !== undefined) hidePopup(pup[0]); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
createSelectForPin("reset", resp["reset"]); |
|
|
|
|
|
|
|
createSelectForPin("isp", resp["isp"]); |
|
|
|
|
|
|
|
createSelectForPin("conn", resp["conn"]); |
|
|
|
|
|
|
|
createSelectForPin("ser", resp["ser"]); |
|
|
|
|
|
|
|
$("#pin-swap").value = resp["swap"]; |
|
|
|
|
|
|
|
$("#pin-rxpup").checked = !!resp["rxpup"]; |
|
|
|
|
|
|
|
createPresets($("#pin-preset")); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$("#pin-spinner").setAttribute("hidden", ""); |
|
|
|
|
|
|
|
$("#pin-table").removeAttribute("hidden"); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function fetchPins() { |
|
|
|
function fetchPins() { |
|
|
|
@ -423,10 +465,17 @@ function fetchPins() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function setPins(v, name) { |
|
|
|
function setPins(v, name) { |
|
|
|
ajaxSpin("POST", "/pins?map="+v, function() { |
|
|
|
var url = "/pins"; |
|
|
|
showNotification("Pin assignment changed to " + name); |
|
|
|
var sep = "?"; |
|
|
|
}, function() { |
|
|
|
["reset", "isp", "conn", "ser", "swap"].forEach(function(p) { |
|
|
|
showNotification("Pin assignment change failed"); |
|
|
|
url += sep + p + "=" + $("#pin-"+p).value; |
|
|
|
|
|
|
|
sep = "&"; |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
url += "&rxpup=" + ($("#pin-rxpup").selected ? "1" : "0"); |
|
|
|
|
|
|
|
ajaxSpin("POST", url, function() { |
|
|
|
|
|
|
|
showNotification("Pin assignment changed"); |
|
|
|
|
|
|
|
}, function(status, errMsg) { |
|
|
|
|
|
|
|
showWarning(errMsg); |
|
|
|
window.setTimeout(fetchPins, 100); |
|
|
|
window.setTimeout(fetchPins, 100); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
Thorsten von Eicken
9 years ago