mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2025-10-03 15:56:17 +00:00
Compare commits
54 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
ed13babf6a | ||
|
|
80db82eb93 | ||
|
|
8d20334d6e | ||
|
|
03a95ad018 | ||
|
|
aa59cc8af0 | ||
|
|
80d63c2c89 | ||
|
|
03a4acd72b | ||
|
|
53118cf660 | ||
|
|
16b1baf81e | ||
|
|
960e0d0965 | ||
|
|
8f41222e43 | ||
|
|
e7bc447166 | ||
|
|
1736359615 | ||
|
|
58784b1e22 | ||
|
|
07f2bfd279 | ||
|
6d62db2890 | ||
|
|
a1b23c4aab | ||
|
|
e272a096da | ||
|
|
b8ca24c5bf | ||
|
|
a05d09f0de | ||
|
|
1807a79c4f | ||
|
|
77f6826af9 | ||
|
|
7e39eedf35 | ||
|
|
0b4b48ceae | ||
|
|
dad931e898 | ||
|
|
2e387730cb | ||
|
|
c9b6775793 | ||
|
|
a6eaf30c2b | ||
|
|
6f91d199d8 | ||
|
|
7ea486307a | ||
|
|
37d254c827 | ||
|
|
b4014eb317 | ||
|
|
c7824fa184 | ||
|
|
13c5bd45f9 | ||
|
|
465d102bd0 | ||
|
|
93007cd56c | ||
|
|
8367576dc8 | ||
|
|
dbc06145b3 | ||
|
|
4efcf0e7c8 | ||
|
|
0a4bbc1106 | ||
|
|
b08c1f6699 | ||
|
|
6828b905ef | ||
|
|
f72b405f6d | ||
|
|
27ae99864c | ||
|
|
82ba15ba5a | ||
|
af01db7bc9 | ||
|
|
6ec0a65d0c | ||
|
|
c32ccfc9ed | ||
|
|
ef818388c8 | ||
|
|
f5aa45a3e1 | ||
|
|
b7a047a743 | ||
|
|
05ec985453 | ||
|
|
88ed9c3e79 | ||
|
|
3fb03c8dfe |
@@ -23,6 +23,24 @@
|
||||
"contributions": [
|
||||
"code"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "reafian",
|
||||
"name": "Richard Newton",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/11992416?v=4",
|
||||
"profile": "https://github.com/reafian",
|
||||
"contributions": [
|
||||
"code"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "davejlong",
|
||||
"name": "David Long",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/175317?v=4",
|
||||
"profile": "http://www.davejlong.com",
|
||||
"contributions": [
|
||||
"code"
|
||||
]
|
||||
}
|
||||
],
|
||||
"contributorsPerLine": 7,
|
||||
|
||||
3
.github/FUNDING.yml
vendored
Normal file
3
.github/FUNDING.yml
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
# These are supported funding model platforms
|
||||
|
||||
github: [donaldzou]
|
||||
155
README.md
155
README.md
@@ -4,9 +4,10 @@
|
||||
|
||||
|
||||
<p align="center">
|
||||
<img src="img/logo.png" width="128">
|
||||
<img alt="WGDashboard" src="img/logo.png" width="128">
|
||||
</p>
|
||||
<h1 align="center"> Wireguard Dashboard</h1>
|
||||
<h1 align="center">WGDashboard</h1>
|
||||
<p align="center"><small>Note: This project is not affiliate to the official WireGuard Project ;)</small></p>
|
||||
|
||||
<p align="center">
|
||||
<img src="http://ForTheBadge.com/images/badges/made-with-python.svg">
|
||||
@@ -16,30 +17,22 @@
|
||||
</p>
|
||||
<p align="center">Monitoring WireGuard is not convinient, need to login into server and type <code>wg show</code>. That's why this platform is being created, to view all configurations and manage them in a easier way.</p>
|
||||
|
||||
|
||||
## 📣 What's New: Version v2.2
|
||||
## 📣 What's New: v2.3
|
||||
|
||||
- 🎉 **New Features**
|
||||
- **Add new peers**: Now you can add peers directly on dashboard, it will generate a pair of private key and public key. You can also set its DNS, endpoint allowed IPs. Both can set a default value in the setting page. [❤️ in [#44](https://github.com/donaldzou/wireguard-dashboard/issues/44)]
|
||||
- **QR Code:** You can add the private key in peer setting of your existed peer to create a QR code. Or just create a new one, dashboard will now be able to auto generate a private key and public key ;) Don't worry, all keys will be generated on your machine, and **will delete all key files after they got generated**. [❤️ in [#29](https://github.com/donaldzou/wireguard-dashboard/issues/29)]
|
||||
- **Peer configuration file download:** Same as QR code, you now can download the peer configuration file, so you don't need to manually input all the details on the peer machine! [❤️ in [#40](https://github.com/donaldzou/wireguard-dashboard/issues/40)]
|
||||
- **Search peers**: You can now search peers by their name.
|
||||
- **Autostart on boot:** Added a tutorial on how to start the dashboard to on boot! Please read the [tutorial below](#autostart-wireguard-dashboard-on-boot). [❤️ in [#29](https://github.com/donaldzou/wireguard-dashboard/issues/29)]
|
||||
- **Click to copy**: You can now click and copy all peer's public key and configuration's public key.
|
||||
- ....
|
||||
- **Update directly from `wgd.sh`:** Now you can update WGDashboard directly from the bash script.
|
||||
- **Displaying Peers:** You can switch the display mode between list and table in the configuration page.
|
||||
- 🪚 **Bug Fixed**
|
||||
- When there are comments in the wireguard config file, will cause the dashboard to crash.
|
||||
- Used regex to search for config files.
|
||||
- [Peer DNS Validation Fails #67](https://github.com/donaldzou/wireguard-dashboard/issues/67): Added DNS format check. [❤️ @realfian]
|
||||
- [configparser.NoSectionError: No section: 'Interface' #66](https://github.com/donaldzou/wireguard-dashboard/issues/66): Changed permission requirement for `etc/wireguard` from `744` to `755`. [❤️ @ramalmaty]
|
||||
- [Feature request: Interface not loading when information missing #73](https://github.com/donaldzou/wireguard-dashboard/issues/73): Fixed when Configuration Address and Listen Port is missing will crash the dashboard. [❤️ @js32]
|
||||
- [Remote Peer, MTU and PersistentKeepalives added #70](https://github.com/donaldzou/wireguard-dashboard/pull/70): Added MTU, remote peer and Persistent Keepalive. [❤️ @realfian]
|
||||
- [Fixes DNS check to support search domain #65](https://github.com/donaldzou/wireguard-dashboard/pull/65): Added allow input domain into DNS. [❤️@davejlong]
|
||||
- **🧐 Other Changes**
|
||||
- Moved all external CSS and JavaScript file to local hosting (Except Bootstrap Icon, due to large amount of SVG files).
|
||||
- Updated Python dependencies
|
||||
- Flask: `v1.1.2 => v2.0.1`
|
||||
- Jinja: `v2.10.1 => v3.0.1`
|
||||
- icmplib: `v2.1.1 => v3.0.1`
|
||||
- Updated CSS/JS dependencies
|
||||
- Bootstrap: `v4.5.3 => v4.6.0`
|
||||
- UI adjustment
|
||||
- Adjusted how peers will display in larger screens, used to be 1 row per peer, now is 3 peers in 1 row.
|
||||
- Moved Add Peer Button into the right bottom corner.
|
||||
|
||||
|
||||
|
||||
<hr>
|
||||
|
||||
|
||||
@@ -49,8 +42,8 @@
|
||||
- [📝 Requirement](#-requirement)
|
||||
- [🛠 Install](#-install)
|
||||
- [🪜 Usage](#-usage)
|
||||
- [Start/Stop/Restart Wireguard Dashboard](#startstoprestart-wireguard-dashboard)
|
||||
- [Autostart Wireguard Dashboard on boot](#autostart-wireguard-dashboard-on-boot)
|
||||
- [Start/Stop/Restart WGDashboard](#startstoprestart-wireguard-dashboard)
|
||||
- [Autostart WGDashboard on boot](#autostart-wireguard-dashboard-on-boot)
|
||||
- [✂️ Dashboard Configuration](#%EF%B8%8F-dashboard-configuration)
|
||||
- [Dashboard Configuration file](#dashboard-configuration-file)
|
||||
- [Generating QR code and peer configuration file (.conf)](#generating-qr-code-and-peer-configuration-file-conf)
|
||||
@@ -62,6 +55,7 @@
|
||||
|
||||
## 💡 Features
|
||||
|
||||
- **No need to re-configure existing WireGuard configuration! It can search for existed configuration files.**
|
||||
- Easy to use interface, provided username and password protection to the dashboard
|
||||
- Add peers and edit (Allowed IPs, DNS, Private Key...)
|
||||
- View peers and configuration real time details (Data Usage, Latest Handshakes...)
|
||||
@@ -80,7 +74,7 @@
|
||||
|
||||
> **If you have tested on other OS and it works perfectly please provide it to me in [#31](https://github.com/donaldzou/wireguard-dashboard/issues/31). Thank you!**
|
||||
|
||||
- **WireGuard** and **Wireguard-Tools (`wg-quick`)** are installed.
|
||||
- **WireGuard** and **WireGuard-Tools (`wg-quick`)** are installed.
|
||||
|
||||
> Don't know how? Check this <a href="https://www.wireguard.com/install/">official documentation</a>
|
||||
|
||||
@@ -90,7 +84,9 @@
|
||||
[Interface]
|
||||
...
|
||||
SaveConfig = true
|
||||
# Need to include this line to allow WireGuard Tool to save your configuration
|
||||
# Need to include this line to allow WireGuard Tool to save your configuration,
|
||||
# or if you just want it to monitor your WireGuard Interface and don't need to
|
||||
# make any changes with the dashboard, you can set it to false.
|
||||
|
||||
[Peer]
|
||||
PublicKey = abcd1234
|
||||
@@ -101,47 +97,47 @@
|
||||
- Python 3.7+ & Pip3
|
||||
|
||||
## 🛠 Install
|
||||
1. **Download Wireguard Dashboard**
|
||||
1. Download WGDashboard
|
||||
|
||||
```shell
|
||||
git clone -b v2.2 https://github.com/donaldzou/wireguard-dashboard.git
|
||||
git clone -b v2.3.1 https://github.com/donaldzou/wireguard-dashboard.git
|
||||
|
||||
2. Open the Wireguard Dashboard folder
|
||||
2. Open the WGDashboard folder
|
||||
|
||||
```shell
|
||||
cd wireguard-dashboard/src
|
||||
```
|
||||
|
||||
3. Install Python Dependencies
|
||||
|
||||
```shell
|
||||
python3 -m pip install -r requirements.txt
|
||||
```
|
||||
|
||||
4. Give read, write and execute permission to root of the WireGuard configuration folder, you can change the path if your configuration files is not stored in `/etc/wireguard`
|
||||
|
||||
```shell
|
||||
sudo chmod -R 744 /etc/wireguard
|
||||
```
|
||||
|
||||
5. Install & run Wireguard Dashboard
|
||||
3. Install WGDashboard
|
||||
|
||||
```shell
|
||||
sudo chmod u+x wgd.sh
|
||||
./wgd.sh start
|
||||
sudo ./wgd.sh install
|
||||
```
|
||||
|
||||
4. Give read and execute permission to root of the WireGuard configuration folder, you can change the path if your configuration files are not stored in `/etc/wireguard`
|
||||
|
||||
```shell
|
||||
sudo chmod -R 755 /etc/wireguard
|
||||
```
|
||||
|
||||
5. Run WGDashboard
|
||||
|
||||
```shell
|
||||
./wgd.sh start
|
||||
```
|
||||
|
||||
**Note**:
|
||||
|
||||
> For [`pivpn`](https://github.com/pivpn/pivpn) user, please use `sudo ./wgd.sh start` to run if your current account does not have the permission to run `wg show` and `wg-quick`.
|
||||
|
||||
6. **Access dashboard**
|
||||
6. Access dashboard
|
||||
|
||||
Access your server with port `10086` ! e.g (http://your_server_ip:10086), continue to read to on how to change port and ip that dashboard is running with.
|
||||
|
||||
## 🪜 Usage
|
||||
|
||||
#### Start/Stop/Restart Wireguard Dashboard
|
||||
#### Start/Stop/Restart WGDashboard
|
||||
|
||||
|
||||
```shell
|
||||
@@ -156,7 +152,7 @@ cd Wireguard-Dashboard/src
|
||||
./wgd.sh restart # Restart the dasboard
|
||||
```
|
||||
|
||||
#### Autostart Wireguard Dashboard on boot (>= v2.2)
|
||||
#### Autostart WGDashboard on boot (>= v2.2)
|
||||
|
||||
In the `src` folder, it contained a file called `wg-dashboard.service`, we can use this file to let our system to autostart the dashboard after reboot. The following guide has tested on **Ubuntu**, most **Debian** based OS might be the same, but some might not. Please don't hesitate to provide your system if you have tested the autostart on another system.
|
||||
|
||||
@@ -251,7 +247,7 @@ In the `src` folder, it contained a file called `wg-dashboard.service`, we can u
|
||||
└─6602 /usr/bin/python3 /root/wireguard-dashboard/src/dashboard.py
|
||||
|
||||
Aug 03 22:31:26 ubuntu-wg systemd[1]: Started wg-dashboard.service.
|
||||
Aug 03 22:31:27 ubuntu-wg python3[6602]: * Serving Flask app "Wireguard Dashboard" (lazy loading)
|
||||
Aug 03 22:31:27 ubuntu-wg python3[6602]: * Serving Flask app "WGDashboard" (lazy loading)
|
||||
Aug 03 22:31:27 ubuntu-wg python3[6602]: * Environment: production
|
||||
Aug 03 22:31:27 ubuntu-wg python3[6602]: WARNING: This is a development server. Do not use it in a production deployment.
|
||||
Aug 03 22:31:27 ubuntu-wg python3[6602]: Use a production WSGI server instead.
|
||||
@@ -277,7 +273,7 @@ In the `src` folder, it contained a file called `wg-dashboard.service`, we can u
|
||||
|
||||
#### Dashboard Configuration file
|
||||
|
||||
Since version 2.0, Wireguard Dashboard will be using a configuration file called `wg-dashboard.ini`, (It will generate automatically after first time running the dashboard). More options will include in future versions, and for now it included the following config:
|
||||
Since version 2.0, WGDashboard will be using a configuration file called `wg-dashboard.ini`, (It will generate automatically after first time running the dashboard). More options will include in future versions, and for now it included the following config:
|
||||
|
||||
| | Description | Default | Available in Setting |
|
||||
| --------------- | ------------------------------------------------------------ | ------------------------ | -------------------- |
|
||||
@@ -292,8 +288,6 @@ Since version 2.0, Wireguard Dashboard will be using a configuration file called
|
||||
| | If `auth_req = false` , user will not be access the **Setting** tab due to security consideration. **User can only edit the file directly in system**. | | |
|
||||
| `version` | Dashboard Version | `v2.2` | No |
|
||||
|
||||
<p align=center>Latest Version: v2.2</p>
|
||||
|
||||
**Except `auth_req` due to security consideration.**
|
||||
|
||||
#### Generating QR code and peer configuration file (.conf)
|
||||
@@ -320,60 +314,73 @@ Endpoint = 0.0.0.0:51820
|
||||
| `DNS` | The DNS server your peer will use | `1.1.1.1` - Cloud flare DNS, you can change it when you adding the peer or in the peer setting. | Yes |
|
||||
| **`[Peer]`** | | | |
|
||||
| `PublicKey` | The public key of your server | N/A | No |
|
||||
| `AllowedIPs` | IP ranges for which a peer will route traffic | `0.0.0.0/0` - Indicated a default route to send all internet and VPN traffic through that peer. | No |
|
||||
| `Endpoint` | Your wireguard server ip and port, the dashboard will search for your server's default interface's ip. | `<your server default interface ip>:<listen port>` | No |
|
||||
| `AllowedIPs` | IP ranges for which a peer will route traffic | `0.0.0.0/0` - Indicated a default route to send all internet and VPN traffic through that peer. | Yes |
|
||||
| `Endpoint` | Your wireguard server ip and port, the dashboard will search for your server's default interface's ip. | `<your server default interface ip>:<listen port>` | Yes |
|
||||
|
||||
## ❓ How to update the dashboard?
|
||||
|
||||
1. Change your directory to `wireguard-dashboard`
|
||||
```shell
|
||||
cd wireguard-dashboard
|
||||
cd wireguard-dashboard/src
|
||||
```
|
||||
2. Get the newest version
|
||||
2. Update the dashboard
|
||||
```shell
|
||||
sudo git pull https://github.com/donaldzou/wireguard-dashboard.git v2.2 --force
|
||||
sudo ./wgd.sh update
|
||||
```
|
||||
3. Update and install all python dependencies
|
||||
```shell
|
||||
python3 -m pip install -r requirements.txt
|
||||
```
|
||||
4. Start the dashboard
|
||||
```shell
|
||||
./wgd.sh start
|
||||
```
|
||||
## 🔍 Screenshot
|
||||
|
||||
|
||||
<p align=center>Sign In</p>
|
||||
|
||||
|
||||
<p align=center>Home</p>
|
||||
|
||||
|
||||
<p align=center>Configuration</p>
|
||||
|
||||
|
||||
<p align=center>Add Peer</p>
|
||||
|
||||
|
||||
<p align=center>Edit Peer</p>
|
||||
|
||||
|
||||
<p align=center>Delete Peer</p>
|
||||
|
||||
|
||||
<p align=center>Dashboard Setting</p>
|
||||
|
||||
|
||||
<p align=center>Ping</p>
|
||||
|
||||
|
||||
<p align=center>Traceroute</p>
|
||||
|
||||
|
||||
|
||||
## ⏰ Changelog
|
||||
|
||||
#### v2.2.1 - Aug 16, 2021
|
||||
|
||||
Bug Fixed:
|
||||
- Added support for full subnet on Allowed IP
|
||||
- Peer setting Save button
|
||||
|
||||
#### v2.2 - Aug 14, 2021
|
||||
|
||||
- 🎉 **New Features**
|
||||
- **Add new peers**: Now you can add peers directly on dashboard, it will generate a pair of private key and public key. You can also set its DNS, endpoint allowed IPs. Both can set a default value in the setting page. [❤️ in [#44](https://github.com/donaldzou/wireguard-dashboard/issues/44)]
|
||||
- **QR Code:** You can add the private key in peer setting of your existed peer to create a QR code. Or just create a new one, dashboard will now be able to auto generate a private key and public key ;) Don't worry, all keys will be generated on your machine, and **will delete all key files after they got generated**. [❤️ in [#29](https://github.com/donaldzou/wireguard-dashboard/issues/29)]
|
||||
- **Peer configuration file download:** Same as QR code, you now can download the peer configuration file, so you don't need to manually input all the details on the peer machine! [❤️ in [#40](https://github.com/donaldzou/wireguard-dashboard/issues/40)]
|
||||
- **Search peers**: You can now search peers by their name.
|
||||
- **Autostart on boot:** Added a tutorial on how to start the dashboard to on boot! Please read the [tutorial below](#autostart-wireguard-dashboard-on-boot). [❤️ in [#29](https://github.com/donaldzou/wireguard-dashboard/issues/29)]
|
||||
- **Click to copy**: You can now click and copy all peer's public key and configuration's public key.
|
||||
- ....
|
||||
- 🪚 **Bug Fixed**
|
||||
- When there are comments in the wireguard config file, will cause the dashboard to crash.
|
||||
- Used regex to search for config files.
|
||||
- **🧐 Other Changes**
|
||||
- Moved all external CSS and JavaScript file to local hosting (Except Bootstrap Icon, due to large amount of SVG files).
|
||||
- Updated Python dependencies
|
||||
- Flask: `v1.1.2 => v2.0.1`
|
||||
- Jinja: `v2.10.1 => v3.0.1`
|
||||
- icmplib: `v2.1.1 => v3.0.1`
|
||||
- Updated CSS/JS dependencies
|
||||
- Bootstrap: `v4.5.3 => v4.6.0`
|
||||
- UI adjustment
|
||||
- Adjusted how peers will display in larger screens, used to be 1 row per peer, now is 3 peers in 1 row.
|
||||
|
||||
#### v2.1 - Jul 2, 2021
|
||||
|
||||
- Added **Ping** and **Traceroute** tools!
|
||||
@@ -419,7 +426,7 @@ Endpoint = 0.0.0.0:51820
|
||||
## ✨ Contributors
|
||||
|
||||
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
|
||||
[](#contributors-)
|
||||
[](#contributors-)
|
||||
<!-- ALL-CONTRIBUTORS-BADGE:END -->
|
||||
|
||||
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
|
||||
@@ -431,6 +438,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
|
||||
<tr>
|
||||
<td align="center"><a href="https://github.com/antonioag95"><img src="https://avatars.githubusercontent.com/u/30556866?v=4?s=100" width="100px;" alt=""/><br /><sub><b>antonioag95</b></sub></a><br /><a href="https://github.com/donaldzou/wireguard-dashboard/commits?author=antonioag95" title="Tests">⚠️</a> <a href="https://github.com/donaldzou/wireguard-dashboard/commits?author=antonioag95" title="Code">💻</a></td>
|
||||
<td align="center"><a href="https://github.com/tonjo"><img src="https://avatars.githubusercontent.com/u/4726289?v=4?s=100" width="100px;" alt=""/><br /><sub><b>tonjo</b></sub></a><br /><a href="https://github.com/donaldzou/wireguard-dashboard/commits?author=tonjo" title="Code">💻</a></td>
|
||||
<td align="center"><a href="https://github.com/reafian"><img src="https://avatars.githubusercontent.com/u/11992416?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Richard Newton</b></sub></a><br /><a href="https://github.com/donaldzou/wireguard-dashboard/commits?author=reafian" title="Code">💻</a></td>
|
||||
<td align="center"><a href="https://github.com/davejlong"><img src="https://avatars.githubusercontent.com/u/175317?v=4?s=100" width="100px;" alt=""/><br /><sub><b>David Long</b></sub></a><br /><a href="https://github.com/donaldzou/wireguard-dashboard/commits?author=davejlong" title="Code">💻</a></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
617
src/dashboard.py
617
src/dashboard.py
File diff suppressed because it is too large
Load Diff
@@ -1,5 +1,5 @@
|
||||
Flask==2.0.1
|
||||
tinydb==4.3.0
|
||||
ifcfg==0.21
|
||||
icmplib==3.0.1
|
||||
flask-qrcode==3.0.0
|
||||
Flask
|
||||
tinydb
|
||||
ifcfg
|
||||
icmplib
|
||||
flask-qrcode
|
||||
@@ -194,15 +194,30 @@ main{
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
/*.add_btn{*/
|
||||
/* position: fixed;*/
|
||||
/* bottom: 1.75rem;*/
|
||||
/* right: 1.75rem;*/
|
||||
/* z-index: 1000;*/
|
||||
/* padding: 0.75rem 1.5rem;*/
|
||||
/* border-radius: 3rem;*/
|
||||
/* font-size: 1rem;*/
|
||||
/*}*/
|
||||
.peer_list{
|
||||
margin-bottom: 7rem
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.add_btn{
|
||||
bottom: 1.5rem !important;
|
||||
}
|
||||
|
||||
.peer_list{
|
||||
margin-bottom: 4rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
.add_btn{
|
||||
position: fixed;
|
||||
bottom: 3rem;
|
||||
right: 2rem;
|
||||
z-index: 99;
|
||||
border-radius: 100px;
|
||||
padding: 10px 20px;
|
||||
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
|
||||
}
|
||||
|
||||
|
||||
@-webkit-keyframes rotating /* Safari and Chrome */ {
|
||||
from {
|
||||
|
||||
@@ -17,7 +17,6 @@ function generate_key(){
|
||||
$("#re_generate_key i").removeClass("rotating")
|
||||
})
|
||||
}
|
||||
|
||||
function generate_public_key(){
|
||||
$.ajax({
|
||||
"url": "/generate_public_key",
|
||||
@@ -26,7 +25,7 @@ function generate_public_key(){
|
||||
"data": JSON.stringify({"private_key": $("#private_key").val()})
|
||||
}).done(function(res){
|
||||
if(res['status'] === "failed"){
|
||||
$("#add_peer_alert").html(res['msg']+$("#add_peer_alert").html());
|
||||
$("#add_peer_alert").html(res['msg']);
|
||||
$("#add_peer_alert").removeClass("d-none");
|
||||
}else{
|
||||
$("#add_peer_alert").addClass("d-none");
|
||||
@@ -46,29 +45,24 @@ $("#private_key").change(function(){
|
||||
$("#public_key").val("")
|
||||
}
|
||||
})
|
||||
|
||||
$('#add_modal').on('show.bs.modal', function (event) {
|
||||
generate_key()
|
||||
})
|
||||
|
||||
$("#re_generate_key").click(function (){
|
||||
$("#public_key").attr("disabled","disabled")
|
||||
$("#re_generate_key i").addClass("rotating")
|
||||
generate_key()
|
||||
})
|
||||
|
||||
$("#save_peer").click(function(){
|
||||
$(this).attr("disabled","disabled")
|
||||
$(this).html("Saving...")
|
||||
|
||||
if ($("#allowed_ips").val() !== "" && $("#public_key").val() !== "" && $("#new_add_DNS").val() !== "" && $("#new_add_endpoint_allowed_ip").val() != ""){
|
||||
var conf = $(this).attr('conf_id')
|
||||
var data_list = [$("#private_key"), $("#allowed_ips"), $("#new_add_name"), $("#new_add_DNS"), $("#new_add_endpoint_allowed_ip")]
|
||||
var data_list = [$("#private_key"), $("#allowed_ips"), $("#new_add_name"), $("#new_add_DNS"), $("#new_add_endpoint_allowed_ip"),$("#new_add_MTU"),$("#new_add_keep_alive")]
|
||||
for (var i = 0; i < data_list.length; i++){
|
||||
data_list[i].attr("disabled", "disabled")
|
||||
}
|
||||
|
||||
|
||||
$.ajax({
|
||||
method: "POST",
|
||||
url: "/add_peer/"+conf,
|
||||
@@ -81,12 +75,19 @@ $("#save_peer").click(function(){
|
||||
"allowed_ips": $("#allowed_ips").val(),
|
||||
"name":$("#new_add_name").val(),
|
||||
"DNS": $("#new_add_DNS").val(),
|
||||
"endpoint_allowed_ip": $("#new_add_endpoint_allowed_ip").val()
|
||||
"endpoint_allowed_ip": $("#new_add_endpoint_allowed_ip").val(),
|
||||
"MTU": $("#new_add_MTU").val(),
|
||||
"keep_alive": $("#new_add_keep_alive").val()
|
||||
}),
|
||||
success: function (response){
|
||||
if(response != "true"){
|
||||
$("#add_peer_alert").html(response+$("#add_peer_alert").html());
|
||||
$("#add_peer_alert").html(response);
|
||||
$("#add_peer_alert").removeClass("d-none");
|
||||
for (var i = 0; i < data_list.length; i++){
|
||||
data_list[i].removeAttr("disabled", "disabled")
|
||||
}
|
||||
$("#save_peer").removeAttr("disabled")
|
||||
$("#save_peer").html("Save")
|
||||
}
|
||||
else{
|
||||
location.reload();
|
||||
@@ -96,6 +97,8 @@ $("#save_peer").click(function(){
|
||||
}else{
|
||||
$("#add_peer_alert").html("Please fill in all required box.");
|
||||
$("#add_peer_alert").removeClass("d-none");
|
||||
$(this).removeAttr("disabled")
|
||||
$(this).html("Save")
|
||||
}
|
||||
})
|
||||
var qrcodeModal = new bootstrap.Modal(document.getElementById('qrcode_modal'), {
|
||||
@@ -164,13 +167,15 @@ $("body").on("click", ".btn-setting-peer", function(){
|
||||
},
|
||||
data: JSON.stringify({"id": peer_id}),
|
||||
success: function(response){
|
||||
let peer_name = ((response['name'] === "") ? "Untitled Peer" : response['name']);
|
||||
var peer_name = ((response['name'] === "") ? "Untitled Peer" : response['name'])
|
||||
$("#setting_modal .peer_name").html(peer_name);
|
||||
$("#setting_modal #peer_name_textbox").val(peer_name)
|
||||
$("#setting_modal #peer_name_textbox").val(response['name'])
|
||||
$("#setting_modal #peer_private_key_textbox").val(response['private_key'])
|
||||
$("#setting_modal #peer_DNS_textbox").val(response['DNS'])
|
||||
$("#setting_modal #peer_allowed_ip_textbox").val(response['allowed_ip'])
|
||||
$("#setting_modal #peer_endpoint_allowed_ips").val(response['endpoint_allowed_ip'])
|
||||
$("#setting_modal #peer_mtu").val(response['mtu'])
|
||||
$("#setting_modal #peer_keep_alive").val(response['keep_alive'])
|
||||
settingModal.toggle();
|
||||
endProgressBar()
|
||||
}
|
||||
@@ -211,7 +216,10 @@ $("#save_peer_setting").click(function (){
|
||||
){
|
||||
var peer_id = $(this).attr("peer_id");
|
||||
var conf_id = $(this).attr("conf_id");
|
||||
var data_list = [$("#peer_name_textbox"), $("#peer_DNS_textbox"), $("#peer_private_key_textbox"), $("#peer_allowed_ip_textbox"), $("#peer_endpoint_allowed_ips")]
|
||||
var data_list = [
|
||||
$("#peer_name_textbox"), $("#peer_DNS_textbox"), $("#peer_private_key_textbox"),
|
||||
$("#peer_allowed_ip_textbox"), $("#peer_endpoint_allowed_ips"), $("#peer_mtu"), $("#peer_keep_alive")
|
||||
]
|
||||
for (var i = 0; i < data_list.length; i++){
|
||||
data_list[i].attr("disabled", "disabled")
|
||||
}
|
||||
@@ -227,7 +235,9 @@ $("#save_peer_setting").click(function (){
|
||||
DNS: $("#peer_DNS_textbox").val(),
|
||||
private_key: $("#peer_private_key_textbox").val(),
|
||||
allowed_ip: $("#peer_allowed_ip_textbox").val(),
|
||||
endpoint_allowed_ip: $("#peer_endpoint_allowed_ips").val()
|
||||
endpoint_allowed_ip: $("#peer_endpoint_allowed_ips").val(),
|
||||
MTU: $("#peer_mtu").val(),
|
||||
keep_alive: $("#peer_keep_alive").val()
|
||||
}),
|
||||
success: function (response){
|
||||
if (response['status'] === "failed"){
|
||||
@@ -246,9 +256,11 @@ $("#save_peer_setting").click(function (){
|
||||
}
|
||||
}
|
||||
})
|
||||
}else{
|
||||
}else{
|
||||
$("#setting_peer_alert").html("Please fill in all required box.");
|
||||
$("#setting_peer_alert").removeClass("d-none");
|
||||
$("#save_peer_setting").removeAttr("disabled")
|
||||
$("#save_peer_setting").html("Save")
|
||||
}
|
||||
|
||||
|
||||
@@ -277,7 +289,6 @@ function doneTyping () {
|
||||
load_data($('#search_peer_textbox').val());
|
||||
}
|
||||
|
||||
|
||||
// Sorting
|
||||
$("body").on("change", "#sort_by_dropdown", function (){
|
||||
$.ajax({
|
||||
@@ -291,7 +302,7 @@ $("body").on("change", "#sort_by_dropdown", function (){
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// Click key to copy
|
||||
$("body").on("mouseenter", ".key", function(){
|
||||
var label = $(this).parent().siblings().children()[1]
|
||||
label.style.opacity = "100"
|
||||
@@ -317,6 +328,7 @@ function copyToClipboard(element) {
|
||||
$temp.remove();
|
||||
}
|
||||
|
||||
// Update Interval
|
||||
$("body").on("click", ".update_interval", function(){
|
||||
$.ajax({
|
||||
method:"POST",
|
||||
@@ -330,3 +342,14 @@ $("body").on("click", ".update_interval", function(){
|
||||
$("body").on("click", ".refresh", function (){
|
||||
load_data($('#search_peer_textbox').val());
|
||||
});
|
||||
|
||||
// Switch display mode
|
||||
$("body").on("click", ".display_mode", function(){
|
||||
$.ajax({
|
||||
method:"GET",
|
||||
url: "/switch_display_mode/"+$(this).attr("display-mode"),
|
||||
success: function (res){
|
||||
location.reload()
|
||||
}
|
||||
})
|
||||
})
|
||||
@@ -11,11 +11,7 @@
|
||||
<input type="text" class="form-control" id="search_peer_textbox" placeholder="Search Peer..." value="" style="display: none">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="config_body">
|
||||
|
||||
</div>
|
||||
<div id="config_body"></div>
|
||||
</div>
|
||||
<div class="modal fade" id="add_modal" data-backdrop="static" data-keyboard="false" tabindex="-1"
|
||||
aria-labelledby="staticBackdropLabel" aria-hidden="true">
|
||||
@@ -44,9 +40,7 @@
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" id="private_key" aria-describedby="public_key">
|
||||
<div class="input-group-append">
|
||||
<button type="button" class="btn btn-danger" id="re_generate_key">
|
||||
<i class="bi bi-arrow-repeat"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-danger" id="re_generate_key"><i class="bi bi-arrow-repeat"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -73,13 +67,24 @@
|
||||
<input type="text" class="form-control" id="new_add_DNS" value="{{ DNS }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="new_add_endpoint_allowed_ip">Endpoint Allowed IPs <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="new_add_endpoint_allowed_ip" value="{{ endpoint_allowed_ip }}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="new_add_MTU">MTU</label>
|
||||
<input type="text" class="form-control" id="new_add_MTU" value="{{ mtu }}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="new_add_keep_alive">Persistent keepalive</label>
|
||||
<input type="text" class="form-control" id="new_add_keep_alive" value="{{ keep_alive }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@@ -132,29 +137,51 @@
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="peer_name_textbox" class="form-label">Name</label>
|
||||
<input type="text" class="form-control" id="peer_name_textbox" placeholder="">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div>
|
||||
<label for="peer_private_key_textbox" class="form-label">Private Key <code>(Required for QR Code and download)</code></label>
|
||||
<input type="password" class="form-control" id="peer_private_key_textbox" style="padding-right: 40px">
|
||||
<a class="peer_private_key_textbox_switch"><i class="bi bi-eye-fill"></i></a>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="peer_allowed_ip_textbox" class="form-label">Allowed IPs <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_allowed_ip_textbox">
|
||||
<hr>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_name_textbox" class="form-label">Name</label>
|
||||
<input type="text" class="form-control" id="peer_name_textbox" placeholder="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_allowed_ip_textbox" class="form-label">Allowed IPs <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_allowed_ip_textbox">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_DNS_textbox" class="form-label">DNS <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_DNS_textbox">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_endpoint_allowed_ips" class="form-label">Endpoint Allowed IPs <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_endpoint_allowed_ips">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_mtu" class="form-label">MTU</label>
|
||||
<input type="text" class="form-control" id="peer_mtu">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="mb-3">
|
||||
<label for="peer_keep_alive" class="form-label">Persistent Keepalive</label>
|
||||
<input type="text" class="form-control" id="peer_keep_alive">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="peer_DNS_textbox" class="form-label">DNS <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_DNS_textbox">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="peer_endpoint_allowed_ips" class="form-label">Endpoint Allowed IPs <code>(Required)</code></label>
|
||||
<input type="text" class="form-control" id="peer_endpoint_allowed_ips">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
|
||||
@@ -223,9 +250,6 @@
|
||||
},250)
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
function load_data(search){
|
||||
startProgressBar()
|
||||
$.ajax({
|
||||
@@ -237,9 +261,7 @@
|
||||
success: function (response){
|
||||
$("#config_body").html(response);
|
||||
$("#search_peer_textbox").css("display", "block")
|
||||
if (bar.css("width") !== "0%"){
|
||||
endProgressBar()
|
||||
}
|
||||
endProgressBar()
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -249,8 +271,6 @@
|
||||
load_data($('#search_peer_textbox').val());
|
||||
}, {{dashboard_refresh_interval}})
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script src="{{ url_for('static',filename='js/configuration.js') }}"></script>
|
||||
</html>
|
||||
@@ -1,9 +1,19 @@
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4 mt-4 mb-4">
|
||||
<div class="info mt-4">
|
||||
{% if conf_data['listen_port'] == "" and conf_data['status'] == "stopped" %}
|
||||
<div class="alert alert-warning" role="alert">
|
||||
Peer QR Code and configuration file download required a specified <strong>Listen Port</strong>.
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if conf_data['conf_address'] == "N/A" %}
|
||||
<div class="alert alert-warning" role="alert">
|
||||
Configuration <strong>Address</strong> not be specified to have peer connect to it.
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<small class="text-muted"><strong>CONFIGURATION</strong></small>
|
||||
<h1 class="mb-3">{{conf_data['name']}}</h1>
|
||||
<h1 class="mb-3"><samp>{{conf_data['name']}}</samp></h1>
|
||||
</div>
|
||||
<div class="col">
|
||||
<small class="text-muted"><strong>ACTION</strong></small><br>
|
||||
@@ -30,7 +40,7 @@
|
||||
<h6 style="text-transform: uppercase;">{{conf_data['total_data_usage'][0]}} GB</h6>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<small class="text-muted"><strong>TOTAL RECIEVED</strong></small>
|
||||
<small class="text-muted"><strong>TOTAL RECEIVED</strong></small>
|
||||
<h6 style="text-transform: uppercase;">{{conf_data['total_data_usage'][1]}} GB</h6>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
@@ -43,11 +53,18 @@
|
||||
<strong>PUBLIC KEY</strong>
|
||||
<strong style="margin-left: auto!important; opacity: 0; transition: 0.2s ease-in-out" class="text-primary">CLICK TO COPY</strong></small>
|
||||
</small>
|
||||
<h6 style="text-transform: uppercase;"><samp class="key">{{conf_data['public_key']}}</samp></h6>
|
||||
<h6><samp class="key">{{conf_data['public_key']}}</samp></h6>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<small class="text-muted"><strong>LISTEN PORT</strong></small>
|
||||
<h6 style="text-transform: uppercase;"><samp>{{conf_data['listen_port']}}</samp></h6>
|
||||
<h6 style="text-transform: uppercase;"><samp>
|
||||
{% if conf_data['listen_port'] == "" %}
|
||||
N/A
|
||||
{% else %}
|
||||
{{conf_data['listen_port']}}
|
||||
{% endif %}
|
||||
|
||||
</samp></h6>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<small class="text-muted"><strong>ADDRESS</strong></small>
|
||||
@@ -81,18 +98,22 @@
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<div class="form-group">
|
||||
<label><small class="text-muted">Add</small></label><br>
|
||||
<button type="button" class="btn btn-primary add_btn" data-toggle="modal" data-target="#add_modal" style="width: 100%">
|
||||
<i class="bi bi-plus-circle-fill"></i> Add Peer
|
||||
</button>
|
||||
<label><small class="text-muted">Display Mode</small></label><br>
|
||||
<div class="btn-group" role="group" style="width: 100%">
|
||||
<button style="width: 20%" type="button" class="btn btn-outline-primary display_mode {% if peer_display_mode == "grid" %} {{ "active" }} {% endif %}" display-mode="grid"><i class="bi bi-grid-fill" style="font-size: 1.5rem;"></i></button>
|
||||
<button style="width: 20%" type="button" class="btn btn-outline-primary display_mode {% if peer_display_mode == "list" %} {{ "active" }} {% endif %}" display-mode="list"><i class="bi bi-list" style="font-size: 1.5rem;"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-primary add_btn" data-toggle="modal" data-target="#add_modal">
|
||||
<i class="bi bi-plus-circle-fill" style=""></i> Add Peer
|
||||
</button>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row peer_list">
|
||||
{% if conf_data['peer_data']|length == 0 %}
|
||||
<div class="col-12" style="text-align: center; margin-top: 1.5rem">
|
||||
<h3 class="text-muted">Oops! No peers found ‘︿’</h3>
|
||||
@@ -100,28 +121,37 @@
|
||||
{% endif %}
|
||||
|
||||
{% for i in conf_data['peer_data']%}
|
||||
<div class="col-sm-6 col-md-4">
|
||||
{% if peer_display_mode == "list" %}
|
||||
<div class="col-12">
|
||||
{% else %}
|
||||
<div class="col-sm-6 col-lg-4">
|
||||
{% endif %}
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="col">
|
||||
<div class="card-header-body ">
|
||||
{% if not i['name']%}
|
||||
{{ "Untitled Peer" }}
|
||||
{{ "Untitled" }}
|
||||
{% else %}
|
||||
{{i['name']}}
|
||||
{% endif %}
|
||||
<span class="dot dot-{{i['status']}}"></span>
|
||||
{# <span class="dot dot-{{i['status']}}"></span>#}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 peer_data_group">
|
||||
<p class="text-primary" style="text-transform: uppercase; display: inline-block; margin-bottom: 0; margin-right: 1rem"><i class="bi bi-arrow-down-right"></i> {{i['total_receive']}} GB</p>
|
||||
<p class="text-success" style="text-transform: uppercase; display: inline-block; margin-bottom: 0"><i class="bi bi-arrow-up-right"></i> {{i['total_sent']}} GB</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<small class="text-muted"><strong>STATUS</strong></small>
|
||||
<h6 style="text-transform: uppercase;" class="mb-2"><span class="dot dot-{{i['status']}}" style="margin-left: 0 !important;margin-top: 5px"></span></h6>
|
||||
</div>
|
||||
<div class="col-6 peer_data_group" style="text-align: right">
|
||||
<small class="text-muted"><strong>TRANSFER</strong></small>
|
||||
<p class="text-primary" style="text-transform: uppercase; margin-bottom: 0;"><small><i class="bi bi-arrow-down-right"></i> {{i['total_receive']}} GB</small></p>
|
||||
<p class="text-success" style="text-transform: uppercase; margin-bottom: 0"><small><i class="bi bi-arrow-up-right"></i> {{i['total_sent']}} GB</small></p>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<small class="text-muted" style="display: flex">
|
||||
<strong>PEER</strong>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard | {{ title }}</title>
|
||||
<title>WGDashboard | {{ title }}</title>
|
||||
<link rel="icon" href="{{ url_for('static',filename='img/logo.png') }}"/>
|
||||
<link rel="stylesheet" href="{{ url_for('static',filename='css/bootstrap.min.css') }}">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='css/dashboard.css') }}">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="/">Wireguard Dashboard</a>
|
||||
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="/">WGDashboard</a>
|
||||
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
|
||||
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<html>
|
||||
{% with %}
|
||||
{% set title="Settings" %}
|
||||
{% include "header.html"%}
|
||||
{% include "header.html" %}
|
||||
{% endwith %}
|
||||
<body>
|
||||
{% include "navbar.html" %}
|
||||
@@ -14,86 +14,124 @@
|
||||
{{ message }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<h1 class="pb-4">Settings</h1>
|
||||
<h1 class="">Settings</h1>
|
||||
<hr>
|
||||
{% if required_auth == "true" %}
|
||||
<h3>Account</h3>
|
||||
<form action="/update_acct" method="post">
|
||||
<div class="form-group">
|
||||
<label for="username">Username</label>
|
||||
<input type="text" class="form-control mb-4" id="username" name="username"
|
||||
value="{{ session['username'] }}" required>
|
||||
<button type="submit" class="btn btn-success">Update Account</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
<h3>New Peer Default Settings</h3>
|
||||
<form action="/update_peer_default_config" method="post">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm">
|
||||
<label for="username">DNS</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_global_DNS" name="peer_global_DNS"
|
||||
value="{{ peer_global_DNS }}" required>
|
||||
<div class="card mb-3">
|
||||
<h6 class="card-header">Peer Default Settings</h6>
|
||||
<div class="card-body">
|
||||
<form action="/update_peer_default_config" method="post">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<label for="peer_global_DNS">DNS</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_global_DNS"
|
||||
name="peer_global_DNS"
|
||||
value="{{ peer_global_DNS }}" required>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label for="peer_endpoint_allowed_ip">Peer Endpoint Allowed IPs</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_endpoint_allowed_ip"
|
||||
name="peer_endpoint_allowed_ip"
|
||||
value="{{ peer_endpoint_allowed_ip }}" required>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label for="peer_mtu">MTU</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_mtu"
|
||||
name="peer_mtu"
|
||||
value="{{ peer_mtu }}">
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label for="peer_keep_alive">Persistent Keepalive</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_keep_alive"
|
||||
name="peer_keep_alive"
|
||||
value="{{ peer_keepalive }}">
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<label for="peer_remote_endpoint"><strong>Peer Remote Endpoint (This will be change globally, and will be apply to all peer's QR code and configuration file.)</strong></label>
|
||||
<input type="text" class="form-control mb-4" id="peer_remote_endpoint"
|
||||
name="peer_remote_endpoint"
|
||||
value="{{ peer_remote_endpoint }}" required>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-success" type="submit">Update Peer Default Settings</button>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<label for="username">Peer Endpoint Allowed IPs</label>
|
||||
<input type="text" class="form-control mb-4" id="peer_endpoint_allowed_ip" name="peer_endpoint_allowed_ip"
|
||||
value="{{ peer_endpoint_allowed_ip }}" required>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-success" type="submit">Update Peer Default Settings</button>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
|
||||
|
||||
<h3>WireGuard Configuration Path</h3>
|
||||
<form action="/update_wg_conf_path" method="post" class="update_wg_conf_path">
|
||||
<div class="form-group">
|
||||
<label for="username">Path</label>
|
||||
<input type="text" class="form-control mb-4" id="wg_conf_path" name="wg_conf_path"
|
||||
value="{{ wg_conf_path }}">
|
||||
<p>Remember to remove <code>/</code> at the end of your path. e.g <code>/etc/wireguard</code>
|
||||
</p>
|
||||
<button class="btn btn-danger change_path">Update Path & Restart Dashboard</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
<h3>Security</h3>
|
||||
<form action="/update_pwd" , method="post">
|
||||
<div class="form-group">
|
||||
<label for="currentpass">Current Password</label>
|
||||
<input type="password" class="form-control mb-2" id="currentpass" name="currentpass">
|
||||
<label for="newpass">New Password</label>
|
||||
<input type="password" class="form-control mb-2" id="newpass" name="newpass">
|
||||
<label for="repnewpass">Repeat New Password</label>
|
||||
<input type="password" class="form-control mb-4" id="repnewpass" name="repnewpass">
|
||||
<button type="submit" class="btn btn-danger">Update Password</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
{% endif %}
|
||||
<h3>Dashboard Configuration</h3>
|
||||
<form action="/update_app_ip_port" method="post" class="update_app_ip_port">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm">
|
||||
<label for="app_ip">Dashboard IP</label>
|
||||
<input type="text" class="form-control mb-2" id="app_ip" name="app_ip" value="{{ app_ip }}">
|
||||
<p><small class="text-danger mb-4">0.0.0.0 means it can be access by anyone with your server
|
||||
IP Address.</small></p>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<label for="app_port">Dashboard Port</label>
|
||||
<input type="text" class="form-control mb-4" id="app_port" name="app_port"
|
||||
value="{{ app_port }}">
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger confirm_modal" data-toggle="modal"
|
||||
data-target="#confirmModal">Update Configuration & Restart
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
<div class="card mb-3">
|
||||
<h6 class="card-header">WireGuard Configuration Path</h6>
|
||||
<div class="card-body">
|
||||
<form action="/update_wg_conf_path" method="post" class="update_wg_conf_path">
|
||||
<div class="form-group">
|
||||
<label for="wg_conf_path">Path</label>
|
||||
<input type="text" class="form-control mb-2" id="wg_conf_path" name="wg_conf_path"
|
||||
value="{{ wg_conf_path }}">
|
||||
<p class="text-muted">Remember to remove <code>/</code> at the end of your path. e.g <code>/etc/wireguard</code>
|
||||
</p>
|
||||
<button class="btn btn-danger change_path">Update Path & Restart Dashboard</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mb-3">
|
||||
<h6 class="card-header">Account</h6>
|
||||
<div class="card-body">
|
||||
<form action="/update_acct" method="post">
|
||||
<div class="form-group">
|
||||
<label for="username">Username</label>
|
||||
<input type="text" class="form-control mb-4" id="username" name="username"
|
||||
value="{{ session['username'] }}" required>
|
||||
<button type="submit" class="btn btn-danger">Update Account</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mb-3">
|
||||
<h6 class="card-header">Security</h6>
|
||||
<div class="card-body">
|
||||
<form action="/update_pwd" method="post">
|
||||
<div class="form-group">
|
||||
<label for="currentpass">Current Password</label>
|
||||
<input type="password" class="form-control mb-2" id="currentpass" name="currentpass">
|
||||
<label for="newpass">New Password</label>
|
||||
<input type="password" class="form-control mb-2" id="newpass" name="newpass">
|
||||
<label for="repnewpass">Repeat New Password</label>
|
||||
<input type="password" class="form-control mb-4" id="repnewpass" name="repnewpass">
|
||||
<button type="submit" class="btn btn-danger">Update Password</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="card">
|
||||
<h6 class="card-header">Dashboard Configuration</h6>
|
||||
<div class="card-body">
|
||||
<form action="/update_app_ip_port" method="post" class="update_app_ip_port">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm">
|
||||
<label for="app_ip">Dashboard IP</label>
|
||||
<input type="text" class="form-control mb-2" id="app_ip" name="app_ip" value="{{ app_ip }}">
|
||||
<p><small class="text-danger mb-4">0.0.0.0 means it can be access by anyone with your server
|
||||
IP Address.</small></p>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<label for="app_port">Dashboard Port</label>
|
||||
<input type="text" class="form-control mb-4" id="app_port" name="app_port"
|
||||
value="{{ app_port }}">
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger confirm_modal" data-toggle="modal"
|
||||
data-target="#confirmModal">Update Configuration & Restart Dashboard
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- Modal -->
|
||||
@@ -122,7 +160,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "tools.html" %}
|
||||
</body>
|
||||
|
||||
{% include "footer.html" %}
|
||||
<script>
|
||||
$(".sb-settings-url").addClass("active")
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
</h6>
|
||||
<ul class="nav flex-column">
|
||||
{% for i in conf%}
|
||||
<li class="nav-item"><a class="nav-link sb-{{i['conf']}}-url" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
|
||||
<li class="nav-item"><a class="nav-link sb-{{i['conf']}}-url" href="/configuration/{{i['conf']}}"><samp>{{i['conf']}}</samp></a></li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
<hr>
|
||||
@@ -39,7 +39,7 @@
|
||||
</ul>
|
||||
{% endif %}
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item"><a href="https://github.com/donaldzou/wireguard-dashboard"><small class="nav-link text-muted">{{ session['dashboard_version'] }}</small></a></li>
|
||||
<li class="nav-item"><a href="https://github.com/donaldzou/wireguard-dashboard/releases/tag/{{ session['dashboard_version'] }}"><small class="nav-link text-muted">{{ session['dashboard_version'] }}</small></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard | Login</title>
|
||||
<title>WGDashboard | Login</title>
|
||||
<link rel="icon" href="{{ url_for('static',filename='logo.png') }}"/>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='css/dashboard.css') }}">
|
||||
@@ -13,7 +13,7 @@
|
||||
|
||||
<main role="main" class="container login-container">
|
||||
<div class="login-box" style="margin: auto !important;">
|
||||
<h3 class="text-center">Sign In</h3>
|
||||
<h1 class="text-center">Sign In</h1>
|
||||
|
||||
<form style="margin-left: auto !important; margin-right: auto !important; max-width: 500px;" action="/auth" method="post">
|
||||
{% if message != ""%}
|
||||
@@ -22,7 +22,7 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="form-group">
|
||||
<label for="username" class="text-left">User Name</label>
|
||||
<label for="username" class="text-left">Username</label>
|
||||
<input type="text" class="form-control" id="username" name="username" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
@@ -36,4 +36,9 @@
|
||||
</div>
|
||||
</body>
|
||||
{% include "footer.html" %}
|
||||
<script>
|
||||
$("button").click(function(){
|
||||
$(this).html("Signing In...")
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
95
src/wgd.sh
95
src/wgd.sh
@@ -1,20 +1,45 @@
|
||||
#!/bin/bash
|
||||
|
||||
app_name="dashboard.py"
|
||||
app_official_name="WGDashboard"
|
||||
dashes='------------------------------------------------------------'
|
||||
equals='============================================================'
|
||||
help () {
|
||||
printf "<Wireguard Dashboard> by Donald Zou - https://github.com/donaldzou \n"
|
||||
printf "Usage: sh wgd.sh <option>"
|
||||
printf "\n \n"
|
||||
printf "Available options: \n"
|
||||
printf " start: To start Wireguard Dashboard.\n"
|
||||
printf " stop: To stop Wireguard Dashboard.\n"
|
||||
printf " debug: To start Wireguard Dashboard in debug mode (i.e run in foreground).\n"
|
||||
printf " update: To update Wireguard Dashboard to the newest version from GitHub.\n"
|
||||
printf "Thank you for using this dashboard! Your support is my motivation ;) \n"
|
||||
printf "\n"
|
||||
printf "=================================================================================\n"
|
||||
printf "+ <WGDashboard> by Donald Zou - https://github.com/donaldzou +\n"
|
||||
printf "=================================================================================\n"
|
||||
printf "| Usage: ./wgd.sh <option> |\n"
|
||||
printf "| |\n"
|
||||
printf "| Available options: |\n"
|
||||
printf "| start: To start WGDashboard. |\n"
|
||||
printf "| stop: To stop WGDashboard. |\n"
|
||||
printf "| debug: To start WGDashboard in debug mode (i.e run in foreground). |\n"
|
||||
printf "| update: To update WGDashboard to the newest version from GitHub. |\n"
|
||||
printf "| install: To install WGDashboard. |\n"
|
||||
printf "| Thank you for using! Your support is my motivation ;) |\n"
|
||||
printf "=================================================================================\n"
|
||||
}
|
||||
|
||||
install_wgd(){
|
||||
# Check Python3 version
|
||||
version_pass=$(python3 -c 'import sys; print("1") if (sys.version_info.major == 3 and sys.version_info.minor >= 7) else print("0");')
|
||||
if [ $version_pass == "0" ]
|
||||
then printf "| WGDashboard required Python3.7+ |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
exit 1
|
||||
fi
|
||||
rm db/hi.txt > /dev/null 2>&1
|
||||
if [ ! -d "log" ]
|
||||
then mkdir "log"
|
||||
fi
|
||||
printf "| Installing latest Python dependencies |\n"
|
||||
python3 -m pip install -r requirements.txt > /dev/null 2>&1
|
||||
printf "| WGDashboard installed successfully! |\n"
|
||||
printf "| Starting Dashboard |\n"
|
||||
start_wgd
|
||||
}
|
||||
|
||||
|
||||
check_wgd_status(){
|
||||
if ps aux | grep '[p]ython3 '$app_name > /dev/null;
|
||||
then
|
||||
@@ -25,14 +50,15 @@ check_wgd_status(){
|
||||
}
|
||||
|
||||
start_wgd () {
|
||||
printf "%s" "$PLATFORM"
|
||||
printf "Starting Wireguard Dashboard in the background. \n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| Starting WGDashboard in the background. |\n"
|
||||
if [ ! -d "log" ]
|
||||
then mkdir "log"
|
||||
fi
|
||||
d=$(date '+%Y%m%d%H%M%S')
|
||||
python3 "$app_name" > log/"$d".txt 2>&1 &
|
||||
printf "Log file: log/%s""$d"".txt\n"
|
||||
printf "| Log files is under log/ |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
}
|
||||
|
||||
stop_wgd() {
|
||||
@@ -40,30 +66,30 @@ stop_wgd() {
|
||||
}
|
||||
|
||||
start_wgd_debug() {
|
||||
printf "Starting Wireguard Dashboard in the foreground. \n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| Starting WGDashboard in the foreground. |\n"
|
||||
python3 "$app_name"
|
||||
printf "%s\n" "$dashes"
|
||||
}
|
||||
|
||||
update_wgd() {
|
||||
new_ver=$(python3 -c "import json; import urllib.request; data = urllib.request.urlopen('https://api.github.com/repos/donaldzou/wireguard-dashboard/releases').read(); output = json.loads(data);print(output[0]['tag_name'])")
|
||||
new_ver=$(python3 -c "import json; import urllib.request; data = urllib.request.urlopen('https://api.github.com/repos/donaldzou/wireguard-dashboard/releases/latest').read(); output = json.loads(data);print(output['tag_name'])")
|
||||
printf "%s\n" "$dashes"
|
||||
printf "Are you sure you want to update to the %s? (Y/N): " "$new_ver"
|
||||
printf "| Are you sure you want to update to the %s? (Y/N): " "$new_ver"
|
||||
read up
|
||||
if [ "$up" = "Y" ]; then
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| Shutting down Wireguard Dashboard... |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| Shutting down WGDashboard... |\n"
|
||||
kill "$(ps aux | grep "[p]ython3 $app_name" | awk '{print $2}')"
|
||||
printf "| Downloading %s from GitHub... |\n" "$new_ver"
|
||||
printf "%s\n" "$dashes"
|
||||
git stash > /dev/null 2>&1
|
||||
git pull https://github.com/donaldzou/wireguard-dashboard.git $new_ver --force > /dev/null 2>&1
|
||||
printf "| Installing latest Python dependencies |\n"
|
||||
python3 -m pip install -r requirements.txt > /dev/null 2>&1
|
||||
printf "| Update Successfully! |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| Now you can start the dashboard with >> sh wgd.sh start |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
exit 1
|
||||
start_wgd
|
||||
else
|
||||
printf "%s\n" "$dashes"
|
||||
printf "CANCEL update. \n"
|
||||
printf "| Update Canceled. |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
fi
|
||||
}
|
||||
@@ -75,31 +101,40 @@ if [ "$#" != 1 ];
|
||||
else
|
||||
if [ "$1" = "start" ]; then
|
||||
if check_wgd_status; then
|
||||
printf "Wireguard Dashboard is already running. \n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| WGDashboard is already running. |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
else
|
||||
start_wgd
|
||||
fi
|
||||
elif [ "$1" = "stop" ]; then
|
||||
if check_wgd_status; then
|
||||
printf "%s\n" "$dashes"
|
||||
stop_wgd
|
||||
printf "Wireguard Dashboard is stopped. \n"
|
||||
printf "| WGDashboard is stopped. |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
else
|
||||
printf "Wireguard Dashboard is not running. \n"
|
||||
printf "%s\n" "$dashes"
|
||||
printf "| WGDashboard is not running. |\n"
|
||||
printf "%s\n" "$dashes"
|
||||
fi
|
||||
elif [ "$1" = "update" ]; then
|
||||
update_wgd
|
||||
elif [ "$1" = "install" ]; then
|
||||
install_wgd
|
||||
elif [ "$1" = "restart" ]; then
|
||||
if check_wgd_status; then
|
||||
printf "%s\n" "$dashes"
|
||||
stop_wgd
|
||||
printf "| WGDashboard is stopped. |\n"
|
||||
sleep 2
|
||||
printf "Wireguard Dashboard is stopped. \n"
|
||||
start_wgd
|
||||
else
|
||||
start_wgd
|
||||
fi
|
||||
elif [ "$1" = "debug" ]; then
|
||||
if check_wgd_status; then
|
||||
printf "Wireguard Dashboard is already running. \n"
|
||||
printf "| WGDashboard is already running. |\n"
|
||||
else
|
||||
start_wgd_debug
|
||||
fi
|
||||
|
||||
Reference in New Issue
Block a user