waifu/kemoverse
waifu/kemoverse
3
2
Fork 3
Code Issues 13 Pull requests 1 Projects 1 Releases Packages Wiki Activity

Sanitize file names for card image and JSON downloads to prevent invalid characters

Browse source
This commit is contained in:
w 2025-07-17 23:24:06 -03:00
parent 076fcfc1c4
commit 3068b16a72
1 changed files with 12 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
web/templates/card_creator.html
View file

@ -221,13 +221,17 @@ function wrapText(text, x, y, maxWidth, lineHeight) {
// Download button // Download button
downloadBtn.addEventListener("click", () => { downloadBtn.addEventListener("click", () => {
// Sanitize file name
const safeName = (nameInput.value || "card").replace(/[^a-z0-9_\-]/gi, "_");
const safePack = (packInput.value || "pack").replace(/[^a-z0-9_\-]/gi, "_");
const fileName = `kemoverse_${safePack}_${safeName}.webp`;
const link = document.createElement("a"); const link = document.createElement("a");
link.download = "kemoverse-card.webp"; link.download = fileName;
link.href = canvas.toDataURL("image/webp", 0.95); link.href = canvas.toDataURL("image/webp", 0.95);
link.click(); link.click();
}); });
// Create and place the JSON download button below the card download button
const jsonBtn = document.createElement("button"); const jsonBtn = document.createElement("button");
jsonBtn.textContent = "Download Card Info"; jsonBtn.textContent = "Download Card Info";
jsonBtn.style.marginTop = "0.5rem"; jsonBtn.style.marginTop = "0.5rem";
@ -242,12 +246,17 @@ jsonBtn.onclick = () => {
artist: artistInput.value, artist: artistInput.value,
frame: frameSelect.value frame: frameSelect.value
}; };
const safeName = (nameInput.value || "card").replace(/[^a-z0-9_\-]/gi, "_");
const safePack = (packInput.value || "pack").replace(/[^a-z0-9_\-]/gi, "_");
const fileName = `kemoverse_${safePack}_${safeName}.json`;
const blob = new Blob([JSON.stringify(cardData, null, 2)], {type: "application/json"}); const blob = new Blob([JSON.stringify(cardData, null, 2)], {type: "application/json"});
const link = document.createElement("a"); const link = document.createElement("a");
link.href = URL.createObjectURL(blob); link.href = URL.createObjectURL(blob);
link.download = "kemoverse-card.json"; link.download = fileName;
link.click(); link.click();
}; };
// Place the button below the downloadBtn // Place the button below the downloadBtn
downloadBtn.parentNode.insertBefore(jsonBtn, downloadBtn.nextSibling); downloadBtn.parentNode.insertBefore(jsonBtn, downloadBtn.nextSibling);
</script> </script>