Как сыграть регион и «только регион» на waveurfer. js? - PullRequest
Новая
       15

Как сыграть регион и «только регион» на waveurfer. js?

0 голосов
/ 03 марта 2020

Я хочу воспроизвести регион, указанный в приведенном ниже коде; не весь mp3-файл. Это будет полезно для проекта, над которым я сейчас работаю; строю интернет-магазин. Я хочу, чтобы клиенты транслировали эту часть только до того, как смогут совершить покупку. 

//Draws the waveform
var wavesurfer = WaveSurfer.create({
    container       : '#waveform',
    barWidth        : 3,
    barHeight       : 2,
    fillParent      : true,
    hideScrollbar   : true,
    responsive      : true,
    height          : 50,
    waveColor       : '#cccccc',
    progressColor   : '#666666',
    cursorColor     : 'white',
    cursorWidth     : 2,
    //Creates the region I want to play
    plugins: [
        WaveSurfer.regions.create({
            regions: [
                {
                    start: 60,
                    end: 80,
                    loop: false,
                    color: '#cccccc'
                }
            ]
        })
    ]
    
});
//Play and pause buttons
wavesurfer.on('play', function () {
    document.getElementById("playButton").innerHTML = "<i class='material-icons'>pause</i>";
});
wavesurfer.on('pause', function () {
    document.getElementById("playButton").innerHTML = "<i class='material-icons'>play_arrow</i>";
});
//Play and pause function
function togglePlay()
{
    if(wavesurfer.isPlaying())
        wavesurfer.pause();
    else
        wavesurfer.play();
}
//Adds the audio file
var myElement = document.getElementById('my-element');
var myVar = myElement.dataset.myVar;
wavesurfer.load(myVar);
//Hides preloader when waveform is drawn and display the length (duration of the song) 
wavesurfer.on('ready', function () {
    document.getElementById("preloader-cover").style.display = "none";
    var getDuration = wavesurfer.getDuration();
    var min = parseInt(getDuration / 60);
    var sec = (getDuration % 60).toFixed(0);
    var duration = min+":"+sec;
    document.getElementById("length").innerHTML = duration;
});

1 Ответ

0 голосов
/ 28 марта 2020

Дайте идентификатор вашему региону: 

plugins: [
    WaveSurfer.regions.create({
        regions: [
            {
                id: "your id",   
                start: 60,
                end: 80,
                loop: false,
                color: '#cccccc'
            }
        ]
    })
]

А затем просто вызовите метод воспроизведения для этого региона: 

wavesurfer.regions.list["your id"].play()

Это будет палить регион с начала до конца. "области. Для получения дополнительной информации c посмотрите: Плагин волнового региона do c

...