Воспроизведение видео HTML5 назад на iOS - PullRequest
10 голосов
/ 24 августа 2011

Я пытаюсь воспроизвести видео HTML5 в обратном направлении на iPad (видео должно произвольно переключаться между прямым и обратным ходом на основе пользовательского ввода).

Элемент HTML5 <video> содержит свойство, называемоеplaybackRate, что позволяет воспроизводить видео с большей или меньшей скоростью или наоборот.Согласно документации Apple , это свойство не поддерживается в iOS.

Воспроизведение в обратном направлении может быть подделано без использования playbackRate, если задать свойство currentTime несколько раз в секунду (например 10-30 обновлений в секунду).Этот подход работает на настольном Safari, но кажется, что поиск на устройствах iOS ограничен до 1 обновления в секунду - слишком медленно в моем случае.

Есть ли способ воспроизвести видео HTML5 в обратном направлении на устройстве iOS (а именно iPad)?

(я тестирую на iPad 2 под управлением 4.3.1)

Ответы [ 5 ]

3 голосов
/ 23 сентября 2011

Как предложил Михай, используйте две версии и обновите местоположение поиска, когда пользователь меняет направление воспроизведения.

Сложите видео в DIV друг на друга, и, когда направление воспроизведения перевернуто, переключитевидимость div (и приостановка воспроизведения скрытого).

Итак, это временная шкала:

  1. Пользователь нажимает переключатель воспроизведения.
  2. Приостановка отображаемого видео.
  3. Получить поиск местоположения отображаемого видео.
  4. Вычесть это значение из длительности видео.
  5. Найти это значение в неотображаемом видео.
  6. Переключение отображаемых видео DIV.
  7. Начало воспроизведения вновь отображаемого видео.
2 голосов
/ 30 января 2013

Атрибут playbackRate теперь поддерживается в iOS 6 Safari.

2 голосов
/ 06 декабря 2011

Почему бы не сшить обратную и прямую версии вместе в один фильм?

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

0 голосов
/ 05 января 2012

ПРИМЕЧАНИЕ: я был глуп и пропустил нетривиальную часть вопроса, поэтому следующее довольно бесполезно для целей iOS

После некоторого времени поиска в Google я нашел следующеекод вместе с объяснением того, как поддерживать обратное воспроизведение видео html5 в браузерах на основе Webkit:

function speedup(video, direction) {
   if (direction == undefined) direction = 1; // or -1 for reverse
   if (video.playbackRate != undefined) {
      video.playbackRate = direction == 1 ? 2 : -2;
   } else { // do it manually
      video.setAttribute('data-playbackRate', setInterval ((function playbackRate () {
         video.currentTime += direction;
         return playbackRate; // allows us to run the function once and setInterval
      })(), 500));
   }
}

function playnormal(video) {
   if (video.playbackRate != undefined) {
      video.playbackRate = 1;
   } else { // do it manually clearInterval(video.getAttribute('data-playbackRate’)); }
}

Источник: http://net.tutsplus.com/tutorials/html-css-techniques/html5-audio-and-video-what-you-must-know/

Вам необходимо передать видеообъект html5 вфункция ускорения, но, опять же, эта функция может быть сведена к следующему (я еще не проверял, это специфическая функция для iPad):

function reverseVideo(video) {
    video.playbackRate = -1;
}

Не стесняйтесь играть и искатьбольше информации об элементе html5 video:)

0 голосов
/ 07 ноября 2011

Я предлагаю сделать «фальшивый» видеоплеер в вашем HTML-коде. Затем запишите попытку пользователя «воспроизвести» видео с помощью методов обратного вызова safari / ios. Затем создайте MPMoviePlayerController, который фактически загружает видео и отображает его поверх исходного положения видео в браузере или поддерживает только полноэкранное воспроизведение. MPMediaPlayback протокол поддерживает обратное воспроизведение через свойство currentPlaybackRate, поэтому, надеюсь, это будет временное исправление, поскольку я не вижу версии Safari для iOS, которая в конечном итоге не реализует эту функцию, поскольку она поддерживается собственным проигрывателем.

...