mirror of
https://github.com/ngoduykhanh/wireguard-ui.git
synced 2025-07-26 20:00:27 +03:00
Merge branch 'ngoduykhanh:master' into support-multi-subnet
This commit is contained in:
brittondodd
GitHub
commit
655375258e
16 changed files with 204 additions and 99 deletions
|
|
@ -44,17 +44,17 @@
|
|||
</ul>
|
||||
|
||||
<!-- SEARCH FORM -->
|
||||
<form class="form-inline ml-3">
|
||||
<div class="input-group input-group-sm">
|
||||
<input class="form-control form-control-navbar" type="search" placeholder="Search"
|
||||
aria-label="Search">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-navbar" type="submit">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- <form class="form-inline ml-3">-->
|
||||
<!-- <div class="input-group input-group-sm">-->
|
||||
<!-- <input class="form-control form-control-navbar" type="search" placeholder="Search"-->
|
||||
<!-- aria-label="Search">-->
|
||||
<!-- <div class="input-group-append">-->
|
||||
<!-- <button class="btn btn-navbar" type="submit">-->
|
||||
<!-- <i class="fas fa-search"></i>-->
|
||||
<!-- </button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </form>-->
|
||||
|
||||
<!-- Right navbar links -->
|
||||
<div class="navbar-nav ml-auto">
|
||||
|
|
@ -238,7 +238,7 @@
|
|||
<div class="float-right d-none d-sm-block">
|
||||
<b>Version</b> {{ .appVersion }}
|
||||
</div>
|
||||
<strong>Copyright © 2020 <a href="https://github.com/ngoduykhanh/wireguard-ui">Wireguard UI</a>.</strong> All rights
|
||||
<strong>Copyright © <script>document.write(new Date().getFullYear())</script> <a href="https://github.com/ngoduykhanh/wireguard-ui">Wireguard UI</a>.</strong> All rights
|
||||
reserved.
|
||||
</footer>
|
||||
|
||||
|
|
@ -388,19 +388,11 @@
|
|||
client_name: {
|
||||
required: true,
|
||||
},
|
||||
client_email: {
|
||||
required: true,
|
||||
email: true,
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
client_name: {
|
||||
required: "Please enter a name"
|
||||
},
|
||||
client_email: {
|
||||
required: "Please enter an email address",
|
||||
email: "Please enter a valid email address"
|
||||
},
|
||||
},
|
||||
errorElement: 'span',
|
||||
errorPlacement: function (error, element) {
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ Wireguard Clients
|
|||
<input type="hidden" id="e_client_id" name="e_client_id">
|
||||
<div class="form-group">
|
||||
<label for="e_client_email" class="control-label">Email</label>
|
||||
<input type="text" class="form-control" id="e_client_email" name="client_email">
|
||||
<input type="text" class="form-control" id="e_client_email" name="e_client_email">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer justify-content-between">
|
||||
|
|
@ -447,50 +447,40 @@ Wireguard Clients
|
|||
}
|
||||
});
|
||||
// Edit client form validation
|
||||
$("#frm_edit_client").validate({
|
||||
rules: {
|
||||
client_name: {
|
||||
required: true,
|
||||
},
|
||||
client_email: {
|
||||
required: true,
|
||||
email: true,
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
client_name: {
|
||||
required: "Please enter a name"
|
||||
},
|
||||
client_email: {
|
||||
required: "Please enter an email address",
|
||||
email: "Please enter a valid email address"
|
||||
},
|
||||
},
|
||||
errorElement: 'span',
|
||||
errorPlacement: function (error, element) {
|
||||
error.addClass('invalid-feedback');
|
||||
element.closest('.form-group').append(error);
|
||||
},
|
||||
highlight: function (element, errorClass, validClass) {
|
||||
$(element).addClass('is-invalid');
|
||||
},
|
||||
unhighlight: function (element, errorClass, validClass) {
|
||||
$(element).removeClass('is-invalid');
|
||||
}
|
||||
});
|
||||
|
||||
// Email client form validation
|
||||
$("#frm_email_client").validate({
|
||||
$("#frm_edit_client").validate({
|
||||
rules: {
|
||||
client_email: {
|
||||
client_name: {
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
client_name: {
|
||||
required: "Please enter a name"
|
||||
},
|
||||
},
|
||||
errorElement: 'span',
|
||||
errorPlacement: function (error, element) {
|
||||
error.addClass('invalid-feedback');
|
||||
element.closest('.form-group').append(error);
|
||||
},
|
||||
highlight: function (element, errorClass, validClass) {
|
||||
$(element).addClass('is-invalid');
|
||||
},
|
||||
unhighlight: function (element, errorClass, validClass) {
|
||||
$(element).removeClass('is-invalid');
|
||||
}
|
||||
});
|
||||
// Email client form validation
|
||||
$("#frm_email_client").validate({
|
||||
rules: {
|
||||
e_client_email: {
|
||||
required: true,
|
||||
email: true,
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
client_email: {
|
||||
required: "Please enter an email address",
|
||||
email: "Please enter a valid email address"
|
||||
e_client_email: {
|
||||
required: "Please enter an email"
|
||||
},
|
||||
},
|
||||
errorElement: 'span',
|
||||
|
|
|
|||
|
|
@ -47,13 +47,13 @@ Global Settings
|
|||
<div class="form-group">
|
||||
<label for="mtu">MTU</label>
|
||||
<input type="text" class="form-control" id="mtu" name="mtu" placeholder="MTU"
|
||||
value="{{ .globalSettings.MTU }}">
|
||||
value="{{if .globalSettings.MTU}}{{ .globalSettings.MTU }}{{end}}">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="persistent_keepalive">Persistent Keepalive</label>
|
||||
<input type="text" class="form-control" id="persistent_keepalive"
|
||||
name="persistent_keepalive" placeholder="Persistent Keepalive"
|
||||
value="{{ .globalSettings.PersistentKeepalive }}">
|
||||
value="{{if .globalSettings.PersistentKeepalive }}{{ .globalSettings.PersistentKeepalive }}{{end}}">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="config_file_path">Wireguard Config File Path</label>
|
||||
|
|
@ -71,6 +71,37 @@ Global Settings
|
|||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card card-success">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Help</h3>
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
<div class="card-body">
|
||||
<dl>
|
||||
<dt>1. Endpoint Address</dt>
|
||||
<dd>The public IP address of your Wireguard server that the client will connect to. Click on
|
||||
<strong>Suggest</strong> button to auto detect the public IP address of your server.</dd>
|
||||
<dt>2. DNS Servers</dt>
|
||||
<dd>The DNS servers will be set to client config.</dd>
|
||||
<dt>3. MTU</dt>
|
||||
<dd>The MTU will be set to server config. By default it is <code>1420</code>. You might want
|
||||
to adjust the MTU size if your connection (e.g PPPoE, 3G, satellite network, etc) has a low MTU.</dd>
|
||||
<dd>Leave blank to omit this setting in the Server config.</dd>
|
||||
<dt>4. Persistent Keepalive</dt>
|
||||
<dd>By default, WireGuard peers remain silent while they do not need to communicate,
|
||||
so peers located behind a NAT and/or firewall may be unreachable from other peers
|
||||
until they reach out to other peers themselves. Adding <code>PersistentKeepalive</code>
|
||||
can ensure that the connection remains open.</dd>
|
||||
<dd>Leave blank to omit this setting in the Client config.</dd>
|
||||
<dt>5. Wireguard Config File Path</dt>
|
||||
<dd>The path of your Wireguard server config file. Please make sure the parent directory
|
||||
exists and is writable.</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
|
|
@ -172,12 +203,10 @@ Global Settings
|
|||
$("#frm_global_settings").validate({
|
||||
rules: {
|
||||
mtu: {
|
||||
required: true,
|
||||
digits: true,
|
||||
range: [68, 65535]
|
||||
},
|
||||
persistent_keepalive: {
|
||||
required: true,
|
||||
digits: true
|
||||
},
|
||||
config_file_path: {
|
||||
|
|
@ -186,12 +215,10 @@ Global Settings
|
|||
},
|
||||
messages: {
|
||||
mtu: {
|
||||
required: "Please enter a MTU value",
|
||||
digits: "MTU must be an integer",
|
||||
range: "MTU must be in range 68..65535"
|
||||
},
|
||||
persistent_keepalive: {
|
||||
required: "Please enter a Persistent Keepalive value",
|
||||
digits: "Persistent keepalive must be an integer"
|
||||
},
|
||||
config_file_path: {
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-4">
|
||||
<button id="btn_login" type="button" class="btn btn-primary btn-block">Sign In</button>
|
||||
<button id="btn_login" type="submit" class="btn btn-primary btn-block">Sign In</button>
|
||||
</div>
|
||||
<!-- /.col -->
|
||||
</div>
|
||||
|
|
@ -91,6 +91,11 @@
|
|||
</script>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('form').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
$("#btn_login").trigger('click');
|
||||
});
|
||||
|
||||
$("#btn_login").click(function () {
|
||||
const username = $("#username").val();
|
||||
const password = $("#password").val();
|
||||
|
|
|
|||
|
|
@ -14,6 +14,20 @@ Connected Peers
|
|||
{{end}}
|
||||
|
||||
{{define "page_content"}}
|
||||
<script>
|
||||
function bytesToHumanReadable(temporal) {
|
||||
const units = [" ", " K", " M", " G", " T", " P", " E", " Z", " Y"]
|
||||
let pow = 0
|
||||
|
||||
while (temporal > 1024) {
|
||||
temporal /= 1024
|
||||
pow ++
|
||||
if (pow == units.length-1) break
|
||||
}
|
||||
|
||||
return parseFloat(temporal.toFixed(3)) + units[pow]+"Bytes"
|
||||
}
|
||||
</script>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
{{ if .error }}
|
||||
|
|
@ -41,8 +55,8 @@ Connected Peers
|
|||
<td>{{ $peer.Name }}</td>
|
||||
<td>{{ $peer.Email }}</td>
|
||||
<td>{{ $peer.PublicKey }}</td>
|
||||
<td>{{ $peer.ReceivedBytes }}</td>
|
||||
<td>{{ $peer.TransmitBytes }}</td>
|
||||
<td title="{{ $peer.ReceivedBytes }} Bytes"><script>document.write(bytesToHumanReadable({{ $peer.ReceivedBytes }}))</script></td>
|
||||
<td title="{{ $peer.TransmitBytes }} Bytes"><script>document.write(bytesToHumanReadable({{ $peer.TransmitBytes }}))</script></td>
|
||||
<td>{{ $peer.Connected }}</td>
|
||||
<td>{{ $peer.LastHandshakeTime }}</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
# This file was generated using wireguard-ui (https://github.com/ngoduykhanh/wireguard-ui)
|
||||
# Please don't modify it manually, otherwise your change might got replaced.
|
||||
# Please don't modify it manually, otherwise your change might get replaced.
|
||||
|
||||
# Address updated at: {{ .serverConfig.Interface.UpdatedAt }}
|
||||
# Private Key updated at: {{ .serverConfig.KeyPair.UpdatedAt }}
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
Address = {{$first :=true}}{{range .serverConfig.Interface.Addresses }}{{if $first}}{{$first = false}}{{else}},{{end}}{{.}}{{end}}
|
||||
ListenPort = {{ .serverConfig.Interface.ListenPort }}
|
||||
PrivateKey = {{ .serverConfig.KeyPair.PrivateKey }}
|
||||
MTU = {{ .globalSettings.MTU }}
|
||||
{{if .globalSettings.MTU}}MTU = {{ .globalSettings.MTU }}{{end}}
|
||||
PostUp = {{ .serverConfig.Interface.PostUp }}
|
||||
PostDown = {{ .serverConfig.Interface.PostDown }}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue