gitproxy/RTLPlayground
1
0
Fork 0
mirror of https://github.com/logicog/RTLPlayground.git synced 2026-08-30 14:52:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

Initial web-files for system settings and configuration management

Browse Source
This commit is contained in:
logicog
2025-11-29 12:44:23 +01:00
parent 76344e172c
commit ba9bc2e845
6 changed files with 149 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
html/config
Symlink
+1
View File
@@ -0,0 +1 @@
../config.txt
html/config.js
+41
View File
@@ -0,0 +1,41 @@
var configInterval = Number();
var configuration = {};
function parseConf(c){
var a = s.split(/\r\n|\n/);
for (var l = 0; l < a.length; l++) {
console.log(l + ' --> ' + a[l]);
}
}
function fetchConfig() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
s = xhttp.responseText;
console.log("CONFIG: ", s);
parseConf(s);
clearInterval(configInterval);
}
}
xhttp.open("GET", `/config`, true);
xhttp.send();
}
function fetchCmdLog() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
s = xhttp.responseText;
console.log("CMD-Log: ", s);
parseConf(s);
clearInterval(configInterval);
}
}
xhttp.open("GET", `/cmd_log`, true);
xhttp.send();
}
window.addEventListener("load", function() {
configInterval = setInterval(fetchConfig, 1000);
});
html/navigation.js
+1
View File
@@ -5,5 +5,6 @@ document.getElementById('sidebar').innerHTML =
+ "<li><a href='mirror.html'>Mirroring</a></li>"
+ "<li><a href='trunk.html'>Port Aggregation</a></li>"
+ "<li><a href='eee.html'>EEE</a></li>"
+ "<li><a href='system.html'>System Settings</a></li>"
+ "<li><a href='update.html'>Firmware Update</a></li></ul>";
html/style.css
+7 -1
View File
@@ -42,6 +42,9 @@ input[type=submit] { padding: 8px 16px;background-color:#aaf;color:#000; margin-
input[type=submit]:hover { background-color: #226; color: white;}
button {padding: 8px; background-color:#99f; color:#000;}
button:hover { background-color: #226; color: white;}
.action{padding: 8px 16px;margin-top: 2em;margin-right: 3em; background-color: #aaf;color: #000;}
.action:hover { background-color: #226; color: white;}
.psel {
position: absolute;
opacity: 0;
@@ -73,4 +76,7 @@ object {
.isSFP{ opacity: .4; background-color: #660;}
.isNOK{ color: #900;}
.isOK{ color: #090;}
.action{padding: 8px 16px;margin-top: 2em;margin-right: 3em; background-color: #aaf;color: #000;}
.ip{padding:8px 16px;margin-bottom: 1em;margin-left: 1em}
.row {display: flex;}
.rcol {flex: 90%;}
.lcol {flex: 10%;}
html/system.html
+36
View File
@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>System Settings</title>
</head>
<body>
<nav id="sidebar"></nav>
<div style="margin-left:16%;padding:1px 16px;height:1000px;">
<div id="ports"></div>
<h1>System Settings</h1>
<div class="row">
<div class="lcol"> <label for="ip">IP address:</label></div>
<div class="rcol"> <input id="ip" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
</div>
<div class="row">
<div class="lcol"> <label for="nm">Netmask:</label></div>
<div class="rcol"><input id="nm" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
</div>
<div class="row">
<div class="lcol"> <label for="gw">Gateway:</label></div>
<div class="rcol"><input id="gw" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
</div>
<br/><br/>
When updating the above settings, remember to point your browser to the new IP afterwards:<br/>
<input style="width:40%;" class="action" id="ip_sub" onclick="ipSub();" type="button" value="Update Settings"><br/>
<br/><br/>
Save all current settings to Flash:<br/>
<input style="width:40%;" class="action" id="flash_sub" onclick="flashSave();" type="button" value="Save Settings to Flash">
</div>
<script src="/config.js"></script>
<script src="/system.js"></script>
<script src="/navigation.js"></script>
</body>
</html>
html/system.js
+63
View File
@@ -0,0 +1,63 @@
var systemInterval = Number();
const ips = ["ip", "nm", "gw"];
function checkIp(ip) {
const ipv4 = /^(\d{1,3}\.){3}\d{1,3}$/;
if (!ipv4.test(ip)) {alert(`Invalid ip:${ip}`); return false };
return true;
}
async function ipSub() {
for (let i=0;i<3;i++) {
if (!checkIp(document.getElementById(ips[i]).value))
return;
}
for (let i=0; i<3;i++){
var cmd = ips[i]+' '+document.getElementById(ips[i]).value;
try {
const response = await fetch('/cmd', {
method: 'POST',
body: cmd
});
console.log('Completed!', response);
fetchIP();
} catch(err) {
console.error(`Error: ${err}`);
}
}
}
async function flashSave() {
fetchConfig();
fetchCmdLog();
return;
try {
const response = await fetch('/save', {
method: 'POST',
body: cmd
});
console.log('Completed!', response);
} catch(err) {
console.error(`Error: ${err}`);
}
}
function fetchIP() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
const s = JSON.parse(xhttp.responseText);
console.log("IP: ", s);
document.getElementById("ip").value=s.ip_address;
document.getElementById("nm").value=s.ip_netmask;
document.getElementById("gw").value=s.ip_gateway;
clearInterval(systemInterval);
}
}
xhttp.open("GET", `/information.json`, true);
xhttp.send();
}
window.addEventListener("load", function() {
systemInterval = setInterval(fetchIP, 1000);
});