0.1.0 • Published 7 years ago

audio-helper v0.1.0

Weekly downloads
-
License
ISC
Repository
-
Last release
7 years ago

简介

audio-helper是一个HTML<audio\>的功能扩展插件,提供了:

  • 基础的音频操作,如playpausestop以及reset等方法;
  • 多种事件监听
  • 音频合并Join)、音频混合Mix)。

Install

npm install audio-helper --save

Usage

首先,我们引用:

import { Player, Mix, Join } 'audio-helper'

audio-helper分为三部分内容:

  • Player:通用播放器类,用于实例化单一的播放器;
  • Mix:用于交叉混合两个播放器实例,返回一个播放器实例;
  • Join:用于拼接多个播放器实例,返回一个播放器实例。

Player

我们来实例化一个播放器:

var poem = new Player({
  src: 'poem.mp3',
  attrs: {
    loop: true
  }
})

poem.play()

Player接受两个参数,src表示音频地址,attrs<audio\>Attributes,参考这里

一个Player实例有以下几个基础api:

  • play:播放音频
  • pause:暂停播放
  • stop:停止播放
  • reset:重置播放器

事件相关的api:

  • on:监听事件
  • once:一次性监听
  • off:移除监听

其他api:

  • copy:用于复制当前播放器,返回一个新的播放器实例。
var playId = poem.on('play', () => {
  console.log('play!')

  poem.off('play', playId)
})

事件系统的实现借助于on-fire,可以查看其文档帮助理解。

Join

Join用于拼接多个播放器实例:

var a1 = new Player({
  src: 'a1.mp3'
})

var a2 = new Player({
  src: 'a2.mp3'
})

var a3 = new Player({
  src: 'a3.mp3'
})

var speech = new Join(a1, a2, a3)

speech.play()

如上,a1a2a3一起拼接成speechspeech.play()会按照拼接的顺序依次播放。

Mix

Mix用于混合两个播放器实例:

var words = new Player({
  src: 'words.mp3'
})

var bgm = new Player({
  src: 'bgm.mp3',
  attrs: {
    loop: true
  }
})

var song = new Mix(words, bgm)

song.play()

以上,song.play()将会混合wordsbgm两段音频,就像是为words配上了背景音乐一样,当然,song是以words为起点和钟点,bgm将会基于words的长度被裁切。

当然,你也可以进行一些更为复杂的组合方式:

var bark = new Player({
  src: 'bark.mp3'
})

var meow = new Player({
  src: 'meow.mp3'
})

var bgm = new Player({
  src: 'bgm.mp3',
  attrs: {
    loop: true
  }
})

var dog = new Join(bark.copy(), bark.copy(), bark.copy())
var cat = new Join(meow.copy(), meow.copy(), meow.copy())

var yard = new Mix(new Mix(dog, cat), bgm)

yard.play()
0.1.0

7 years ago