
If your device has multiple audio output devices, use `setAudioOutput(deviceId)` to change The microphone plugin has additional configuration

Include the additional `` plugin on your page.Ĭonfigure the player: use the value `'live'` for the `src` option: It's also possible to use a microphone for real-time rendering of the audio waveform. !( examples/img/text-tracks.png?raw=true "Text tracks screenshot") Video.js offers a cross-browser implementation Text tracks (or captions/subtitles) are a feature of HTML5 for displaying The `fluid` option for video.js will resize the player according to the sizeĬonfigure the player enable the video.js `'fluid'` option: To disable and hide specific controls, use the video.js `controlBar` option: | `audioOutputReady` | Audio output was changed and is now active. | `playbackFinish` | Audio playback finished. | `waveReady` | Audio is loaded, decoded and the waveform is drawn. Plugin events that are available on the video.js player instance. Wavesurfer.js `seekTo` method, by using the `surfer` property of the You can access the wavesurfer instance, for example to call the | `setAudioOutput(deviceId)` | Change the audio output device using its ( ).

| `exportImage(format, quality)` | Save waveform image as data URI. Returns 0 if no stream is available (yet). | `getCurrentTime` | Get the current time (in seconds) of the stream during playback. | `getDuration` | Get the length of the stream in seconds. | `setVolume(level)` | Set the volume level (value between 0.0 and 1.0). Also supports loading ( ) or ( ) objects. | `destroy` | Destroys the wavesurfer instance and children (including the video.js player). Methods for this plugin documented below are available on the `wavesurfer` method To try out the examples locally, checkout the repository using Git:Īnd start the local webserver for the examples:
#Wavesurfer videojs full#
See the full `audio` example (( ) or ( )) and Clips with a duration that is longer than `msDisplayMax` will be displayed as `M:SS` or `HH:MM:SS`.| An audio clip with a total length of 2 seconds and a `msDisplayMax` of 3 will use the format `M:SS:MMM`. | `msDisplayMax` | float | `3` | Indicates the number of seconds that is considered the boundary value for displaying milliseconds in the time controls. | `debug` | boolean | `false` | Display internal log messages using the `videojs.log` method. This file can be generated using the ( ) utility.

This allows the waveform to be created from pre-rendered peak data. | `peaks` | string | `null` | The URL of the JSON file with peak data corresponding to the source audio/video file. | `src` | string | `null` | The URL of the audio/video file or `'live'` when ( #microphone-plugin).| | option | type | default | description | The additional options for this plugin are: The plugin automatically registers itself when the ``Īnd enable the plugin by adding a `wavesurfer` entry with the related wavesurfer.js The plugin depends on the video.js and wavesurfer.js libraries: CHANGES.md) when upgrading from a previous If you want to use this plugin with an older video.js or wavesurfer.js version,įor a 1.3.x or older release of this plugin. Since v2.0 this plugin is compatible with video.js 6.0 and wavesurfer.js 2.0 and If you want to try the examples, check ( #examples).
#Wavesurfer videojs install#
You can use ( ) ( `npm install videojs-wavesurfer`) to install the !( examples/img/screenshot.png?raw=true "Screenshot") Includes support for fullscreen mode and [real-time visualization of microphone

A ( ) plugin that adds a navigable waveformįor audio and video files, using the ( )
