Music that reacts

One song can cover a whole game if the game bends it. A player has two controls for that.

Tempo

player.tempo(1.12); // 12% faster
player.tempo(0.85); // slower
player.tempo(1); // the song's own bpm

The change takes effect from the next note, with no jump or restart.

Layers

Every instrument in a song is a layer you can fade:

player.layer("kick", 0, 0.8); // fade the kick out over 0.8 seconds
player.layer("kick", 1, 0.8); // and back in
player.layer("hat", 0.5); // half volume

Moods

gloop's whole soundtrack is one theme in four moods:

type Mood = "map" | "room" | "tense" | "done";

function setMood(mood: Mood) {
  const drums = mood === "room" || mood === "tense" ? 1 : 0;
  for (const track of ["kick", "snap"]) player.layer(track, drums, 0.8);
  player.layer("hat", mood === "map" ? 0.5 : mood === "done" ? 0.3 : 1, 0.8);
  player.tempo(mood === "map" ? 0.85 : mood === "tense" ? 1.12 : 1);
}

The map is calm and drumless, a level brings the drums in, the last three moves hurry it along, and a finished level lets the jingle through. Call setMood from wherever the game changes state.

Switching songs

player.play(otherSong, { fade: 1 }) stops the current song and fades the new one in. For a crossfade, use two players on the same audio context.