Reorganize files, keep table from moving on alert
This commit is contained in:
@@ -15,10 +15,10 @@
|
||||
<link rel="icon" type="image/png" href="assets/favicon-32.png" sizes="32x32">
|
||||
<link rel="icon" type="image/png" href="assets/favicon-196.png" sizes="196x196">
|
||||
|
||||
<script src="script.js"></script>
|
||||
<script src="static/script.js"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.1/build/pure-min.css"
|
||||
integrity="sha384-oAOxQR6DkCoMliIh8yFnu25d7Eq/PHS21PClpwjOTeU2jRSq11vu66rf90/cZr47" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" rel="noopener" target="_blank" href="styles.css">
|
||||
<link rel="stylesheet" type="text/css" target="_blank" href="static/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -40,6 +40,7 @@
|
||||
</div>
|
||||
<div class="pure-controls">
|
||||
<button class="pure-button pure-button-primary">Shorten!</button>
|
||||
<p id="alert-box"> </p>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
@@ -49,7 +50,7 @@
|
||||
<br>
|
||||
<thead>
|
||||
<tr>
|
||||
<td id="short-url-header">Short URL (click to copy)</td>
|
||||
<td id="short-url-header">Short URL<br>(click to copy)</td>
|
||||
<td>Long URL</td>
|
||||
<td>Hits</td>
|
||||
<td name="deleteBtn">×</td>
|
||||
|
||||
@@ -48,7 +48,7 @@ const displayData = async (data) => {
|
||||
const table = document.querySelector("#url-table");
|
||||
if (!window.isSecureContext) {
|
||||
const shortUrlHeader = document.getElementById("short-url-header");
|
||||
shortUrlHeader.innerHTML = "Short URL (right click and copy)";
|
||||
shortUrlHeader.innerHTML = "Short URL<br>(right click and copy)";
|
||||
}
|
||||
table_box.style.visibility = "visible";
|
||||
table.innerHTML = ''; // Clear
|
||||
@@ -57,10 +57,10 @@ const displayData = async (data) => {
|
||||
};
|
||||
|
||||
const showAlert = async (text, col) => {
|
||||
document.getElementById("alertBox")?.remove();
|
||||
document.getElementById("alert-box")?.remove();
|
||||
const controls = document.querySelector(".pure-controls");
|
||||
const alertBox = document.createElement("p");
|
||||
alertBox.setAttribute("id", "alertBox");
|
||||
alertBox.setAttribute("id", "alert-box");
|
||||
alertBox.setAttribute("style", `color:${col}`);
|
||||
alertBox.innerHTML = text;
|
||||
controls.appendChild(alertBox);
|
||||
@@ -121,7 +121,8 @@ const deleteButton = (shortUrl) => {
|
||||
btn.onclick = e => {
|
||||
e.preventDefault();
|
||||
if (confirm("Do you want to delete the entry " + shortUrl + "?")) {
|
||||
document.getElementById("alertBox")?.remove();
|
||||
document.getElementById("alert-box")?.remove();
|
||||
showAlert(" ", "black");
|
||||
fetch(`/api/del/${shortUrl}`, {
|
||||
method: "DELETE"
|
||||
}).then(_ => refreshData());
|
||||
Reference in New Issue
Block a user