RoadAudio

RoadAudio

The sound of a road war, made on the fly with Web Audio. No files to load.

What you hear

• the engine, with a pitch that climbs through three gears as you speed up, and a brighter tone under throttle;
• gun cracks, Gunner shotgun booms, missile whooshes, and the splat of oil and the puff of smoke;
• explosions: a noise rumble that dies away over a low thump;
• metal on metal for rams and crashes, and a ping off armour;
• a tyre squeal while your car slides;
• the bomber's rotor chop while one is up;
• a police siren while a patrol car chases you, louder as it gets close;
• a chime in the weapons truck.

Use it in a scene

{
  "Game": {
    "components": {
      "RoadAudio": { "player": "Player", "volume": 0.7, "reach": 140 }
    }
  }
}

Starting the sound

Browsers only let a page start audio during a user gesture. The audio is set up on the first key press, click or tap, inside that gesture. Keys reach it as keyboard.keydown events, so the scene needs KeyboardInput; a click or a lifted finger is caught on the page itself, so a HUD's START button and a phone start the sound too.

M mutes and unmutes. While the world is paused, all sound fades out.

Engine in three gears

export function engineVoice(speed: number, throttle: number, topSpeed: number): EngineVoice {
  const f = Math.max(0, Math.min(1, Math.abs(speed) / Math.max(1, topSpeed)));
  const gears = 3;
  const g = Math.min(gears - 1, Math.floor(f * gears));
  const inGear = f * gears - g; // 0..1 within the gear
  const freq = 42 + g * 9 + inGear * 34;
  return {
    freq,
    cutoff: 380 + throttle * 900 + f * 700,
    gain: 0.045 + throttle * 0.035 + f * 0.02,
  };
}

Each gear is a third of topSpeed. Inside a gear the note climbs 34 Hz. At the next gear it drops back, but each gear starts 9 Hz higher than the last. With the default top speed of 52 m/s:

The System plays that note on two saw waves, one tuned a hair sharp so the pair beats like an engine, plus a sine an octave below. They pass through a low-pass filter set to cutoff, which opens under throttle.

Sounds from noise

Every crack, boom and squeal starts from one two-second buffer of white noise, made once when the audio starts:

export function noiseSamples(length: number, seed = 1): Float32Array {
  const out = new Float32Array(length);
  let s = seed >>> 0 || 1;
  for (let i = 0; i < length; i++) {
    s = (Math.imul(s, 1664525) + 1013904223) >>> 0;
    out[i] = (s / 4294967296) * 2 - 1;
  }
  return out;
}

A filter keeps the part of the hiss that sounds like the thing, and a quick fade gives it a shape. Each burst starts at a random spot in the buffer, so no two shots sound the same. Gun cracks are rationed to about 22 a second, so a fast gun can't pile up hundreds of sounds.

Fading with distance

export function falloff(distance: number, reach: number): number {
  if (reach <= 0) return 1;
  const k = 1 - Math.min(1, Math.max(0, distance) / reach);
  return k * k;
}

Halfway to reach, a sound plays at a quarter of its volume. Past reach it is skipped. The siren follows the nearest car chasing you. The missile whoosh and the truck chime play at full volume wherever they happen.

Settings

Events

RoadAudio emits nothing.

Needs

• MeshPrimitive: where the player, each wreck and each police car is, for the distance fade.
• CarDrive: the player's speed and throttle, for the engine note.
• CarCollision: rams, crashes and spin-outs, and the ghost tag that silences a lost car's engine.