Files
eacp_webapp/htdocs/network.html
T
2026-06-16 11:24:50 +08:00

329 lines
22 KiB
HTML

<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Network Settings</title>
<meta charset="utf-8">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap-toggle.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Common Javascript -->
<script type="text/javascript" src="js/globals.js"></script>
<script type="text/javascript" src="js/navbar.js"></script>
<!-- Application needed for this page -->
<script>
var globs = {};
$(document).ready(function(){
// https://stackoverflow.com/questions/8838648/onchange-event-handler-for-radio-button-input-type-radio-doesnt-work-as-one
var radiobutton = document.formwirednetworksettings.dhcp;
for (var i = 0; i < radiobutton.length; i++) {
radiobutton[i].addEventListener('change', function() {
if( this.value=='1' ) { document.getElementById('lan0manualaddress').style.display='none'; }
else { document.getElementById('lan0manualaddress').style.display=''; }
});
}
var radiobutton = document.formwifinetworksettings.dhcp;
for (var i = 0; i < radiobutton.length; i++) {
radiobutton[i].addEventListener('change', function() {
if( this.value=='1' ) { document.getElementById('wifimanualaddress').style.display='none'; }
else { document.getElementById('wifimanualaddress').style.display=''; }
});
}
var radiobutton = document.formwifinetworksettings.wifimode;
for (var i = 0; i < radiobutton.length; i++) {
radiobutton[i].addEventListener('change', function() {
if( this.value=="0" ) { // WiFi is off
document.getElementById('wifi0ssidpsk').style.display='none';
document.getElementById('wifi0manualparams').style.display='none';
}
else if( this.value=="1" ) { // Wireless Client
document.getElementById('wifi0ssidpsk').style.display='';
document.getElementById('wifi0manualparams').style.display='';
if( globs.params.wifista.psk ) { document.getElementById('wifipsk' ).value = globs.params.wifista.psk; }
if( globs.params.wifista.ssid ) { document.getElementById('wifissid').value = globs.params.wifista.ssid; }
}
else if( this.value=="2" ) { // Wireless Access Point
document.getElementById('wifi0ssidpsk').style.display='';
document.getElementById('wifi0manualparams').style.display='none';
if( globs.params.wifiap.psk ) { document.getElementById('wifipsk' ).value = globs.params.wifiap.psk; }
if( globs.params.wifiap.ssid ) { document.getElementById('wifissid').value = globs.params.wifiap.ssid; }
}
});
}
$.getJSON( "./network.json", function(params) {
console.log(params);
globs.params = params;
if( params.hostname ) { document.getElementById('hostname').value = params.hostname; }
if( params.lan[0] ) {
if( params.lan[0].mac ) { document.getElementById('lan0mac' ).value = params.lan[0].mac; }
if( params.lan[0].address ) { document.getElementById('lan0address').value = params.lan[0].address; }
if( params.lan[0].netmask ) { document.getElementById('lan0netmask').value = params.lan[0].netmask; }
if( params.lan[0].gateway ) { document.getElementById('lan0gateway').value = params.lan[0].gateway; }
if( params.lan[0].dns ) { document.getElementById('lan0dns' ).value = params.lan[0].dns; }
if( params.lan[0].dhcp ) { if( params.lan[0].dhcp=='1' ) { document.getElementById('lan0dhcpstatic0').checked=true;
document.getElementById('lan0manualaddress').style.display='none';
} else
{ document.getElementById('lan0dhcpstatic1').checked=true; }
}
if( params.lan[0].ipv6 ) { document.getElementById('lan0ipv60').checked=(params.lan[0].ipv6!='1');
document.getElementById('lan0ipv61').checked=(params.lan[0].ipv6=='1'); }
else document.getElementById('lan0ipv6').style.display='none';
} else {
// make lan settings invisible
}
if( !params.wifista && !params.wifiap ) {
document.getElementById('wifi0').style.display='none';
} else {
if( params.wifista.address ) { document.getElementById('wifiaddress').value = params.wifista.address; }
if( params.wifista.netmask ) { document.getElementById('wifinetmask').value = params.wifista.netmask; }
if( params.wifista.gateway ) { document.getElementById('wifigateway').value = params.wifista.gateway; }
if( params.wifista.dns ) { document.getElementById('wifidns' ).value = params.wifista.dns; }
if( params.wifista.dhcp ) { if( params.wifista.dhcp=='1' ) { document.getElementById('wifidhcpstatic0').checked=true;
document.getElementById('wifimanualaddress').style.display='none';
} else {
document.getElementById('wifidhcpstatic1').checked=true;
}
}
if( params.wifista.ipv6 ) { document.getElementById('wifiipv60').checked=(params.wifista.ipv6!='1');
document.getElementById('wifiipv61').checked=(params.wifista.ipv6=='1'); }
// access point mode
if( params.wifiap.enabled=='1' ) {
document.getElementById('wifi0mode2').checked=true;
document.getElementById('wifi0ssidpsk').style.display='';
document.getElementById('wifi0manualparams').style.display='none';
if( params.wifiap.psk ) { document.getElementById('wifipsk' ).value = params.wifiap.psk; }
if( params.wifiap.ssid ) { document.getElementById('wifissid').value = params.wifiap.ssid; }
}
// wireless client mode
else if( params.wifista.enabled=='1' ) {
document.getElementById('wifi0mode1').checked=true;
document.getElementById('wifi0ssidpsk').style.display='';
document.getElementById('wifi0manualparams').style.display='';
if( params.wifista.psk ) { document.getElementById('wifipsk' ).value = params.wifista.psk; }
if( params.wifista.ssid ) { document.getElementById('wifissid').value = params.wifista.ssid; }
}
else {
document.getElementById('wifi0mode0').checked=true;
document.getElementById('wifi0ssidpsk').style.display='none';
document.getElementById('wifi0manualparams').style.display='none';
}
}
});
});
</script>
</head>
<!-- document.getElementById('wifi0').style.visibility='hidden'; -->
<body>
<div id="nav"></div>
<div class="container">
<div class="row col-xs-12">
<div class="page-header">
<h1>Network Settings</h1>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#paneldevicehostname">Device Hostname</a>
</h4>
</div>
<div id="paneldevicehostname" class="panel-collapse collapse in">
<div class="panel-body">
<form id="formdevicehostname" method="post" action="./network_post.html">
<div class="col-xs-12 col-md-4">
<div class="form-group">
<label for="hostname">Hostname</label>
<input id="hostname" class="form-control" name="hostname" type="text" maxlength="16">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12">
<button form="formdevicehostname" class="btn btn-primary custom-btn-block-xs" type="submit"><span class="glyphicon glyphicon-ok"></span> Change Settings</button>
<button form="formdevicehostname" class="btn btn-default custom-btn-block-xs" type="reset"><span class="glyphicon glyphicon-remove"></span> Undo Changes</button>
<a href="./" class="btn btn-default" role="button">Cancel</a>
</div>
</div>
</form>
</div>
</div>
</div>
<div id="lan0" class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#panellan0settings">Wired Network Settings</a>
</h4>
</div>
<div id="panellan0settings" class="panel-collapse collapse">
<div class="panel-body">
<form name="formwirednetworksettings" id="formwirednetworksettings" method="post" action="./network_post.html">
<div id="lan0ipv6" class="col-xs-12 col-md-4">
<div class="form-group">
<label>Wired Network IPv6</label>
<div class="radio">
<label><input id="lan0ipv61" type="radio" name="ipv6" value="1"> Enabled </label>
</div>
<div class="radio">
<label><input id="lan0ipv60" type="radio" name="ipv6" value="0"> Disabled </label>
</div>
</div>
</div>
<div class="col-xs-12 col-md-12"></div>
<div class="col-xs-12 col-md-4">
<div class="form-group">
<label>Wired Network Address Assignment</label>
<div class="radio">
<label><input id="lan0dhcpstatic0" type="radio" name="dhcp" value="1"> Automatic (DHCP) (recommended)</label>
</div>
<div class="radio">
<label><input id="lan0dhcpstatic1" type="radio" name="dhcp" value="0"> Manual (Static IP)</label>
</div>
</div>
</div>
<div class="col-xs-12 col-md-12"></div>
<div id="lan0manualaddress" class="col-xs-12 col-md-4">
<input id="lan0mac" type='hidden' name="mac">
<div class="form-group">
<label for="address">IP Address</label>
<input id="lan0address" class="form-control" name="ipaddress" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="netmask">Netmask</label>
<input id="lan0netmask" class="form-control" name="ipnetmask" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="gateway">Default Gateway</label>
<input id="lan0gateway" class="form-control" name="ipgateway" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="dns">Nameserver</label>
<input id="lan0dns" class="form-control" name="ipdns" type="text" size="15" maxlength="15">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12">
<button form="formwirednetworksettings" class="btn btn-primary custom-btn-block-xs" type="submit"><span class="glyphicon glyphicon-ok"></span> Change Settings</button>
<button form="formwirednetworksettings" class="btn btn-default custom-btn-block-xs" type="reset"><span class="glyphicon glyphicon-remove"></span> Undo Changes</button>
<a href="./" class="btn btn-default" role="button">Cancel</a>
</div>
</div>
</form>
</div>
</div>
</div>
<div id="wifi0" class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#panelwifi0settings">Wireless Network Settings</a>
</h4>
</div>
<div id="panelwifi0settings" class="panel-collapse collapse">
<div class="panel-body">
<form name="formwifinetworksettings" id="formwifinetworksettings" method="post" action="./network_post.html">
<div class="col-xs-12 col-md-12">
<div class="form-group">
<label>Wireless Network Mode</label>
<div class="radio">
<label><input id="wifi0mode0" name="wifimode" value="0" type="radio"> Wireless disabled</label>
</div>
<div class="radio">
<label><input id="wifi0mode1" name="wifimode" value="1" type="radio"> Wireless Client (accesses an existing WiFi network)</label>
</div>
<div class="radio">
<label><input id="wifi0mode2" name="wifimode" value="2" type="radio"> Wireless Access Point (provides WiFi services to mobile devices)</label>
</div>
</div>
</div>
<div id="wifi0ssidpsk">
<div class="col-xs-12 col-md-4">
<div class="form-group">
<label for="wifissid">Name (SSID)</label>
<input id="wifissid" class="form-control" name="ssid" type="text" size="30" maxlength="30">
</div>
<div class="form-group">
<label for="wifipsk">Passphrase (WPA/WPA2)</label>
<input id="wifipsk" class="form-control" name="psk" type="text" size="30" maxlength="30">
</div>
</div>
</div>
<div id="wifi0manualparams">
<div class="col-xs-12 col-md-12">
<div class="form-group">
<label>Wireless Network IPv6</label>
<div class="radio">
<label><input id="wifiipv61" type="radio" name="ipv6" value="1"> Enabled </label>
</div>
<div class="radio">
<label><input id="wifiipv60" type="radio" name="ipv6" value="0"> Disabled </label>
</div>
</div>
</div>
<div class="col-xs-12 col-md-12">
<div class="form-group">
<label>Wireless Network Address Assignment</label>
<div class="radio">
<label><input id="wifidhcpstatic0" type="radio" value="1" name="dhcp"> Automatic (DHCP) (recommended)</label>
</div>
<div class="radio">
<label><input id="wifidhcpstatic1" type="radio" value="0" name="dhcp"> Manual (Static IP)</label>
</div>
</div>
</div>
<div id="wifimanualaddress" class="col-xs-12 col-md-4">
<div class="form-group">
<label for="wifiaddress">IP Address</label>
<input id="wifiaddress" class="form-control" name="ipaddress" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="wifinetmask">Netmask</label>
<input id="wifinetmask" class="form-control" name="ipnetmask" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="wifigateway">Default Gateway</label>
<input id="wifigateway" class="form-control" name="ipgateway" type="text" size="15" maxlength="15">
</div>
<div class="form-group">
<label for="wifidns">Nameserver</label>
<input id="wifidns" class="form-control" name="ipdns" type="text" size="15" maxlength="15">
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12">
<button form="formwifinetworksettings" class="btn btn-primary custom-btn-block-xs" type="submit"><span class="glyphicon glyphicon-ok"></span> Change Settings</button>
<button form="formwifinetworksettings" class="btn btn-default custom-btn-block-xs" type="reset"><span class="glyphicon glyphicon-remove"></span> Undo Changes</button>
<a href="./" class="btn btn-default" role="button">Cancel</a>
</div>
</div>
</form>
</div>
</div>
</div>
<div>
<p id="msg_reboot_jessie" class="help-block">Please reboot after submitting to activate new settings</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>