From f2750de153b92f875eb7cdc8cd2a8f6a540a6be4 Mon Sep 17 00:00:00 2001 From: Donald Cheng Hong Zou Date: Wed, 29 Dec 2021 12:17:44 -0500 Subject: [PATCH] Feature adding and UI adjustment Added Preshared-Key to all configuration --- src/dashboard.py | 272 +++++++++++++++++++++++-------- src/static/css/dashboard.css | 58 +++++++ src/static/js/configuration.js | 120 +++++++++++--- src/templates/configuration.html | 110 +++++++------ src/templates/index.html | 15 +- src/templates/qrcode.html | 2 +- 6 files changed, 426 insertions(+), 151 deletions(-) diff --git a/src/dashboard.py b/src/dashboard.py index 1407a75..1f1afc1 100644 --- a/src/dashboard.py +++ b/src/dashboard.py @@ -235,11 +235,11 @@ def get_all_peers_data(config_name): for i in conf_peer_data['Peers']: search = db.search(peers.id == i['PublicKey']) if not search: - db.insert({ + new_data = { "id": i['PublicKey'], "private_key": "", "DNS": config.get("Peers", "peer_global_DNS"), - "endpoint_allowed_ip": config.get("Peers","peer_endpoint_allowed_ip"), + "endpoint_allowed_ip": config.get("Peers", "peer_endpoint_allowed_ip"), "name": "", "total_receive": 0, "total_sent": 0, @@ -250,9 +250,13 @@ def get_all_peers_data(config_name): "allowed_ip": "N/A", "traffic": [], "mtu": config.get("Peers", "peer_mtu"), - "keepalive": config.get("Peers","peer_keep_alive"), - "remote_endpoint":config.get("Peers","remote_endpoint") - }) + "keepalive": config.get("Peers", "peer_keep_alive"), + "remote_endpoint": config.get("Peers", "remote_endpoint"), + "preshared_key": "" + } + if "PresharedKey" in i.keys(): + new_data["preshared_key"] = i["PresharedKey"] + db.insert(new_data) else: # Update database since V2.2 update_db = {} @@ -270,6 +274,11 @@ def get_all_peers_data(config_name): update_db['keepalive'] = config.get("Peers","peer_keep_alive") if "remote_endpoint" not in search[0]: update_db['remote_endpoint'] = config.get("Peers","remote_endpoint") + if "preshared_key" not in search[0]: + if "PresharedKey" in i.keys(): + update_db['preshared_key'] = i["PresharedKey"] + else: + update_db['preshared_key'] = "" db.update(update_db, peers.id == i['PublicKey']) # Remove peers no longer exist in WireGuard configuration file db_key = list(map(lambda a: a['id'], db.all())) @@ -288,7 +297,7 @@ def get_all_peers_data(config_name): try: sem.release() except RuntimeError as e: - pass + print("RuntimeError: cannot release un-acquired lock") """ Frontend Related Functions @@ -308,7 +317,10 @@ def get_peers(config_name, search, sort_t): else: result = sorted(result, key=lambda d: d[sort_t]) db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return result @@ -353,7 +365,10 @@ def get_conf_total_data(config_name): upload_total = round(upload_total, 4) download_total = round(download_total, 4) db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return [total, upload_total, download_total] # Get configuration status @@ -384,11 +399,14 @@ def get_conf_list(): def gen_private_key(): gen = subprocess.check_output('wg genkey > private_key.txt && wg pubkey < private_key.txt > public_key.txt', shell=True) + gen_psk = subprocess.check_output('wg genpsk', shell=True) + preshare_key = gen_psk.decode("UTF-8").strip() + print(gen_psk.decode("UTF-8").strip()) private = open('private_key.txt') private_key = private.readline().strip() public = open('public_key.txt') public_key = public.readline().strip() - data = {"private_key": private_key, "public_key": public_key} + data = {"private_key": private_key, "public_key": public_key, "preshared_key": preshare_key} private.close() public.close() os.remove('private_key.txt') @@ -423,11 +441,17 @@ def checkKeyMatch(private_key, public_key, config_name): match = db.search(peers.id == result['data']) if len(match) != 1 or result['data'] != public_key: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return {'status': 'failed', 'msg': 'Please check your private key, it does not match with the public key.'} else: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return {'status': 'success'} # Check if there is repeated allowed IP @@ -442,11 +466,17 @@ def check_repeat_allowed_IP(public_key, ip, config_name): existed_ip = db.search((peers.id != public_key) & (peers.allowed_ip == ip)) if len(existed_ip) != 0: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return {'status': 'failed', 'msg': "Allowed IP already taken by another peer."} else: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return {'status': 'success'} @@ -457,7 +487,6 @@ Flask Functions # Before request @app.before_request def auth_req(): - conf = configparser.ConfigParser(strict=False) conf.read(dashboard_conf) req = conf.get("Server", "auth_req") @@ -715,12 +744,16 @@ def update_dashbaord_sort(): # Update configuration refresh interval @app.route('/update_dashboard_refresh_interval', methods=['POST']) def update_dashboard_refresh_interval(): - config = configparser.ConfigParser(strict=False) - config.read(dashboard_conf) - config.set("Server", "dashboard_refresh_interval", str(request.form['interval'])) - config.write(open(dashboard_conf, "w")) - config.clear() - return "true" + preset_interval = ["5000", "10000", "30000", "60000"] + if request.form["interval"] in preset_interval: + config = configparser.ConfigParser(strict=False) + config.read(dashboard_conf) + config.set("Server", "dashboard_refresh_interval", str(request.form['interval'])) + config.write(open(dashboard_conf, "w")) + config.clear() + return "true" + else: + return "false" # Configuration Page @app.route('/configuration/', methods=['GET']) @@ -819,60 +852,98 @@ def add_peer(config_name): allowed_ips = data['allowed_ips'] endpoint_allowed_ip = data['endpoint_allowed_ip'] DNS = data['DNS'] + enable_preshared_key = data["enable_preshared_key"] keys = get_conf_peer_key(config_name) if len(public_key) == 0 or len(DNS) == 0 or len(allowed_ips) == 0 or len(endpoint_allowed_ip) == 0: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "Please fill in all required box." if type(keys) != list: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return config_name + " is not running." if public_key in keys: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "Public key already exist." if len(db.search(peers.allowed_ip.matches(allowed_ips))) != 0: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "Allowed IP already taken by another peer." if not check_DNS(DNS): db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "DNS formate is incorrect. Example: 1.1.1.1" if not check_Allowed_IPs(endpoint_allowed_ip): db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "Endpoint Allowed IPs format is incorrect." if len(data['MTU']) != 0: try: mtu = int(data['MTU']) except: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "MTU format is not correct." if len(data['keep_alive']) != 0: try: keep_alive = int(data['keep_alive']) except: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "Persistent Keepalive format is not correct." try: - status = subprocess.check_output( - "wg set " + config_name + " peer " + public_key + " allowed-ips " + allowed_ips, shell=True, - stderr=subprocess.STDOUT) + if enable_preshared_key == True: + key = subprocess.check_output("wg genpsk > tmp_psk.txt", shell=True) + status = subprocess.check_output( + "wg set " + config_name + " peer " + public_key + " allowed-ips " + allowed_ips + " preshared-key " + "tmp_psk.txt", shell=True, + stderr=subprocess.STDOUT) + os.remove("tmp_psk.txt") + elif enable_preshared_key == False: + status = subprocess.check_output( + "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_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() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "true" except subprocess.CalledProcessError as exc: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return exc.output.strip() # Remove peer @@ -898,11 +969,17 @@ def remove_peer(config_name): status = subprocess.check_output("wg-quick save " + config_name, shell=True, stderr=subprocess.STDOUT) db.remove(peers.id == delete_key) db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return "true" except subprocess.CalledProcessError as exc: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return exc.output.strip() # Save peer settings @@ -915,6 +992,7 @@ def save_peer_setting(config_name): DNS = data['DNS'] allowed_ip = data['allowed_ip'] endpoint_allowed_ip = data['endpoint_allowed_ip'] + preshared_key = data['preshared_key'] sem.acquire(timeout=1) db = TinyDB(os.path.join(db_path, config_name + ".json")) peers = Query() @@ -922,37 +1000,66 @@ def save_peer_setting(config_name): check_ip = check_repeat_allowed_IP(id, allowed_ip, config_name) if not check_IP_with_range(endpoint_allowed_ip): db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": "Endpoint Allowed IPs format is incorrect."}) if not check_DNS(DNS): db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": "DNS format is incorrect."}) if len(data['MTU']) != 0: try: mtu = int(data['MTU']) except: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": "MTU format is not correct."}) if len(data['keep_alive']) != 0: try: keep_alive = int(data['keep_alive']) except: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": "Persistent Keepalive format is not correct."}) if private_key != "": check_key = checkKeyMatch(private_key, id, config_name) if check_key['status'] == "failed": db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify(check_key) if check_ip['status'] == "failed": db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify(check_ip) try: + tmp_psk = open("tmp_edit_psk.txt", "w+") + tmp_psk.write(preshared_key) + tmp_psk.close() + change_psk = subprocess.check_output("wg set " + config_name + " peer " + id + " preshared-key tmp_edit_psk.txt", shell=True, stderr=subprocess.STDOUT) + if change_psk.decode("UTF-8") != "": + db.close() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") + return jsonify({"status": "failed", "msg": change_psk.decode("UTF-8")}) if allowed_ip == "": allowed_ip = '""' allowed_ip = allowed_ip.replace(" ", "") @@ -962,24 +1069,36 @@ def save_peer_setting(config_name): stderr=subprocess.STDOUT) if change_ip.decode("UTF-8") != "": db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": change_ip.decode("UTF-8")}) db.update( {"name": name, "private_key": private_key, "DNS": DNS, "endpoint_allowed_ip": endpoint_allowed_ip, "mtu": data['MTU'], - "keepalive":data['keep_alive']}, + "keepalive":data['keep_alive'], "preshared_key": preshared_key}, peers.id == id) db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "success", "msg": ""}) except subprocess.CalledProcessError as exc: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": str(exc.output.decode("UTF-8").strip())}) else: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify({"status": "failed", "msg": "This peer does not exist."}) # Get peer settings @@ -994,8 +1113,12 @@ def get_peer_name(config_name): db.close() 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'], - "mtu": result[0]['mtu'], "keep_alive": result[0]['keepalive']} - sem.release() + "mtu": result[0]['mtu'], "keep_alive": result[0]['keepalive'], "preshared_key": result[0]["preshared_key"]} + + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return jsonify(data) # Generate a private key @@ -1039,6 +1162,7 @@ def generate_qrcode(config_name): MTU = peer['mtu'] endpoint_allowed_ip = peer['endpoint_allowed_ip'] keepalive = peer['keepalive'] + preshared_key = peer["preshared_key"] conf = { "public_key": public_key, "listen_port": listen_port, @@ -1049,16 +1173,29 @@ def generate_qrcode(config_name): "mtu": MTU, "endpoint_allowed_ip": endpoint_allowed_ip, "keepalive": keepalive, + "preshared_key": preshared_key } db.close() - sem.release() - return render_template("qrcode.html", i=conf) + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") + + result = "[Interface]\nPrivateKey = "+conf['private_key']+"\nAddress = "+conf['allowed_ip']+"\nMTU = "+conf['mtu']+"\nDNS = "+conf['DNS']\ + +"\n\n[Peer]\nPublicKey = "+conf['public_key']+"\nAllowedIPs = "+conf['endpoint_allowed_ip']+"\nPersistentKeepalive = "+conf['keepalive']+"\nEndpoint = "+conf['endpoint'] + if preshared_key != "": + result += "\nPresharedKey = "+preshared_key + + return render_template("qrcode.html", i=result) else: db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return redirect("/configuration/" + config_name) # Download configuration file -@app.route('/', methods=['GET']) +@app.route('/download/', methods=['GET']) def download(config_name): print(request.headers.get('User-Agent')) id = request.args.get('id') @@ -1080,6 +1217,7 @@ def download(config_name): endpoint_allowed_ip = peer['endpoint_allowed_ip'] keepalive = peer['keepalive'] filename = peer['name'] + preshared_key = peer["preshared_key"] if len(filename) == 0: filename = "Untitled_Peers" else: @@ -1094,11 +1232,17 @@ def download(config_name): filename = "Untitled_Peer" filename = "".join(filename.split(' ')) filename = filename + "_" + config_name + psk = "" + if preshared_key != "": + psk = "\nPresharedKey = "+preshared_key def generate(private_key, allowed_ip, DNS, MTU, public_key, endpoint, keepalive): - yield "[Interface]\nPrivateKey = " + private_key + "\nAddress = " + allowed_ip + "\nDNS = " + DNS + "\nMTU = " + MTU + "\n\n[Peer]\nPublicKey = " + public_key + "\nAllowedIPs = " + endpoint_allowed_ip + "\nEndpoint = " + endpoint+ "\nPersistentKeepalive = " + keepalive + yield "[Interface]\nPrivateKey = " + private_key + "\nAddress = " + allowed_ip + "\nDNS = " + DNS + "\nMTU = " + MTU + "\n\n[Peer]\nPublicKey = " + public_key + "\nAllowedIPs = " + endpoint_allowed_ip + "\nEndpoint = " + endpoint+ "\nPersistentKeepalive = " + keepalive + psk db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return app.response_class(generate(private_key, allowed_ip, DNS, MTU, public_key, endpoint, keepalive), mimetype='text/conf', headers={"Content-Disposition": "attachment;filename=" + filename + ".conf"}) @@ -1106,7 +1250,7 @@ def download(config_name): db.close() return redirect("/configuration/" + config_name) -# Switch peer displate mode +# Switch peer display mode @app.route('/switch_display_mode/', methods=['GET']) def switch_display_mode(mode): if mode in ['list','grid']: @@ -1126,7 +1270,7 @@ Dashboard Tools Related def get_ping_ip(): config = request.form['config'] sem.acquire(timeout=1) - db = TinyDB(os.path.join(db_path, config_name + ".json")) + db = TinyDB(os.path.join(db_path, config + ".json")) html = "" for i in db.all(): @@ -1141,7 +1285,10 @@ def get_ping_ip(): html += "" html += "" db.close() - sem.release() + try: + sem.release() + except RuntimeError as e: + print("RuntimeError: cannot release un-acquired lock") return html # Ping IP @@ -1260,13 +1407,4 @@ if __name__ == "__main__": app_port = config.get("Server", "app_port") wg_conf_path = config.get("Server", "wg_conf_path") config.clear() - app.run(host=app_ip, debug=False, port=app_port) -else: - init_dashboard() - update = check_update() - config = configparser.ConfigParser(strict=False) - config.read(dashboard_conf) - app_ip = config.get("Server", "app_ip") - app_port = config.get("Server", "app_port") - wg_conf_path = config.get("Server", "wg_conf_path") - config.clear() \ No newline at end of file + app.run(host=app_ip, debug=False, port=app_port) \ No newline at end of file diff --git a/src/static/css/dashboard.css b/src/static/css/dashboard.css index 7f1ab27..630262a 100644 --- a/src/static/css/dashboard.css +++ b/src/static/css/dashboard.css @@ -134,6 +134,7 @@ body { .info h6{ line-break: anywhere; + transition: 0.2s ease-in-out; } .info .row .col-sm{ @@ -291,6 +292,10 @@ main{ cursor: pointer; } +#peer_private_key_textbox, #private_key, #public_key{ + font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; +} + .progress-bar{ transition: 0.3s ease-in-out; } @@ -322,4 +327,57 @@ main{ .modal-content{ border-radius: 10px; +} + +.tooltip-inner{ + font-size: 0.8rem; +} + +@-webkit-keyframes loading { + 0%{ + background-color: #dfdfdf; + } + 50%{ + background-color: #adadad; + } + 100%{ + background-color: #dfdfdf; + } +} +@-moz-keyframes loading { + 0%{ + background-color: #dfdfdf; + } + 50%{ + background-color: #adadad; + } + 100%{ + background-color: #dfdfdf; + } +} + +.conf_card{ + transition: 0.2s ease-in-out; +} + +.conf_card:hover{ + border-color: #007bff; + cursor: pointer; +} + +.info_loading{ + animation: loading 2s infinite ease-in-out; + border-radius: 5px; + height: 19px; + transition: 0.3s ease-in-out; +} + +#conf_status_btn{ + transition: 0.2s ease-in-out; +} + +#conf_status_btn.info_loading{ + height: 38px; + border-radius: 5px; + animation: loading 2s infinite ease-in-out; } \ No newline at end of file diff --git a/src/static/js/configuration.js b/src/static/js/configuration.js index 7d6a4b4..cc86563 100644 --- a/src/static/js/configuration.js +++ b/src/static/js/configuration.js @@ -1,5 +1,38 @@ +let $body = $("body"); + +// Progress Bar +let $progress_bar = $(".progress-bar") +function startProgressBar(){ + $progress_bar.css("width","0%") + $progress_bar.css("opacity", "100") + $progress_bar.css("background", "rgb(255,69,69)") + $progress_bar.css("background", "linear-gradient(145deg, rgba(255,69,69,1) 0%, rgba(0,115,186,1) 100%)") + $progress_bar.css("width","25%") + setTimeout(function(){ + stillLoadingProgressBar(); + },300) +} +function stillLoadingProgressBar(){ + $progress_bar.css("transition", "3s ease-in-out") + $progress_bar.css("width", "75%") +} +function endProgressBar(){ + $progress_bar.css("transition", "0.3s ease-in-out") + $progress_bar.css("width","100%") + setTimeout(function(){ + $progress_bar.css("opacity", "0") + },250) + +} + +function showToast(msg) { + $('#alertToast').toast('show'); + $('#alertToast .toast-body').html(msg); +} + + // Config Toggle -$("body").on("click", ".switch", function (){ +$body.on("click", ".switch", function (){ $(this).siblings($(".spinner-border")).css("display", "inline-block"); $(this).remove() location.replace("/switch/"+$(this).attr('id')); @@ -13,6 +46,7 @@ function generate_key(){ }).done(function(res){ $("#private_key").val(res.private_key) $("#public_key").val(res.public_key) + $("#preshare_key").val(res.preshared_key) $("#add_peer_alert").addClass("d-none"); $("#re_generate_key i").removeClass("rotating") }) @@ -36,7 +70,7 @@ function generate_public_key(){ } // Add Peer -$("#private_key").change(function(){ +$("#private_key").on("change",function(){ if ($("#private_key").val().length > 0){ $("#re_generate_key i").addClass("rotating") generate_public_key() @@ -53,7 +87,15 @@ $("#re_generate_key").click(function (){ $("#re_generate_key i").addClass("rotating") generate_key() }) -$("#save_peer").click(function(){ +let addModal = new bootstrap.Modal(document.getElementById('add_modal'), { + keyboard: false +}) + +$(".add_btn").on("click", function(){ + addModal.toggle(); +}) + +$("#save_peer").on("click",function(){ $(this).attr("disabled","disabled") $(this).html("Saving...") @@ -77,7 +119,8 @@ $("#save_peer").click(function(){ "DNS": $("#new_add_DNS").val(), "endpoint_allowed_ip": $("#new_add_endpoint_allowed_ip").val(), "MTU": $("#new_add_MTU").val(), - "keep_alive": $("#new_add_keep_alive").val() + "keep_alive": $("#new_add_keep_alive").val(), + "enable_preshared_key": $("#enable_preshare_key").prop("checked"), }), success: function (response){ if(response != "true"){ @@ -90,7 +133,8 @@ $("#save_peer").click(function(){ $("#save_peer").html("Save") } else{ - location.reload(); + load_data(""); + addModal.hide(); } } }) @@ -106,7 +150,7 @@ var qrcodeModal = new bootstrap.Modal(document.getElementById('qrcode_modal'), { }) // QR Code -$("body").on("click", ".btn-qrcode-peer", function (){ +$body.on("click", ".btn-qrcode-peer", function (){ var src = $(this).attr('img_src'); $.ajax({ "url": src, @@ -122,7 +166,7 @@ var deleteModal = new bootstrap.Modal(document.getElementById('delete_modal'), { keyboard: false }); -$("body").on("click", ".btn-delete-peer", function(){ +$body.on("click", ".btn-delete-peer", function(){ var peer_id = $(this).attr("id"); $("#delete_peer").attr("peer_id", peer_id); deleteModal.toggle(); @@ -161,7 +205,7 @@ $("#delete_peer").click(function(){ var settingModal = new bootstrap.Modal(document.getElementById('setting_modal'), { keyboard: false }) -$("body").on("click", ".btn-setting-peer", function(){ +$body.on("click", ".btn-setting-peer", function(){ startProgressBar() var peer_id = $(this).attr("id"); $("#save_peer_setting").attr("peer_id", peer_id); @@ -182,6 +226,7 @@ $("body").on("click", ".btn-setting-peer", function(){ $("#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']) + $("#setting_modal #peer_preshared_key_textbox").val(response["preshared_key"]) settingModal.toggle(); endProgressBar() } @@ -223,7 +268,7 @@ $("#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_name_textbox"), $("#peer_DNS_textbox"), $("#peer_private_key_textbox"), $("#peer_preshared_key_textbox"), $("#peer_allowed_ip_textbox"), $("#peer_endpoint_allowed_ips"), $("#peer_mtu"), $("#peer_keep_alive") ] for (var i = 0; i < data_list.length; i++){ @@ -243,7 +288,8 @@ $("#save_peer_setting").click(function (){ allowed_ip: $("#peer_allowed_ip_textbox").val(), endpoint_allowed_ip: $("#peer_endpoint_allowed_ips").val(), MTU: $("#peer_mtu").val(), - keep_alive: $("#peer_keep_alive").val() + keep_alive: $("#peer_keep_alive").val(), + preshared_key: $("#peer_preshared_key_textbox").val() }), success: function (response){ if (response['status'] === "failed"){ @@ -296,7 +342,7 @@ function doneTyping () { } // Sorting -$("body").on("change", "#sort_by_dropdown", function (){ +$body.on("change", "#sort_by_dropdown", function (){ $.ajax({ method:"POST", data: JSON.stringify({'sort':$("#sort_by_dropdown option:selected").val()}), @@ -309,11 +355,11 @@ $("body").on("change", "#sort_by_dropdown", function (){ }) // Click key to copy -$("body").on("mouseenter", ".key", function(){ +$body.on("mouseenter", ".key", function(){ var label = $(this).parent().siblings().children()[1] label.style.opacity = "100" }) -$("body").on("mouseout", ".key", function(){ +$body.on("mouseout", ".key", function(){ var label = $(this).parent().siblings().children()[1] label.style.opacity = "0" setTimeout(function (){ @@ -321,39 +367,54 @@ $("body").on("mouseout", ".key", function(){ },200) }); -$("body").on("click", ".key", function(){ +$body.on("click", ".key", function(){ var label = $(this).parent().siblings().children()[1] copyToClipboard($(this)) label.innerHTML = "COPIED!" }) function copyToClipboard(element) { var $temp = $(""); - $("body").append($temp); + $body.append($temp); $temp.val($(element).text()).select(); document.execCommand("copy"); $temp.remove(); } // Update Interval -$("body").on("click", ".update_interval", function(){ +$body.on("click", ".update_interval", function(){ + let prev = $(".interval-btn-group.active button"); $(".interval-btn-group button").removeClass("active"); - $(this).addClass("active"); + let _new = $(this) + _new.addClass("active"); + let interval = $(this).data("refresh-interval"); $.ajax({ method:"POST", data: "interval="+$(this).data("refresh-interval"), url: "/update_dashboard_refresh_interval", success: function (res){ - - load_data($('#search_peer_textbox').val()) + if (res === "true"){ + load_interval = interval; + clearInterval(load_timeout); + load_timeout = setInterval(function (){ + load_data($('#search_peer_textbox').val()); + }, interval); + showToast("Refresh Interval set to "+Math.round(interval/1000)+" seconds"); + }else{ + $(".interval-btn-group button").removeClass("active"); + $('.interval-btn-group button[data-refresh-interval="'+load_interval+'"]').addClass("active"); + showToast("Refresh Interval set unsuccessful"); + } } }) }); -$("body").on("click", ".refresh", function (){ +$body.on("click", ".refresh", function (){ load_data($('#search_peer_textbox').val()); }); + + // Switch display mode -$("body").on("click", ".display_mode", function(){ +$body.on("click", ".display_mode", function(){ $(".display-btn-group button").removeClass("active"); $(this).addClass("active"); let display_mode = $(this).data("display-mode"); @@ -361,16 +422,25 @@ $("body").on("click", ".display_mode", function(){ method:"GET", url: "/switch_display_mode/"+$(this).data("display-mode"), success: function (res){ - // load_data($('#search_peer_textbox').val()) - if (display_mode === "list"){ + if (res === "true"){ + if (display_mode === "list"){ Array($(".peer_list").children()).forEach(function(child){ $(child).removeClass().addClass("col-12"); }) + showToast("Displaying as List"); }else{ Array($(".peer_list").children()).forEach(function(child){ $(child).removeClass().addClass("col-sm-6 col-lg-4"); - }) + }); + showToast("Displaying as Grid"); } + } } }) -}) \ No newline at end of file +}) + +// Pre-share key +// $("#enable_preshare_key").on("change", function(){ +// $(".preshare_key_container").css("display", $(".preshare_key_container").css("display") === "none" ? "block":"none"); +// +// }) \ No newline at end of file diff --git a/src/templates/configuration.html b/src/templates/configuration.html index 3f4612e..990718f 100644 --- a/src/templates/configuration.html +++ b/src/templates/configuration.html @@ -8,7 +8,7 @@ {% include "sidebar.html" %}
- +
@@ -21,8 +21,8 @@

{{ title }}

- ACTION
-
+ SWITCH
+
@@ -30,23 +30,23 @@
STATUS -
+
CONNECTED PEERS -
+
TOTAL DATA USAGE -
+
TOTAL RECEIVED -
+
TOTAL SENT -
+
@@ -54,15 +54,15 @@ PUBLIC KEY CLICK TO COPY -
+
LISTEN PORT -
+
ADDRESS -
+
@@ -100,7 +100,7 @@ - @@ -134,7 +134,7 @@
- +
@@ -179,6 +179,12 @@
+
+
+
+
+ +
@@ -233,10 +239,14 @@ +
+ + + +
- - - + +
@@ -307,7 +317,7 @@