Quick Links

• 📖 Read the blog

Installation

npm install sounds-control

Available Functions

loadSound(url: string, id: string): Promise<void>

Loads an audio file from a URL and decodes it for later use.

isSoundLoaded(id: string): boolean

Checks if a sound has been loaded.

play(id: string, startTime: number = 0): Promise<void>

Plays a sound from a specified start time.

playEffect(id: string): Promise<void>

Plays a sound effect.

stop(id: string): void

Stops the playback of a sound and stores the pause time.

loop(id: string, startTime: number = 0): void

Loops a sound from a specified start time.

setVolume(volume: number): void

Sets the overall playback volume.

setEffectVolume(volume: number): void

Sets the volume for sound effects.

setPlaybackRate(id: string, rate: number): void

Sets the playback rate for a specific sound.

setGlobalPlaybackRate(rate: number): void

Sets the global playback rate for all sounds.

faster(id: string, rate: number = 1.5): void

Sets a faster playback rate for a specific sound.

slow(id: string, rate: number = 0.75): void

Sets a slower playback rate for a specific sound.

fasterEffect(id: string, rate: number = 1.5): void

Sets a faster playback rate for a specific sound effect.

slowEffect(id: string, rate: number = 0.75): void

Sets a slower playback rate for a specific sound effect.

pauseAll(): void

Pauses all sounds and stores the pause time.

resumeAll(): void

Resumes playback of all sounds from the stored pause time.

Usage Examples

Plain JavaScript

import { SoundsControl } from 'sounds-control';

const soundsControl = new SoundsControl();

async function init() {
  await soundsControl.loadSound('path/to/sound.mp3', 'sound1');
  soundsControl.play('sound1');
}

init();

Angular / Ionic

// app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { AudioService } from './audio.service';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [AudioService],
  bootstrap: [AppComponent]
})
export class AppModule {}

// audio.service.ts
import { Injectable } from '@angular/core';
import { SoundsControl } from 'sounds-control';

@Injectable({
  providedIn: 'root'
})
export class AudioService {
  private soundsControl: SoundsControl;

  constructor() {
    this.soundsControl = new SoundsControl();
  }

  async loadSound(url: string, id: string): Promise<void> {
    await this.soundsControl.loadSound(url, id);
  }

  play(id: string): void {
    this.soundsControl.play(id);
  }
}

Angular / Ionic Pause and Resume

  ngOnInit() {
    App.addListener('appStateChange', ({ isActive }) => {
      if (isActive) {
        this.audioService.resumeAll();
      } else {
        this.audioService.pauseAll();
      }
    });
  }

React

import React, { useEffect } from 'react';
import { SoundsControl } from 'sounds-control';

const soundsControl = new SoundsControl();

function App() {
  useEffect(() => {
    async function init() {
      await soundsControl.loadSound('path/to/sound.mp3', 'sound1');
      soundsControl.play('sound1');
    }
    init();
  }, []);

  return <div className="App">Playing sound...</div>;
}

export default App;

Vue

<template>
  <div>
    <button @click="playSound">Play Sound</button>
  </div>
</template>

<script>
import { SoundsControl } from 'sounds-control';

const soundsControl = new SoundsControl();

export default {
  methods: {
    async playSound() {
      await soundsControl.loadSound('path/to/sound.mp3', 'sound1');
      soundsControl.play('sound1');
    }
  }
};
</script>

License

Sounds Control is licensed under the MIT license. Please refer to the LICENSE file for more information. © Rodrigo Rangel

Doações

If you enjoyed using sounds-control, please consider making a donation to support the continuous development of the project. You can make a donation using one of the following options:

• Pix: [email protected]