Skip to content

Commit

Permalink
webapp-cosmetics
Browse files Browse the repository at this point in the history
  • Loading branch information
@wizmo2
wizmo2 committed Oct 11, 2023
1 parent 9ae455d commit e1a41d0
Show file tree
Hide file tree
Showing 3 changed files with 36 additions and 32 deletions.
30 changes: 15 additions & 15 deletions components/wifi-manager/webapp/src/index.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,10 +99,10 @@
<div class="tab-pane fade" id="tab-cfg-gen"></div>
<div class="tab-pane fade" id="tab-cfg-fw">

<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">Software Updates</div>
<div class="card-body">
<table class="table table-hover table-striped table-dark">
<table class="table table-hover table-striped table-primary">
<thead>
<tr>
<th class="border-bottom-0 pb-0" scope="col">Version</th>
Expand Down Expand Up @@ -145,7 +145,7 @@
</div>

<div class="col-auto">
<button id="btn_reboot_recovery" class="btn-warning ota_element"
<button id="btn_reboot_recovery" class="btn btn-warning ota_element"
type="submit">Recovery</button>
</div>
</div>
Expand All @@ -171,7 +171,7 @@
</div>
</div>
</div>
<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">Local Firmware Upload</div>
<div class="card-body">
<div id="uploaddiv" class="form-group row ">
Expand All @@ -194,7 +194,7 @@


<div class="tab-pane fade" id="tab-nvs">
<table class="table table-hover">
<table class="table table-hover table-secondary">
<thead>
<tr>
<th scope="col">Key</th>
Expand All @@ -216,7 +216,7 @@
</div>

<div class="tab-pane fade" id="tab-cfg-audio">
<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">Usage Templates</div>
<div class="card-body">
<fieldset class="form-group" id="output-tmpl">
Expand Down Expand Up @@ -356,15 +356,15 @@
</div>
</div>
<div class="tab-pane fade active show" id="tab-wifi">
<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">WiFi Status</div>

<div class="card-body if_eth" style="display: none">
<h2>Connected to Ethernet</h2>
<p>WiFi is inactive while connected to a wired network.
</div>
<div class="card-body if_wifi" style="display: none">
<table class="table table-hover">
<table class="table table-hover table-secondary">
<thead>
<tr>
<th scope="col">Joined</th>
Expand Down Expand Up @@ -474,7 +474,7 @@
<div class="card border-primary mb-3">
<div class="card-header">Logs</div>
<div class="card-body">
<table class="table table-hover">
<table class="table table-hover table-secondary">
<thead>
<tr>
<th scope="col">Timestamp</th>
Expand All @@ -492,7 +492,7 @@
<div class="card border-primary mb-3" id="pins" style="display: none;">
<div class="card-header">Pin Assignments</div>
<div class="card-body">
<table class="table table-hover">
<table class="table table-hover table-secondary">
<thead>
<tr>
<th scope="col">Device</th>
Expand All @@ -508,7 +508,7 @@
<div class="card border-primary mb-3" style="visibility: collapse;" id="tasks_sect">
<div class="card-header">Tasks</div>
<div class="card-body">
<table class="table table-hover">
<table class="table table-hover table-secondary">
<!-- console.log(msg_time.toLocaleString() + '\tname' + '\tcpu' + '\tstate' + '\tminstk' + '\tbprio' + '\tcprio' + '\tnum'); -->
<thead>
<tr>
Expand All @@ -528,7 +528,7 @@
</div>
<!-- syslog -->
<div class="tab-pane fade " id="tab-credits">
<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">Credits</div>
<div class="card-body">
<p><strong><a
Expand All @@ -555,7 +555,7 @@
</ul>
</div>
</div>
<div class="card text-white mb-3">
<div class="card mb-3">
<div class="card-header">Extras/Overrides</div>
<div class="card-body">
<fieldset>
Expand All @@ -579,9 +579,9 @@
</main>
<footer>
<div class="fixed-bottom d-flex justify-content-between border-top border-dark p-3 bg-primary">
<span class="text-center" id="foot-fw"></span><button class="btn-warning ota_element " id="reboot_nav"
<span class="text-center" id="foot-fw"></span><button class="btn btn-warning ota_element " id="reboot_nav"
type="submit" style="display: none;">Reboot</button>
<button class="btn-warning recovery_element" id="reboot_ota_nav" type="submit" style="display: none;">Exit
<button class="btn btn-warning recovery_element" id="reboot_ota_nav" type="submit" style="display: none;">Exit
Recovery</button><span class="text-center" id="foot-if"></span>
</div>

Expand Down
36 changes: 20 additions & 16 deletions components/wifi-manager/webapp/src/js/custom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1982,7 +1982,6 @@ window.runCommand = function (button, reboot) {
if (cmdstring === 'cfg-hw-preset') return handleHWPreset(allfields, reboot);
cmdstring += ' ';
if (fields) {

for (const field of allfields) {
let qts = '';
let opt = '';
Expand Down Expand Up @@ -2075,7 +2074,7 @@ function getCommands() {
const isConfig = cmdParts[0] === 'cfg';
const targetDiv = '#tab-' + cmdParts[0] + '-' + cmdParts[1];
let innerhtml = '';
innerhtml += `<div class="card text-white mb-3"><div class="card-header">${command.help.encodeHTML().replace(/\n/g, '<br />')}</div><div class="card-body"><fieldset id="flds-${command.name}">`;
innerhtml += `<div class="card mb-3"><div class="card-header">${command.help.encodeHTML().replace(/\n/g, '<br />')}</div><div class="card-body"><fieldset id="flds-${command.name}">`;
if (command.argtable) {
command.argtable.forEach(function (arg) {
let placeholder = arg.datatype || '';
Expand All @@ -2087,20 +2086,18 @@ function getCommands() {
attributes += 'shortopts="' + arg.shortopts + '" ';
attributes += 'checkbox=' + arg.checkbox + ' ';
attributes += 'cmdname="' + command.name + '" ';
attributes +=
'id="' +
ctrlname +
'" name="' +
ctrlname +
'" hasvalue="' +
arg.hasvalue +
'" ';
let extraclass = arg.mincount > 0 ? 'bg-success' : '';
attributes += 'id="' + ctrlname + '" name="' + ctrlname + '" ';
if (arg.longopts && arg.longopts.startsWith('_')){
attributes += "readonly ";
}
let extraclass = arg.mincount > 0 ? 'is-invalid' : '';
if (arg.glossary === 'hidden') {
attributes += ' style="visibility: hidden;"';
}
if (arg.checkbox) {
innerhtml += `<div class="form-check"><label class="form-check-label"><input type="checkbox" ${attributes} class="form-check-input ${extraclass}" value="" >${arg.glossary.encodeHTML()}</label>`;
innerhtml += `<div class="form-check"><label class="form-check-label"><input type="checkbox" ${attributes} class="form-check-input ${extraclass}" value="" >${arg.glossary.encodeHTML()}</label></div><div>`;
} else if (arg.remark) {
innerhtml += `<div class="form-group"><label for="${ctrlname}">${arg.glossary.encodeHTML()}</label>`;
} else {
innerhtml += `<div class="form-group" ><label for="${ctrlname}">${arg.glossary.encodeHTML()}</label>`;
if (placeholder.includes('|')) {
Expand All @@ -2118,9 +2115,12 @@ function getCommands() {
} else {
innerhtml += `<input type="text" class="form-control ${extraclass}" placeholder="${placeholder}" ${attributes}>`;
}
}
}

innerhtml += `${arg.checkbox ? '</div>' : ''}<small class="form-text text-muted">Previous value: ${arg.checkbox ? (curvalue ? 'Checked' : 'Unchecked') : (curvalue || '')}</small>${arg.checkbox ? '' : '</div>'}`;
if (!arg.remark) {
innerhtml += `<small class="form-text text-muted">Previous value: ${arg.checkbox ? (curvalue ? 'Checked' : 'Unchecked') : (curvalue || '')}</small>`;
}
innerhtml += `</div>`;
});
}
innerhtml += `<div style="margin-top: 16px;">
Expand Down Expand Up @@ -2157,7 +2157,7 @@ function getCommands() {
const ctrlValue = getLongOps(data, command.name, arg.longopts);
if (arg.checkbox) {
$(ctrlselector)[0].checked = ctrlValue;
} else {
} else if (!arg.remark) {
if (ctrlValue !== undefined) {
$(ctrlselector)
.val(ctrlValue)
Expand All @@ -2170,6 +2170,10 @@ function getCommands() {
$(ctrlselector)[0].value = '--';
}
}
if (arg.mincount && arg.mincount > 0) {
$(ctrlselector).removeClass('is-invalid');
$(ctrlselector).addClass('is-valid');
}
});
}
});
Expand Down Expand Up @@ -2200,7 +2204,7 @@ function getConfig() {
.forEach(function (key) {
let val = data[key].value;
if (key === 'autoexec') {
if (data.autoexec.value === '0') {
if (data.autoexec.value === '0') {
$('#disable-squeezelite')[0].checked = true;
} else {
$('#disable-squeezelite')[0].checked = false;
Expand Down
2 changes: 1 addition & 1 deletion components/wifi-manager/webapp/src/sass/utils/_variables.scss
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
$enable-gradients: false;
// This is needed below, otherwise colors look washed out
$table-bg-level: 0;
//$table-bg-level: 0;

0 comments on commit e1a41d0

Please sign in to comment.