lbsadmin/ESPUI
1
0
Fork 0
mirror of https://github.com/s00500/ESPUI.git synced 2025-07-04 06:10:18 +00:00
Code Issues Releases Activity

Support dynamic enabling and disabling of controls

Browse Source 
See documentation in README for how this works. This commit
handles all the main controls. Pads are not yet supported.
This commit is contained in:
Ian Gray
2022-01-31 21:43:09 +00:00
parent 7dcf6a10f4
commit 896dc97c75
9 changed files with 159 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
data/js/controls.js vendored
View File

@ -568,7 +568,13 @@ function start() {
break;
}
if (data.type >= UI_TITEL && data.type < UPDATE_OFFSET) {
//A UI element was just added to the DOM
processEnabled(data);
}
if (data.type >= UPDATE_OFFSET && data.type < UI_INITIAL_GUI) {
//An "update" message was just recieved and processed
var element = $("#id" + data.id);
if(data.hasOwnProperty('panelStyle')) {
@ -593,6 +599,8 @@ function start() {
);
element.addClass(colorClass(data.color));
}
processEnabled(data);
}
$(".range-slider__range").each(function(){
@ -816,4 +824,49 @@ var elementHTML = function(data) {
default:
return "";
}
}
}
var processEnabled = function(data) {
//Handle the enabling and disabling of controls
//Most controls can be disabled through the use of $("#<item>").prop("disabled", true) and CSS will style it accordingly
//The switcher also requires the addition of the "disabled" class
switch(data.type) {
case UI_SWITCHER:
case UPDATE_SWITCHER:
if(data.enabled) {
$("#sl" + data.id).removeClass('disabled');
$("#s" + data.id).prop("disabled", false);
} else {
$("#sl" + data.id).addClass('disabled');
$("#s" + data.id).prop("disabled", true);
}
break;
case UI_SLIDER:
case UPDATE_SLIDER:
$("#sl" + data.id).prop("disabled", !data.enabled);
break;
case UI_NUMBER:
case UPDATE_NUMBER:
$("#num" + data.id).prop("disabled", !data.enabled);
break;
case UI_TEXT_INPUT:
case UPDATE_TEXT_INPUT:
$("#text" + data.id).prop("disabled", !data.enabled);
break;
case UI_SELECT:
case UPDATE_SELECT:
$("#select" + data.id).prop("disabled", !data.enabled);
break;
case UI_BUTTON:
case UPDATE_BUTTON:
$("#btn" + data.id).prop("disabled", !data.enabled);
break;
}
}