ltadeu6/skeledance
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: use img tag for album art instead of CSS background-image

Browse source 
CSS background-image url() from http:// is blocked in WebEngine local
context even when fetch() works; <img src> does not have this restriction.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ltadeu6 2026-06-07 10:33:26 -03:00
parent b4bf048487
commit 93c019c02e
No known key found for this signature in database
GPG key ID: FB9FDAB6B6F3418D
1 changed files with 10 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

15
plugin/contents/ui/dancer.html
View file

@ -165,12 +165,17 @@ html, body {
right: 2%;
width: 110px;
height: 110px;
background-size: cover;
background-position: center;
border-radius: 6px;
box-shadow: 0 0 18px rgba(0,0,0,0.8), 0 0 8px var(--theme-color, rgba(0,220,255,0.5));
transition: opacity 0.6s ease, background-image 0.4s ease, box-shadow 0.6s ease;
transition: opacity 0.6s ease, box-shadow 0.6s ease;
pointer-events: none;
overflow: hidden;
}
.album-art img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.music-ticker {
@ -782,7 +787,7 @@ html, body {
<div class="vu-meter" id="vuMeter"></div>
<!-- Album art -->
<div id="albumArt" class="album-art" style="opacity:0"></div>
<div id="albumArt" class="album-art" style="opacity:0"><img id="albumArtImg" src="" alt=""></div>
<!-- Music ticker -->
<div class="music-ticker">
@ -1062,7 +1067,7 @@ function fetchTheme() {
if (d.rgb) applyTheme(d.rgb);
if (d.art_url && d.art_url !== lastArtUrl) {
lastArtUrl = d.art_url;
albumArtEl.style.backgroundImage = "url('http://127.0.0.1:8765/art')";
document.getElementById('albumArtImg').src = 'http://127.0.0.1:8765/art?' + Date.now();
}
})
.catch(() => {});