Skip to content

Getting Started

Kawaiipantsu edited this page Oct 2, 2026 · 6 revisions
XXC / THUGS(red) — Strudel Sandbox. Live code, pattern, sound, signal.

A live-coding workstation for code, sound, and signal.

Write real Strudel. Perform a set. Shape a sample. Record the master output. Publish a score, read someone else’s code, and make a remix.

Live studio Strudel PHP TypeScript License

Apache + PHP in production · Node for builds · music happens in your browser

Open the studio · Explore the library · Read the wiki · Join discussions

Contents

The workstation

Area What it does
Editor Official Strudel CodeMirror integration: mini notation, event highlighting, sliders, inline visuals, completion, folding, search, multiple files and a command palette.
Audio Official Strudel + SuperDough, independent orbits, master control, measured stereo/orbit levels and PCM recording through an AudioWorklet.
Signal workbench Scope, FFT spectrum/spectrogram, stereo phase plot, pattern events, piano roll, spiral and geometry. Background animation follows actual audio and events.
Visualizer Nine generated scenes, 146 VJ loop clips in three packs, four overlay layers and a fullscreen Music Video mode with automatic scene changes. Optional studio background and PNG snapshots.
Sample Lab Microphone recording, upload, waveform selection, crop, cut, duplicate, reverse, fades, normalize, gain, looping, resampling and WAV export.
Banks Search installed and custom banks, browse voices and aliases, and insert bank names, modifiers or playable examples into the editor.
Recording Uncompressed float PCM source; server exports WAV, 320 kbps MP3 and 256 kbps AAC/M4A with metadata and compatible PNG artwork.
Projects Local crash recovery, server autosave, revision checkpoints, private/unlisted/public visibility, ZIP bundles and remix provenance.
Library Search, tags, original examples, collapsed source inspection, audio previews and server-rendered share pages with a 720p VJ player, fullscreen and animated hexagon background. Public sitemap included.
Admin Settings, themes, library moderation, metadata, media approval, sample packs, author overview, diagnostics and redacted activity logs.

The visual language brings together THUGS(red), XXC / WAF, and ASCIITRON: JetBrains Mono, ASCII framing, bracketed status text, thin rules, and restrained red. Light mode uses warm engineering-paper surfaces. The README banner was supplied by the project owner.

Inside the studio

Dark studio with live Strudel playback

Light / engineering paper theme

Light studio with live Strudel playback

Fullscreen generative music video

Live music visualization driven by Strudel output

Choose generated scenes or your local VJ loop packs in the Visualizer. Visualizer guide · VJ loop guide.

Start making sound

  1. Open strudel.xxc.dk. The editor is the homepage.
  2. Press Play. Safari may ask for one more Enable Audio click inside the editor.
  3. Change a pattern. Ctrl/Cmd + Enter evaluates a selection or logical block. Scores with anonymous $: tracks update as a whole file so repeated updates replace their voices. Named tracks such as drums: support independent block updates.
  4. Use Update for the whole file and Ctrl/Cmd + . to hush.
  5. Ctrl/Cmd + S saves. Ctrl/Cmd + P opens files; Ctrl/Cmd + Shift + P opens commands.
  6. Record a take, make a code cover, and publish through Export / Share.

Start empty: click New + in the top bar. It preserves local or edited work, then opens a private Untitled project with one blank main.strudel file. Unchanged library scores stay untouched. Use the Recent projects folder button on the left to reopen saved work, or find Project: New empty workspace in the command palette. Click the project title to rename it.

setcps(120 / 60 / 4)

$: s("bd*4, [~ sd]*2, hh*8").gain(.4).orbit(0)

$: n("0 ~ 4 7 ~ 3 2 ~").scale("C4:minor")
  .s("triangle").room(.35).gain(.2).orbit(1)
  ._pianoroll()

The default Strudel banks are installed locally: 1,063 sounds / 6,325 audio files, including Roland drum machines, Salamander piano, Uzu drums (misc included), VCSL, mridangam, wavetables and the full Dirt collection. The original procedural drums remain available as xxc_bd, xxc_sd, xxc_hh, xxc_oh, xxc_cp and xxc_rim, alongside tone and xxc_wt. Browse, preview and insert sounds in SAMPLES. The 125 official gm_* General MIDI instruments are also registered; soundfont audio loads from the upstream host when first played. External maps still use the official samples() and tables() APIs. Sample guide and attribution.

Architecture

flowchart LR
    UI[React / TypeScript studio] <-->|bounded messages| Runtime[Opaque-origin iframe\nOfficial Strudel + CodeMirror]
    Runtime --> Audio[SuperDough / WebAudio]
    Audio --> Signal[AudioWorklet capture\nAnalyser / orbit meters]
    Signal --> UI
    UI --> API[Apache / PHP JSON API]
    API --> DB[(MariaDB)]
    API --> Redis[(Redis rate limits / locks)]
    API --> Media[Private storage / FFmpeg / librsvg]
    API --> Pages[Share pages / library / sitemap]
Loading

The frame is our custom editor/runtime; it does not embed the stock Strudel website. Evaluated code has no same-origin privilege and receives no session, CSRF, database, or administrator credentials. Public scores do not run when viewed or opened.

Pinned engine versions

Package Version
@strudel/core, mini, transpiler, draw, tonal, xen 1.2.6
@strudel/codemirror, webaudio, midi, soundfonts 1.3.0
superdough 1.3.0
@strudel/hydra, gamepad, serial 1.2.6
@strudel/osc 1.3.2
hydra-synth 1.4.0

All direct versions and the transitive dependency graph are locked. See integration details for the small WebKit output-channel and MIDI timer compatibility transforms.

Build and deploy

This checkout is deployed on an existing Apache vhost whose document root is html/. The upstream proxy terminates TLS. The canonical public URL is always https://strudel.xxc.dk.

# Initial installation on the prepared XXC host (root required)
./scripts/setup.sh

# Future updates
npm ci --ignore-scripts
./scripts/migrate.sh
./scripts/build.sh
./scripts/package-source.sh
./scripts/healthcheck.sh

# Verification
./scripts/test.sh

The setup script calls xxc-db-setup strudel only when private configuration is missing. Never rerun database provisioning to rotate a password. Node serves no production requests. No application daemon is required.

Location Purpose
html/ Apache public files and PHP entry points
frontend/, src/, public/ Frontend source and original static assets
backend/ PHP API, storage, cover and media logic
config/secrets.json Private database configuration and signing key; excluded from Git
storage/ Private uploaded/generated audio, artwork, sessions, temporary files and logs
docs/ADMIN_CREDS.md One-time admin credential, mode 0600; excluded from Git
LICENSES/ License texts and pinned dependency inventory

Security and ownership

  • Administrator access: /admin/. Credentials are generated during installation and hashed with Argon2id.
  • Anonymous project ownership uses a random, persistent HttpOnly browser cookie. Export a ZIP before clearing browser data or changing devices.
  • Shared code executes only after an explicit Play/Evaluate action, inside a sandbox without allow-same-origin.
  • Main/admin CSP excludes dynamic evaluation. The sandbox alone permits the module/evaluation formats required by upstream Strudel.
  • Uploads are inspected by MIME and FFprobe, use generated internal names, and remain outside the web root. Controlled delivery supports byte ranges.
  • Redis backs rate limits and conversion locks. Prepared statements, CSRF checks, optimistic save versions, bounded media jobs and strict session cookies protect the API.
  • Sample/audio uploads have owner quotas and configured size/duration limits. A recording stops at the earlier duration or PCM byte limit.

Read SECURITY.md before changing the iframe, proxy, media routes or session configuration.

Compatibility

Core playback, PCM recording, sample editing, persistence and responsive UI are exercised in Chromium and Playwright WebKit. Real MIDI hardware, microphones, serial devices and audio output hardware still need verification on the user’s machine. WebKit testing on Linux does not cover every Safari/iOS hardware configuration.

Hydra needs WebGL. MIDI needs browser support and an explicit connection in Controls. OSC needs an external bridge; no Node/OSC production service is installed. WebSerial is detected but isolated runtime permissions may prevent native access. External soundfonts and sample maps retain their own licenses and CORS requirements. This is an online-first studio with a best-effort offline shell, not a guarantee that uncached external samples will work offline.

Verification

48 browser tests · 99 backend/media checks · 10 unit tests passed. The suite exercises actual signal output, captured PCM, codecs, permissions and sharing on the deployed HTTPS origin. See the verification report for scope and hardware boundaries.

Documentation

Guide Contents
Installation Exact server setup and prerequisites
Architecture Runtime, trust boundaries, persistence and rendering
Operations Deployment, backup, cleanup, log rotation and recovery
Administrator guide Moderation, settings and credential rotation
API Routes, authorization, errors and limits
Security Execution isolation and storage policy
Strudel integration Packages, upstream APIs and compatibility
Audio engine Routing, PCM, meters and encoding
Sample banks Default sounds, external maps, installation and attribution
Visualizer Live music video, scenes, overlays and fullscreen
VJ Loops Video packs, playback, storage and local import
Storage Ownership, sample URLs, bundles and retention
Third-party licenses Complete pinned inventory and notices
Troubleshooting Playback, Safari, permissions and recovery

Contribute

Use Discussions for scores, sample-making techniques, wishes, and questions. Report reproducible defects through Issues. Include browser/OS, the smallest useful score, and the relevant Output/Problems messages. Do not include credentials or private sample links.

See CONTRIBUTING.md. Changes to the audio runtime need browser playback tests; changes to access control need negative authorization tests.

Licensing

The application is AGPL-3.0-or-later, consistent with the official Strudel integration guidance. Network users can access the complete application source here and through the studio’s source link. License notices, build scripts and the dependency lock are included. Operators of modified deployments must provide their corresponding source as required by the license.

Original bundled sample waveforms and example scores are CC0-1.0. Third-party samples, packages, fonts and icons keep their respective notices. Sample attribution and published license status are recorded separately. User compositions and uploaded media remain subject to their owners’ chosen rights; publishing does not silently assign a new license to them.


XXC / THUGS(red) · MAKE NOISE · SHARE TOOLS · KEEP IT OPEN

Clone this wiki locally