diff --git a/html/ports.js b/html/ports.js index 3548bac..257f397 100644 --- a/html/ports.js +++ b/html/ports.js @@ -42,9 +42,9 @@ function createPortTable() { for (let i = 1; i <= numPorts; i++) { let td = tr.insertCell(); if (pIsSFP[i-1]) - td.innerHTML = '' + td.innerHTML = '' else - td.innerHTML = '' + td.innerHTML = '' } tr = tbl.insertRow(); for (let i = 1; i <= numPorts; i++) { diff --git a/html/style.css b/html/style.css index b27ad56..61a9b8a 100644 --- a/html/style.css +++ b/html/style.css @@ -65,7 +65,7 @@ button:hover { background-color: #226; color: white;} /* outline: 2px solid #f00;*/ opacity: 1.0; } -object { +object, img { margin: 0.5em 0.5em; } .cbgroup { diff --git a/html/vlan.html b/html/vlan.html index a3f91e0..133b84c 100644 --- a/html/vlan.html +++ b/html/vlan.html @@ -23,6 +23,8 @@

Untagged Ports

+

Use as default VLAN for incoming traffic (PVID)

+

diff --git a/html/vlan.js b/html/vlan.js index a6b0f9b..d783534 100644 --- a/html/vlan.js +++ b/html/vlan.js @@ -6,6 +6,7 @@ function vlanForm() { clearInterval(vlanInterval); var t = document.getElementById('tPorts'); var u = document.getElementById('uPorts'); + var p = document.getElementById('pPorts'); for (let i = 1; i <= numPorts; i++) { const d = document.createElement("div"); d.classList.add("cbgroup"); @@ -29,11 +30,20 @@ function vlanForm() { d2.children[0].children[0].id = "uport" + i; d2.children[0].children[0].setAttribute('onclick', `setC("t", ${i}, false);`); u.appendChild(d2); + var d3=d.cloneNode(true); + d3.children[0].children[0].id = "pport" + i; + d3.children[0].children[0].removeAttribute('onclick'); + p.appendChild(d3); } } function setC(t, p, c){ document.getElementById(t+'port'+p).checked=c; + // When a tagged port is checked, automatically select the PVID port as well + const tportElem = document.getElementById('tport'+p); + if (tportElem && tportElem.checked) { + document.getElementById('pport'+p).checked=true; + } } function utClicked(t){ @@ -42,6 +52,12 @@ function utClicked(t){ } } +function pvClicked(p){ + for (let i = 1; i <= numPorts; i++) { + setC('p', i, p); + } +} + window.addEventListener("load", function() { vlanInterval = setInterval(vlanForm, 100); }); @@ -55,8 +71,9 @@ function fetchVLAN() { m = parseInt(s.members, 16); document.getElementById('vname').value = s.name; for (let i = 1; i <= numPorts; i++) { - setC('t', i, (m>>(10+i-1))&1); - setC('u', i, (m>>(i-1))&1); + setC('t', i, (m>>(10+i-1))&1); + setC('u', i, (m>>(i-1))&1); + setC('p', i, (m>>(20+i-1))&1); } } }; diff --git a/html/vlan_sub.js b/html/vlan_sub.js index ee381de..ea14c95 100644 --- a/html/vlan_sub.js +++ b/html/vlan_sub.js @@ -1,4 +1,5 @@ async function vlanSub() { + var commands = []; var cmd = "vlan "; var v=document.getElementById('vid').value if (!v) { @@ -14,12 +15,19 @@ async function vlanSub() { else if (document.getElementById('uport' + i).checked) cmd = cmd + ` ${i}`; } + commands.push(cmd); + for (let i = 1; i <= numPorts; i++) { + if (document.getElementById('pport' + i).checked) + commands.push(`pvid ${i} ${v}`); + } try { - const response = await fetch('/cmd', { - method: 'POST', - body: cmd - }); - console.log('Completed!', response); + for (let c of commands) { + const response = await fetch('/cmd', { + method: 'POST', + body: c + }); + console.log('Completed!', response); + } } catch(err) { console.error(`Error: ${err}`); } diff --git a/httpd/httpd.c b/httpd/httpd.c index b9d6ead..a35274a 100644 --- a/httpd/httpd.c +++ b/httpd/httpd.c @@ -598,7 +598,9 @@ void httpd_appcall(void) } } else { dbg_string("Have entry, authenticated: "); dbg_byte(authenticated); dbg_char('\n'); - if (!authenticated && !(f_data[entry].start == FDATA_START_login_html + if (!authenticated && !(f_data[entry].start == FDATA_START_login_html + || f_data[entry].start == FDATA_START_port_svg + || f_data[entry].start == FDATA_START_sfp_svg || f_data[entry].start == FDATA_START_style_css)) { send_to_login(); goto do_send; @@ -610,7 +612,8 @@ void httpd_appcall(void) slen = strtox(outbuf, "HTTP/1.1 200 OK\r\nContent-Type: "); slen += strtox(outbuf + slen, mime_strings[f_data[entry].mime]); - slen += strtox(outbuf + slen, "; charset=UTF-8\r\nCache-Control: max-age=60, must-revalidate\r\n\r\n"); + slen += strtox(outbuf + slen, "; charset=UTF-8\r\nCache-Control: max-age=60, must-revalidate\r\nAccess-Control-Allow-Origin: *\r\n\r\n"); + len_left = f_data[entry].len; if (len_left > (TCP_OUTBUF_SIZE - slen)) { cont_len = len_left - (TCP_OUTBUF_SIZE - slen);