kamp/WGDashboard
1
0
Fork 0
mirror of https://github.com/donaldzou/WGDashboard.git synced 2024-11-06 16:00:28 +01:00
Code

Minimized some js code

Browse Source
This commit is contained in:
Donald Cheng Hong Zou 2022-03-30 00:54:11 -04:00
parent 5af2fff9ca
commit c8ca9ef7ab
1 changed files with 54 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
src/static/js/configuration.js
View File

@ -303,11 +303,15 @@ let peers = [];
let total_s = 0; let total_s = 0;
total_r += peer.cumu_receive; total_r += peer.cumu_receive;
total_s += peer.cumu_sent; total_s += peer.cumu_sent;
let spliter = '<div class="w-100"></div>'; let spliter = '<div class="w-100"></div>';
let peer_name = let peer_name =
`<div class="col-sm peerNameCol"> `<div class="col-sm peerNameCol">
<h5 class="peerName">${peer.name === "" ? "Untitled" : peer.name}</h5> <h5 class="peerName">${peer.name === "" ? "Untitled" : peer.name}</h5>
<h6 class="peerLightContainer"><span class="dot dot-${peer.status}" style="margin-left: auto !important;" data-toggle="tooltip" data-placement="left"></span></h6> <h6 class="peerLightContainer">
<span class="dot dot-${peer.status}" style="margin-left: auto !important;" data-toggle="tooltip" data-placement="left"></span>
</h6>
</div>`; </div>`;
let peer_transfer = let peer_transfer =
`<div class="col-12 peer_data_group" style=""> `<div class="col-12 peer_data_group" style="">
@ -318,10 +322,31 @@ let peers = [];
<small><i class="bi bi-arrow-up-right"></i> ${roundN(peer.total_sent + total_s, 4)} GB</small> <small><i class="bi bi-arrow-up-right"></i> ${roundN(peer.total_sent + total_s, 4)} GB</small>
</p> </p>
</div>`; </div>`;
let peer_key = '<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">' + peer.id + '</samp></h6></div>'; let peer_key =
let peer_allowed_ip = '<div class="col-sm"><small class="text-muted"><strong>ALLOWED IP</strong></small><h6 style="text-transform: uppercase;">' + peer.allowed_ip + '</h6></div>'; `<div class="col-sm">
let peer_latest_handshake = '<div class="col-sm"> <small class="text-muted"><strong>LATEST HANDSHAKE</strong></small> <h6 style="text-transform: uppercase;">' + peer.latest_handshake + '</h6> </div>'; <small class="text-muted" style="display: flex">
let peer_endpoint = '<div class="col-sm"><small class="text-muted"><strong>END POINT</strong></small><h6 style="text-transform: uppercase;">' + peer.endpoint + '</h6></div>'; <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">${peer.id}</samp></h6>
</div>`;
let peer_allowed_ip = `
<div class="col-sm">
<small class="text-muted">
<strong>ALLOWED IP</strong>
</small>
<h6 style="text-transform: uppercase;">${peer.allowed_ip}</h6>
</div>`;
let peer_latest_handshake =
`<div class="col-sm">
<small class="text-muted"><strong>LATEST HANDSHAKE</strong></small>
<h6 style="text-transform: uppercase;">${peer.latest_handshake}</h6>
</div>`;
let peer_endpoint =
`<div class="col-sm">
<small class="text-muted"><strong>END POINT</strong></small>
<h6 style="text-transform: uppercase;">${peer.endpoint}</h6>
</div>`;
let peer_control = ` let peer_control = `
<div class="col-sm"> <div class="col-sm">
<hr> <hr>
@ -336,27 +361,31 @@ let peers = [];
<i class="bi bi-ethernet" data-toggle="tooltip" data-placement="bottom" data-original-title='Peer enabled. Click to disable peer.' data-peer-name="${peer.name}"></i> <i class="bi bi-ethernet" data-toggle="tooltip" data-placement="bottom" data-original-title='Peer enabled. Click to disable peer.' data-peer-name="${peer.name}"></i>
</button>`; </button>`;
if (peer.private_key !== "") { if (peer.private_key !== "") {
peer_control += '<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" data-imgsrc="/qrcode/' + response.name + '?id=' + encodeURIComponent(peer.id) + '"><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/' + response.name + '?id=' + encodeURIComponent(peer.id) + '" class="btn btn-outline-info btn-download-peer btn-control"><i class="bi bi-download"></i></a></div>'; peer_control +=
`<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" data-imgsrc="/qrcode/${response.name}?id=${encodeURIComponent(peer.id)}">
<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/${response.name}?id=${encodeURIComponent(peer.id)}" class="btn btn-outline-info btn-download-peer btn-control"><i class="bi bi-download"></i></a>
</div>`;
} }
peer_control += '</div>'; peer_control += '</div></div>';
let html = '<div class="' + mode + '" data-id="' + peer.id + '">' + let html =
'<div class="card mb-3 card-' + peer.status + '">' + `<div class="${mode}" data-id="${peer.id}">
'<div class="card-body">' + <div class="card mb-3 card-${peer.status}">
'<div class="row">' + <div class="card-body">
peer_name + <div class="row">` +
spliter + peer_name +
peer_transfer + spliter +
peer_key + peer_transfer +
peer_allowed_ip + peer_key +
peer_latest_handshake + peer_allowed_ip +
spliter + peer_latest_handshake +
peer_endpoint + spliter +
spliter + peer_endpoint +
peer_control + spliter +
'</div>' + peer_control +
'</div>' + `</div></div></div></div>`;
'</div>' +
'</div></div>';
result += html; result += html;
}); });
response.lock_access_peers.forEach(function(peer) { response.lock_access_peers.forEach(function(peer) {