Приостановить все, кроме нажатого игрока (waversurfer+Drupal)
[EDIT: I FITFO on my own, lol-см. ответ, который я написал здесь]
Хорошо, так что я схожу с ума от этого уже несколько недель …
У меня есть несколько экземпляров wavesurfer player на моем сайте Drupal. Когда я нажимаю "play" на одном, я хочу, чтобы любые другие в настоящее время воспроизводимые экземпляры Wavesurfer приостановились.
Я перепробовал все, что мог найти, но не могу заставить его работать.
Вот как Drupal реализует Wavesurfer:
(function ($, Drupal) {
'use strict';
Drupal.AudiofieldWavesurfer = {};
Drupal.AudiofieldWavesurfer.generate = function (context, file, settings) {
$.each($(context).find('#' + file.id).once('generate-waveform'), function (index, wavecontainer) {
var wavesurfer = WaveSurfer.create({
container: '#' + $(wavecontainer).attr('id') + ' .waveform',
audioRate: settings.audioRate,
autoCenter: settings.autoCenter,
barGap: settings.barGap,
barHeight: settings.barHeight,
barWidth: settings.barWidth,
cursorColor: settings.cursorColor,
cursorWidth: settings.cursorWidth,
forceDecode: settings.forceDecode,
normalize: settings.normalize,
progressColor: settings.progressColor,
responsive: settings.responsive,
waveColor: settings.waveColor
});
wavesurfer.load(file.path);
wavesurfer.setVolume(1);
$(wavecontainer).find('.player-button.playpause').on('click', function (event) {
Drupal.AudiofieldWavesurfer.PlayPause(wavecontainer, wavesurfer);
});
$(wavecontainer).find('.volume').on('change', function (event) {
wavesurfer.setVolume($(event.currentTarget).val() / 10);
});
if (!!settings.autoplay) {
wavesurfer.on('ready', wavesurfer.play.bind(wavesurfer));
}
});
};
Drupal.AudiofieldWavesurfer.PlayPause = function (wavecontainer, wavesurfer) {
wavesurfer.playPause();
var button = $(wavecontainer).find('.player-button.playpause');
if (wavesurfer.isPlaying()) {
$(wavecontainer).addClass('playing');
button.html('<i class="fas fa-pause-circle fa-2x"></i>');
} else {
$(wavecontainer).removeClass('playing');
button.html('<i class="fas fa-play-circle fa-2x"></i>');
}
};
И вот как я сейчас пытаюсь приостановить все остальные:
document.addEventListener('playPause', function(e){
var audios = document.getElementsByClassName('audiofield-wavesurfer');
for(var i = 0, len = audios.length; i < len; i++){
if(audios[i] != e.target && audios[i].hasClass('playing')){
audios[i].playPause();
}
}
}, true);
Кажется, это не сработает (читал в Drupal.поведение и попытался изменить эту часть, также не повезло.
Я также попытался просто позволить функции PlayPause работать через каждого игрока при нажатии, как это:
Drupal.AudiofieldWavesurfer.PlayPause = function (wavecontainer, wavesurfer) {
$.each($(Drupal.AudiofieldWavesurfer), function() {
wavesurfer.playPause();
var button = $(wavecontainer).find('.player-button.playpause');
if (wavesurfer.isPlaying()) {
$(wavecontainer).addClass('playing');
button.html('<i class="fas fa-pause-circle fa-2x"></i>');
} else {
$(wavecontainer).removeClass('playing');
button.html('<i class="fas fa-play-circle fa-2x"></i>');
}
})};
... или здесь:
Drupal.AudiofieldWavesurfer.generate = function (context, file, settings) {
$.each($(context).find('#' + file.id).once('generate-waveform'), function (index, wavecontainer) {
var wavesurfer = WaveSurfer.create({
container: '#' + $(wavecontainer).attr('id') + ' .waveform',
audioRate: settings.audioRate,
autoCenter: settings.autoCenter,
barGap: settings.barGap,
barHeight: settings.barHeight,
barWidth: settings.barWidth,
cursorColor: settings.cursorColor,
cursorWidth: settings.cursorWidth,
forceDecode: settings.forceDecode,
normalize: settings.normalize,
progressColor: settings.progressColor,
responsive: settings.responsive,
waveColor: settings.waveColor
});
wavesurfer.load(file.path);
wavesurfer.setVolume(1);
// ---- HERE MY CODE: --------
$(wavecontainer).find('.player-button.playpause').on('click', function (event) {
$.each($(context).find('#' + file.id), function(idx, obj) {
$(obj).stop();
});
Drupal.AudiofieldWavesurfer.PlayPause($(wavecontainer), wavesurfer);
});
но все это тоже не сработало для меня … у кого-нибудь есть идеи, как помочь мне разобраться в этом? это спасло бы мне жизнь!!!