Questions tagged [howler.js]

howler.js is an audio library for the modern web. It defaults to Web Audio API and falls back to HTML5 Audio.

From the Homepage:

Features

  • Defaults to Web Audio API
  • Falls back to HTML5 Audio
  • Supports multiple file formats to support all browsers
  • Automatic caching for Web Audio API
  • Implements cache pool for HTML5 Audio
  • Per-sound and global mute/unmute and volume control
  • Playback of multiple sounds at the same time
  • Easy sound sprite definition and playback
  • Fade in/out sounds
  • Methods can be chained
  • Uses no outside libraries, just pure Javascript
  • Lightweight, 9kb filesize (3kb gzipped)

It's also on GitHub.

234 questions
11
votes
2 answers

Create JavaScript Waveform Visualization With Howler.js

I am trying to produce a wave form (https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API) with howler.js . I see the dataArray looping through the draw function. However it only draws a straight line…
NicholasByDesign
  • 781
  • 1
  • 11
  • 33
11
votes
3 answers

How can I update a progress bar with howler js?

How can I use howler js and update the progress bar as the audio plays? I assume I use either pos or seek however I can't seem to get it working. Can I create a on event listener to change every time the position changes? Progress bar…
joshuatvernon
  • 1,530
  • 2
  • 23
  • 45
10
votes
0 answers

How to use both Howler.js and Wavesurfer.js together

I'm new to HTML5 Audio programming and I recently used howler.js for my project which is an audio player based off of html5, I want the cool wave style seeker that wavesurfer.js offers to my player, but I can't find a way to use wavesurfer for my…
8
votes
1 answer

howler.js group of sounds. how?

According the https://github.com/goldfire/howler.js#documentation you can pause, loop, or set the volume of a group of sounds, which is pretty useful in case of games. The question is, how do I define a group of sounds?
djpaul1963
  • 83
  • 4
8
votes
1 answer

Why does encoding wav file to base64 with python and online webapp give different results?

I am making a simple web app that needs to play a some audio files, using howler.js. howler.js accepts base64 URI as input, so I wanted to try that out. To test it, I took a sample audio file and used an online audio-to-base64 encoder to get the…
Sakeeb Hossain
  • 662
  • 5
  • 19
8
votes
2 answers

Connect analyzer to Howler sound

I have been trying for a while to connect an analyser to a Howler sound without any success. I create my Howler sound like this: var sound = new Howl({ urls: [ '/media/sounds/genesis.mp3', ] }); And then I create my analyser using…
arthurmchr
  • 500
  • 2
  • 8
  • 27
7
votes
1 answer

There is always a gap on my Audio Loop in Safari

SITUATION: It works fine on Chrome. But there is a small gap every time the "Waterfall 1" sound loops, only on Safari. WHAT I TRIED SO FAR: With the HTML 5 audio element: audio.addEventListener('timeupdate', function(){ var buffer =…
TheProgrammer
  • 1,409
  • 4
  • 24
  • 53
7
votes
3 answers

Howler.js error: ' An array of source files must be passed with any new Howl '

So i'm trying to test out using Howler.js to play an audio file. When I run this html file and press the button I get an error in console saying "An array of source files must be passed with any new Howl." html:
Martin
  • 1,336
  • 4
  • 32
  • 69
7
votes
1 answer

HTML5 audio - get time played of a sound object (howler.js)

Im playing some HTML5 audio using the Howler.js library. Currently im able to determine the total length of the audio file with sound.duration(); however im not sure how to create a timer to show how much time that has been played. I create a simple…
user1231561
  • 3,239
  • 6
  • 36
  • 55
6
votes
0 answers

What benefits howler.js brings for a basic audio player in comparison to `audio` element?

Preconditions: Developing an audio player for a web application. All target browsers fully support audio tag. No need in sprites, multiple simultaneous sounds etc, just one audio track to be played back at a moment. Audio file has to be streamed…
AKd
  • 501
  • 4
  • 17
6
votes
1 answer

Web audio / radio streaming client: use Howler.js, native Audio, other library?

I have been building a web radio player for live streams & static files (MP3 over http). I picked Howler.js as the back-end to normalize the quirks of HTML5 Audio (think: Autoplay, fading in/out, progress events). Unfortunately, I ran into several…
kubi
  • 829
  • 2
  • 14
  • 24
6
votes
4 answers

how to use howler.js in react?

Why is it that when I click play, I can play the sound and when I click play, there is no sound?? import React, { Component } from "react"; import { Howl, Howler } from 'howler'; class App extends Component { SoundPlay() { const Sounds = new…
张晓钒
  • 61
  • 1
  • 2
6
votes
1 answer

Is there a way to indicate audio download progress/buffer when using Howler.js?

I'm using Howler.js and trying to accomplish something like this: However, Howler doesn't seem to have support for audio "progress" events. Anybody know how I could work around this?
Brian FitzGerald
  • 3,041
  • 3
  • 28
  • 38
5
votes
1 answer

howler.js update volume of a sound

I am working with howler.js 2.0 but cant seem to get a simple example of updating the volume working. Here some a sample code: window.sound = new Howl({ src:'http://example.com/assets/audio/background.mp3', loop: true, volume:…
Rajat
  • 32,970
  • 17
  • 67
  • 87
4
votes
2 answers

How to keep javascript code simple and organized with long argument lists?

I apologize if my use of terminology is inaccurate. I'm a novice. I have a long list of variables that are being shared/used by the function loop(). I am currently only calling loop() twice and only passing unique arguments for the sound file…
forestkelley
  • 341
  • 3
  • 14
1
2 3
15 16