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

Fix JS error and add skeleton preloading

Browse source 
Remove dead EQ bar code referencing elements removed with the CSS robot.
Preload all APNG files on startup so skeleton switches are instant.

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

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

@ -698,7 +698,7 @@ html, body {
<!-- ===================== ROBOT ===================== --> <!-- ===================== ROBOT ===================== -->
<div class="robot-wrap"> <div class="robot-wrap">
<img src="skeleton6.apng" class="skeleton-gif" alt="skeleton"> <img src="skeleton4.apng" class="skeleton-gif" alt="skeleton">
<div class="robot-shadow"></div> <div class="robot-shadow"></div>
</div><!-- .robot-wrap --> </div><!-- .robot-wrap -->
@ -848,41 +848,6 @@ resizeFloor();
requestAnimationFrame(drawFloor); requestAnimationFrame(drawFloor);
/* ============================================================
CHEST EQ BARS (JS-animated for smooth randomness)
============================================================ */
const EQ_COLS = 7;
const EQ_COLORS_T = ['#00ffcc','#00eebb','#00ddff','#0099ff','#0055ff','#00ddff','#00ffcc'];
const EQ_COLORS_B = ['#ff44aa','#ff55bb','#ff66cc','#ff44aa','#ff66cc','#ff55bb','#ff44aa'];
function buildEqRow(container, colors) {
const cols = [];
for (let i = 0; i < EQ_COLS; i++) {
const d = document.createElement('div');
d.className = 'eq-col';
d.style.background = colors[i];
d.style.height = '50%';
d._phase = Math.random() * Math.PI * 2;
d._speed = 3 + Math.random() * 5;
container.appendChild(d);
cols.push(d);
}
return cols;
}
const eqTopCols = buildEqRow(document.getElementById('eqTop'), EQ_COLORS_T);
const eqBotCols = buildEqRow(document.getElementById('eqBot'), EQ_COLORS_B);
function animateEQ(ts) {
const t = ts * 0.001;
[...eqTopCols, ...eqBotCols].forEach(col => {
const pct = 15 + 85 * (0.5 + 0.5 * Math.sin(t * col._speed + col._phase));
col.style.height = pct + '%';
col.style.opacity = 0.5 + 0.5 * (pct / 100);
});
requestAnimationFrame(animateEQ);
}
requestAnimationFrame(animateEQ);
/* ============================================================ /* ============================================================
VU METER (bottom of screen) VU METER (bottom of screen)
@ -999,7 +964,10 @@ setInterval(nextDanceStyle, 8000);
============================================================ */ ============================================================ */
const SKELETONS = ['skeleton.apng', 'skeleton2.apng', 'skeleton3.apng', 'skeleton4.apng', 'skeleton5.apng', 'skeleton6.apng']; const SKELETONS = ['skeleton.apng', 'skeleton2.apng', 'skeleton3.apng', 'skeleton4.apng', 'skeleton5.apng', 'skeleton6.apng'];
const skeletonImg = document.querySelector('.skeleton-gif'); const skeletonImg = document.querySelector('.skeleton-gif');
let currentSkel = 5; let currentSkel = 3;
// Preload all skeletons so switches are instant
const _preloaded = SKELETONS.map(src => { const i = new Image(); i.src = src; return i; });
function pickSkeleton() { function pickSkeleton() {
if (SKELETONS.length < 2) return; if (SKELETONS.length < 2) return;