1
0
mirror of https://github.com/donaldzou/WGDashboard.git synced 2024-06-30 22:50:14 +02:00

v2.0-beta-1 Commit

This commit is contained in:
Donald Zou 2021-05-04 01:32:34 -04:00 committed by Donald Cheng Hong Zou
parent ab334a393f
commit bc8b8e7982
17 changed files with 558 additions and 185 deletions

2
.gitignore vendored
View File

@ -5,3 +5,5 @@ wg.db
*.json
.idea
src/test.py
tmp
__pycache__

View File

@ -1,4 +1,4 @@
Flask==1.1.2
tinydb==4.3.0
ifcfg==0.21
ping3==2.7.0
configparser==5.0.2

View File

@ -1,13 +1,22 @@
import ifcfg
# Python Built-in Library
import os
from flask import Flask, request, render_template, redirect, url_for
from flask import Flask, request, render_template, redirect, url_for, session, abort
import subprocess
from datetime import datetime, date, time, timedelta
from operator import itemgetter
from tinydb import TinyDB, Query
import secrets
import hashlib
import json, urllib.request
# PIP installed library
import ifcfg
from tinydb import TinyDB, Query
import configparser
dashboard_conf = 'wg-dashboard.ini'
conf_location = "/etc/wireguard"
app = Flask("Wireguard Dashboard")
app.secret_key = secrets.token_urlsafe(16)
app.config['TEMPLATES_AUTO_RELOAD'] = True
conf_data = {}
@ -177,20 +186,20 @@ def get_peers(config_name):
def get_conf_pub_key(config_name):
try:
pub_key = subprocess.check_output("wg show " + config_name + " public-key", shell=True, stderr=subprocess.STDOUT)
except Exception:
return "stopped"
return pub_key.decode("UTF-8")
conf = configparser.ConfigParser(strict=False)
conf.read(conf_location+"/"+config_name+".conf")
pri = conf.get("Interface", "PrivateKey")
pub = subprocess.check_output("echo '" + pri + "' | wg pubkey", shell=True)
conf.clear()
return pub.decode().strip("\n")
def get_conf_listen_port(config_name):
try:
pub_key = subprocess.check_output("wg show " + config_name + " listen-port", shell=True,
stderr=subprocess.STDOUT)
except Exception:
return "stopped"
return pub_key.decode("UTF-8")
conf = configparser.ConfigParser(strict=False)
conf.read(conf_location + "/" + config_name + ".conf")
port = conf.get("Interface", "ListenPort")
conf.clear()
return port
def get_conf_total_data(config_name):
@ -219,20 +228,154 @@ def get_conf_list():
if ".conf" in i:
i = i.replace('.conf', '')
temp = {"conf": i, "status": get_conf_status(i), "public_key": get_conf_pub_key(i)}
# get_conf_peers_data(i)
if temp['status'] == "running":
temp['checked'] = 'checked'
else:
temp['checked'] = ""
conf.append(temp)
conf = sorted(conf, key=itemgetter('status'))
conf = sorted(conf, key=itemgetter('conf'))
return conf
@app.before_request
def auth_req():
conf = configparser.ConfigParser(strict=False)
conf.read(dashboard_conf)
req = conf.get("Server", "auth_req")
if req == "true":
if '/static/' not in request.path and \
request.endpoint != "signin" and \
request.endpoint != "signout" and \
request.endpoint != "auth" and \
"username" not in session:
print(request.path)
print("not loggedin")
return redirect(url_for("signin"))
else:
if request.endpoint in ['signin', 'signout', 'auth', 'settings', 'update_acct', 'update_pwd', 'update_app_ip_port']:
return redirect(url_for("index"))
@app.route('/signin', methods=['GET'])
def signin():
message = ""
if "message" in session:
message = session['message']
session.pop("message")
return render_template('signin.html', message=message)
@app.route('/signout', methods=['GET'])
def signout():
if "username" in session:
session.pop("username")
message = "Sign out successfully!"
return render_template('signin.html', message=message)
@app.route('/settings', methods=['GET'])
def settings():
message = ""
status = ""
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
if "message" in session and "message_status" in session:
message = session['message']
status = session['message_status']
session.pop("message")
session.pop("message_status")
required_auth = config.get("Server", "auth_req")
return render_template('settings.html',conf=get_conf_list(),message=message, status=status, app_ip = config.get("Server", "app_ip"), app_port = config.get("Server", "app_port"), required_auth=required_auth)
@app.route('/auth', methods=['POST'])
def auth():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
password = hashlib.sha256(request.form['password'].encode())
if password.hexdigest() == config["Account"]["password"] and request.form['username'] == config["Account"]["username"]:
session['username'] = request.form['username']
config.clear()
return redirect(url_for("index"))
else:
session['message'] = "Username or Password is correct."
config.clear()
return redirect(url_for("signin"))
@app.route('/update_acct', methods=['POST'])
def update_acct():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
config.set("Account", "username", request.form['username'])
try:
config.write(open(dashboard_conf, "w"))
session['message'] = "Username update successfully!"
session['message_status'] = "success"
session['username'] = request.form['username']
config.clear()
return redirect(url_for("settings"))
except Exception:
session['message'] = "Username update failed."
session['message_status'] = "danger"
config.clear()
return redirect(url_for("settings"))
@app.route('/update_pwd', methods=['POST'])
def update_pwd():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
if hashlib.sha256(request.form['currentpass'].encode()).hexdigest() == config.get("Account", "password"):
if hashlib.sha256(request.form['newpass'].encode()).hexdigest() == hashlib.sha256(request.form['repnewpass'].encode()).hexdigest():
config.set("Account", "password", hashlib.sha256(request.form['repnewpass'].encode()).hexdigest())
try:
config.write(open(dashboard_conf, "w"))
session['message'] = "Password update successfully!"
session['message_status'] = "success"
config.clear()
return redirect(url_for("settings"))
except Exception:
session['message'] = "Password update failed"
session['message_status'] = "danger"
config.clear()
return redirect(url_for("settings"))
else:
session['message'] = "Your New Password does not match."
session['message_status'] = "danger"
config.clear()
return redirect(url_for("settings"))
else:
session['message'] = "Your Password does not match."
session['message_status'] = "danger"
config.clear()
return redirect(url_for("settings"))
@app.route('/update_app_ip_port', methods=['POST'])
def update_app_ip_port():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
config.set("Server", "app_ip", request.form['app_ip'])
config.set("Server", "app_port", request.form['app_port'])
config.write(open(dashboard_conf, "w"))
config.clear()
os.system('bash wgd.sh restart')
@app.route('/check_update_dashboard', methods=['GET'])
def check_update_dashboard():
conf = configparser.ConfigParser(strict=False)
conf.read(dashboard_conf)
data = urllib.request.urlopen("https://api.github.com/repos/donaldzou/wireguard-dashboard/releases").read()
output = json.loads(data)
if conf.get("Server", "version") == output[0]["tag_name"]:
return "false"
else:
return "true"
@app.route('/', methods=['GET'])
def index():
return render_template('index.html', conf=get_conf_list())
@app.route('/configuration/<config_name>', methods=['GET'])
def conf(config_name):
conf_data = {
@ -241,16 +384,15 @@ def conf(config_name):
"checked": ""
}
if conf_data['status'] == "stopped":
return redirect('/')
conf_data['checked'] = "nope"
else:
conf_data['checked'] = "checked"
return render_template('configuration.html', conf=get_conf_list(), conf_data=conf_data)
return render_template('configuration.html', conf=get_conf_list(), conf_data=conf_data)
@app.route('/get_config/<config_name>', methods=['GET'])
def get_conf(config_name):
db = TinyDB('db/' + config_name + '.json')
conf_data = {
"peer_data": get_peers(config_name),
"name": config_name,
@ -261,14 +403,18 @@ def get_conf(config_name):
"running_peer": get_conf_running_peer_number(config_name),
}
if conf_data['status'] == "stopped":
return redirect('/')
# return redirect('/')
conf_data['checked'] = "nope"
else:
conf_data['checked'] = "checked"
return render_template('get_conf.html', conf=get_conf_list(), conf_data=conf_data)
return render_template('get_conf.html', conf=get_conf_list(), conf_data=conf_data)
@app.route('/switch/<config_name>', methods=['GET'])
def switch(config_name):
if "username" not in session:
print("not loggedin")
return redirect(url_for("signin"))
status = get_conf_status(config_name)
if status == "running":
try:
@ -301,7 +447,6 @@ def add_peer(config_name):
return "true"
except subprocess.CalledProcessError as exc:
return exc.output.strip()
# return redirect('/configuration/'+config_name)
@ -347,4 +492,9 @@ def get_peer_name(config_name):
return result[0]['name']
if __name__ == "__main__":
app.run(host='0.0.0.0', debug=False, port=10086)
config = configparser.ConfigParser(strict=False)
config.read('wg-dashboard.ini')
app_ip = config.get("Server", "app_ip")
app_port = config.get("Server", "app_port")
config.clear()
app.run(host=app_ip, debug=False, port=app_port)

View File

View File

@ -22,11 +22,11 @@ body {
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}
@media (max-width: 767.98px) {
.sidebar {
top: 5rem;
}
}
/*@media (max-width: 767.98px) {*/
/* .sidebar {*/
/* top: 5rem;*/
/* }*/
/*}*/
.sidebar-sticky {
position: relative;
@ -47,6 +47,11 @@ body {
.sidebar .nav-link {
font-weight: 500;
color: #333;
transition: 0.2s cubic-bezier(0.82, -0.07, 0, 1.01);
}
.nav-link:hover {
padding-left: 30px;
}
.sidebar .nav-link .feather {
@ -139,4 +144,21 @@ body {
.btn-setting-peer:hover{
color:#007bff
}
.login-container{
padding: 2rem;
}
@media (max-width: 992px){
.card-col{
margin-bottom: 1rem;
}
}
.switch{
font-size: 2rem;
}
.switch:hover{
text-decoration: none
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 50 KiB

After

Width:  |  Height:  |  Size: 49 KiB

View File

@ -1,45 +1,11 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Wireguard Dashboard</title>
<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='dashboard.css') }}">
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.0.1/dist/chart.min.js"></script>
</head>
{% include "header.html" %}
<body>
<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>
<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>
</button>
</nav>
{% include "navbar.html" %}
<div class="container-fluid">
<div class="row">
<div class="row">
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
<div class="sidebar-sticky pt-3">
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
</ul>
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
<span>Configurations</span>
</h6>
<ul class="nav flex-column">
{% for i in conf%}
<li class="nav-item"><a class="nav-link" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
{%endfor%}
</ul>
</div>
</nav>
</div>
</div>
{% include "sidebar.html" %}
<div id="config_body">
</div>
@ -150,6 +116,9 @@
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
crossorigin="anonymous"></script>
<script>
$(".sb-{{conf_data['name']}}-url").addClass("active");
function load_data(){
$.ajax({
method: "GET",
@ -176,16 +145,16 @@
});
</script>
<script>
$('.switch').change(function() {
if ($(this).prop('checked') == false){
$("body").on("click", ".switch", function (){
if ($(this).prop('checked') === true){
if (confirm('Are you sure you want to turn off this connection?')){
location.replace("/switch/"+$(this).attr('id'));
location.replace("/switch/"+$(this).attr('id'))
}
}
else{
location.replace("/switch/"+$(this).attr('id'));
location.replace("/switch/"+$(this).attr('id'))
}
});
})
$("#save_peer").click(function(){
if ($("#allowed_ips") != "" && $("#public_key") != ""){
var conf = $(this).attr('conf_id')
@ -287,5 +256,7 @@
}
})
})
</script>
</html>

20
src/templates/footer.html Normal file
View File

@ -0,0 +1,20 @@
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
<script>
$.ajax({
method: "GET",
url: "/check_update_dashboard",
success: function (response){
if (response === "true"){
$(".sb-update-url").append("<span class=\"dot dot-running\"></span>")
}
}
})
</script>

View File

@ -7,7 +7,13 @@
</div>
<div class="col-sm">
<small class="text-muted"><strong>ACTION</strong></small><br>
<input class="mt-2 switch" id="{{conf_data['name']}}" type="checkbox" data-toggle="toggle" {{conf_data['checked']}} data-size="sm">
{# <input class="mt-2 switch" id="{{conf_data['name']}}" type="checkbox" data-toggle="toggle" {{conf_data['checked']}} data-size="sm">#}
{% if conf_data['checked'] == "checked" %}
<a href="#" id="{{conf_data['name']}}" {{conf_data['checked']}} class="switch text-primary"><i class="bi bi-toggle2-on"></i> ON</a>
{% else %}
<a href="#" id="{{conf_data['name']}}" {{conf_data['checked']}} class="switch text-secondary"><i class="bi bi-toggle2-off"></i> OFF</a>
{% endif %}
</div>
<div class="w-100"></div>
<div class="col-sm">
@ -96,50 +102,6 @@
<small class="text-muted"><strong>END POINT</strong></small>
<h6 style="text-transform: uppercase;">{{i['endpoint']}}</h6>
</div>
{# <div class="w-100"></div>#}
{# <div class="col-sm">#}
{# <canvas id="{{ i['id'] }}_chart" style="width: 100%" height="200"></canvas>#}
{# </div>#}
{# <script>#}
{# var data = "{{ i['traffic'] }}";#}
{# data = data.replaceAll("&#39;", "\"")#}
{# data = JSON.parse(data)#}
{# y_label = [];#}
{# data_point = [];#}
{# for (var i = 1; i < data.length; i++){#}
{# y_label.push(data[i]['time'])#}
{# data_point.push(data[i]['total_sent'] - data[i-1]['total_sent']);#}
{# }#}
{# var ctx = document.getElementById('{{ i['id'] }}_chart');#}
{# var plot_data =#}
{# {#}
{# labels: y_label,#}
{# datasets:[{#}
{# label: "Traffic",#}
{# data: data_point,#}
{# fill: false,#}
{# borderColor: 'rgb(75, 192, 192)',#}
{# tension: 0.1#}
{# }],#}
{# options: {#}
{# scales: {#}
{# xAxes: [{#}
{# type: 'time',#}
{# ticks: {#}
{# autoSkip: true,#}
{# maxTicksLimit: 12#}
{# }#}
{# }]#}
{# },#}
{# responsive: true#}
{# }#}
{# }#}
{##}
{# var myLineChart = new Chart(ctx, {#}
{# type: 'line',#}
{# data: plot_data#}
{# });#}
{# </script>#}
<div class="w-100"></div>
<div class="col-sm">
<!-- <small class="text-muted"><strong>ACTION</strong></small> -->

13
src/templates/header.html Normal file
View File

@ -0,0 +1,13 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Wireguard Dashboard</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='dashboard.css') }}">
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.0.1/dist/chart.min.js"></script>
</head>

View File

@ -1,70 +1,35 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Wireguard Dashboard</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='dashboard.css') }}">
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
</head>
{% include "header.html" %}
<body>
<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>
<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>
</button>
</nav>
{% include "navbar.html" %}
<div class="container-fluid">
<div class="row">
<div class="row">
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
<div class="sidebar-sticky pt-3">
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
</ul>
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
<span>Configurations</span>
</h6>
<ul class="nav flex-column">
{% for i in conf%}
<li class="nav-item"><a class="nav-link" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
{%endfor%}
</ul>
</div>
</nav>
</div>
</div>
{% include "sidebar.html" %}
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
{% for i in conf%}
<div class="card mt-3">
<div class="card-body">
<div class="row">
<div class="col">
<div class="col card-col">
<small class="text-muted"><strong>CONFIGURATION</strong></small>
<a href="/configuration/{{i['conf']}}">
<h5 class="card-title">{{i['conf']}}</h5>
<h6 class="card-title" style="margin:0 !important;">{{i['conf']}}</h6>
</a>
</div>
<div class="col">
<input class="mt-2 switch" id="{{i['conf']}}" type="checkbox" data-toggle="toggle" {{i['checked']}} data-size="sm">
</div>
<div class="w-100"></div>
<div class="col-sm">
<div class="col card-col">
<small class="text-muted"><strong>STATUS</strong></small>
<h6 style="text-transform: uppercase;">{{i['status']}}<span class="dot dot-{{i['status']}}"></span></h6>
<h6 style="text-transform: uppercase; margin:0 !important;">{{i['status']}}<span class="dot dot-{{i['status']}}"></span></h6>
</div>
<div class="col-sm">
<div class="col-md card-col">
<small class="text-muted"><strong>PUBLIC KEY</strong></small>
<h6 style="text-transform: uppercase;"><samp>{{i['public_key']}}</samp></h6>
<h6 style="text-transform: uppercase; margin:0 !important;"><samp>{{i['public_key']}}</samp></h6>
</div>
<div class="col-md">
{% if i['checked'] == "checked" %}
<a href="#" id="{{i['conf']}}" {{i['checked']}} class="switch text-primary"><i class="bi bi-toggle2-on"></i></a>
{% else %}
<a href="#" id="{{i['conf']}}" {{i['checked']}} class="switch text-secondary"><i class="bi bi-toggle2-off"></i></a>
{% endif %}
</div>
</div>
</div>
</div>
@ -72,25 +37,11 @@
</main>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
{% include "footer.html" %}
<script>
$('.switch').change(function() {
if ($(this).prop('checked') == false){
if (confirm('Are you sure you want to turn off this connection?')){
location.replace("/switch/"+$(this).attr('id'))
}
}
else{
location.replace("/switch/"+$(this).attr('id'))
}
$('.switch').click(function() {
location.replace("/switch/"+$(this).attr('id'))
});
$(".sb-home-url").addClass("active")
</script>
</html>

View File

@ -0,0 +1,7 @@
<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>
<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>
</button>
</nav>

107
src/templates/settings.html Normal file
View File

@ -0,0 +1,107 @@
<html>
{% include "header.html" %}
<body>
{% include "navbar.html" %}
<div class="container-fluid">
{% include "sidebar.html" %}
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
<div class="setting-container mt-4">
{% if message != ""%}
<div class="alert alert-{{ status }}" role="alert">
{{ message }}
</div>
{% endif %}
<h1 class="pb-4">Settings</h1>
{% 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'] }}">
<button type="submit" class="btn btn-success" >Update Account</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>
</div>
</main>
<!-- Modal -->
<div class="modal fade" id="confirmModal" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="staticBackdropLabel">Confirm Dashboard Configuration</h5>
</div>
<div class="modal-body">
<small>Dashboard Original IP</small>
<p>{{ app_ip }}</p>
<small style="font-weight: bold" class="text-bold">Dashboard New IP</small>
<p class="app_new_ip text-bold text-danger" style="font-weight: bold"></p>
<small>Dashboard Original Port</small>
<p>{{ app_port }}</p>
<small style="font-weight: bold" class="text-bold">Dashboard New Port</small>
<p class="app_new_port text-bold text-danger" style="font-weight: bold"></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary cancel_restart" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-danger confirm_restart">Confirm & Restart Dashboard</button>
</div>
</div>
</div>
</div>
</div>
</body>
{% include "footer.html" %}
<script>
$(".sb-settings-url").addClass("active")
$(".confirm_modal").click(function (){
$(".app_new_ip").html($("#app_ip")[0].value)
$(".app_new_port").html($("#app_port")[0].value)
})
$(".confirm_restart").click(function (){
$(".cancel_restart").remove()
countdown = 7;
$.post('/update_app_ip_port', $('.update_app_ip_port').serialize())
url = $("#app_ip")[0].value+":"+$("#app_port")[0].value;
$(".confirm_restart").attr("disabled", "disabled")
setInterval(function (){
if (countdown === 0){
window.location.replace("http://"+url);
}
$(".confirm_restart").html("Redirecting you in "+countdown+" seconds.")
countdown--;
},1000)
})
</script>
</html>

View File

@ -0,0 +1,30 @@
<div class="row">
<div class="row">
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
<div class="sidebar-sticky pt-3">
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link sb-home-url" href="/">Home</a></li>
{% if "username" in session %}
<li class="nav-item"><a class="nav-link sb-settings-url" href="/settings">Settings</a></li>
{% endif %}
<li class="nav-item"><a class="nav-link sb-update-url" href="/">Check Update</a></li>
</ul>
<hr>
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
<span>Configurations</span>
</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>
{%endfor%}
</ul>
<hr>
{% if "username" in session %}
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link text-danger" href="/signout" style="font-weight: bold">Sign Out</a></li>
</ul>
{% endif %}
</div>
</nav>
</div>
</div>

43
src/templates/signin.html Normal file
View File

@ -0,0 +1,43 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Wireguard Dashboard | 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='dashboard.css') }}">
</head>
<body>
{% include "navbar.html" %}
<div class="container-fluid">
<main role="main" class="container login-container">
<div class="login-box" style="margin: auto !important;">
<h3 class="text-center">Sign In</h3>
<form style="margin-left: auto !important; margin-right: auto !important; max-width: 500px;" action="/auth" method="post">
{% if message != ""%}
<div class="alert alert-danger" role="alert">
{{ message }}
</div>
{% endif %}
<div class="form-group">
<label for="username" class="text-left">User Name</label>
<input type="text" class="form-control" id="username" name="username" required>
</div>
<div class="form-group">
<label for="password" class="text-left">Password</label>
<input type="password" class="form-control" id="password" name="password" required>
</div>
<div class="form-group form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Keep you login</label>
</div>
<button type="submit" class="btn btn-dark" style="width: 100%;">Sign In</button>
</form>
</div>
</main>
</div>
</body>
{% include "footer.html" %}
</html>

9
src/wg-dashboard.ini Normal file
View File

@ -0,0 +1,9 @@
[Account]
username = admin
password = 8c6976e5b5410415bde908bd4dee15dfb167a9c873fc4bb8a81f6f2ab448a918
[Server]
app_ip = 0.0.0.0
app_port = 10086
auth_req = true
version = v2.0

86
src/wgd.sh Normal file
View File

@ -0,0 +1,86 @@
#!/bin/bash
app_name="dashboard.py"
help () {
printf "<Wireguard Dashboard> by Donald Zou - https://github.com/donaldzou \n"
printf "Usage: sh wg-dashboard.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"
}
check_wgd_status(){
if ps aux | grep '[p]ython3 '$app_name > /dev/null;
then
return 0
else
return 1
fi
}
start_wgd () {
printf "Starting Wireguard Dashboard 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"
}
stop_wgd() {
kill "$(ps aux | grep "[p]ython3 $app_name" | awk '{print $2}')"
}
start_wgd_debug() {
printf "Starting Wireguard Dashboard in the foreground. \n"
python3 "$app_name"
}
if [ "$#" != 1 ];
then
help
else
if [ "$1" = "start" ]; then
if check_wgd_status; then
printf "Wireguard Dashboard is already running. \n"
else
start_wgd
fi
elif [ "$1" = "stop" ]; then
if check_wgd_status; then
stop_wgd
printf "Wireguard Dashboard is stopped. \n"
else
printf "Wireguard Dashboard is not running. \n"
fi
elif [ "$1" = "update" ]; then
echo "update";
elif [ "$1" = "restart" ]; then
if check_wgd_status; then
stop_wgd
sleep 2
printf "Wireguard Dashboard is stopped. \n"
start_wgd_debug
else
start_wgd_debug
fi
elif [ "$1" = "debug" ]; then
if check_wgd_status; then
printf "Wireguard Dashboard is already running. \n"
else
start_wgd_debug
fi
else
help
fi
fi