Sound Sprites

Audio sprites are a common technique for playing segments of a longer sound file, similar to image spritesheets. This is a common method for reducing the network overhead of requesting many small files.

Construction Example

A manifest (JSON object) can be used to assign the sprite data at construction time.

// Sprites must have a start and end time
const sprites = {
    'alien death': { start: 1, end: 2 },
    'boss hit': { start: 3, end: 3.5 },
    'escape': { start: 4, end: 7.2 },
    'meow': { start: 8, end: 8.5 },
    'numkey': { start: 9, end: 9.1 },
    'ping': { start: 10, end: 11 },
    'death': { start: 12, end: 16.2 },
    'shot': { start: 17, end: 18 },
    'squit': { start: 19, end: 19.3 }
};

// Add the sprites data when creating sounds
const sound = PIXI.sound.Sound.from({
    'url': 'resources/sprite.mp3',
    'sprites': sprites
});

// Use the sprite alias to play
sound.play('meow');

After Construction Example

Sound sprites can be added after the sound has been created by using the addSprites method

// Create a new sound
const sound = PIXI.sound.Sound.from('resources/sprite.mp3');

// Add the sprite markers
sound.addSprites({
    'alien death': { start: 1, end: 2 },
    'boss hit': { start: 3, end: 3.5 },
    'escape': { start: 4, end: 7.2 },
    'meow': { start: 8, end: 8.5 },
    'numkey': { start: 9, end: 9.1 },
    'ping': { start: 10, end: 11 },
    'death': { start: 12, end: 16.2 },
    'shot': { start: 17, end: 18 }
});

// Add a single sprite
sound.addSprites('squit', {
    start: 19,
    end: 19.3
});

// Use the sprite alias to play
sound.play('meow');