Несколько видео на YouTube - событие все готово? - PullRequest
Новая
       9

Несколько видео на YouTube - событие все готово?

0 голосов
/ 07 июня 2018

есть ли шанс получить информацию, когда все видео на странице находятся в состоянии «ГОТОВ»?(Мне нужно знать эту информацию, и после того, как я устрою еще одно событие JS).

Все примеры поиска SO / Google приведены с одним видео.Я ничего не нашел в документации.

Спасибо.

1 Ответ

0 голосов
/ 07 июня 2018

Вы можете создать что-то вроде прослушивателя переменных (в данном случае счетчика прослушивателей), используя сеттеры и геттеры.Затем вы можете указать количество видео на своей странице и увеличивать счетчик при каждой загрузке видео.

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

Функция videoHasBeenLoaded() в приведенном ниже фрагменте кода должна использоваться в качестве обратного вызова для вашего on ready state видео слушатель (здесь я использую setTimout для имитации этого события). 

function videoHasBeenLoaded() {
  loaded.counter++;
  console.log(`video has been loaded (no. of loaded videos: ${loaded.counter})`);
}

const loaded = {
  _counter: 0,
  listener: function() {},
  set counter(val) {
    this._counter = val;
    this.listener(val);
  },
  get counter() {
    return this._counter;
  },
  registerListener: function(listener) {
    this.listener = listener;
  }
}

loaded.registerListener(function(val) {
  const numberOfVideos = 3;
  if (loaded.counter === numberOfVideos) {
    alert(`all (${numberOfVideos}) videos have been loaded`);
    // you code goes here
  }
});

setTimeout(videoHasBeenLoaded, 1000);
setTimeout(videoHasBeenLoaded, 2000);
setTimeout(videoHasBeenLoaded, 3000);

Версия ES5 без геттеров и сеттеров с использованием глобального счетчика. 

var counter = 0;

function videoHasBeenLoaded() {
  counter++;
  console.log(`video has been loaded`);
  allVideosReadyCallback(counter);
}

function allVideosReadyCallback(counter) {
  var numberOfVideos = 3;
  if (counter === numberOfVideos) {
    alert(`all videos have been loaded`);
    // you code goes here
  }
}

setTimeout(videoHasBeenLoaded, 1000);
setTimeout(videoHasBeenLoaded, 2000);
setTimeout(videoHasBeenLoaded, 3000);
...