mirror of
https://github.com/logicog/RTLPlayground.git
synced 2026-08-30 14:52:51 +08:00
Merge pull request #99 from TylerDurden-23/vlan-pvid-clean
Add ability to configure PVID on VLAN page.
This commit is contained in:
+2
-2
@@ -42,9 +42,9 @@ function createPortTable() {
|
||||
for (let i = 1; i <= numPorts; i++) {
|
||||
let td = tr.insertCell();
|
||||
if (pIsSFP[i-1])
|
||||
td.innerHTML = '<object type="image/svg+xml" data="sfp.svg", width="60"</object>'
|
||||
td.innerHTML = '<object type="image/svg+xml" data="sfp.svg" width="60"></object>'
|
||||
else
|
||||
td.innerHTML = '<object type="image/svg+xml" data="port.svg", width="40"</object>'
|
||||
td.innerHTML = '<object type="image/svg+xml" data="port.svg" width="40"></object>'
|
||||
}
|
||||
tr = tbl.insertRow();
|
||||
for (let i = 1; i <= numPorts; i++) {
|
||||
|
||||
+1
-1
@@ -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 {
|
||||
|
||||
@@ -23,6 +23,8 @@
|
||||
<div id="tPorts"><button type="button" style="transform: translateY(-100%);margin: 0 50px 0 0" onclick="utClicked(true);">Select all</button></div>
|
||||
<h2>Untagged Ports</h2>
|
||||
<div id="uPorts"><button type="button" style="transform: translateY(-100%); margin: 0 50px 0 0" onclick="utClicked(false);">Select all</button> </div>
|
||||
<h2>Use as default VLAN for incoming traffic (PVID)</h2>
|
||||
<div id="pPorts"><button type="button" style="transform: translateY(-100%); margin: 0 50px 0 0" onclick="pvClicked(true);">Select all</button> </div>
|
||||
<script src="/vlan.js"></script>
|
||||
<br/> <input style="width:40%;" class="action" id="vlan_sub" onclick="vlanSub();" type="button" value="Update / Create">
|
||||
<script src="/vlan_sub.js"></script>
|
||||
|
||||
+19
-2
@@ -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);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
+13
-5
@@ -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}`);
|
||||
}
|
||||
|
||||
+5
-2
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user