2022-01-12 19:53:36 -05:00
<!-- index.html - < WGDashboard > - Copyright(C) 2021 Donald Zou [https://github.com/donaldzou]-->
< html lang = "en" >
2021-08-14 23:30:05 -04:00
{% with %}
{% set title="Home" %}
{% include "header.html"%}
{% endwith %}
2020-10-18 01:10:13 -04:00
< body >
2021-05-04 01:32:34 -04:00
{% include "navbar.html" %}
2020-10-18 01:10:13 -04:00
< div class = "container-fluid" >
2021-05-04 01:32:34 -04:00
{% include "sidebar.html" %}
2022-03-29 15:11:50 -04:00
< main role = "main" class = "col-md-9 ml-sm-auto col-lg-10 px-md-4 mb-4" style = "margin-bottom: 10rem !important;" >
2022-01-12 19:53:36 -05:00
< div style = "display: flex; flex-direction: row; align-items: center;" >
< h1 class = "pb-4 mt-4" > Home</ h1 >
</ div >
2022-03-24 02:10:52 -04:00
<!-- {% if msg != "" %}
2022-01-13 09:37:23 -05:00
<div class="alert alert-danger" role="alert">
Configuration toggle failed. Please check the following error message:
</div>
<pre class="index-alert"><code>{{ msg }}</code></pre>
2022-03-24 02:10:52 -04:00
{% endif %} -->
< div class = "index-alert alert alert-danger d-none" role = "alert" >
Configuration toggle failed. Please check the following error message:
</ div >
< pre class = "index-alert index-alert-full d-none" >< code ></ code ></ pre >
2022-01-12 19:53:36 -05:00
2021-07-02 13:23:04 -04:00
{% if conf == [] %}
< p class = "text-muted" > You don't have any WireGuard configurations yet. Please check the configuration folder or change it in "Settings". By default the folder is "/etc/wireguard".</ p >
{% endif %}
2022-04-11 20:01:29 -04:00
{% for i in conf %}
2022-03-21 22:33:19 -04:00
< div class = "card mt-3 conf_card" data-conf-id = "{{i['conf']}}" >
2020-10-18 01:10:13 -04:00
< div class = "card-body" >
2020-10-18 01:52:53 -04:00
< div class = "row" >
2021-05-04 01:32:34 -04:00
< div class = "col card-col" >
2020-10-23 01:31:10 -04:00
< small class = "text-muted" >< strong > CONFIGURATION</ strong ></ small >
2021-12-29 12:17:44 -05:00
< a href = "/configuration/{{i['conf']}}" class = "conf_link" >
2022-01-12 19:53:36 -05:00
< h6 class = "card-title" style = "margin:0 !important;" >< samp > {{i['conf']}}</ samp ></ h6 >
2020-10-18 12:23:38 -04:00
</ a >
</ div >
2021-05-04 01:32:34 -04:00
< div class = "col card-col" >
2020-10-18 01:52:53 -04:00
< small class = "text-muted" >< strong > STATUS</ strong ></ small >
2022-03-21 22:33:19 -04:00
< h6 style = "text-transform: uppercase; margin:0 !important;" >< span > {{i['status']}}</ span >< span class = "dot dot-{{i['status']}}" ></ span ></ h6 >
2020-10-18 01:52:53 -04:00
</ div >
2022-03-21 22:33:19 -04:00
< div class = "col-sm card-col" >
2020-10-18 01:52:53 -04:00
< small class = "text-muted" >< strong > PUBLIC KEY</ strong ></ small >
2022-01-16 20:35:24 -05:00
< h6 style = "margin:0 !important;" >< samp > {{i['public_key']}}</ samp ></ h6 >
2021-05-04 01:32:34 -04:00
</ div >
2022-03-21 22:33:19 -04:00
< div class = "col-sm index-switch" >
< div class = "switch-test" >
< input type = "checkbox" class = "toggle--switch" id = "{{i['conf']}}-switch" {{ i [' checked ']}} data-conf-id = "{{i['conf']}}" >
< label for = "{{i['conf']}}-switch" class = "toggleLabel" ></ label >
</ div >
2020-10-18 01:52:53 -04:00
</ div >
</ div >
2022-03-24 02:10:52 -04:00
< div class = "card-message" ></ div >
2020-10-18 01:10:13 -04:00
</ div >
</ div >
{%endfor%}
</ main >
</ div >
2022-03-22 16:13:57 -04:00
< div class = "position-fixed top-0 right-0 p-3 toastContainer" style = "z-index: 5; right: 0; top: 50px;" ></ div >
< div class = "btn-manage-group" >
< button type = "button" class = "btn btn-primary add_btn" id = "toggleAddConfiguration" >< i class = "bi bi-plus-circle-fill" ></ i ></ button >
</ div >
< div class = "modal fade" id = "addConfigurationModal" data-backdrop = "static" data-keyboard = "false" tabindex = "-1"
aria-labelledby = "staticBackdropLabel" aria-hidden = "true" >
< div class = "modal-dialog modal-dialog-centered modal-lg" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" id = "staticBackdropLabel" > Add New Configuration</ h5 >
< button type = "button" class = "close" data-dismiss = "modal" aria-label = "Close" >
2022-03-21 22:33:19 -04:00
< span aria-hidden = "true" > × </ span >
</ button >
</ div >
2022-03-22 16:13:57 -04:00
< div class = "modal-body" >
< div id = "addCconfigurationAlert" class = "alert alert-danger alert-dismissible fade show d-none" role = "alert" >
< div class = "alert-body" ></ div >
</ div >
2022-03-24 02:10:52 -04:00
< pre id = "addCconfigurationAlertMessage" class = "index-alert d-none" ></ pre >
< form id = "add_configuration_form" >
2022-03-22 16:13:57 -04:00
< div class = "form-group" >
< div >
2022-03-24 02:10:52 -04:00
< label for = "addConfigurationPrivateKey" > Private Key < code > *</ code ></ label >
2022-03-22 16:13:57 -04:00
</ div >
< div class = "input-group" >
2022-03-24 02:10:52 -04:00
< input type = "text" class = "form-control codeFont" id = "addConfigurationPrivateKey" name = "addConfigurationPrivateKey" required >
2022-03-22 16:13:57 -04:00
< div class = "input-group-append" >
< button type = "button" class = "btn btn-danger" id = "reGeneratePrivateKey" data-toggle = "tooltip" data-placement = "top" title = "Regenerate Key" >< i class = "bi bi-arrow-repeat" ></ i ></ button >
</ div >
2022-03-24 02:10:52 -04:00
< div id = "addConfigurationPrivateKeyFeedback" class = "input-feedback" ></ div >
2022-03-22 16:13:57 -04:00
</ div >
</ div >
< div class = "row" >
< div class = "col-sm" >
< div class = "form-group" >
2022-03-24 02:10:52 -04:00
< label for = "addConfigurationName" > Configuration Name < code > *</ code ></ label >
< input type = "text" class = "form-control" id = "addConfigurationName" name = "addConfigurationName" required >
< div id = "addConfigurationNameFeedback" class = "input-feedback" ></ div >
2022-03-22 16:13:57 -04:00
</ div >
</ div >
< div class = "col-sm" >
< div class = "form-group" >
2022-03-24 02:10:52 -04:00
< label for = "addConfigurationListenPort" > Listen Port < code > *</ code ></ label >
< input type = "number" class = "form-control codeFont" id = "addConfigurationListenPort" name = "addConfigurationListenPort" required >
< div id = "addConfigurationListenPortFeedback" class = "input-feedback" ></ div >
2022-03-22 16:13:57 -04:00
</ div >
</ div >
</ div >
< div class = "row" >
< div class = "col-sm" >
< div class = "form-group" >
2022-03-24 02:10:52 -04:00
< label for = "addConfigurationAddress" > Address < code > *</ code >
</ label >
< input type = "text" class = "form-control codeFont" id = "addConfigurationAddress" placeholder = "Ex: 192.168.0.1/24" name = "addConfigurationAddress" required >
< div id = "addConfigurationAddressFeedback" class = "input-feedback" ></ div >
2022-03-22 16:13:57 -04:00
</ div >
</ div >
< div class = "col-sm" >
< div class = "form-group" >
2022-03-24 02:10:52 -04:00
< label for = "" > # of available IPs</ label >
2022-03-22 16:13:57 -04:00
< p class = "addConfigurationAvailableIPs" > N/A</ p >
</ div >
</ div >
</ div >
< hr >
< div class = "form-group" >
< label for = "addConfigurationPreUp" > PreUp</ label >
2022-03-24 02:10:52 -04:00
< input type = "text" class = "form-control codeFont" id = "addConfigurationPreUp" name = "addConfigurationPreUp" >
2022-03-22 16:13:57 -04:00
</ div >
< div class = "form-group" >
< label for = "addConfigurationPreDown" > PreDown</ label >
2022-03-24 02:10:52 -04:00
< input type = "text" class = "form-control codeFont" id = "addConfigurationPreDown" name = "addConfigurationPreDown" >
2022-03-22 16:13:57 -04:00
</ div >
< div class = "form-group" >
< label for = "addConfigurationPostUp" > PostUp</ label >
2022-03-24 02:10:52 -04:00
< input type = "text" class = "form-control codeFont" id = "addConfigurationPostUp" name = "addConfigurationPostUp" >
2022-03-22 16:13:57 -04:00
</ div >
< div class = "form-group" >
< label for = "addConfigurationPostDown" > PostDown</ label >
2022-03-24 02:10:52 -04:00
< input type = "text" class = "form-control codeFont" id = "addConfigurationPostDown" name = "addConfigurationPostDown" >
2022-03-22 16:13:57 -04:00
</ div >
</ form >
</ div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel</ button >
2022-03-24 02:10:52 -04:00
< button type = "button" class = "btn btn-primary" id = "addConfigurationBtn" > Add</ button >
2022-03-24 20:43:56 -04:00
< div class = "text-primary addConfigurationStatus addConfigurationAddStatus d-none" >
< div class = "spinner-border spinner-border-sm" role = "status" >< span class = "sr-only" > Loading...</ span ></ div >
Add Configuration
</ div >
< div class = "text-primary addConfigurationStatus addConfigurationToggleStatus d-none waiting" >
< i class = "bi bi-circle" ></ i > Toggle Configuration
</ div >
2022-03-22 16:13:57 -04:00
</ div >
</ div >
</ div >
</ div >
2023-11-28 16:37:16 -05:00
{% include "tools.html" %}
2022-03-22 16:13:57 -04:00
</ body >
{% include "footer.html" %}
2023-11-28 16:37:16 -05:00
< script src = "{{ url_for('static',filename='js/wireguard.js') }}" ></ script >
2022-03-22 16:13:57 -04:00
< script src = "{{ url_for('static',filename='js/index.js') }}" ></ script >
2020-10-18 01:10:13 -04:00
</ html >
