Created: 2011-07-08 21:43
Updated: 2018-10-29 23:52

Make your browser beep

Step 1. Include beep.js

<script type="text/javascript" src="beep.js"></script>

Step 2. Beep!

<script type="text/javascript">
    new Beep(22050).play(1000, 1, [Beep.utils.amplify(8000)]);

You can also beep multiple beeps at the same time, all together:

<script type="text/javascript">
    new Beep(22050).play(1000, 1, [Beep.utils.amplify(8000)]);
    new Beep(22050).play(500, 1, [Beep.utils.amplify(8000)]);

Or even use a callback, and sequence beeps one after another:

<script type="text/javascript">
    new Beep(22050).play(500, 1, [Beep.utils.amplify(8000)], function() {
    	new Beep(22050).play(600, 1, [Beep.utils.amplify(8000)]);

If you want a silence (pause), just use a frequency that humans can't hear:

<script type="text/javascript">
    new Beep(22050).play(1, 0.1, [Beep.utils.amplify(8000)]); // this will be "silent" for 100 miliseconds

Step 3. That's all!

Nothing here.

A little song example

Here's an example of how to beep a little song. You might know this song starting.

function play(keys) {
  var key = keys.shift();
  if(typeof key == 'undefined') return; // song ended
  new Beep(22050).play(key[0], key[1], [Beep.utils.amplify(8000)], function() { play(keys); });
play([[660, 0.1], [660, 0.1], [660, 0.1], [510, 0.1], [660, 0.1], [770, 0.1], [1, 0.1], [380, 0.1]]);


Read the source for more detail.


new Beep(number:samplingrate) -> Beep

Makes Beeps.


#generate(number:samplingrate) -> [number:sample]

Generates a list of numbers representing samples of the sine wave.

#encode(number:frequency, number:duration, [function:filters]) -> string:wavencode

Repeats the sine samples to fulfill a specified duration and encodes them to a WAV format.

#play(number:frequency, number:duration, [function:filters] [, function:callback ])

Generates and encodes a sine wave and tries to play it with the <audio> element. Also, binds a callback function to the onended event of the <audio> element.

Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more