Accords-Library-Archive
/
v3.accords-library.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make download button js-less most of the time

This commit is contained in:
DrMint 2024-06-26 06:41:18 +02:00
parent e854d88d89
commit 8142d69bb7
1 changed files with 14 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/DownloadButton.astro
View File

@ -15,13 +15,17 @@ const { t } = await getI18n(Astro.locals.currentLocale);
{/* ------------------------------------------- HTML ------------------------------------------- */} {/* ------------------------------------------- HTML ------------------------------------------- */}
<download-button {
href={href} useBlob ? (
filename={filename} <download-button href={href} filename={filename} class="when-js when-no-print">
class="when-js when-no-print" <Button title={t("global.downloadButton")} icon="material-symbols:download" />
data-use-blob={useBlob}> </download-button>
<Button title={t("global.downloadButton")} icon="material-symbols:download" /> ) : (
</download-button> <a href={href} class="when-no-print">
<Button title={t("global.downloadButton")} icon="material-symbols:download" />
</a>
)
}
{/* ------------------------------------------- JS --------------------------------------------- */} {/* ------------------------------------------- JS --------------------------------------------- */}
@ -31,19 +35,13 @@ const { t } = await getI18n(Astro.locals.currentLocale);
customElement("download-button", (elem) => { customElement("download-button", (elem) => {
const href = elem.getAttribute("href"); const href = elem.getAttribute("href");
const filename = elem.getAttribute("filename"); const filename = elem.getAttribute("filename");
const useBlob = elem.hasAttribute("data-use-blob");
if (!href || !filename) return; if (!href || !filename) return;
elem.addEventListener("click", async () => { elem.addEventListener("click", async () => {
let url; const res = await fetch(href);
if (useBlob) { const blob = await res.blob();
const res = await fetch(href); const url = window.URL.createObjectURL(blob);
const blob = await res.blob();
url = window.URL.createObjectURL(blob);
} else {
url = href;
}
var link = document.createElement("a"); var link = document.createElement("a");
link.download = filename; link.download = filename;