Make the validation simpler (#1569)

This commit is contained in:
Tim Wilkinson 2024-10-08 21:01:07 -07:00 committed by GitHub
parent 2eb3029156
commit 1e79e95afd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 91 additions and 117 deletions

View File

@ -377,8 +377,10 @@ if (f) {
const hosts = {{hosts}};
function updateServices()
{
if (!htmx.closest(htmx.find("#local-services"), "form").checkValidity()) {
return;
}
const services = [];
let invalid = 0;
const svc = htmx.findAll("#local-services .service");
for (let i = 0; i < svc.length; i++) {
const s = svc[i];
@ -389,57 +391,41 @@ if (f) {
const port = htmx.find(s, "input[name=port]");
const path = htmx.find(s, "input[name=path]");
if (protocol && port && path) {
if (name.validity.valid && protocol.validity.valid && port.validity.valid && path.validity.valid) {
services.push(`${name.value}${type.value ? " [" + type.value + "]" : ""}|1|${protocol.value}|${host.value}|${port.value}|${path.value}`);
}
else {
invalid++;
}
}
else {
if (name.validity.valid) {
services.push(`${name.value}${type.value ? " [" + type.value + "]" : ""}|0||${host.value}||`);
}
else {
invalid++;
}
}
}
if (invalid === 0) {
htmx.ajax("PUT", "{{request.env.REQUEST_URI}}", {
swap: "none",
values: { services: JSON.stringify(services) }
});
htmx.find("#dialog-done").disabled = false;
}
}
function updateAliases()
{
if (!htmx.closest(htmx.find("#host-aliases"), "form").checkValidity()) {
return;
}
const aliases = [];
let invalid = 0;
const al = htmx.findAll("#host-aliases .alias");
for (let i = 0; i < al.length; i++) {
const s = al[i];
const hostname = htmx.find(s, "input[name=hostname]");
const address = htmx.find(s, "select[name=address]");
if (hostname.validity.valid) {
aliases.push(`${address.value} ${hostname.value}`);
}
else {
invalid++;
}
}
if (invalid === 0) {
htmx.ajax("PUT", "{{request.env.REQUEST_URI}}", {
swap: "none",
values: { aliases: JSON.stringify(aliases) }
});
}
}
function updatePortForwards()
{
if (!htmx.closest(htmx.find("#port-forwards"), "form").checkValidity()) {
return;
}
const ports = [];
let invalid = 0;
const rows = htmx.findAll("#port-forwards .cols .row");
for (let i = 0; i < rows.length; i++) {
const r = rows[i];
@ -449,20 +435,13 @@ if (f) {
const dst = htmx.find(r, "[name=port_dst]");
const dport = htmx.find(r, "[name=port_dport]");
const enabled = htmx.find(r, "[name=port_enable]");
if (sports.validity.valid && dport.validity.valid) {
ports.push(`${src.value}:${type.value}:${sports.value}:${dst.value}:${dport.value}:${enabled.checked ? "1" : "0"}`);
}
else {
invalid++;
}
}
if (invalid === 0) {
htmx.ajax("PUT", "{{request.env.REQUEST_URI}}", {
swap: "none",
values: { ports: JSON.stringify(ports) }
});
}
}
function refreshHostSelectors()
{
const selectors = htmx.findAll("#local-services .service .cols:last-child select");

View File

@ -388,6 +388,9 @@ uciMesh.foreach("xlink", "interface", x => {
});
}
htmx.on("#ctrl-modal .dialog #xlink-list", "change", event => {
if (!htmx.closest(htmx.find("#ctrl-modal .dialog #xlink-list"), "form").checkValidity()) {
return;
}
const target = htmx.closest(event.target, "[data-name]");
const xlink = xlinks.find(x => x.name == target.dataset.name);
const vlan = htmx.find(target, "[name=vlan]");
@ -396,7 +399,6 @@ uciMesh.foreach("xlink", "interface", x => {
const weight = htmx.find(target, "[name=weight]");
const port = htmx.find(target, "[name=port]");
const cidr = htmx.find(target, "[name=cidr]");
if (vlan.validity.valid && ipaddr.validity.valid && peer.validity.valid && weight.validity.valid) {
xlink.vlan = parseInt(vlan.value);
xlink.ipaddr = ipaddr.value;
xlink.peer = peer.value;
@ -404,7 +406,6 @@ uciMesh.foreach("xlink", "interface", x => {
xlink.port = port ? port.value : null;
xlink.cidr = parseInt(cidr.value);
update();
}
});
htmx.on("#ctrl-modal .dialog #xlink-list", "click", event => {
if (event.target.nodeName === "BUTTON") {

View File

@ -379,9 +379,11 @@ This value is used by default, but each tunnel may overide it.
const available = {{sprintf("%J", available)}};
function updateTunnels()
{
if (!htmx.closest(htmx.find("#tunnels"), "form").checkValidity()) {
return;
}
const tunnels = [];
let servercount = 0;
let invalid = 0;
const tuns = htmx.findAll("#tunnels .tunnel");
for (let i = 0; i < tuns.length; i++) {
const t = tuns[i];
@ -394,7 +396,6 @@ This value is used by default, but each tunnel may overide it.
const notes = htmx.find(t, "input[name=notes]");
const enable = htmx.find(t, "input[name=enable]");
const weight = htmx.find(t, "input[name=weight]");
if (name.validity.valid && password.validity.valid && network.validity.valid && notes.validity.valid && weight.validity.valid) {
tunnels.push({
index: index,
type: type,
@ -406,33 +407,25 @@ This value is used by default, but each tunnel may overide it.
key: key && key.value,
weight: weight.value
});
}
else {
invalid++;
}
if (type === "ls" || type === "ws") {
servercount++;
}
}
if (invalid === 0) {
htmx.ajax("PUT", "{{request.env.REQUEST_URI}}", {
swap: "none",
values: { tunnels: JSON.stringify(tunnels) }
});
}
const start = htmx.find("input[name=tunnel_range_start]");
if (start) {
start.disabled = servercount > 0 ? true : false;
}
{% if (includeAdvanced) { %}
htmx.find("input[name=tunnel_range_start]").disabled = servercount > 0 ? true : false;
{% } %}
}
htmx.on("input[name=tunnel_server]", "change", e => {
if (e.target.validity.valid) {
server = e.target.value;
}
});
const rangeStart = htmx.find("input[name=tunnel_range_start]");
if (rangeStart) {
htmx.on(rangeStart, "change", e => {
{% if (includeAdvanced) { %}
htmx.on("input[name=tunnel_range_start]", "change", e => {
available.l = {};
available.w = {};
if (e.target.validity.valid) {
@ -464,7 +457,7 @@ This value is used by default, but each tunnel may overide it.
}
}
});
}
{% } %}
function newTunnelEntry()
{
const type = htmx.find("#tunnel-templates select").value;
@ -551,10 +544,11 @@ This value is used by default, but each tunnel may overide it.
newTunnelEntry();
}
});
const start = htmx.find("input[name=tunnel_range_start]");
if (start && !client) {
start.disabled = true;
{% if (includeAdvanced) { %}
if (!client) {
htmx.find("input[name=tunnel_range_start]").disabled = true;
}
{% } %}
htmx.find("#dialog-done").disabled = true;
}
htmx.on("#tunnel-templates button", "click", newTunnelEntry);