Rhythm Game Source Code: Note Charts, Timing and Adding Songs
How Riffvolt stores 12 tracks and 48 charts, where timing and scoring are decided, and what it takes to add a song of your own.
Rhythm game source code is really two things: the code that judges timing, and the data that says when each note arrives. Buyers almost always want to change the second, because new songs are what make a rhythm game theirs. Riffvolt, our four-lane rock rhythm template, keeps the song list in one manifest file and every note chart in its own file, so adding a song is a data job with a clear checklist.
This guide walks through the package: what it plays, where timing and scoring live, how to add a song, how to rebuild and host it, what the licence allows, and what the edition leaves out. File names come from the buyer guide that ships with the game.
One fact to keep in mind from the start: unlike some of our templates, Riffvolt needs a rebuild after you change the source or add songs. Hosting the supplied game folder needs nothing but a static web host.
What this rhythm game source code plays
Riffvolt is a finished four-lane rock rhythm game for the browser. Players hit notes in time, hold long notes to the end, bend them with the whammy and fill a ROCK gauge that starts overdrive, a light show that adds no points and ends on any miss. Timing accuracy builds score and combo.
- 12 full tracks, each with Easy, Normal and Hard charts, plus Rock God, which opens after the tour: 48 note charts in total.
- A tour through four venues (Garage, The road, Festival and Arena), three songs each. Stars from the first two open the encore, and finishing the encore opens the next venue, with story scenes and cosmetic rewards such as trails and frames.
- Free play: any song at any difficulty, with personal records saved song by song in the browser.
- Controls: D, F, J and K by default, tapping the lanes on a touch screen, or a gamepad. Key bindings are in Settings.
- Comfort: audio calibration for the offset, which helps with Bluetooth headphones, reduced motion and a photosensitive mode that tones down flashes and lightning.
- 14 interface languages.
See the Riffvolt listing, demo and manuals
How the files are organised
The download holds game/ (the deployable files), source/ (the TypeScript project), documentation/ (illustrated manuals in English and Portuguese) and licenses/ (third-party notices). Inside source/, the split between song data and game logic is clean.
- public/manifest.json: the song catalogue, with each song's duration, audio version and chart paths.
- public/charts/: the 48 note charts.
- public/audio/: the track recordings.
- src/core/chartValidate.ts: chart schema and timing validation.
- src/core/judge.ts: timing judgments.
- src/core/scoring.ts: score and combo rules.
- src/game/campaign.ts: tour progression.
- src/game/session.ts: a song's lifecycle and the result calculation.
- src/i18n/locales.ts: the 14 interface dictionaries.
- src/net/localRecords.js: local personal records.
- src/ui/style.css: interface and responsive layout.
Because the judge and the scoring are separate files, you can make timing windows stricter or more forgiving without touching how points add up, and the reverse. That is the split to look for in any rhythm code.
Adding your own song, step by step
This is the change rhythm-game buyers ask about first. There is no chart editor in the package, so the charts are written as data, and the manual lists exactly what each file needs.
- Put the recording in public/audio/. Use only audio you hold the rights to for your end product.
- Create one chart per supported difficulty in public/charts/. Each chart needs the matching songId, difficulty, audioVersion, offset and the notes in order.
- Add the song to public/manifest.json with a unique id, duration, BPM, theme, audioVersion and the chart paths.
- Check each chart with the validator in chartValidate.ts.
- Play the whole track at every difficulty to confirm the sync. The validator checks structure and timing rules, not whether a note feels right.
- Rebuild, then upload the new build.
If you want a whole new soundtrack rather than one extra song, plan the work per chart: 12 songs at four difficulties is 48 charts, and each one deserves a full play-through before release.
Rebuilding and what else to change
Node.js 24 LTS is recommended. Inside source/, run npm ci, then npm run typecheck and npm run build, and publish only the contents of dist/. npm run preview serves the local build for inspection. Do not upload node_modules/. Vite uses a relative base, so the build works in a subfolder. The delivered runtime is formatted for reading; the manual asks you to keep minify:false and cssMinify:false when you rebuild, so the next person can still read it.
- Brand: colours and layout in src/ui/style.css, plus your logo. White label is allowed, so your brand can replace ours.
- Texts: src/i18n/locales.ts, for the languages you ship.
- Tour: the order of venues and what unlocks what, in campaign.ts.
- Difficulty: timing windows in judge.ts, then score and combo rules in scoring.ts.
- Songs: last, because each new chart needs a full play-through.
Back up before editing, change one feature at a time, and test the menu, a song, pause, the result screen and a reload after each change. Keep item ids and save keys stable so existing players keep their records.
Hosting it, or embedding it in a portal
Upload the contents of game/ to a folder on your HTTP(S) host, keep the relative paths, and open the address. No PHP, database or account is needed. Do not open index.html via file://; for a local test, run python -m http.server 8765 inside game/.
- Browser needs: JavaScript, ES modules, Canvas 2D and Web Audio.
- Browsers unlock audio only after the first tap or click, so a silent first screen is normal.
- In an iframe, allow fullscreen and autoplay.
- Serve .js with a JavaScript MIME type, never as text/plain.
- All runtime assets, fonts and libraries are inside the build. There is no mandatory CDN, but this is not an installable offline app.
Saves belong to the browser origin, so moving the game to another domain starts players fresh. This edition uses its own save keys, separate from our portal editions. Native app projects are not included; a store release is separate work.
What the edition does not include
Riffvolt is the local browser edition. It has no online rooms or multiplayer, no online ranking or shared leaderboard, no advertising SDK or account, no chart editor, no native apps and no hosting. Personal records and tour progress stay in the player's browser.
If a music game fits your catalogue, two other timing-based templates of ours may fit beside it.
Pinloop: a one-button timing arcade game with 30 targets
Ricopop: a ricochet arcade game with 50 levels
Licence and price
Riffvolt lists at $49. Until 30 November 2026 the Black Friday promotion takes 15% off, so it costs $41.65, and buying two or more templates in one order adds a 5% to 20% bundle discount. The licence is perpetual and non-exclusive, for one end product, yours or one client's. You may change the code, art and audio, replace our brand with yours, and offer the game free or with ads. Use the included tracks as part of that end product; you may not resell the template, its code or its assets on their own. Six months of support are included, or twelve with the extension; new songs, integrations and hosting are quoted separately.
FAQ
Can I add my own songs to the rhythm game source code?
Yes. Add the audio, one chart per difficulty and an entry in public/manifest.json, validate the charts, play them through, then rebuild. A chart editor is not included.
Do I need Node.js to use Riffvolt?
Not to host the supplied game folder. Node.js 24 LTS is recommended only to rebuild after changing the TypeScript or adding songs.
Does it work with touch screens and gamepads?
Yes. Players can tap the lanes or use a gamepad, and controls are set in Settings. Performance depends on the device, so test the ones you target.
What about Bluetooth headphones and latency?
Settings include audio calibration, which sets the audio offset and helps with Bluetooth headphones.
Is there an online leaderboard?
No. Personal records are saved per song and difficulty in the player's browser. There are no remote opponents or shared rankings.
Who should buy it
Riffvolt suits a portal or site that wants a music game in its catalogue, a studio delivering a branded rhythm game to one client, and a developer who wants to read how a Canvas 2D and Web Audio game judges timing in TypeScript. It is a weaker fit if you need a visual chart editor for non-developers or online competition; both are custom work.