SadlyNotSappho
/
login-template
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add delete button to GET /myimages

This commit is contained in:
SadlyNotSappho 2024-03-29 11:16:27 -07:00
parent ac21b0ef00
commit 314c1bec7d
1 changed files with 22 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
web/myimages.html
View File

@ -1,28 +1,39 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>My Images</title> <title>My Images</title>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="css/style.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet" />
</head> </head>
<body> <body>
<div id='images' style='display: none'></div> <div id="images" style="display: none"></div>
<button id='showImages-button' onclick="getImages()">Get Images</button> <button id="showImages-button" onclick="getImages()">Get Images</button>
</body> </body>
<script defer> <script defer>
async function getImages(user) { async function getImages(user) {
// get current username // get current username
let username = JSON.parse(await (await fetch("/account")).text()).username; let username = JSON.parse(await (await fetch("/account")).text()).username;
// get images for username // get images for username
let images = JSON.parse(await (await fetch(`/images/by-user/${username}`)).text()) let images = JSON.parse(await (await fetch(`/images/by-user/${username}`)).text());
let imagestrings = []; let imagestrings = [];
for(const img of images) { for (const img of images) {
imagestrings.push(`${img}<br><img src="/images/${img}.png" alt="${img}" style="max-width: 100%">`) imagestrings.push(
`<div id='img-${img}'>ID: ${img} <button id='delimg' onclick="deleteImage('${img}')">Delete</button><br><img src="/images/${img}.png" alt="${img}" style="max-width: 100%"></div>`,
);
} }
document.getElementById('images').innerHTML = imagestrings.join('<br><br>'); document.getElementById("images").innerHTML = imagestrings.join("<br><br>");
document.getElementById('images').style.display = ''; document.getElementById("images").style.display = "";
document.getElementById("showImages-button").style.display = "none";
}
async function deleteImage(uuid) {
// delete the image
alert(await (await fetch(`/images/${uuid}`, { method: "DELETE" })).text());
// remove the image from html
document.getElementById(`img-${uuid}`).remove();
} }
</script> </script>
</html> </html>