Как отличить два события "onpause" - вызванные нажатием кнопки "pause" и достижением конца фрагмента мультимедиа?

Если пользователь хочет остановить носитель HTML5, например, нажав кнопку "паузы" собственного управления, мы получим событие "onpause". В то же время, если медиа-элемент достигает конца указанного фрагмента, он автоматически запускает одно и то же событие "onpause". Можно ли отделить одно от другого? В стиле JQuery,

<video id="video1" src="url/video.webm#t=10,20" controls></video>

<script type="text/javascript">
  $(window).load(function () { 
    $('#video1').on("manualpause", function () {
      alert("you paused this media manually!");
    });
    $('#video1').on("fragmentend", function () {
      alert("you've reached the end of the fragment! your media is now paused automatically!");
    });
  });
</script>

Я попытался использовать событие "ontimeupdate", но отказался: я хочу реагировать точно, когда происходит автоматическая пауза (вызванная достижением конца фрагмента).

Источник

1 ответ

Решение

Завершенное событие будет выпущено только после завершения полного трека. При воспроизведении фрагмента он будет только приостанавливать дорожку в конце фрагмента, поскольку сама дорожка не закончилась (кроме случаев, когда время окончания фрагмента также оказалось концом).

Говорят, что медиа-элемент приостановлен для взаимодействия с пользователем, когда его атрибут paused имеет значение false, атрибутом readyState является либо HAVE_FUTURE_DATA, либо HAVE_ENOUGH_DATA, а пользовательский агент достиг точки в медиа-ресурсе, где пользователь должен сделать выбор для ресурса, чтобы Продолжить.

Завершенное событие произойдет, только если:

Говорят, что медиа-элемент завершил воспроизведение, когда:

Атрибут readyState элемента имеет значение HAVE_METADATA или выше, и

Или:

  • Текущая позиция воспроизведения является концом медиаресурса, и
  • Направление воспроизведения вперед, и
  • Либо у медиа-элемента не указан атрибут цикла, либо у медиа-элемента есть текущий медиа-контроллер.
Или же:
  • Текущая позиция воспроизведения является самой ранней возможной позицией, и
  • Направление воспроизведения обратное.

Источник

Чтобы определить, было ли вызвано событие паузы из-за конца фрагмента, вы можете сравнить currentTime с временем окончания фрагмента (и да, есть теоретический шанс, что вы можете нажать кнопку паузы точно в это же время, но это будьте как можно ближе к звуковому элементу, если только само событие не имеет секретного свойства, раскрывающего источник паузы, о котором я не знаю).

Поскольку мы имеем дело со значениями с плавающей запятой, вам нужно сравнить время, используя эпсилон. Предполагая, что у вас есть анализ или другой способ получить время окончания для фрагмента, вы можете сделать:

function onPauseHandler(e) {
    var fragmentEndTime = ...;   // get/parse end-fragment into this var
    if (isEqual(this.currentTime, fragmentEndTime)) {
      // likely that fragment ended
    }
    else {
      // a manual pause
    }
}

function isEqual(n1, n2) {
   return Math.abs(n1 - n2) < 0.00001
}
Источник

Это возникло у меня сегодня, когда я искал "почему onpause также срабатывает, когда происходит onended".

Я хотел не запускать обработчик события onpause, когда произошло событие onended.

Это был мой (рабочий) подход:

videoRef.onpause = (e) => {
  if(e.target.currentTime != e.target.duration) {
    doPauseRelatedStuff()
  }
}

У меня зарегистрированы как onpause, так и onended обработчики. Приведенный выше код заставляет doPauseRelatedStuff() выполняться только тогда, когда видео останавливается вручную.

Источник
Другие вопросы по тегам