mirror of
https://github.com/Shik3i/KoalaSync.git
synced 2026-08-28 11:37:16 +00:00
Polish demo film, bamboo forest, popup a11y, and step-1 toast
- Demo mockup video: drifting clouds, shooting star, moon craters, bird flock, valley mist band, floating lantern instead of bouncing ball, stronger cinematic vignette - Player controls: play/pause glyph, duration, buffered range, volume, HD badge, fullscreen icon - Bamboo background: two faint centre trunks, segment rings on far stalks, wider near stalks with extra leaf, smaller blurred layers (240% -> 200%) and reduced blur radii for cheaper compositing - Step-1 illustration: invite toast floats fully below the popup card - Extension popup: label/for associations for all settings controls - Demo video select: drop invalid inline SVG inside <option> Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
+6
-6
@@ -820,16 +820,16 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const midOffset = (t * -24) % 160;
|
||||
const foreOffset = (t * -48) % 160;
|
||||
|
||||
// Bouncing ball logic (bounce Y is computed as parabolic arc)
|
||||
const bouncePeriod = 0.8;
|
||||
const bounceProgress = (t % bouncePeriod) / bouncePeriod;
|
||||
const bounceHeight = 16;
|
||||
const bounceY = 4 * bounceProgress * (1 - bounceProgress) * -bounceHeight;
|
||||
|
||||
// Floating lantern: slow vertical bob + softer horizontal sway on
|
||||
// detuned periods, so the drift never repeats exactly in sync
|
||||
const bounceY = Math.sin((t % 5.2) / 5.2 * Math.PI * 2) * 3.5;
|
||||
const lanternX = Math.cos((t % 8.6) / 8.6 * Math.PI * 2) * 4;
|
||||
|
||||
tab.root.style.setProperty('--scroll-back', backOffset.toFixed(2) + 'px');
|
||||
tab.root.style.setProperty('--scroll-mid', midOffset.toFixed(2) + 'px');
|
||||
tab.root.style.setProperty('--scroll-fore', foreOffset.toFixed(2) + 'px');
|
||||
tab.root.style.setProperty('--bounce-y', bounceY.toFixed(2) + 'px');
|
||||
tab.root.style.setProperty('--lantern-x', lanternX.toFixed(2) + 'px');
|
||||
};
|
||||
|
||||
const updateSyncUI = () => {
|
||||
|
||||
Reference in New Issue
Block a user