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

Make Advanced configuration tabbed.

Browse Source
This commit is contained in:
chriz
2026-02-13 08:43:48 +01:00
parent ea37126e87
commit eae7f10d7a
2 changed files with 56 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
html/style.css
+2 -1
View File
@@ -6,8 +6,9 @@ ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
width: 12%; width: 12%;
height: 100%; height: calc(100% - 50px);
position: fixed; position: fixed;
top: 50px;
overflow: auto; overflow: auto;
} }
html/system.html
+54 -30
View File
@@ -3,45 +3,69 @@
<head> <head>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<title>System Settings</title> <title>System Settings</title>
<style>
.tab-bar { display: flex; border-bottom: 2px solid #226; margin-bottom: 0; margin-left: 16%; padding: 1px 16px; padding-bottom: 0; }
.tab-btn { padding: 10px 20px; background-color: #ddf; border: none; cursor: pointer; font-size: 1em; border-radius: 8px 8px 0 0; margin-right: 4px; }
.tab-btn:hover { background-color: #aaf; }
.tab-btn.active { background-color: #aaf; font-weight: bold; border-bottom: 2px solid #aaf; margin-bottom: -2px; }
.tab-content { display: none; }
.tab-content.active { display: block; }
</style>
</head> </head>
<body> <body>
<div class="tab-bar">
<button class="tab-btn active" onclick="openTab(event, 'system-tab')">System</button>
<button class="tab-btn" onclick="openTab(event, 'advanced-tab')">Advanced</button>
</div>
<nav id="sidebar"></nav> <nav id="sidebar"></nav>
<div style="margin-left:16%;padding:1px 16px;height:1000px;"> <div style="margin-left:16%;padding:1px 16px;height:1000px;">
<div id="ports"></div> <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="netmask">Netmask:</label></div>
<div class="rcol"><input id="netmask" 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/>
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/>
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">
<br/><br/>
<hr style="width:50%;margin-left:0;"/>
<h1>Advanced Settings</h1> <div id="system-tab" class="tab-content active">
<div class="lcol"> <label for="ip">Startup configuration:</label></div> <h1>System Settings</h1>
<textarea id="config_display" rows="8" cols="60"></textarea> <div class="row">
<br/> <div class="lcol"> <label for="ip">IP address:</label></div>
<input style="width:40%;" class="action" id="clear_config" onclick="clearConfig();" type="button" value="Clear Startup Config"> <div class="rcol"> <input id="ip" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
<br/> </div>
<input style="width:40%;" class="action" id="flash_startup_sub" onclick="flashStartupSave();" type="button" value="Save Startup Settings to Flash"> <div class="row">
<br/> <div class="lcol"> <label for="netmask">Netmask:</label></div>
<input style="width:40%;" class="action" id="switch_reset" onclick="resetSwitch();" type="button" value="Reset Switch"> <div class="rcol"><input id="netmask" 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/>
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/>
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>
<div id="advanced-tab" class="tab-content">
<h1>Advanced Settings</h1>
<div class="lcol"> <label for="config_display">Startup configuration:</label></div>
<textarea id="config_display" rows="8" cols="60"></textarea>
<br/>
<input style="width:40%;" class="action" id="clear_config" onclick="clearConfig();" type="button" value="Clear Startup Config">
<br/>
<input style="width:40%;" class="action" id="flash_startup_sub" onclick="flashStartupSave();" type="button" value="Save Startup Settings to Flash">
<br/>
<input style="width:40%;" class="action" id="switch_reset" onclick="resetSwitch();" type="button" value="Reset Switch">
</div>
</div> </div>
<script src="/config.js"></script> <script src="/config.js"></script>
<script src="/system.js"></script> <script src="/system.js"></script>
<script src="/navigation.js"></script> <script src="/navigation.js"></script>
<script>
function openTab(evt, tabId) {
document.querySelectorAll('.tab-content').forEach(c => c.classList.remove('active'));
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
document.getElementById(tabId).classList.add('active');
evt.currentTarget.classList.add('active');
}
</script>
</body> </body>
</html> </html>