Song changes look cleaner on stream
When the track changes, the widget now waits until the new cover art and its colors have loaded before it switches. No more blank square or wrong color for a split second between songs.
Animations and transitions
Every element can now animate on its own, with one effect for each of four moments:
- Widget load: when the browser source first shows up
- Song change: when a new track starts
- Playing and Paused / stopped: when playback starts or stops
Built-in effects: Fade, Slide, Pop, and Blur for anything. Zoom, Tilt, and Flip for cover art. Letter fade, Letter rise, and Letter blur for text, which animate one letter at a time (emoji too).
You can tune the duration, delay, direction, distance, and easing (spring, overshoot, elastic, and more). Hit preview in the toolbar to watch every animation play without waiting for a song to change.
Want something custom? Build your own effect with start and end frames, paste a CSS @keyframes rule, or write it in JavaScript. The three starter presets come with motion already set up, so they're a good place to start.
Proper layers
- The element list in the sidebar now runs front to back. Drag to reorder, or select an element and use Alt + Up/Down.
- Every element's settings have a new Layers section with drag and arrow buttons. It replaces the old Layer slider.
Canvas
- The selection outline is now marching ants in the inverse of the element's color, so you can see it on any background.
- A resize grip shows up at the corner nearest your mouse.
- Alignment ghosts for nearby elements now show while you move things, not just while you resize.
Editor
- Cleaner sidebar top: one lock button for Last.fm access, one copy-link button, and a text field showing your widget link.
- New Widget settings button under the element list.
- Sliders and switches got rebuilt. Dragging is smoother, values snap to round numbers, and holding Shift while dragging steps in fixed amounts.
- The "When paused" switch has icons now, and it's also on the pause symbol's settings. Elements hidden while paused show a crossed-out eye instead of being grayed out.
- Every help tip has a diagram now.
- New accent color.
Behind the scenes
The server handles slow Last.fm responses better, and there are a bunch of security and stability fixes.
Your existing widget links still work, and if you used the old song-switch animation, it carries over. If you don't see the changes, refresh your browser source in OBS (right-click > Refresh cache of current page).
Editor:
https://fast.jamlog.lol
Bugs or ideas:
https://github.com/oyuh/music-widget/issues
