diff --git a/plugins/webamp/public/assets/plugins/webamp/webamp-mod.js b/plugins/webamp/public/assets/plugins/webamp/webamp-mod.js index e9d94ce..1da7c03 100644 --- a/plugins/webamp/public/assets/plugins/webamp/webamp-mod.js +++ b/plugins/webamp/public/assets/plugins/webamp/webamp-mod.js @@ -1,7 +1,7 @@ // teahub plugin: webamp — a Winamp-style player docked on every Teahub page. -// Loads the self-hosted Webamp bundle on first click, so pages stay fast for everyone else. +// Loads Webamp from the CDN on first click, so pages stay fast for everyone else. -// Module scripts have no document.currentScript, so find our tag by its src. +// Module scripts have no document.currentScript, so find our tag by its data attribute. const script = document.querySelector('script[src*="plugins/webamp/webamp-mod.js"]'); const PLAYLIST_URL = script?.dataset.playlist; const KEY = 'teahub-webamp-open'; @@ -56,7 +56,12 @@ function loadWebamp() { } async function open() { - if (webamp) return; + if (webamp) { + // Already open (maybe off-screen or hidden): close and reopen so it lands centered in view. + webamp.dispose(); + webamp = null; + document.getElementById('teahub-webamp')?.remove(); + } btn.textContent = '… webamp'; try { const Webamp = await loadWebamp(); @@ -69,6 +74,8 @@ async function open() { }); const host = document.createElement('div'); host.id = 'teahub-webamp'; + // Webamp centers itself in this node, so make it exactly the visible viewport. + host.style.cssText = 'position:fixed;left:0;top:0;width:100vw;height:100vh;pointer-events:none'; document.body.appendChild(host); await webamp.renderWhenReady(host); try { localStorage.setItem(KEY, '1'); } catch {} @@ -81,12 +88,17 @@ async function open() { } } +// Keep Webamp pinned to the viewport and above Gitea's own layers. +const style = document.createElement('style'); +style.textContent = '#webamp{position:fixed!important;z-index:99990!important}'; +document.head.appendChild(style); + // Small launcher in the corner: the "sound system" button. const btn = document.createElement('button'); btn.textContent = '▶ webamp'; btn.title = 'Open Webamp'; btn.style.cssText = [ - 'position:fixed', 'right:12px', 'bottom:12px', 'z-index:9999', + 'position:fixed', 'right:12px', 'bottom:12px', 'z-index:99999', 'font:12px/1 monospace', 'padding:6px 10px', 'border-radius:4px', 'border:1px solid #1d3', 'background:#000', 'color:#1d3', 'cursor:pointer', ].join(';'); diff --git a/plugins/webamp/templates/custom/footer.tmpl b/plugins/webamp/templates/custom/footer.tmpl index ea0b5bc..b7cb7b6 100644 --- a/plugins/webamp/templates/custom/footer.tmpl +++ b/plugins/webamp/templates/custom/footer.tmpl @@ -1,2 +1,2 @@ {{/* teahub plugin: webamp */}} - +