v2.2 beta 4

This commit is contained in:
Donald Cheng Hong Zou
2021-08-14 17:13:16 -04:00
parent e2fb8dca5b
commit 0d380672f3
30 changed files with 8035 additions and 579 deletions

View File

@@ -23,13 +23,13 @@ dashboard_version = 'v2.2'
dashboard_conf = 'wg-dashboard.ini'
# Default Wireguard IP
wg_ip = ifcfg.default_interface()['inet']
# Upgrade Required
update = ""
# Flask App Configuration
app = Flask("Wireguard Dashboard")
app.secret_key = secrets.token_urlsafe(16)
app.config['TEMPLATES_AUTO_RELOAD'] = True
# Enable QR Code Generator
QRcode(app)
@@ -39,7 +39,8 @@ def get_conf_peer_key(config_name):
peer_key = peer_key.decode("UTF-8").split()
return peer_key
except Exception:
return config_name+" is not running."
return config_name + " is not running."
def get_conf_running_peer_number(config_name):
running = 0
@@ -59,10 +60,12 @@ def get_conf_running_peer_number(config_name):
count += 2
return running
def is_match(regex, text):
pattern = re.compile(regex)
return pattern.search(text) is not None
def read_conf_file(config_name):
# Read Configuration File Start
conf_location = wg_conf_path + "/" + config_name + ".conf"
@@ -74,7 +77,7 @@ def read_conf_file(config_name):
}
peers_start = 0
for i in range(len(file)):
if not is_match("#(.*)",file[i]):
if not is_match("#(.*)", file[i]):
if file[i] == "[Peer]":
peers_start = i
break
@@ -101,6 +104,7 @@ def read_conf_file(config_name):
# Read Configuration File End
return conf_peer_data
def get_latest_handshake(config_name, db, peers):
# Get latest handshakes
try:
@@ -124,6 +128,7 @@ def get_latest_handshake(config_name, db, peers):
db.update({"latest_handshake": "(None)", "status": status}, peers.id == data_usage[count])
count += 2
def get_transfer(config_name, db, peers):
# Get transfer
try:
@@ -158,6 +163,7 @@ def get_transfer(config_name, db, peers):
count += 3
def get_endpoint(config_name, db, peers):
# Get endpoint
try:
@@ -170,12 +176,14 @@ def get_endpoint(config_name, db, peers):
db.update({"endpoint": data_usage[count + 1]}, peers.id == data_usage[count])
count += 2
def get_allowed_ip(config_name, db, peers, conf_peer_data):
# Get allowed ip
for i in conf_peer_data["Peers"]:
db.update({"allowed_ip": i.get('AllowedIPs', '(None)')}, peers.id == i["PublicKey"])
def get_conf_peers_data(config_name):
def get_all_peers_data(config_name):
db = TinyDB('db/' + config_name + '.json')
peers = Query()
conf_peer_data = read_conf_file(config_name)
@@ -186,7 +194,8 @@ def get_conf_peers_data(config_name):
db.insert({
"id": i['PublicKey'],
"private_key": "",
"DNS":"1.1.1.1",
"DNS": "1.1.1.1",
"endpoint_allowed_ip":"0.0.0.0/0",
"name": "",
"total_receive": 0,
"total_sent": 0,
@@ -204,6 +213,8 @@ def get_conf_peers_data(config_name):
update_db['private_key'] = ''
if "DNS" not in search[0]:
update_db['DNS'] = '1.1.1.1'
if "endpoint_allowed_ip" not in search[0]:
update_db['endpoint_allowed_ip'] = '0.0.0.0/0'
db.update(update_db, peers.id == i['PublicKey'])
tic = time.perf_counter()
@@ -215,14 +226,21 @@ def get_conf_peers_data(config_name):
print(f"Finish fetching data in {toc - tic:0.4f} seconds")
db.close()
def get_peers(config_name):
get_conf_peers_data(config_name)
def get_peers(config_name, search, sort_t):
get_all_peers_data(config_name)
db = TinyDB('db/' + config_name + '.json')
result = db.all()
result = sorted(result, key=lambda d: d['status'])
peer = Query()
print(search)
if len(search) == 0:
result = db.all()
else:
result = db.search(peer.name.matches('(.*)(' + re.escape(search) + ')(.*)'))
result = sorted(result, key=lambda d: d[sort_t])
db.close()
return result
def get_conf_pub_key(config_name):
conf = configparser.ConfigParser(strict=False)
conf.read(wg_conf_path + "/" + config_name + ".conf")
@@ -231,6 +249,7 @@ def get_conf_pub_key(config_name):
conf.clear()
return pub.decode().strip("\n")
def get_conf_listen_port(config_name):
conf = configparser.ConfigParser(strict=False)
conf.read(wg_conf_path + "/" + config_name + ".conf")
@@ -238,6 +257,7 @@ def get_conf_listen_port(config_name):
conf.clear()
return port
def get_conf_total_data(config_name):
db = TinyDB('db/' + config_name + '.json')
upload_total = 0
@@ -254,6 +274,7 @@ def get_conf_total_data(config_name):
db.close()
return [total, upload_total, download_total]
def get_conf_status(config_name):
ifconfig = dict(ifcfg.interfaces().items())
if config_name in ifconfig.keys():
@@ -261,6 +282,7 @@ def get_conf_status(config_name):
else:
return "stopped"
def get_conf_list():
conf = []
for i in os.listdir(wg_conf_path):
@@ -276,6 +298,7 @@ def get_conf_list():
conf = sorted(conf, key=itemgetter('conf'))
return conf
def genKeys():
gen = subprocess.check_output('wg genkey > private_key.txt && wg pubkey < private_key.txt > public_key.txt',
shell=True)
@@ -290,6 +313,7 @@ def genKeys():
os.remove('public_key.txt')
return data
def genPubKey(private_key):
pri_key_file = open('private_key.txt', 'w')
pri_key_file.write(private_key)
@@ -300,10 +324,11 @@ def genPubKey(private_key):
public_key = public.readline().strip()
os.remove('private_key.txt')
os.remove('public_key.txt')
return {"status":'success', "msg":"", "data":public_key}
return {"status": 'success', "msg": "", "data": public_key}
except subprocess.CalledProcessError as exc:
os.remove('private_key.txt')
return {"status":'failed', "msg":"Key is not the correct length or format", "data":""}
return {"status": 'failed', "msg": "Key is not the correct length or format", "data": ""}
def checkKeyMatch(private_key, public_key, config_name):
result = genPubKey(private_key)
@@ -318,6 +343,7 @@ def checkKeyMatch(private_key, public_key, config_name):
else:
return {'status': 'success'}
def checkAllowedIP(public_key, ip, config_name):
db = TinyDB('db/' + config_name + '.json')
peers = Query()
@@ -327,9 +353,26 @@ def checkAllowedIP(public_key, ip, config_name):
else:
existed_ip = db.search((peers.id != public_key) & (peers.allowed_ip == ip))
if len(existed_ip) != 0:
return {'status':'failed', 'msg':"Allowed IP already taken by another peer."}
return {'status': 'failed', 'msg': "Allowed IP already taken by another peer."}
else:
return {'status':'success'}
return {'status': 'success'}
def checkIp(ip):
return is_match("((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)(\.|$)){4}",ip)
def cleanIp(ip):
return ip.replace(' ','')
def cleanIpWithRange(ip):
return cleanIp(ip).split(',')
def checkIpWithRange(ip):
return is_match("((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)(\.|\/)){4}(0|8|16|24|32)(,|$)", ip)
def checkAllowedIPs(ip):
ip = cleanIpWithRange(ip)
for i in ip:
if not checkIpWithRange(i): return False
return True
@app.before_request
def auth_req():
@@ -344,7 +387,7 @@ def auth_req():
request.endpoint != "signout" and \
request.endpoint != "auth" and \
"username" not in session:
print("User not loggedin - Attemped access: "+str(request.endpoint))
print("User not loggedin - Attemped access: " + str(request.endpoint))
if request.endpoint != "index":
session['message'] = "You need to sign in first!"
else:
@@ -387,7 +430,9 @@ def settings():
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, wg_conf_path=config.get("Server", "wg_conf_path"))
required_auth=required_auth, wg_conf_path=config.get("Server", "wg_conf_path"),
peer_global_DNS=config.get("Peers","peer_global_DNS"),
peer_endpoint_allowed_ip=config.get("Peers","peer_endpoint_allowed_ip"))
@app.route('/auth', methods=['POST'])
@@ -408,6 +453,10 @@ def auth():
@app.route('/update_acct', methods=['POST'])
def update_acct():
if len(request.form['username']) == 0:
session['message'] = "Username cannot be empty."
session['message_status'] = "danger"
return redirect(url_for("settings"))
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
config.set("Account", "username", request.form['username'])
@@ -424,6 +473,46 @@ def update_acct():
config.clear()
return redirect(url_for("settings"))
@app.route('/update_peer_default_config', methods=['POST'])
def update_peer_default_config():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
if len(request.form['peer_endpoint_allowed_ip']) == 0 or len(request.form['peer_global_DNS']) == 0:
session['message'] = "Peer DNS or Peer Endpoint Allowed IP cannot be empty."
session['message_status'] = "danger"
return redirect(url_for("settings"))
# Check DNS Format
DNS = request.form['peer_global_DNS']
DNS = cleanIp(DNS)
if not checkIp(DNS):
session['message'] = "Peer DNS Format Incorrect. Example: 1.1.1.1"
session['message_status'] = "danger"
return redirect(url_for("settings"))
# Check Endpoint Allowed IPs
ip = request.form['peer_endpoint_allowed_ip']
if not checkAllowedIPs(ip):
session['message'] = "Peer Endpoint Allowed IPs Format Incorrect. Example: 192.168.1.1/32 or 192.168.1.1/32,192.168.1.2/32"
session['message_status'] = "danger"
return redirect(url_for("settings"))
config.set("Peers", "peer_endpoint_allowed_ip", ','.join(cleanIpWithRange(ip)))
config.set("Peers", "peer_global_DNS", request.form['peer_global_DNS'])
try:
config.write(open(dashboard_conf, "w"))
session['message'] = "DNS and Enpoint Allowed IP update successfully!"
session['message_status'] = "success"
config.clear()
return redirect(url_for("settings"))
except Exception:
session['message'] = "DNS and Enpoint Allowed IP update failed."
session['message_status'] = "danger"
config.clear()
return redirect(url_for("settings"))
@app.route('/update_pwd', methods=['POST'])
def update_pwd():
@@ -478,6 +567,22 @@ def update_wg_conf_path():
config.clear()
os.system('bash wgd.sh restart')
@app.route('/update_dashboard_sort', methods=['POST'])
def update_dashbaord_sort():
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
data = request.get_json()
sort_tag = ['name', 'status', 'allowed_ip']
if data['sort'] in sort_tag:
config.set("Server", "dashboard_sort", data['sort'])
else:
config.set("Server", "dashboard_sort", 'status')
config.write(open(dashboard_conf, "w"))
config.clear()
return "true"
@app.route('/update_dashboard_refresh_interval', methods=['POST'])
def update_dashboard_refresh_interval():
config = configparser.ConfigParser(strict=False)
@@ -487,28 +592,30 @@ def update_dashboard_refresh_interval():
config.clear()
return "true"
@app.route('/get_ping_ip', methods=['POST'])
def get_ping_ip():
config = request.form['config']
db = TinyDB('db/' + config + '.json')
html = ""
for i in db.all():
html += '<optgroup label="'+i['name']+' - '+i['id']+'">'
html += '<optgroup label="' + i['name'] + ' - ' + i['id'] + '">'
allowed_ip = str(i['allowed_ip']).split(",")
for k in allowed_ip:
k = k.split("/")
if len(k) == 2:
html += "<option value="+k[0]+">"+k[0]+"</option>"
html += "<option value=" + k[0] + ">" + k[0] + "</option>"
endpoint = str(i['endpoint']).split(":")
if len(endpoint) == 2:
html += "<option value=" + endpoint[0] + ">" + endpoint[0] + "</option>"
html += "</optgroup>"
return html
@app.route('/ping_ip', methods=['POST'])
def ping_ip():
try:
result = ping(''+request.form['ip']+'', count=int(request.form['count']),privileged=True, source=None)
result = ping('' + request.form['ip'] + '', count=int(request.form['count']), privileged=True, source=None)
returnjson = {
"address": result.address,
"is_alive": result.is_alive,
@@ -523,21 +630,24 @@ def ping_ip():
except Exception:
return "Error"
@app.route('/traceroute_ip', methods=['POST'])
def traceroute_ip():
try:
result = traceroute(''+request.form['ip']+'', first_hop=1, max_hops=30, count=1, fast=True)
result = traceroute('' + request.form['ip'] + '', first_hop=1, max_hops=30, count=1, fast=True)
returnjson = []
last_distance = 0
for hop in result:
if last_distance + 1 != hop.distance:
returnjson.append({"hop":"*", "ip":"*", "avg_rtt":"", "min_rtt":"", "max_rtt":""})
returnjson.append({"hop": hop.distance, "ip": hop.address, "avg_rtt": hop.avg_rtt, "min_rtt": hop.min_rtt, "max_rtt": hop.max_rtt})
returnjson.append({"hop": "*", "ip": "*", "avg_rtt": "", "min_rtt": "", "max_rtt": ""})
returnjson.append({"hop": hop.distance, "ip": hop.address, "avg_rtt": hop.avg_rtt, "min_rtt": hop.min_rtt,
"max_rtt": hop.max_rtt})
last_distance = hop.distance
return jsonify(returnjson)
except Exception:
return "Error"
@app.route('/', methods=['GET'])
def index():
return render_template('index.html', conf=get_conf_list())
@@ -545,6 +655,8 @@ def index():
@app.route('/configuration/<config_name>', methods=['GET'])
def conf(config_name):
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
conf_data = {
"name": config_name,
"status": get_conf_status(config_name),
@@ -559,27 +671,34 @@ def conf(config_name):
config_list = get_conf_list()
if config_name not in [conf['conf'] for conf in config_list]:
return render_template('index.html', conf=get_conf_list())
return render_template('configuration.html', conf=get_conf_list(), conf_data=conf_data, dashboard_refresh_interval=int(config.get("Server","dashboard_refresh_interval")))
return render_template('configuration.html', conf=get_conf_list(), conf_data=conf_data,
dashboard_refresh_interval=int(config.get("Server", "dashboard_refresh_interval")),
DNS=config.get("Peers", "peer_global_DNS"),
endpoint_allowed_ip=config.get("Peers", "peer_endpoint_allowed_ip"), title=config_name)
@app.route('/get_config/<config_name>', methods=['GET'])
def get_conf(config_name):
search = request.args.get('search')
if len(search) == 0: search = ""
search = urllib.parse.unquote(search)
config = configparser.ConfigParser(strict=False)
config.read(dashboard_conf)
sort = config.get("Server", "dashboard_sort")
conf_data = {
"peer_data": get_peers(config_name),
"peer_data": get_peers(config_name, search, sort),
"name": config_name,
"status": get_conf_status(config_name),
"total_data_usage": get_conf_total_data(config_name),
"public_key": get_conf_pub_key(config_name),
"listen_port": get_conf_listen_port(config_name),
"running_peer": get_conf_running_peer_number(config_name),
}
if conf_data['status'] == "stopped":
# 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, wg_ip=wg_ip)
return render_template('get_conf.html', conf_data=conf_data, wg_ip=wg_ip, sort_tag=sort, dashboard_refresh_interval=int(config.get("Server", "dashboard_refresh_interval")))
@app.route('/switch/<config_name>', methods=['GET'])
@@ -609,21 +728,30 @@ def add_peer(config_name):
data = request.get_json()
public_key = data['public_key']
allowed_ips = data['allowed_ips']
endpoint_allowed_ip = data['endpoint_allowed_ip']
DNS = data['DNS']
keys = get_conf_peer_key(config_name)
if type(keys) != list:
return config_name+" is not running."
return config_name + " is not running."
if public_key in keys:
return "Public key already exist."
if len(db.search(peers.allowed_ip.matches(allowed_ips))) != 0:
return "Allowed IP already taken by another peer."
if not checkIp(DNS):
return "DNS formate is incorrect. Example: 1.1.1.1"
if not checkAllowedIPs(endpoint_allowed_ip):
return "Endpoint Allowed IPs format is incorrect."
else:
status = ""
try:
status = subprocess.check_output(
"wg set " + config_name + " peer " + public_key + " allowed-ips " + allowed_ips, shell=True, stderr=subprocess.STDOUT)
"wg set " + config_name + " peer " + public_key + " allowed-ips " + allowed_ips, shell=True,
stderr=subprocess.STDOUT)
status = subprocess.check_output("wg-quick save " + config_name, shell=True, stderr=subprocess.STDOUT)
get_conf_peers_data(config_name)
db.update({"name": data['name'], "private_key": data['private_key'], "DNS": data['DNS']}, peers.id == public_key)
get_all_peers_data(config_name)
db.update({"name": data['name'], "private_key": data['private_key'], "DNS": data['DNS'], "endpoint_allowed_ip": endpoint_allowed_ip},
peers.id == public_key)
db.close()
return "true"
except subprocess.CalledProcessError as exc:
@@ -641,7 +769,7 @@ def remove_peer(config_name):
delete_key = data['peer_id']
keys = get_conf_peer_key(config_name)
if type(keys) != list:
return config_name+" is not running."
return config_name + " is not running."
if delete_key not in keys:
db.close()
return "This key does not exist"
@@ -665,6 +793,7 @@ def save_peer_setting(config_name):
private_key = data['private_key']
DNS = data['DNS']
allowed_ip = data['allowed_ip']
endpoint_allowed_ip = data['endpoint_allowed_ip']
db = TinyDB("db/" + config_name + ".json")
peers = Query()
if len(db.search(peers.id == id)) == 1:
@@ -679,22 +808,25 @@ def save_peer_setting(config_name):
try:
if allowed_ip == "":
allowed_ip = '""'
change_ip = subprocess.check_output('wg set '+config_name+" peer "+id+" allowed-ips "+allowed_ip, shell=True, stderr=subprocess.STDOUT)
save_change_ip = subprocess.check_output('wg-quick save '+ config_name, shell=True,stderr=subprocess.STDOUT)
change_ip = subprocess.check_output('wg set ' + config_name + " peer " + id + " allowed-ips " + allowed_ip,
shell=True, stderr=subprocess.STDOUT)
save_change_ip = subprocess.check_output('wg-quick save ' + config_name, shell=True,
stderr=subprocess.STDOUT)
if change_ip.decode("UTF-8") != "":
return jsonify({"status":"failed", "msg": change_ip.decode("UTF-8")})
return jsonify({"status": "failed", "msg": change_ip.decode("UTF-8")})
db.update({"name": name, "private_key": private_key, "DNS": DNS}, peers.id == id)
db.update({"name": name, "private_key": private_key, "DNS": DNS, "endpoint_allowed_ip":endpoint_allowed_ip}, peers.id == id)
db.close()
return jsonify({"status": "success", "msg": ""})
except subprocess.CalledProcessError as exc:
return jsonify({"status":"failed", "msg": str(exc.output.decode("UTF-8").strip())})
return jsonify({"status": "failed", "msg": str(exc.output.decode("UTF-8").strip())})
else:
return jsonify({"status":"failed","msg":"This peer does not exist."})
return jsonify({"status": "failed", "msg": "This peer does not exist."})
@app.route('/get_peer_data/<config_name>', methods=['POST'])
@@ -705,28 +837,35 @@ def get_peer_name(config_name):
peers = Query()
result = db.search(peers.id == id)
db.close()
data = {"name": result[0]['name'], "allowed_ip":result[0]['allowed_ip'], "DNS": result[0]['DNS'], "private_key": result[0]['private_key']}
data = {"name": result[0]['name'], "allowed_ip": result[0]['allowed_ip'], "DNS": result[0]['DNS'],
"private_key": result[0]['private_key'], "endpoint_allowed_ip": result[0]['endpoint_allowed_ip']}
return jsonify(data)
@app.route('/generate_peer', methods=['GET'])
def generate_peer():
return jsonify(genKeys())
@app.route('/generate_public_key', methods=['POST'])
def generate_public_key():
data = request.get_json()
private_key = data['private_key']
return jsonify(genPubKey(private_key))
@app.route('/check_key_match/<config_name>', methods=['POST'])
def check_key_match(config_name):
data = request.get_json()
private_key = data['private_key']
public_key = data['public_key']
return jsonify(checkKeyMatch(private_key,public_key, config_name))
return jsonify(checkKeyMatch(private_key, public_key, config_name))
@app.route('/download/<config_name>', methods=['GET'])
def download(config_name):
print(request.headers.get('User-Agent'))
id = request.args.get('id')
db = TinyDB("db/" + config_name + ".json")
peers = Query()
@@ -738,23 +877,38 @@ def download(config_name):
if peer['private_key'] != "":
public_key = get_conf_pub_key(config_name)
listen_port = get_conf_listen_port(config_name)
endpoint = wg_ip+":"+listen_port
endpoint = wg_ip + ":" + listen_port
private_key = peer['private_key']
allowed_ip = peer['allowed_ip']
DNS = peer['DNS']
name = "".join(peer['name'].split(' '))
if name == "": name = public_key
def generate(private_key, allowed_ip, DNS, public_key, endpoint):
yield "[Interface]\nPrivateKey = "+private_key+"\nAddress = "+allowed_ip+"\nDNS = "+DNS+"\n\n[Peer]\nPublicKey = "+public_key+"\nAllowedIPs = 0.0.0.0/0\nEndpoint = "+endpoint
return app.response_class(generate(private_key,allowed_ip,DNS, public_key,endpoint), mimetype='text/conf', headers={"Content-Disposition":"attachment;filename="+name+".conf"})
filename = peer['name']
if len(filename) == 0:
filename = "Untitled_Peers"
else:
filename = peer['name']
# Clean filename
illegal_filename = [".", ",", "/", "?", "<", ">", "\\", ":", "*", '|' '\"', "com1", "com2", "com3",
"com4", "com5", "com6", "com7", "com8", "com9", "lpt1", "lpt2", "lpt3", "lpt4",
"lpt5", "lpt6", "lpt7", "lpt8", "lpt9", "con", "nul", "prn"]
for i in illegal_filename:
filename = filename.replace(i, "")
print(filename)
if len(filename) == 0:
filename = "Untitled_Peer"
filename = "".join(filename.split(' '))
filename = filename + "_" + config_name
def generate(private_key, allowed_ip, DNS, public_key, endpoint):
yield "[Interface]\nPrivateKey = " + private_key + "\nAddress = " + allowed_ip + "\nDNS = " + DNS + "\n\n[Peer]\nPublicKey = " + public_key + "\nAllowedIPs = 0.0.0.0/0\nEndpoint = " + endpoint
return app.response_class(generate(private_key, allowed_ip, DNS, public_key, endpoint),
mimetype='text/conf',
headers={"Content-Disposition": "attachment;filename=" + filename + ".conf"})
else:
return redirect("/configuration/" + config_name)
def init_dashboard():
# Set Default INI File
if not os.path.isfile("wg-dashboard.ini"):
@@ -783,6 +937,15 @@ def init_dashboard():
config['Server']['version'] = dashboard_version
if 'dashboard_refresh_interval' not in config['Server']:
config['Server']['dashboard_refresh_interval'] = '15000'
if 'dashboard_sort' not in config['Server']:
config['Server']['dashboard_sort'] = 'status'
if "Peers" not in config:
config['Peers'] = {}
if 'peer_global_DNS' not in config['Peers']:
config['Peers']['peer_global_DNS'] = '1.1.1.1'
if 'peer_endpoint_allowed_ip' not in config['Peers']:
config['Peers']['peer_endpoint_allowed_ip'] = '0.0.0.0/0'
config.write(open(dashboard_conf, "w"))
config.clear()

View File

@@ -1,4 +1,4 @@
Flask==1.1.2
Flask==2.0.1
tinydb==4.3.0
ifcfg==0.21
icmplib==2.1.1

Binary file not shown.

Before

Width:  |  Height:  |  Size: 145 KiB

7
src/static/css/bootstrap.min.css vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,262 @@
body {
font-size: .875rem;
}
.feather {
width: 16px;
height: 16px;
vertical-align: text-bottom;
}
/*
* Sidebar
*/
.sidebar {
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: 100; /* Behind the navbar */
padding: 48px 0 0; /* Height of navbar */
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}
/*@media (max-width: 767.98px) {*/
/* .sidebar {*/
/* top: 5rem;*/
/* }*/
/*}*/
.sidebar-sticky {
position: relative;
top: 0;
height: calc(100vh - 48px);
padding-top: .5rem;
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}
@supports ((position: -webkit-sticky) or (position: sticky)) {
.sidebar-sticky {
position: -webkit-sticky;
position: sticky;
}
}
.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 {
margin-right: 4px;
color: #999;
}
.sidebar .nav-link.active {
color: #007bff;
}
.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
color: inherit;
}
.sidebar-heading {
font-size: .75rem;
text-transform: uppercase;
}
/*
* Navbar
*/
.navbar-brand {
padding-top: .75rem;
padding-bottom: .75rem;
font-size: 1rem;
background-color: rgba(0, 0, 0, .25);
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler {
top: .25rem;
right: 1rem;
}
.navbar .form-control {
padding: .75rem 1rem;
border-width: 0;
border-radius: 0;
}
.form-control-dark {
color: #fff;
background-color: rgba(255, 255, 255, .1);
border-color: rgba(255, 255, 255, .1);
}
.form-control-dark:focus {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
.dot{
width: 10px;
height: 10px;
border-radius: 50px;
display: inline-block;
margin-left: 10px;
}
.dot-running{
background-color: #28a745!important;
}
.dot-stopped{
background-color: #6c757d!important;
}
.info h6{
line-break: anywhere;
}
.btn-control{
border: none !important;
padding: 0 1rem 0 0;
}
.share_peer_btn_group .btn-control{
padding: 0 0 0 1rem;
}
.btn-control:hover{
background: white;
}
.btn-delete-peer:hover{
color: #dc3545;
}
.btn-setting-peer:hover{
color:#007bff
}
.btn-download-peer:hover{
color: #17a2b8;
}
.login-container{
padding: 2rem;
}
@media (max-width: 992px){
.card-col{
margin-bottom: 1rem;
}
}
.switch{
font-size: 2rem;
}
.switch:hover{
text-decoration: none
}
.btn-group-label:hover{
color: #007bff;
border-color: #007bff;
background: white;
}
/*.peer_data_group{*/
/* text-align: right;*/
/*}*/
@media (max-width: 768px) {
.peer_data_group{
text-align: left;
}
}
.index-switch{
text-align: right;
}
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;*/
/*}*/
@-webkit-keyframes rotating /* Safari and Chrome */ {
from {
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotating {
from {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.rotating::before {
-webkit-animation: rotating 0.75s linear infinite;
-moz-animation: rotating 0.75s linear infinite;
-ms-animation: rotating 0.75s linear infinite;
-o-animation: rotating 0.75s linear infinite;
animation: rotating 0.75s linear infinite;
}
.peer_private_key_textbox_switch{
position: absolute;
right: 2rem;
transform: translateY(-28px);
font-size: 1.2rem;
cursor: pointer;
}
.progress-bar{
transition: 0.3s ease-in-out;
}
.key{
transition: 0.2s ease-in-out;
cursor: pointer;
}
.key:hover{
color: #007bff;
}

View File

@@ -1,249 +0,0 @@
body {
font-size: .875rem;
}
.feather {
width: 16px;
height: 16px;
vertical-align: text-bottom;
}
/*
* Sidebar
*/
.sidebar {
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: 100; /* Behind the navbar */
padding: 48px 0 0; /* Height of navbar */
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}
/*@media (max-width: 767.98px) {*/
/* .sidebar {*/
/* top: 5rem;*/
/* }*/
/*}*/
.sidebar-sticky {
position: relative;
top: 0;
height: calc(100vh - 48px);
padding-top: .5rem;
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}
@supports ((position: -webkit-sticky) or (position: sticky)) {
.sidebar-sticky {
position: -webkit-sticky;
position: sticky;
}
}
.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 {
margin-right: 4px;
color: #999;
}
.sidebar .nav-link.active {
color: #007bff;
}
.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
color: inherit;
}
.sidebar-heading {
font-size: .75rem;
text-transform: uppercase;
}
/*
* Navbar
*/
.navbar-brand {
padding-top: .75rem;
padding-bottom: .75rem;
font-size: 1rem;
background-color: rgba(0, 0, 0, .25);
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler {
top: .25rem;
right: 1rem;
}
.navbar .form-control {
padding: .75rem 1rem;
border-width: 0;
border-radius: 0;
}
.form-control-dark {
color: #fff;
background-color: rgba(255, 255, 255, .1);
border-color: rgba(255, 255, 255, .1);
}
.form-control-dark:focus {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
.dot{
width: 10px;
height: 10px;
border-radius: 50px;
display: inline-block;
margin-left: 10px;
}
.dot-running{
background-color: #28a745!important;
}
.dot-stopped{
background-color: #6c757d!important;
}
.info h6{
line-break: anywhere;
}
.btn-control{
border: none !important;
padding: 0 1rem 0 0;
}
.share_peer_btn_group .btn-control{
padding: 0 0 0 1rem;
}
.btn-control:hover{
background: white;
}
.btn-delete-peer:hover{
color: #dc3545;
}
.btn-setting-peer:hover{
color:#007bff
}
.btn-download-peer:hover{
color: #17a2b8;
}
.login-container{
padding: 2rem;
}
@media (max-width: 992px){
.card-col{
margin-bottom: 1rem;
}
}
.switch{
font-size: 2rem;
}
.switch:hover{
text-decoration: none
}
.btn-group-label:hover{
color: #007bff;
border-color: #007bff;
background: white;
}
.peer_data_group{
text-align: right;
}
@media (max-width: 768px) {
.peer_data_group{
text-align: left;
}
}
.index-switch{
text-align: right;
}
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;*/
/*}*/
@-webkit-keyframes rotating /* Safari and Chrome */ {
from {
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotating {
from {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.rotating::before {
-webkit-animation: rotating 0.75s linear infinite;
-moz-animation: rotating 0.75s linear infinite;
-ms-animation: rotating 0.75s linear infinite;
-o-animation: rotating 0.75s linear infinite;
animation: rotating 0.75s linear infinite;
}
.peer_private_key_textbox_switch{
position: absolute;
right: 2rem;
transform: translateY(-28px);
font-size: 1.2rem;
cursor: pointer;
}

View File

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 92 KiB

7045
src/static/js/bootstrap.bundle.js vendored Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

7
src/static/js/bootstrap.bundle.min.js vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -71,7 +71,8 @@ $("#save_peer").click(function(){
"public_key":$("#public_key").val(),
"allowed_ips": $("#allowed_ips").val(),
"name":$("#new_add_name").val(),
"DNS": $("#DNS").val()
"DNS": $("#new_add_DNS").val(),
"endpoint_allowed_ip": $("#new_add_endpoint_allowed_ip").val()
}),
success: function (response){
if(response != "true"){
@@ -123,7 +124,7 @@ $("#delete_peer").click(function(){
}
else{
deleteModal.toggle();
load_data();
load_data($('#search_peer_textbox').val());
$('#alertToast').toast('show');
$('#alertToast .toast-body').html("Peer deleted!");
}
@@ -136,7 +137,7 @@ var settingModal = new bootstrap.Modal(document.getElementById('setting_modal'),
keyboard: false
})
$("body").on("click", ".btn-setting-peer", function(){
settingModal.toggle();
startProgressBar()
var peer_id = $(this).attr("id");
$("#save_peer_setting").attr("peer_id", peer_id);
$.ajax({
@@ -153,6 +154,9 @@ $("body").on("click", ".btn-setting-peer", function(){
$("#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'])
settingModal.toggle();
endProgressBar()
}
})
});
@@ -199,7 +203,8 @@ $("#save_peer_setting").click(function (){
name: $("#peer_name_textbox").val(),
DNS: $("#peer_DNS_textbox").val(),
private_key: $("#peer_private_key_textbox").val(),
allowed_ip: $("#peer_allowed_ip_textbox").val()
allowed_ip: $("#peer_allowed_ip_textbox").val(),
endpoint_allowed_ip: $("#peer_endpoint_allowed_ips").val()
}),
success: function (response){
if (response['status'] === "failed"){
@@ -207,7 +212,7 @@ $("#save_peer_setting").click(function (){
$("#setting_peer_alert").removeClass("d-none");
}else{
settingModal.toggle();
load_data();
load_data($('#search_peer_textbox').val())
$('#alertToast').toast('show');
$('#alertToast .toast-body').html("Peer Saved!");
}
@@ -225,4 +230,65 @@ $(".peer_private_key_textbox_switch").click(function (){
let icon = (($("#peer_private_key_textbox").attr('type') === 'password') ? "bi bi-eye-slash-fill":"bi bi-eye-fill")
$("#peer_private_key_textbox").attr('type',mode)
$(".peer_private_key_textbox_switch i").removeClass().addClass(icon)
})
})
// Search Peer
var typingTimer;
var doneTypingInterval = 200;
var $input = $('#search_peer_textbox');
$input.on('keyup', function () {
clearTimeout(typingTimer);
typingTimer = setTimeout(doneTyping, doneTypingInterval);
});
$input.on('keydown', function () {
clearTimeout(typingTimer);
});
function doneTyping () {
load_data($('#search_peer_textbox').val());
}
// Sorting
$("body").on("change", "#sort_by_dropdown", function (){
$.ajax({
method:"POST",
data: JSON.stringify({'sort':$("#sort_by_dropdown option:selected").val()}),
headers:{"Content-Type": "application/json"},
url: "/update_dashboard_sort",
success: function (res){
location.reload()
}
})
})
$("body").on("mouseenter", ".key", function(){
var label = $(this).parent().siblings().children()[1]
label.style.opacity = "100"
})
$("body").on("mouseout", ".key", function(){
var label = $(this).parent().siblings().children()[1]
label.style.opacity = "0"
setTimeout(function (){
label.innerHTML = "CLICK TO COPY"
},200)
});
$("body").on("click", ".key", function(){
var label = $(this).parent().siblings().children()[1]
copyToClipboard($(this))
label.innerHTML = "COPIED!"
})
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
// $(".key").mouseenter(function(){
//
// })

2
src/static/js/jquery.min.js vendored Normal file

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 42 KiB

View File

@@ -1,10 +1,21 @@
<html>
{% include "header.html" %}
{% with title=title%}
{% include "header.html"%}
{% endwith %}
<body>
{% include "navbar.html" %}
<div class="container-fluid">
{% include "sidebar.html" %}
<div id="config_body"></div>
<div class="col-md-9 ml-sm-auto col-lg-10 px-md-4 mt-4 mb-4">
<div class="form-group">
<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>
<div class="modal fade" id="add_modal" data-backdrop="static" data-keyboard="false" tabindex="-1"
aria-labelledby="staticBackdropLabel" aria-hidden="true">
@@ -44,22 +55,29 @@
<input type="text" class="form-control" id="public_key" aria-describedby="public_key" disabled>
</div>
<div class="row">
<div class="col-sm">
<div class="col-sm-6">
<div class="form-group">
<label for="new_add_name">Name</label>
<input type="text" class="form-control" id="new_add_name">
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label for="allowed_ips">Allowed IPs <code>(Required)</code></label>
<input type="text" class="form-control" id="allowed_ips">
</div>
</div>
<div class="col-sm">
<div class="col-sm-6">
<div class="form-group">
<label for="DNS">DNS</label>
<input type="text" class="form-control" id="DNS" value="1.1.1.1">
<label for="new_add_DNS">DNS</label>
<input type="text" class="form-control" id="new_add_DNS" value="{{ DNS }}">
</div>
</div>
<div class="col-sm">
<div class="col-sm-6">
<div class="form-group">
<label for="new_add_name">Name</label>
<input type="text" class="form-control" id="new_add_name">
<label for="new_add_endpoint_allowed_ip">Endpoint Allowed IPs</label>
<input type="text" class="form-control" id="new_add_endpoint_allowed_ip" value="{{ endpoint_allowed_ip }}">
</div>
</div>
</div>
@@ -114,6 +132,10 @@
<span aria-hidden="true">&times;</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">
<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">
@@ -128,10 +150,11 @@
<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_name_textbox" class="form-label">Name</label>
<input type="text" class="form-control" id="peer_name_textbox" placeholder="">
<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>
@@ -174,25 +197,59 @@
</body>
{% include "footer.html" %}
<script>
$(".sb-{{conf_data['name']}}-url").addClass("active");
function load_data(){
var conf_name = "{{ conf_data['name'] }}"
$(".sb-"+conf_name+"-url").addClass("active");
// Progress Bar
let bar = $(".progress-bar")
function startProgressBar(){
bar.css("width","0%")
bar.css("opacity", "100")
bar.css("background", "rgb(255,69,69)")
bar.css("background", "linear-gradient(145deg, rgba(255,69,69,1) 0%, rgba(0,115,186,1) 100%)")
bar.css("width","25%")
setTimeout(function(){
stillLoadingProgressBar();
},300)
}
function stillLoadingProgressBar(){
bar.css("transition", "3s ease-in-out")
bar.css("width", "75%")
}
function endProgressBar(){
bar.css("transition", "0.3s ease-in-out")
bar.css("width","100%")
setTimeout(function(){
bar.css("opacity", "0")
},250)
}
function load_data(search){
startProgressBar()
$.ajax({
method: "GET",
url: "/get_config/"+"{{conf_data['name']}}",
url: "/get_config/"+conf_name+"?search="+encodeURIComponent(search),
headers:{
"Content-Type": "application/json"
},
async:false,
success: function (response){
$("#config_body").html(response);
$("[refresh-interval={{ dashboard_refresh_interval }}]").addClass("active")
{#$("[refresh-interval={{ dashboard_refresh_interval }}]").addClass("active")#}
$("#search_peer_textbox").css("display", "block")
if (bar.css("width") !== "0%"){
endProgressBar()
}
}
})
}
$(document).ready(function(){
load_data();
load_data($('#search_peer_textbox').val());
setInterval(function(){
load_data();
load_data($('#search_peer_textbox').val());
}, {{dashboard_refresh_interval}})
});
@@ -207,8 +264,8 @@
})
});
$("body").on("click", ".refresh", function (){
load_data();
load_data($('#search_peer_textbox').val());
});
</script>
<script src="{{ url_for('static',filename='configuration.js') }}"></script>
<script src="{{ url_for('static',filename='js/configuration.js') }}"></script>
</html>

View File

@@ -1,9 +1,3 @@
<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="{{ url_for('static',filename='tools.js') }}"></script>
<script src="{{ url_for('static', filename='js/jquery.min.js') }}"></script>
<script src="{{ url_for('static',filename='js/bootstrap.bundle.js') }}"></script>
<script src="{{ url_for('static',filename='js/tools.js') }}"></script>

View File

@@ -39,8 +39,11 @@
</div>
<div class="w-100"></div>
<div class="col-sm">
<small class="text-muted"><strong>PUBLIC KEY</strong></small>
<h6 style="text-transform: uppercase;"><samp>{{conf_data['public_key']}}</samp></h6>
<small class="text-muted">
<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>
</div>
<div class="col-sm">
<small class="text-muted"><strong>LISTEN PORT</strong></small>
@@ -48,85 +51,122 @@
</div>
</div>
<hr>
<div class="button-div mb-3" style="text-align: right;">
<div class="btn-group" role="group" aria-label="Basic example">
<button type="button" class="btn btn-outline-primary btn-sm btn-group-label refresh"><i class="bi bi-arrow-repeat"></i></button>
<button type="button" class="btn btn-outline-primary btn-sm update_interval" refresh-interval="5000">5s</button>
<button type="button" class="btn btn-outline-primary btn-sm update_interval" refresh-interval="10000">10s</button>
<button type="button" class="btn btn-outline-primary btn-sm update_interval" refresh-interval="30000">30s</button>
<button type="button" class="btn btn-outline-primary btn-sm update_interval" refresh-interval="60000">1m</button>
</div>
<button type="button" class="btn btn-primary add_btn btn-sm" data-toggle="modal" data-target="#add_modal">
<i class="bi bi-plus-circle-fill"></i> PEER
</button>
</div>
</div>
{% for i in conf_data['peer_data']%}
<div class="card mb-3">
<div class="card-header">
<div class="row">
<div class="col-sm">
<div class="card-header-body ">
{% if not i['name']%}
{{ "Untitled Peer" }}
{% else %}
{{i['name']}}
{% endif %}
<span class="dot dot-{{i['status']}}"></span>
<div class="button-div mb-3">
<div class="row">
<div class="col-sm">
<div class="form-group">
<label for="sort_by_dropdown"><small class="text-muted">Sort Peers By</small></label>
<select class="form-control" id="sort_by_dropdown">
<option value="status" {% if sort_tag == "status" %} {{ "selected" }} {% endif %}>Status</option>
<option value="name" {% if sort_tag == "name" %} {{ "selected" }} {% endif %}>Name</option>
<option value="allowed_ip" {% if sort_tag == "allowed_ip" %} {{ "selected" }} {% endif %}>Allowed IP</option>
</select>
</div>
</div>
<div class="col-sm">
<div class="form-group">
<label><small class="text-muted">Refresh Interval</small></label><br>
<div class="btn-group" role="group">
<button type="button" class="btn btn-outline-primary btn-group-label refresh"><i class="bi bi-arrow-repeat"></i></button>
<button type="button" class="btn btn-outline-primary update_interval {% if dashboard_refresh_interval == 5000 %} {{ "active" }} {% endif %}" refresh-interval="5000">5s</button>
<button type="button" class="btn btn-outline-primary update_interval {% if dashboard_refresh_interval == 10000 %} {{ "active" }} {% endif %}" refresh-interval="10000">10s</button>
<button type="button" class="btn btn-outline-primary update_interval {% if dashboard_refresh_interval == 30000 %} {{ "active" }} {% endif %}" refresh-interval="30000">30s</button>
<button type="button" class="btn btn-outline-primary update_interval {% if dashboard_refresh_interval == 60000 %} {{ "active" }} {% endif %}" refresh-interval="60000">1m</button>
</div>
</div>
<div class="col-sm 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 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>
</div>
</div>
</div>
<div class="card-body">
<div class="row">
<div class="col-sm">
<small class="text-muted"><strong>PEER</strong></small>
<h6><samp class="ml-auto">{{i['id']}}</samp></h6>
</div>
<div class="col-sm">
<small class="text-muted"><strong>ALLOWED IP</strong></small>
<h6 style="text-transform: uppercase;">{{i['allowed_ip']}}</h6>
</div>
<div class="w-100"></div>
<div class="col-sm">
<small class="text-muted"><strong>LATEST HANDSHAKE</strong></small>
<h6 style="text-transform: uppercase;">{{i['latest_handshake']}}</h6>
</div>
<div class="col-sm">
<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">
<hr>
<div class="button-group" style="display:flex">
<button type="button" class="btn btn-outline-primary btn-setting-peer btn-control" id="{{i['id']}}" data-toggle="modal"><i class="bi bi-gear-fill"></i></button>
<button type="button" class="btn btn-outline-danger btn-delete-peer btn-control" id="{{i['id']}}" data-toggle="modal"><i class="bi bi-x-circle-fill"></i></button>
{% if i['private_key'] %}
<div class="share_peer_btn_group" style="margin-left: auto !important; display: inline">
<button type="button" class="btn btn-outline-success btn-qrcode-peer btn-control" img_src="{{ qrcode("[Interface]\nPrivateKey = "+i['private_key']+"\nAddress = "+i['allowed_ip']+"\nDNS = 1.1.1.1\n\n[Peer]\nPublicKey = "+conf_data['public_key']+"\nAllowedIPs = 0.0.0.0/0\nEndpoint = "+wg_ip+":"+conf_data['listen_port']) }}">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" style="width: 19px;" fill="#28a745"><path d="M3 11h8V3H3v8zm2-6h4v4H5V5zM3 21h8v-8H3v8zm2-6h4v4H5v-4zM13 3v8h8V3h-8zm6 6h-4V5h4v4zM13 13h2v2h-2zM15 15h2v2h-2zM13 17h2v2h-2zM17 17h2v2h-2zM19 19h2v2h-2zM15 19h2v2h-2zM17 13h2v2h-2zM19 15h2v2h-2z"/></svg>
</button>
<a href="/download/{{ conf_data['name'] }}?id={{ i['id']|urlencode }}" type="button" class="btn btn-outline-info btn-download-peer btn-control">
<i class="bi bi-download"></i>
</a>
</div>
{% endif %}
</div>
</div>
</div>
</div>
<hr>
</div>
{%endfor%}
</div>
<div class="row">
{% 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>
</div>
{% endif %}
{% for i in conf_data['peer_data']%}
<div class="col-sm-6 col-md-4">
<div class="card mb-3">
<div class="card-header">
<div class="row">
<div class="col-12">
<div class="card-header-body ">
{% if not i['name']%}
{{ "Untitled Peer" }}
{% else %}
{{i['name']}}
{% endif %}
<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-sm">
<small class="text-muted" style="display: flex">
<strong>PEER</strong>
<strong style="margin-left: auto!important; opacity: 0; transition: 0.2s ease-in-out" class="text-primary">CLICK TO COPY</strong></small>
<h6><samp class="ml-auto key">{{i['id']}}</samp></h6>
</div>
<div class="col-sm">
<small class="text-muted"><strong>ALLOWED IP</strong></small>
<h6 style="text-transform: uppercase;">{{i['allowed_ip']}}</h6>
</div>
<div class="w-100"></div>
<div class="col-sm">
<small class="text-muted"><strong>LATEST HANDSHAKE</strong></small>
<h6 style="text-transform: uppercase;">{{i['latest_handshake']}}</h6>
</div>
<div class="w-100"></div>
<div class="col-sm">
<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">
<hr>
<div class="button-group" style="display:flex">
<button type="button" class="btn btn-outline-primary btn-setting-peer btn-control" id="{{i['id']}}" data-toggle="modal"><i class="bi bi-gear-fill"></i></button>
<button type="button" class="btn btn-outline-danger btn-delete-peer btn-control" id="{{i['id']}}" data-toggle="modal"><i class="bi bi-x-circle-fill"></i></button>
{% if i['private_key'] %}
<div class="share_peer_btn_group" style="margin-left: auto !important; display: inline">
<button type="button" class="btn btn-outline-success btn-qrcode-peer btn-control" img_src="{{ qrcode("[Interface]\nPrivateKey = "+i['private_key']+"\nAddress = "+i['allowed_ip']+"\nDNS = 1.1.1.1\n\n[Peer]\nPublicKey = "+conf_data['public_key']+"\nAllowedIPs = 0.0.0.0/0\nEndpoint = "+wg_ip+":"+conf_data['listen_port']) }}">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" style="width: 19px;" fill="#28a745"><path d="M3 11h8V3H3v8zm2-6h4v4H5V5zM3 21h8v-8H3v8zm2-6h4v4H5v-4zM13 3v8h8V3h-8zm6 6h-4V5h4v4zM13 13h2v2h-2zM15 15h2v2h-2zM13 17h2v2h-2zM17 17h2v2h-2zM19 19h2v2h-2zM15 19h2v2h-2zM17 13h2v2h-2zM19 15h2v2h-2z"/></svg>
</button>
<a href="/download/{{ conf_data['name'] }}?id={{ i['id']|urlencode }}" type="button" class="btn btn-outline-info btn-download-peer btn-control">
<i class="bi bi-download"></i>
</a>
</div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
{%endfor%}
</div>
</main>

View File

@@ -1,10 +1,10 @@
<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.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
<title>Wireguard Dashboard - {{ 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') }}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css">
</head>

View File

@@ -4,4 +4,7 @@
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</nav>
</nav>
<div class="progress" style="height: 3px; position: fixed; width: 100%; z-index: 10000; background-color: transparent">
<div class="progress-bar" role="progressbar" style="z-index: 10000; width: 0%"></div>
</div>

View File

@@ -1,41 +1,64 @@
<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">
{% 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>
<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>
<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>
</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>
<button class="btn btn-success" type="submit">Update Peer Default Settings</button>
</div>
</form>
<hr>
<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>
<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">
</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>
@@ -43,37 +66,42 @@
<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>
</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 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>
</form>
</div>
<button type="button" class="btn btn-danger confirm_modal" data-toggle="modal"
data-target="#confirmModal">Update Configuration & Restart
</button>
</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">
</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">
</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>
@@ -82,49 +110,49 @@
<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">
</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>
</div>
</div>
</body>
{% include "footer.html" %}
<script>
$(".sb-settings-url").addClass("active")
$(".confirm_modal").click(function (){
$(".confirm_modal").click(function () {
$(".app_new_ip").html($("#app_ip")[0].value)
$(".app_new_port").html($("#app_port")[0].value)
})
$(".confirm_restart").click(function (){
$(".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;
url = $("#app_ip")[0].value + ":" + $("#app_port")[0].value;
$(".confirm_restart").attr("disabled", "disabled")
setInterval(function (){
if (countdown === 0){
window.location.replace("http://"+url);
setInterval(function () {
if (countdown === 0) {
window.location.replace("http://" + url);
}
$(".confirm_restart").html("Redirecting you in "+countdown+" seconds.")
$(".confirm_restart").html("Redirecting you in " + countdown + " seconds.")
countdown--;
},1000)
}, 1000)
});
$(".change_path").click(function (){
$(".change_path").click(function () {
$(this).attr("disabled", "disabled");
countdown = 5;
setInterval(function (){
if (countdown === 0){
setInterval(function () {
if (countdown === 0) {
location.reload()
}
$(".change_path").html("Redirecting you in "+countdown+" seconds.")
$(".change_path").html("Redirecting you in " + countdown + " seconds.")
countdown--;
},1000)
}, 1000)
$.post('/update_wg_conf_path', $('.update_wg_conf_path').serialize())
});

View File

@@ -5,7 +5,7 @@
<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') }}">
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='css/dashboard.css') }}">
</head>
<body>
{% include "navbar.html" %}

0
src/wgd.sh Normal file → Executable file
View File