Как работать с несколькими игроками на одной странице, используя Vimeo "player.js" - PullRequest
Новая
       37

Как работать с несколькими игроками на одной странице, используя Vimeo "player.js"

0 голосов
/ 29 августа 2018

Задача

У меня есть несколько встроенных Vimeo на одной странице. У каждого из них есть свои собственные отдельные кнопки HTML Play / Pause для управления ими.

Я предположил, что лучший способ сделать это - создать массив игроков и перейти оттуда, используя немного jQuery. Вот так: 

vimeoPlayers = [];

// Set up the players
$('.js-vid-player').each(function(){
  iframe = $(this).find('iframe');
  videoId = iframe.attr('id');
  vimeoPlayers[videoId] = new Vimeo.Player(iframe);
});

// Handle the play buttons 
$('.js-vid-play').click(function(){
  videoId = $(this).attr('data-video');   // Get the appropriate video we want to control.
  vimeoPlayers[videoId].play();           // This works fine.
  $(vimeoPlayers).each(function() {
    // Ideally, I would like to pause all other videos here somehow, but I'm doing something wrong.
  });
});

Вопросы:

  1. Во-первых, это правильный способ сделать это? Наличие нескольких игроков в массиве? Документация Vimeo, похоже, не дает никаких примеров работы с несколькими игроками ... или я как-то совсем упустил это.
  2. Во-вторых, как я могу контролировать всех игроков одновременно? Например, мой комментарий в коде выше об остановке всех остальных игроков.

Заранее спасибо!

1 Ответ

0 голосов
/ 29 августа 2018

Другой SO Вопрос может быть полезным, поскольку он предлагает рабочий пример того, как они делали несколько игроков в JSFiddle .

В своем ответе я рассказал о нашей функции autopause. По сути, когда несколько игроков встраиваются в одну локацию, по умолчанию используется автоматическая пауза, когда все остальные игроки делают паузу, когда один из них играет. Так что по поводу вашего комментария / второго вопроса. На самом деле это поведение по умолчанию.

Дайте мне знать, могу ли я быть более полезным в использовании нашего API для достижения ваших целей.

...