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

Tie animations to playback state

Browse source 
- Paused/stopped playerctl treated as no music (QML change)
- Character and notes only appear when Playing
- VU meter always visible but in rest state (3px, faint) when idle

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ltadeu6 2026-06-07 09:28:36 -03:00
parent b6eb089c2c
commit 2ee2470089
No known key found for this signature in database
GPG key ID: FB9FDAB6B6F3418D
2 changed files with 19 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -102,14 +102,13 @@ html, body {
============================================================ */ ============================================================ */
.vu-meter { .vu-meter {
position: absolute; position: absolute;
bottom: 4%; bottom: 5%;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
gap: 4px; gap: 4px;
pointer-events: none; pointer-events: none;
opacity: 0;
transition: opacity 0.8s; transition: opacity 0.8s;
} }
.vu-bar { .vu-bar {
@ -887,9 +886,14 @@ for (let i = 0; i < VU_COUNT; i++) {
function animateVU(ts) { function animateVU(ts) {
const t = ts * 0.001; const t = ts * 0.001;
vuBars.forEach(bar => { vuBars.forEach(bar => {
if (isPlaying) {
const h = bar._maxH * Math.abs(Math.sin(t * bar._speed + bar._phase)); const h = bar._maxH * Math.abs(Math.sin(t * bar._speed + bar._phase));
bar.style.height = Math.max(3, h) + 'px'; bar.style.height = Math.max(3, h) + 'px';
bar.style.opacity = 0.55 + 0.45 * (h / bar._maxH); bar.style.opacity = 0.55 + 0.45 * (h / bar._maxH);
} else {
bar.style.height = '3px';
bar.style.opacity = '0.15';
}
}); });
requestAnimationFrame(animateVU); requestAnimationFrame(animateVU);
} }
@ -919,15 +923,15 @@ function spawnNote() {
setTimeout(() => el.remove(), dur * 1000 + 100); setTimeout(() => el.remove(), dur * 1000 + 100);
} }
let isPlaying = false;
/* Spawn on every beat (500ms) with a 50 % chance of two notes */ /* Spawn on every beat (500ms) with a 50 % chance of two notes */
setInterval(() => { setInterval(() => {
if (!isPlaying) return;
spawnNote(); spawnNote();
if (Math.random() < 0.5) spawnNote(); if (Math.random() < 0.5) spawnNote();
}, BEAT_MS); }, BEAT_MS);
/* First note immediately */
spawnNote();
/* ============================================================ /* ============================================================
MUSIC INFO (called by QML via runJavaScript) MUSIC INFO (called by QML via runJavaScript)
============================================================ */ ============================================================ */
@ -936,8 +940,8 @@ function updateMusic(artist, title) {
const text = (artist && title) ? `${artist} — ${title}` const text = (artist && title) ? `${artist} — ${title}`
: (title || artist || '— —'); : (title || artist || '— —');
const playing = !!(artist || title); const playing = !!(artist || title);
isPlaying = playing;
document.querySelector('.robot-wrap').style.opacity = playing ? '1' : '0'; document.querySelector('.robot-wrap').style.opacity = playing ? '1' : '0';
document.querySelector('.vu-meter').style.opacity = playing ? '1' : '0';
if (el.textContent === text) return; if (el.textContent === text) return;
el.textContent = text; el.textContent = text;
if (playing) pickSkeleton(); if (playing) pickSkeleton();

9
plugin/contents/ui/main.qml
View file

@ -28,14 +28,15 @@ WallpaperItem {
Plasma5Support.DataSource { Plasma5Support.DataSource {
id: musicSource id: musicSource
engine: "executable" engine: "executable"
connectedSources: ["playerctl metadata --format '{{artist}}||{{title}}' 2>/dev/null || echo '||'"] connectedSources: ["playerctl metadata --format '{{status}}||{{artist}}||{{title}}' 2>/dev/null || echo '||'"]
interval: 2000 interval: 2000
onNewData: function(sourceName, data) { onNewData: function(sourceName, data) {
var raw = data["stdout"].trim() var raw = data["stdout"].trim()
var sep = raw.indexOf("||") var parts = raw.split("||")
var artist = sep >= 0 ? raw.substring(0, sep) : "" var status = parts[0] || ""
var title = sep >= 0 ? raw.substring(sep + 2) : raw var artist = status === "Playing" ? (parts[1] || "") : ""
var title = status === "Playing" ? (parts[2] || "") : ""
webView.runJavaScript( webView.runJavaScript(
"updateMusic(" + JSON.stringify(artist) + "," + JSON.stringify(title) + ")" "updateMusic(" + JSON.stringify(artist) + "," + JSON.stringify(title) + ")"
) )