mirror/pasty
1
0
Fork 0
mirror of https://github.com/lus/pasty.git synced 2023-08-10 21:13:09 +03:00
Code Issues Projects Releases Wiki Activity

Implement the spinner functionality

Browse Source
This commit is contained in:
Lukas SP 2020-08-24 18:23:52 +02:00
parent 09135a493f
commit 6b0d0007e2
3 changed files with 63 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web/js/autoload.js
View File

@ -1,6 +1,7 @@
// Import the used modules // Import the used modules
import * as api from "./api.js"; import * as api from "./api.js";
import * as buttons from "./buttons.js"; import * as buttons from "./buttons.js";
import * as spinner from "./spinner.js";
// Set up the buttons // Set up the buttons
buttons.setupButtons(); buttons.setupButtons();
@ -57,4 +58,4 @@ async function loadPaste() {
input.focus(); input.focus();
} }
} }
loadPaste(); spinner.surround(loadPaste);

13
web/js/buttons.js
View File

@ -1,6 +1,7 @@
// Import the used modules // Import the used modules
import * as api from "./api.js"; import * as api from "./api.js";
import * as autoload from "./autoload.js"; import * as autoload from "./autoload.js";
import * as spinner from "./spinner.js";
// setupKeybinds initializes the keybinds for the buttons // setupKeybinds initializes the keybinds for the buttons
export function setupKeybinds() { export function setupKeybinds() {
@ -46,7 +47,8 @@ export function setupButtons() {
}); });
// Define the behavior of the 'save' button // Define the behavior of the 'save' button
document.getElementById("btn_save").addEventListener("click", async function() { document.getElementById("btn_save").addEventListener("click", function() {
spinner.surround(async function() {
// Return if the text area is empty // Return if the text area is empty
const input = document.getElementById("input"); const input = document.getElementById("input");
if (!input.value) return; if (!input.value) return;
@ -66,9 +68,11 @@ export function setupButtons() {
// TODO: Find a solution to display the deletion token // TODO: Find a solution to display the deletion token
}); });
});
// Define the behavior of the 'delete' button // Define the behavior of the 'delete' button
document.getElementById("btn_delete").addEventListener("click", async function() { document.getElementById("btn_delete").addEventListener("click", function() {
spinner.surround(async function() {
// Ask the user for the deletion token // Ask the user for the deletion token
const deletionToken = window.prompt("Deletion Token:"); const deletionToken = window.prompt("Deletion Token:");
if (!deletionToken) return; if (!deletionToken) return;
@ -84,15 +88,18 @@ export function setupButtons() {
// Redirect the user to the main page // Redirect the user to the main page
location.replace(location.protocol + "//" + location.host); location.replace(location.protocol + "//" + location.host);
}); });
});
// Define the behavior of the 'copy' button // Define the behavior of the 'copy' button
document.getElementById("btn_copy").addEventListener("click", async function() { document.getElementById("btn_copy").addEventListener("click", function() {
spinner.surround(async function() {
// Ask for the clipboard permissions // Ask for the clipboard permissions
askClipboardPermissions(); askClipboardPermissions();
// Copy the code // Copy the code
await navigator.clipboard.writeText(document.getElementById("code").innerText); await navigator.clipboard.writeText(document.getElementById("code").innerText);
}); });
});
} }
// askClipboardPermissions asks the user for the clipboard permissions // askClipboardPermissions asks the user for the clipboard permissions

19
web/js/spinner.js Normal file
View File

@ -0,0 +1,19 @@
// element holds the spinners DOM element
const element = document.getElementById("spinner");
// show shows the spinner
export function show() {
element.classList.remove("hidden");
}
// hide hides the spinner
export function hide() {
element.classList.add("hidden");
}
// surround surrounds an action with a spinner
export async function surround(action) {
show();
await action();
hide();
}