denar90/yii2-wavesurfer-audio-widget

Wavesurfer audio widget for yii2.

v1.0 2015-08-14 09:10 UTC

Requires

• npm-asset/wavesurfer.js: *
• yiisoft/yii2: *

MIT

• Artem Denysov

• jquery
• audio
• extension
• widget
• yii2
• wavesurfer

README

Audio widget for yii2 based on wavesurfer.js

Installation

The preferred way to install this extension is through composer.

• Either run

php composer.phar require --prefer-dist "denar90/yii2-wavesurfer-audio-widget": "dev-master"

or add

"denar90/yii2-wavesurfer-audio-widget": "dev-master"

to the require section of your application's composer.json file.

Usage

In your view add

use denar90\waveSurferAudio\WaveSurferAudioWidget;

In place where you need widget to be shown add

echo WaveSurferAudioWidget::widget([
	'settings' => [
		'fileUrl' => url_to_your_mp3_file,
		'init' => [
			'container' => 'selector_name' //it has to be id not class
		],
		'callbacks' => [
			'ready' => new \yii\web\JsExpression("function(event) {
				this.play();
			}")
		],
		'controls' => [
			'play' => true,
			'pause' => true
		]
	]
]);

Options

Init options sets in init array. List of options

Supported javascript callbacks sets in callbacks array

• error – Occurs on error. Callback will receive (string) error message.
• finish – When it finishes playing.
• loading – Fires continuously when loading via XHR or drag'n'drop.
• mouseup - When a mouse button goes up.
• pause – When audio is paused.
• play – When play starts.
• ready – When audio is loaded, decoded and the waveform drawn.
• scroll - When the scrollbar is moved.
• seek – On seeking.

Supported controls sets in controls array

• playPause - Plays if paused, pauses if playing.
• play - Starts playback from the current position. Optional start and end measured in seconds can be used to set the range of audio to play.
• pause - Stops playback.
• back - Rewind skipLength seconds.
• forth - Skip ahead skipLength seconds.
• toggleMute - Toggles the volume on and off.
• toggleInteraction - Toggle mouse interaction.
• toggleScroll - Toggles scrollParent.