Skip to content

Commit

Permalink
webui gpio section: fix tree view issue
Browse files Browse the repository at this point in the history
  • Loading branch information
Slider0007 committed Oct 9, 2024
1 parent 3971944 commit 12d9457
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 33 deletions.
57 changes: 26 additions & 31 deletions sd-card/html/edit_config_param.html
Original file line number Diff line number Diff line change
Expand Up @@ -1988,7 +1988,7 @@ <h2>Configuration</h2>
<select name="gpio.gpiopin.0.pinenabled" id="gpio_gpiopin_0_pinenabled_value"
onchange="setClassVisibility('classvisibility_gpio_gpiopin_pinenabled', this.value);
this.value == 'true' ? $('[id$=\'pinmode_value\']').trigger('onchange') : null;
gatherChangedParameter(this.form)">
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form)">
<option value="false" selected>Disabled</option>
<option value="true">Enabled</option>
</select>
Expand All @@ -2005,7 +2005,8 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_pinmode_form">
<select name="gpio.gpiopin.0.pinmode" id="gpio_gpiopin_0_pinmode_value"
onchange='gpioPinModeChanged(); gatherChangedParameter(this.form)'>
onchange='gpioPinModeChanged();gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);
gatherChangedParameter(this.form)'>
<option value="flashlight-default">flashlight-default</option>
<option value="flashlight-pwm">flashlight-pwm</option>
<option value="flashlight-smartled">flashlight-smartled</option>
Expand All @@ -2029,7 +2030,8 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_capturemode_form">
<select name="gpio.gpiopin.0.capturemode" id="gpio_gpiopin_0_capturemode_value"
onchange='gpioPinModeChanged(); gatherChangedParameter(this.form)'>
onchange='gpioPinModeChanged(); gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);
gatherChangedParameter(this.form)'>
<option value="cyclic-polling" selected>cyclic-polling</option>
<option value="interrupt-rising-edge">interrupt-rising-edge</option>
<option value="interrupt-falling-edge">interrupt-falling-edge</option>
Expand All @@ -2049,7 +2051,7 @@ <h2>Configuration</h2>
<input required type="number" min="0" max="5000" value="500"
name="gpio.gpiopin.0.inputdebouncetime" id="gpio_gpiopin_0_inputdebouncetime_value"
onchange="(!validity.rangeUnderflow||(value=0)) && (!validity.rangeOverflow||(value=5000));
gatherChangedParameter(this.form, true)">ms
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">ms
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_inputdebouncetime</td>
Expand All @@ -2064,7 +2066,7 @@ <h2>Configuration</h2>
<input style="min-width:90px" required type="number" min="5" max="1000000" value="5000"
name="gpio.gpiopin.0.pwmfrequency" id="gpio_gpiopin_0_pwmfrequency_value"
onchange="(!validity.rangeUnderflow||(value=5)) && (!validity.rangeOverflow||(value=1000000));
gatherChangedParameter(this.form, true)">Hz
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">Hz
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_pwmfrequency</td>
Expand All @@ -2077,7 +2079,7 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_exposetorest_form">
<select name="gpio.gpiopin.0.exposetorest" id="gpio_gpiopin_0_exposetorest_value"
onchange='gatherChangedParameter(this.form)'>
onchange='gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form)'>
<option value="false">Disabled</option>
<option value="true" selected>Enabled</option>
</select>
Expand All @@ -2093,7 +2095,7 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_exposetomqtt_form">
<select name="gpio.gpiopin.0.exposetomqtt" id="gpio_gpiopin_0_exposetomqtt_value"
onchange='gatherChangedParameter(this.form)'>
onchange='gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form)'>
<option value="false">Disabled</option>
<option value="true" selected>Enabled</option>
</select>
Expand All @@ -2109,7 +2111,7 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_pinname_form">
<input type="text" name="gpio.gpiopin.0.pinname" id="gpio_gpiopin_0_pinname_value" placeholder="gpioX"
onchange='gatherChangedParameter(this.form)'>
onchange='gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form)'>
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_pinname</td>
Expand All @@ -2122,7 +2124,7 @@ <h2>Configuration</h2>
<td>
<form class="form_gpio_config" id="gpio_gpiopin_smartled_type_form">
<select name="gpio.gpiopin.0.smartled.type" id="gpio_gpiopin_0_smartled_type_value"
onchange='gatherChangedParameter(this.form, true)'>
onchange='gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)'>
<option value="0" selected>WS2812</option>
<option value="1">WS2812B (universal)</option>
<option value="2">WS2812B (newer variant)</option>
Expand All @@ -2143,7 +2145,8 @@ <h2>Configuration</h2>
<form class="form_gpio_config" id="gpio_gpiopin_smartled_quantity_form">
<input required type="number" min="1" value="1"
name="gpio.gpiopin.0.smartled.quantity" id="gpio_gpiopin_0_smartled_quantity_value"
onchange="(!validity.rangeUnderflow||(value=1));gatherChangedParameter(this.form, true)">
onchange="(!validity.rangeUnderflow||(value=1));gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);
gatherChangedParameter(this.form, true)">
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_smartled_quantity</td>
Expand All @@ -2158,17 +2161,17 @@ <h2>Configuration</h2>
R <input required style="min-width:45px;width:45px;" type="number" min="0" max="255" value="255"
name="gpio.gpiopin.0.smartled.colorredchannel" id="gpio_gpiopin_0_smartled_colorredchannel_value"
onchange="(!validity.rangeUnderflow||(value=0)) && (!validity.rangeOverflow||(value=255));
gatherChangedParameter(this.form, true)">
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">

G <input required style="min-width:45px;width:45px" type="number" min="0" max="255" value="255"
name="gpio.gpiopin.0.smartled.colorgreenchannel" id="gpio_gpiopin_0_smartled_colorgreenchannel_value"
onchange="(!validity.rangeUnderflow||(value=0)) && (!validity.rangeOverflow||(value=255));
gatherChangedParameter(this.form, true)">
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">

B <input required style="min-width:45px;width:45px" type="number" min="0" max="255" value="255"
name="gpio.gpiopin.0.smartled.colorbluechannel" id="gpio_gpiopin_0_smartled_colorbluechannel_value"
onchange="(!validity.rangeUnderflow||(value=0)) && (!validity.rangeOverflow||(value=255));
gatherChangedParameter(this.form, true)">
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_smartled_color</td>
Expand All @@ -2183,7 +2186,7 @@ <h2>Configuration</h2>
<input required type="number" min="1" max="100" value="100"
name="gpio.gpiopin.0.intensitycorrectionfactor" id="gpio_gpiopin_0_intensitycorrectionfactor"
onchange="(!validity.rangeUnderflow||(value=1)) && (!validity.rangeOverflow||(value=100));
gatherChangedParameter(this.form, true)">%
gatherChangedParameter(gpio_gpiopin_gpionumber_form, true);gatherChangedParameter(this.form, true)">%
</form>
</td>
<td style="visibility:hidden">$TOOLTIP_gpio_gpiopin_intensitycorrectionfactor</td>
Expand Down Expand Up @@ -2697,9 +2700,6 @@ <h2>Configuration</h2>
function initGpioSection()
{
getGpioPins();

if ($(gpio_customizationenabled_value).val() == 'true')
$("[id$='pinenabled_value']")[0].onchange();
}


Expand All @@ -2720,12 +2720,12 @@ <h2>Configuration</h2>
}

gpioPinSelection.prop('selectedIndex', idx);
gpioPinSelectAfterChange();
getGpioPinMode(parseInt(gpioPinSelection[0].value));
gpioPinSelectAfterChange(true);
getGpioPinUsage(parseInt(gpioPinSelection[0].value));
}


function getGpioPinMode(gpioNumberSelected, reload = false)
function getGpioPinUsage(gpioNumberSelected)
{
let gpioPinModeSel = document.querySelector("[id$='pinmode_value']");

Expand All @@ -2735,14 +2735,10 @@ <h2>Configuration</h2>
if (jsonConfig.gpio.gpiopin[i].gpiousage.substring(0,10) == "flashlight") { // Special case: Default flashlight GPIO
// Show option "flashlight-default"
gpioPinModeSel.options[0].removeAttribute("hidden");
if (!reload)
gpioPinModeSel.selectedIndex = 0;
}
else {
// Hide option "flashlight-default"
gpioPinModeSel.options[0].setAttribute('hidden', 'true');
if (!reload)
gpioPinModeSel.selectedIndex = 4;
}

// Show expert view / text for restricted pins
Expand All @@ -2760,8 +2756,6 @@ <h2>Configuration</h2>
break;
}
}

gpioPinModeChanged();
}


Expand Down Expand Up @@ -2834,7 +2828,7 @@ <h2>Configuration</h2>
}


function gpioPinSelectAfterChange()
function gpioPinSelectAfterChange(init = false)
{
let gpioPinSelect = $("[id$='gpionumber_value']")[0];

Expand All @@ -2849,8 +2843,10 @@ <h2>Configuration</h2>
let jsonConfigModified = deepMergeObjects(jsonConfig, jsonConfigModifiedDelta);
let jsonConfigModifiedKeyified = jsonObjectKeyify(jsonConfigModified)
parseCurrentParametrization(jsonConfigModifiedKeyified);
$("[id$='pinenabled_value']")[0].onchange(); // Eval pin enabled state
getGpioPinMode(parseInt(gpioPinSelect.value), true);
if(!init) {
$("[id$='pinenabled_value']")[0].onchange(); // Eval pin enabled state
getGpioPinUsage(gpioPinSelect.value);
}
}


Expand Down Expand Up @@ -2948,7 +2944,6 @@ <h2>Configuration</h2>
fillModelSelectionOptions(modelFileListObj);
fillCertSelectionOptions(certFileListObj);

//jsonConfigModifiedDelta = {};
let jsonConfigKeyified = []; // Config: array as key-value pairs
[jsonConfig, jsonConfigKeyified] = getConfigFromStorage(2); // Get config
parseCurrentParametrization(jsonConfigKeyified);
Expand All @@ -2959,7 +2954,7 @@ <h2>Configuration</h2>
triggerClassElementOnChange("classvisibility_init");
jsonConfigModifiedDelta = {}; // Reset modified parameter container after subparameter visibilty is set

$("#wlan_reboot_note").hide(); // Hide note
$("#wlan_reboot_note").hide(); // Hide reboot note
$("#divloading").hide(); // Hide loading indicator
$("#divcontent").show(); // Show parameter content
}
Expand Down
2 changes: 1 addition & 1 deletion sd-card/html/global_common.js
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ function triggerClassElementOnChange(classname)
if (el.length == 0)
return;

for (i = 0; i < el.length; i++) {
for (i = el.length - 1; i >= 0; i--) {
el[i].onchange();
}
}
2 changes: 1 addition & 1 deletion sd-card/html/global_data.js
Original file line number Diff line number Diff line change
Expand Up @@ -374,7 +374,7 @@ function gatherChangedParameter(form, integer = false)
deepSet(data, path, value, integer);
}
jsonConfigModifiedDelta = deepMergeObjects(jsonConfigModifiedDelta, data);
//console.log(jsonConfigModifiedDelta)
console.log(jsonConfigModifiedDelta) //@TODO: Remove log
}


Expand Down

0 comments on commit 12d9457

Please sign in to comment.