add delete function from servers storarage and other
This commit is contained in:
parent
e7000c9abf
commit
1b0ad61236
@ -23,7 +23,7 @@ document.body.innerHTML = `<nav id="navbar-main" class="navbar navbar-connect-da
|
||||
|
||||
<div class="vr" style="margin-right:5px"></div>
|
||||
<div class="d-flex" style="margin-right:10px" id="navbar-user-menu">
|
||||
<button id="toggle-theme" class="btn btn-outline-light" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"><i class="far fa-eye"></i> Light theme</button>
|
||||
<button id="toggle-theme" class="btn btn-outline-light" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"><i class="fas fa-sun"></i></button>
|
||||
</div>
|
||||
</nav>
|
||||
<div id="server.area">
|
||||
@ -60,4 +60,4 @@ socket.run()
|
||||
<p>Connection errored</p>
|
||||
</center>
|
||||
</div>`;
|
||||
});
|
||||
});
|
||||
|
@ -96,6 +96,7 @@ fl.bindLoad("/connect", () => {
|
||||
const portSelected = +(address.value.match(/:[0-9]{1,5}$/).at(0).slice(1,));
|
||||
address.value = address.value.slice(0, -1 * (":"+portSelected).length);
|
||||
port.value = portSelected;
|
||||
document.getElementById("custom-conn-port").focus();
|
||||
}
|
||||
|
||||
if (!port.value) {
|
||||
@ -141,6 +142,7 @@ fl.bindLoad("/connect", () => {
|
||||
|
||||
const servers = localServers.concat(JSON.parse(xhr.response).result.map(x => { x.fromLocal = false; return x }));
|
||||
const serversByItemID = new Object();
|
||||
const serversByAddress = new Object();
|
||||
const items = [];
|
||||
const itemIDs = [];
|
||||
const mp = servers.map(async serverItem => {
|
||||
@ -155,15 +157,19 @@ fl.bindLoad("/connect", () => {
|
||||
data.tls = serverItem.tls;
|
||||
itemIDs.push({
|
||||
...data,
|
||||
itemID: `con-btn-to:${data.tag}:${serverItem.address}:${serverItem.port}`
|
||||
itemID: `con-btn-to:${data.tag}:${serverItem.address}:${serverItem.port}`,
|
||||
deleteID: `remove-con:${serverItem.address}:${serverItem.port}`,
|
||||
address: `${serverItem.address}:${serverItem.port}`,
|
||||
});
|
||||
serversByItemID[`con-btn-to:${data.tag}:${serverItem.address}:${serverItem.port}`] = { data, serverItem };
|
||||
serversByAddress[`${serverItem.address}:${serverItem.port}`] = { data, serverItem };
|
||||
resolve(items.push(`<tr${!data.tls ? ' style="background-color: #7F6003"' : ""}>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}>${data.name}</td>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}>${serverItem.address}:${serverItem.port}</td>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}>${!data.tls ? '<font color="red"><i class="fas fa-exclamation-triangle"></i></font>' : '<font color="green"><i class="fas fa-lock"></i></font>'}</td>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}>${ping}</td>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}><button class="btn btn-secondary" id="con-btn-to:${data.tag}:${serverItem.address}:${serverItem.port}">${tr("/connect", "connect-to-server-btn") ?? "Connect"}</button></td>
|
||||
<td${!data.tls ? ' style="background-color: #7F6003"' : ""}><button class="btn btn-outline-danger" id="remove-con:${serverItem.address}:${serverItem.port}"${!serverItem.fromLocal ? ' disabled' : ''}><i class="fas fa-trash"></i></button></td>
|
||||
</tr>`));
|
||||
};
|
||||
socket.send(JSON.stringify({
|
||||
@ -172,12 +178,18 @@ fl.bindLoad("/connect", () => {
|
||||
};
|
||||
socket.onerror = (err) => {
|
||||
console.error(err);
|
||||
itemIDs.push({
|
||||
deleteID: `remove-con:${serverItem.address}:${serverItem.port}`,
|
||||
address: `${serverItem.address}:${serverItem.port}`,
|
||||
});
|
||||
serversByAddress[`${serverItem.address}:${serverItem.port}`] = { serverItem };
|
||||
resolve(items.push(`<tr>
|
||||
<td style="background-color: #7F0000"><font color="red">${tr("/connect", "offline-server") ?? "Offline"}</font></td>
|
||||
<td style="background-color: #7F0000">${serverItem.address}:${serverItem.port}</td>
|
||||
<td style="background-color: #7F0000"><font color="red"><i class="fas fa-exclamation-triangle"></i></font></td>
|
||||
<td style="background-color: #7F0000"><font color="red">${tr("/connect", "offline-server") ?? "Offline"}</font></td>
|
||||
<td style="background-color: #7F0000"><button class="btn btn-danger" disabled>${tr("/connect", "offline-server") ?? "Offline"}</button></td>
|
||||
<td style="background-color: #7F0000"><button class="btn btn-outline-danger" id="remove-con:${serverItem.address}:${serverItem.port}"${!serverItem.fromLocal ? ' disabled' : ''}><i class="fas fa-trash"></i></button></td>
|
||||
</tr>`));
|
||||
};
|
||||
});
|
||||
@ -185,7 +197,7 @@ fl.bindLoad("/connect", () => {
|
||||
});
|
||||
|
||||
await Promise.all(mp);
|
||||
items.push(`<tr><td colspan="5"><center><button class="btn btn-primary" id="conn-to-custom">${tr("/connect", "add-custon-server") ?? "Connect to custom server"}</button></center></td></tr>`);
|
||||
items.push(`<tr><td colspan="6"><center><button class="btn btn-primary" id="conn-to-custom">${tr("/connect", "add-custon-server") ?? "Connect to custom server"}</button></center></td></tr>`);
|
||||
document.getElementById("loading-servers").innerHTML = `<table class="table table-dark">
|
||||
<thead>
|
||||
<th scope="col">${tr("/connect", "server-name-tbl") ?? "Name"}</th>
|
||||
@ -193,6 +205,7 @@ fl.bindLoad("/connect", () => {
|
||||
<th scope="col">${tr("/connect", "server-encryption") ?? "Encrypted"}</th>
|
||||
<th scope="col">${tr("/connect", "server-ping") ?? "Ping"}</th>
|
||||
<th scope="col">${tr("/connect", "server-action") ?? "Action"}</th>
|
||||
<th scope="col"></th>
|
||||
</thead>
|
||||
<tbody>
|
||||
${items.join("\n")}
|
||||
@ -200,11 +213,24 @@ fl.bindLoad("/connect", () => {
|
||||
</table>`;
|
||||
|
||||
itemIDs.forEach(btn => {
|
||||
document.getElementById(btn.itemID).onclick = () => {
|
||||
checkContentWarning(() => {
|
||||
const serverInfo = serversByItemID[btn.itemID].serverItem;
|
||||
window.open(`/connect-area?server=${serverInfo.address}:${serverInfo.port}&encrypted=${serverInfo.tls ? "true" : "false"}`);
|
||||
});
|
||||
//console.log("btn:", btn);
|
||||
if (btn.itemID)
|
||||
document.getElementById(btn.itemID).onclick = () => {
|
||||
checkContentWarning(() => {
|
||||
const serverInfo = serversByItemID[btn.itemID].serverItem;
|
||||
window.open(`/connect-area?server=${serverInfo.address}:${serverInfo.port}&encrypted=${serverInfo.tls ? "true" : "false"}`);
|
||||
});
|
||||
};
|
||||
|
||||
document.getElementById(btn.deleteID).onclick = () => {
|
||||
const serverInfo = serversByAddress[btn.address].serverItem;
|
||||
console.log("serverInfo:", serverInfo);
|
||||
const savedServers = (JSON.parse(localStorage.getItem("savedServers") ?? "null") ?? [])
|
||||
.filter(server => {
|
||||
return !(server.address === serverInfo.address && server.port === serverInfo.port)
|
||||
});
|
||||
localStorage.setItem("savedServers", JSON.stringify(savedServers));
|
||||
connectServers();
|
||||
};
|
||||
});
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user