fix : early return, logging errors into frontend
This commit is contained in:
parent
9b9ea81206
commit
202c89ca74
2 changed files with 55 additions and 54 deletions
|
@ -7,21 +7,21 @@
|
|||
<link href="../stylesheets/index.css" rel="stylesheet" type="text/css"/>
|
||||
<script src="ssh.js"></script>
|
||||
</head>
|
||||
|
||||
<style>
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
table, th {
|
||||
border: 1px solid;
|
||||
|
||||
}
|
||||
td { border: 1px solid;
|
||||
|
||||
td {
|
||||
border: 1px solid;
|
||||
width: fit-content;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
#key_table {
|
||||
|
@ -29,7 +29,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<header class="page-header">
|
||||
|
@ -63,7 +62,8 @@
|
|||
<div> SSH Keys</div>
|
||||
<form id="add_key_form">
|
||||
<label for="key_input"></label>
|
||||
<textarea name="key_input" rows = "4" cols="30" id = "key_input" placeholder="ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAINS2UR/o+nK8lNHHTj5I84ZAAp6P+ZhXqhedMfx0KHE4 My skynet key!"></textarea>
|
||||
<textarea name="key_input" rows="4" cols="30" id="key_input"
|
||||
placeholder="ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAINS2UR/o+nK8lNHHTj5I84ZAAp6P+ZhXqhedMfx0KHE4 My skynet key!"></textarea>
|
||||
<button type="button" id="add_key_button"> Add key</button>
|
||||
</form>
|
||||
|
||||
|
|
|
@ -4,16 +4,21 @@ async function get_keys() {
|
|||
let username = document.getElementById("user").value;
|
||||
let password = document.getElementById("pass").value;
|
||||
let request = {auth: {user: username, pass: password}};
|
||||
|
||||
try {
|
||||
const response = await fetch('https://api.account.skynet.ie/ldap/ssh', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(request),
|
||||
mode: 'cors',
|
||||
});
|
||||
if (response.status === 200) {
|
||||
if (response.status !== 200) {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
return;
|
||||
}
|
||||
const data = await response.json();
|
||||
if (data.result === "success") {
|
||||
if (data.result !== "success") {
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
|
||||
return;
|
||||
}
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Got keys</span>";
|
||||
let keys = data.success;
|
||||
document.getElementById('key_table').style.display = "table";
|
||||
|
@ -21,13 +26,8 @@ async function get_keys() {
|
|||
keys.forEach(key => {
|
||||
add_to_table(key);
|
||||
});
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Error: Failed to get keys</span>";
|
||||
}
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
}
|
||||
} catch (err) {
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
|
@ -48,20 +48,21 @@ async function add_key() {
|
|||
body: JSON.stringify(request),
|
||||
mode: 'cors',
|
||||
});
|
||||
if (response.status === 200) {
|
||||
if (response.status !== 200) {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
return;
|
||||
}
|
||||
const data = await response.json();
|
||||
if (data.result === "success") {
|
||||
if (data.result !== "success") {
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
|
||||
return;
|
||||
}
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Key added</span>";
|
||||
document.getElementById('key_table').style.display = "table";
|
||||
add_to_table(request.key);
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Error:Failed to add</span>";
|
||||
}
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Error </span>";
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
|
@ -78,46 +79,46 @@ async function delete_key(row_idx) {
|
|||
body: JSON.stringify(request),
|
||||
mode: 'cors',
|
||||
});
|
||||
if (response.status === 200) {
|
||||
if (response.status !== 200) {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
return;
|
||||
}
|
||||
const data = await response.json();
|
||||
if (data.result === "success") {
|
||||
if (data.result !== "success") {
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
|
||||
return;
|
||||
}
|
||||
table.deleteRow(row_idx);
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Key deleted</span>";
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Error: Failed to delete</span>";
|
||||
}
|
||||
} else {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Error </span>";
|
||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
|
||||
function add_to_table(key) {
|
||||
let table = document.getElementById("key_table");
|
||||
let new_row = table.insertRow();
|
||||
let name_cell = new_row.insertCell(0);
|
||||
let key_cell = new_row.insertCell(1);
|
||||
let row = table.insertRow();
|
||||
let cell_name = row.insertCell(0);
|
||||
let cell_key = row.insertCell(1);
|
||||
|
||||
//Splitting by spaces, first two make the key + type, rest is a comment/name of the key
|
||||
let key_split = key.split(' ');
|
||||
let key_string = key_split[0] + ' ' + key_split[1];
|
||||
key_cell.textContent = key_string;
|
||||
cell_key.textContent = `${key_split[0]} ${key_split[1]}`;
|
||||
//Names for SSH keys can have multiple spaces
|
||||
let comment = "";
|
||||
for (i = 2; i < key_split.length; i++) {
|
||||
comment += " " + key_split[i];
|
||||
}
|
||||
name_cell.textContent = comment;
|
||||
let delete_cell = new_row.insertCell(2);
|
||||
cell_name.textContent = comment;
|
||||
let cell_delete = row.insertCell(2);
|
||||
let delete_button = document.createElement("button");
|
||||
delete_button.innerHTML = "Delete";
|
||||
|
||||
delete_cell.appendChild(delete_button);
|
||||
delete_cell.addEventListener("click", function () {
|
||||
delete_key(new_row.rowIndex);
|
||||
cell_delete.appendChild(delete_button);
|
||||
cell_delete.addEventListener("click", function () {
|
||||
delete_key(row.rowIndex);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue