fixed event order issues with swapping

Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
ari melody 2024-04-17 18:29:39 +01:00
parent 0b401c058a
commit 0d1e694b59
7 changed files with 22 additions and 8 deletions

View file

@ -51,7 +51,14 @@ function bind_go_back_btn() {
function bind_share_btn() {
const share_btn = document.getElementById("share");
share_btn.onclick = (e) => {
if (navigator.clipboard === undefined) {
share_btn.onclick = event => {
console.error("clipboard is not supported by this browser!");
};
return;
}
share_btn.onclick = event => {
event.preventDefault();
navigator.clipboard.writeText(window.location.href);
share_btn.classList.remove('active');
void share_btn.offsetWidth;

View file

@ -4,7 +4,6 @@ let caches = {};
async function cached_fetch(url) {
let cached = caches[url];
console.log("cache: " + cached);
const res = cached === undefined ? await fetch(url) : await fetch(url, {
headers: {
@ -113,4 +112,6 @@ window.addEventListener("popstate", event => {
swap(event.state, false);
});
bind(document.body);
document.addEventListener("DOMContentLoaded", () => {
bind(document.body);
});

View file

@ -358,11 +358,17 @@ ul#links a:hover {
#share {
margin: 0;
padding: 0;
display: inline-block;
color: inherit;
font-family: inherit;
font-size: inherit;
line-height: 1em;
text-shadow: 0 .05em 2px #0004;
cursor: pointer;
opacity: .5;
background: none;
border: none;
transition: opacity .1s linear;
}

View file

@ -13,7 +13,7 @@
<!-- <script type="application/javascript" src="/script/lib/htmx.js"></script> -->
<!-- <script type="application/javascript" src="/script/lib/htmx.min.js"></script> -->
<!-- <script type="application/javascript" src="/script/lib/htmx-preload.js"></script> -->
<script type="application/javascript" src="/script/swap.js" defer></script>
<script type="application/javascript" src="/script/swap.js"></script>
</head>
<body>

View file

@ -20,7 +20,7 @@
{{define "content"}}
<main>
<script type="module" src="/script/main.js" defer></script>
<script type="module" src="/script/main.js"></script>
<h1>
# hello, world!

View file

@ -30,7 +30,7 @@
{{define "content"}}
<main>
<script type="module" src="/script/music-gateway.js" defer></script>
<script type="module" src="/script/music-gateway.js"></script>
<div id="background" style="background-image: url({{.ResolveArtwork}})"></div>
@ -79,7 +79,7 @@
</p>
{{end}}
<p id="share">share</p>
<button id="share">share</button>
</div>
{{if .Credits}}

View file

@ -18,7 +18,7 @@
{{define "content"}}
<main>
<script type="module" src="/script/music.js" defer></script>
<script type="module" src="/script/music.js"></script>
<h1>
# my music