pl8list gives where a preview cuts in (previewStart, a fraction of the full
track). The server keeps it and hands previews their start in seconds; the
card moves each comment by it and keeps the ones inside the clip. Tracks
crawled before this show none until their artist comes round again.
The rise animation blurred the bubble in and out and kept it under a filter and a drifting transform the whole time, so the text stayed soft. Now it only scales in, holds still with no transform, and slides up as it fades.
Each comment sits as a dot under the moment it was left at. When the music
gets there the dot pings and a bubble grows out of it on a spark, then drifts
up and fades; a mouse over a dot peeks at it. The server fetches the newest
60 comments from pl8list on demand and keeps them for 15 minutes. A setting
turns them off.
The drop grows spikes on a fixed lattice, raised by the bass line and by kicks
at the beat's spot on the rim, and throws a moving net of light behind it.
The first visit shows a welcome screen where one tap starts a guest
session; sign-in moves below it. Guests see a "sign in" pill, are
asked once to sign in after five likes or a first follow, and need
two taps to forget themselves.
Drops are found in the waveform and marked on it; "drop" and the d
key jump a bar before the next one. Long and dj-mix fades start on a
bar once the beat is locked. Radio sheets can be shared as /?r=handle.
The audio features now follow the bar, gaps before drops and the
wobble rate, and a new flare pass draws loops round the drop on each
kick, with a setting under visuals.
Feed, likes, artist, track and the session lookup run on four
read-only SQLite connections, so a slow feed no longer blocks writes.
Reads are capped at 120 a minute per user and the audio and image
proxy at 3000 a minute per IP. Session rotation happens once when
requests race, and the page, assets and legal pages skip the session
lookup. Events and follows for unknown tracks or artists return 404,
and radio only explores artists already in the catalogue.
The crawler queue is capped at 20k jobs, an empty home page counts as
a failure, and 25 failures in a row log an error that pl8list may
have changed its API. A guest who signs in with "stay connected" gets
up to 200 likes and follows saved to pl8list. The old Python server is
removed; it lives on in 54a436a.
"start listening" on the sign-in page makes a guest: a user with a negative
id and a session of its own, so the feed, likes, follows and radio work as
for anyone. Signing in with pl8list later moves the guest's plays, likes and
follows to the account. Signing out as a guest deletes it; guests whose
session ran out are purged hourly. New guests are capped at 10 per IP and
hour, and that limiter forgets IPs hourly. The privacy policy covers guests.
Back to the plain bold title, the drawn waveform and the system font from
before the metal look. The spiky drop and its glow, the pre-blurred
backgrounds, the --energy fix, ?debug=drop and the desktop layout stay.
On wide windows with a mouse the card grows with the window (--u), the
action rail sits beside the content, the header controls share one glass
capsule and up next is larger. The volume slider is a slim filled track
everywhere. The drop's canvas is capped at 2.6M pixels so the bigger drop
costs no more than it shows.
--energy is now set only on the art and the glow, and only when it changes,
so the card is no longer restyled every frame. The halo pulses through
transform and opacity, without forcing layout or paint. The card background
is blurred and darkened once on a small canvas, so the full-screen CSS blur is
gone. The action rings no longer use backdrop-filter, and neither do the mode
tabs and the up-next pill on phones. The chrome layer reads the layout only
after a resize or a font load. The drop's fragment shader skips the icon, the
ring and the frost while none of them shows.
That saves enough to render the drop at up to 1.5 canvas px per CSS px on
phones, up from 1. ?debug=drop shows fps, the worst frame and chrome draws per
second, refreshed once a second.
Letter faces reflected a studio that was black overhead and dark below the
horizon, so half of every letter sank into the dark page. The sky now runs from
mid grey to white, the horizon is a thin dark band, the floor brightens quickly,
and each line's face spans only the bright middle of the studio.
Small text clogged up under its side wall: the wall is half as deep and gone
below 20 px, and the shadow is set on its own, so small text and the logo keep
it as a dark outline. Text gets a third of the colour split at its edges; the
waveform keeps all of it. The title is a weight lighter and spaced a little
wider, and the logo spaced wider too.
The play/pause icon built a vec2[4] array in the drop's fragment shader. Some
phone drivers reject that with "no default precision defined for variable
'vec2[4]'", so the whole drop failed to compile and phones only ever showed the
plain artwork. The icon's quad is now written out edge by edge.
Film grain is back, but under the page instead of over it: on each card it lies
over the blurred background and the glow, below the content and the actions,
and on the page itself for screens without a card.
The drop gets thorns, sharp points that shoot out on snares, kicks and drops; a
stronger split of the art's colours; oil-slick fringes and a per-channel
fresnel on the rim; a thin hot edge that flares on hits; and a larger halo.
A distance transform turns the glyphs and waveform bars into a height field
with bevelled edges and some depth, and a shader lights them as metal: a
studio of softboxes, a dark horizon and the card's colour and art as the
floor, colour split at steep edges, a key light that follows the pointer
(drifts on phones) and flares on kicks, and a sweep over each new title.
One offscreen context serves every plate. The title turns slightly towards
the pointer. Display text uses Bruno Ace SC, bundled; "simple" visuals keep
plain text and the drawn waveform.
Feed modes move into tabs in the bar; likes, history, filters and settings,
and account open as one kind of sheet: a drawer on wide screens, a bottom
sheet with a drag handle on phones, with a scrim, Esc, a focus trap and
focus restore.
Cards get an artist avatar, follow and radio pills, a "new" chip, counts
under round action buttons, an up-next pill and a redrawn waveform with
rounded bars, a reflection and the buffered range. The start overlay names
the track behind a big round play button.
New: undo on dislike, a searchable likes list that plays as a queue
(in order or shuffled), a local history of what played, deep links to a
track (?t=handle/slug), a sleep timer, adjustable crossfade, bass boost,
wheel up (w or a long press on the drop) and more keys.
An undislike event cancels a dislike in the taste profile, for the undo on the
dislike toast. GET /local/track?handle=&slug= returns one known track, so a link
into the app (/?t=handle/slug) can open on it.
- A failed likes request shows the error in the panel instead of an empty list.
- A failed sign-out says why instead of doing nothing.
- Long toasts, like a copied link, wrap instead of running off narrow screens.
- Keys no longer act on the feed behind the help; ? still toggles it, and focus
goes into the help and back to where it was.
- Phones reach the help from the account panel; the bar has no room for ?.
- Cards next to the current one are inert, so Tab no longer walks into buttons
that are off screen.
- Keyboard focus is visible everywhere, and panels use the shared colour and
radius tokens.
The kick wave in the vertex shader squared a negative number with pow(), which
GLSL leaves undefined. Mesa returns NaN there, so on Linux the drop's position
pinned to the clamp: it stayed a plain round sphere without wobble, and its
normals split it into a dark yin-yang. The squares are written out now, and the
normal comes from the slope of the displacement instead of two whole positions.
The play/pause icon is one shape whose corners move: each pause bar turns into
half of the play triangle, with a small swing in between, instead of two icons
faded over each other. It sits on a disc of frosted artwork with a lit rim, and a
ring round it shows the track's progress, or runs while the track loads, which
replaces the flat spinner. The surface calms down under the icon gradually
instead of jumping flat, a double-tap no longer flickers the icon, and a mouse
resting on the playing drop shows the pause bars faintly.
Also:
- Low-density desktop screens render the drop at twice the resolution.
- Quality steps follow the display's own frame rate and step back up again.
- A lost WebGL context brings the drop back once it is restored.
- A paused drop keeps breathing at a low frame rate on desktop.
- Without Web Audio (iOS) jumps in the waveform count as kicks, so the drop lands on drops there too.
- Artists without an image get their own colour from their name, so their drop no longer sinks into the page.
- z toggles zen mode: just the drop, bigger, and the music.
The infinity sign becomes a dubplate: a wobbling riddim groove around a red label
with a rewind arrow, after the soundsystem rewind where a tune the dance loves is
pulled back and run again. Icons, manifest, titles, legal pages and the README use
the new name; cookie names, storage keys and the link key info keep pl8inf so no
one is signed out or loses settings.
The raised icon was cut into a mesh too coarse for its edges and did not line up
with the icon painted over it, so it came out doubled and jagged, and melting one
shape into the other went through blobby in-betweens. The icon is now only painted:
crisp and white on a dark disc like the page's round buttons, still turning with the
drop, and pause and play fade into each other as the new one grows in.
Some browsers only offer to install an app with a service worker. A minimal one at
/sw.js (served from the root so it covers the whole app) caches nothing and only
shows a short offline note instead of the browser's error page. The manifest gets
an id.
The flat play/pause badge and the flash icon sat on top of the drop as two separate
symbols. With the drop on, both are gone: the icon is stamped out of the drop's front
instead, turns with it and catches the light. Pausing pops up the bars, which melt
into the play triangle; playing melts it back into the bars as they fade.
On touch only a clearly sideways drag turns the drop now, so diagonal swipes turn the
page again. A mouse released outside the window, or after turning the drop, no longer
leaves the pager dragging. The halo behind the drop drew a hard ring at the art's edge;
it is a soft radial glow now.
The rim hue drifted with play time until it left the card's colour altogether, so a
pink card could carry a green drop. It now only sways around the accent. The edge
fades into the page, a halo in the accent pulses behind it like the plain artwork's
glow, the surface reflects the accent from above, and the title and the rest of the
card sit on top where the drop spills over them.
Dragging the drop turns it (sideways only on touch, where up and down turn the page).
A flick keeps it spinning; it slows down and a weak spring wobbles it back to face the
front. Spun fast it flattens a little and sloshes, and the artwork blurs into colour
where it is seen from the side. A spin is not a tap, so it does not pause.
Two new features follow the bass line itself: its envelope against the last moment,
which rises and falls with every wub, and how open its filter is (spectral centroid
of the bass and mids). Each wub swells the drop, and as the filter opens its surface
crinkles and spikes like before. Every layer keeps a floor, so the drop never goes
still and nothing snaps in from nothing; riddim gets its soft terraces back. Kicks
still make it jump.
The terraces, snare spikes and fine ripples creased the surface into jagged corners.
The drop now always moves in broad, smooth lobes, and the strongest kick and bass
hits (weighed by prominence against the last seconds) throw it up on a spring: it
stretches as it rises, squashes as it lands and jiggles back. Snares pump its size.
It also swells in from the flat artwork more slowly.
The radio button (r) opens a sheet with the artist, their tags and their closest
neighbours instead of switching the feed at once; tapping a neighbour walks the
artist graph. Starting jumps to the radio's first track, the top-bar chip shows the
station, each radio card says why it is there, and an end card offers the way back
when the radio runs dry.
GET /local/artist feeds the sheet and starts crawling a new artist's neighbourhood
(at most every 10 minutes per artist). Artist-radio tracks carry why: seed, related,
or via the neighbour that leads to them.
The bass meter sat at full scale through every dubstep drop, so the glow froze.
features.ts now tracks band levels against their recent range, kick and snare
onsets from spectral flux, wobble in the mids, and drops, and the pulse follows
the kicks.
The playing card's artwork becomes a WebGL2 liquid drop that moves with those
features; tempo, tags and key set its character. Falls back to the plain artwork
without WebGL2, with reduced motion, or with visuals set to simple (v).
?debug=audio shows what the tracker hears.
Tracks get tags from their title, description, artist name and BPM
(styles such as riddim, versions such as VIP/dub/flip, and tempo), stored
in track_tags and shown on cards. Related pages the crawler reads are kept
in track_related, which links artists to each other.
The feed takes ?mode=: riddim (140 BPM, riddim artists and their graph
neighbours first), fresh, deep cuts, and an artist radio that plays an
artist and the artists around them. Opening a radio crawls that artist's
related pages first. The crawler searches riddim-adjacent terms first.
The filters panel picks the feed, each card has a radio button (r), and a
chip in the top bar returns to the normal feed.
The front end moves to web/ (Vite, TypeScript, no framework) and is built
into web/dist, which the server embeds. hls.js is bundled from npm and
loaded on demand instead of vendored.
The feed is a custom pager instead of CSS scroll snapping: drag and flick
with a spring that keeps the finger's speed, a rubber band at the ends,
one page per wheel or trackpad gesture, and only three cards in the DOM.
Playback uses two decks. The next track is buffered shortly after the
current one starts and tracks crossfade through a Web Audio graph; on iOS,
where that would break lock-screen playback, they switch with a cut. An
analyser drives a bass pulse of the artwork and its glow, and each card
takes its accent colour from the artist image. Styles start from design
tokens and respect reduced motion.
Docker gets a Node build stage; legal pages use their own small stylesheet.
At sign-in users can choose to stay connected to pl8list on that device.
The pl8list session is then stored in the device's session row, encrypted
with XChaCha20-Poly1305 under a key derived from the device's local token
(only the browser has it) and a server key kept outside the database. It
is only decrypted during that device's own requests, re-encrypted when the
token rotates or pl8list sends a new cookie, and deleted when pl8list
rejects it.
Every sign-in now syncs the personal feed, saved tracks (imported as likes)
and saved artists (imported as follows). Connected devices resync on use
every six hours and push new likes and follows to the pl8list library with
addOnly, so nothing is ever removed there. Without the connection, the
resync button runs the email-code sign-in again.
Artists can be followed from each card (f); follows feed the ranker. The
account menu shows the sync state, resync and disconnect. Privacy policy,
export and account deletion cover the new data.
New axum server in backend/ with the same HTTP API and database as the
Python one. The pl8list session is only held in memory during the feed
crawl and logged out afterwards. Local sessions use a __Host- cookie,
30-day idle expiry and weekly token rotation; the old cookie is migrated.
The audio and image proxy only accepts known parameters, fixes the content
type, follows redirects only to pl8list's file host and caches segments and
images on disk. Strict security headers, origin checks on POST, body and
concurrency limits.
/impressum and /datenschutz are rendered from env variables. The account
menu offers data export, sign out on all devices and account deletion.
hls.js is self-hosted and artist images are proxied, so the browser only
talks to this server. The Docker image builds a static binary on scratch.
Take the client IP from the right-most X-Forwarded-For entry so a spoofed
header no longer resets the per-IP limit. Cap resends per login, count them
against the per-email limit, add a server-wide login mail limit and cap
pending logins at 500. Count code attempts under the lock.
Log the pl8list session out upstream once the feed has been read, also when
reading fails or the account has no handle, and always drop it from memory.
- Tap/click a track to play or pause, double-tap/double-click to like
with a heart burst; any key or tap starts playback
- Media Session API: lock-screen, notification and headphone controls,
with next/previous working while the screen is locked
- Drag the waveform to seek, hover shows the time
- "Not for me" button feeds a dislike signal into the ranker
- Share button (native share sheet or copy link)
- Likes newest first, each playable right away
- Filters remembered per browser, clear button, active indicator
- Panels close on outside click or Esc; help overlay on "?"
- Buffering spinner, paused badge, toast messages, first-run hint
- Installable as an app (manifest and icons)
- Refreshed README screenshots and controls
Endless TikTok-style feed over pl8list's Remix loaders. A guest crawler
builds a shared catalogue; a per-user ranker learns from likes, full
listens and skips. Users sign in with pl8list's email code; only a hash
of the local session token is stored. Ships as a hardened Docker image
with a Traefik override for pl8.narl.io.
nvrl