встроить викторину в видео html5 - ключевые точки в многофункциональном настраиваемом проигрывателе

У Coursera есть эти интерактивные вопросы в середине их видеолекции

  • как я мог реализовать это сам,
  • или еще лучше, существует ли где-нибудь эта функция для публичного использования?

custom-track-mixing

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

  • т.е. какой плеер я должен использовать, чтобы пройти викторину,
  • но в ближайшем будущем мне также нужно будет добавить функцию скорости, которая есть у Coursera
  • Мне нужна поддержка скрытых субтитров
  • и хотел бы время от времени накладывать слайды
  • плюс все ожидаемые функции переключения между различными исходными разрешениями (360p, 720p и т. д.), он должен работать в IE, Firefox, Chrome, Safari, собственных браузерах Android и iOS и т. д.

Кандидаты

  • С точки зрения настраиваемости и набора функций SublimeVideo, похоже, лидирует, но я не знаю, когда они будут поддерживать субтитры.

  • Не изучил Flowplayer, подойдет ли он для моих целей?

  • Jwplayer хорош для всех стандартных функций и включает поддержку субтитров, но я не Действительно ли вы видели какие-либо плагины, кроме эстетического скина, глубокая настройка не кажется их сильной стороной?

  • Или videojs

  • Или еще что-то?


html jwplayer video media-player flowplayer
person Cel    schedule 24.05.2013    source источник
comment
Возможно, вы сможете сделать это с помощью JavaScript API JW Player и seek() - longtailvideo.com/support/jw-player/28851/   -  person emaxsaun    schedule 28.05.2013
comment
Хотелось бы увидеть реальный пример этого в любом плеере. @Cel, у тебя получилось так, как ты хотел?   -  person Dejan    schedule 20.07.2014
comment
@EthanJWPlayer - не могли бы вы дать мне некоторое представление об этом вопросе - заголовок stackoverflow.com/questions/27032811/   -  person Ajey    schedule 20.11.2014
comment
Боюсь, у нас нет API cuepoints.   -  person emaxsaun    schedule 20.11.2014

Ответы (2)


arrow_upward
4
arrow_downward

Flowplayer и Jwplayer — замечательные проигрыватели, и вы можете делать все, что хотите, но в бесплатной версии вы не можете удалить их брендинг. Я стараюсь придерживаться проектов с открытым исходным кодом, чтобы вы не беспокоились о лицензиях.

Я сделал нечто подобное, как вам нужно, с Mediaelementjs. Он поддерживает все, что вам нужно в данный момент, и они будут поддерживать переменную скорость в какой-то момент в будущем, как было объявлено на их веб-сайте. Однако так было уже больше года с тех пор, как я начал смотреть, так что, вероятно, ваше «ближайшее будущее» опережает их «скоро».

Я думаю, что лучшим бесплатным вариантом будет Videojs. Они также поддерживают все, что вам нужно. Для переменной скорости есть этот плагин.

По сути, вы настраиваете прослушиватель в событии timeupdate, и когда он достигает нужной вам точки, вы прикрепляете html викторины для наложения области видео.

person Jesús Carrera    schedule 29.05.2013

arrow_upward
3
arrow_downward

Я активно использовал Flowplayer. Я только сейчас начинаю больше погружаться в их новую версию HTML5. Лицензирование для flowplayer разумно. У него есть плагин для создания субтитров, и функциональность ключевых точек работает отлично. Мне также нравится, что у них есть версия Flash, которая хорошо работает в качестве запасного варианта, и я до сих пор использую ее для потоковой передачи rtmp.

Я создал видео-презентатор с синхронизированными слайдами, используя версию flash, которую я заменю на версию HTML5. Я использую его для создания видео выступлений с презентациями Powerpoint. Иногда у нас проводятся опросы (в прямом эфире), поэтому я также планировал добавить возможность слайда опроса.

Вы можете взглянуть на то, что я построил в качестве примера здесь (у него есть некоторые недостатки). Пример синхронизированной слайд-видеопрезентации (я не имею отношения к Flowplayer. WebVideoDesk, фирменный на связанной странице — это служба, которую я планирую когда-нибудь запустить.)

person Ecropolis    schedule 31.05.2013
comment
пожалуйста, дайте мне знать, если у вас будет возможность выпустить версию HTML5 :) - person Cel; 03.06.2013