How to use waveform-playlist - 2 common examples

To help you get started, we’ve selected a few waveform-playlist examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ritazh / EchoML / app / annotations.js View on Github external
export function loadAnnotation(notes) {
  const playlist = WaveformPlaylist.init({
    container: document.getElementById('playlist'),
    timescale: true,
    state: 'select',
    samplesPerPixel: 3400,
    zoomLevels: [1000, 2000, 3400, 4000],
    colors: {
      waveOutlineColor: '#E0EFF1',
      timeColor: 'grey',
      fadeColor: 'black',
    },
    annotationList: {
      annotations: notes,
      controls: actions,
      editable: true,
      isContinuousPlay: false,
      linkEndpoints: true,
github naomiaro / video-waveform-subtitle-editor / client / index.js View on Github external
const annotations = subtitleData.map((subtitle) => {
      const startSec = subtitle.startTime / 1000;
      const endSec = subtitle.endTime / 1000;
      const cue = new VTTCue(startSec, endSec, subtitle.text);
      cueList.push(cue);
      captionTrack.addCue(cue);

      return {
        id: subtitle.id,
        begin: startSec,
        end: endSec,
        lines: subtitle.text.split('\n')
      };
    });

    const playlist = new Playlist.default();
    playlist.setSampleRate(audioContext.sampleRate);
    playlist.setSamplesPerPixel(1500);
    playlist.setAudioContext(audioContext);
    playlist.setEventEmitter(EventEmitter());
    playlist.setTimeSelection(0, 0);
    playlist.setDurationFormat('hh:mm:ss.uu');
    playlist.setState('cursor');
    playlist.setControlOptions({
      show: false,
      width: 150,
    });
    playlist.setWaveHeight(96);
    playlist.setColors({
      waveOutlineColor: '#000',
      timeColor: 'grey',
      fadeColor: 'black'

waveform-playlist

Multiple track web audio editor and player with waveform preview

MIT
Latest version published 2 years ago

Package Health Score

48 / 100
Full package analysis