Vimeo froogaloop конфликт с плъгин

Използвам приставката Vimeowrap Playlist, за да направя плейлист с видеоклипове от определен канал. Това работи добре, но сега трябва да проследявам събитията на видеоклиповете: пускане, пауза и т.н. Когато използвам froogaloop за това, получавам грешка Cannot read property 'getAttribute' of undefined. По някакъв начин froogaloop е в конфликт със скрипта на Vimeowrap. Може ли някой да ми помогне с този проблем?

Това е кодът на плъгина:

vimeowrap('player').setup({
    urls: [
        'https://vimeo.com/channels/trocadero'
    ],
    height:363,
    item: 5,
    plugins: {
        'playlist':{
            position:'right',
            size:340
        }
    },



});

Ето jsfiddle на целия ми проблем.


jquery vimeo vimeo-api vimeo-player froogaloop
person Shile    schedule 30.11.2014    source източник
comment
Вижте примера за API тук: labs.funkhausdesign.com/examples/vimeo/   -  person danger89    schedule 21.01.2015

Отговори (1)


arrow_upward
1
arrow_downward

Успях да разреша проблема си...ето го jsfiddle решение.

var vimeoPlayers = [];

function VimeoPlayer (playerId) {
var iframe = $('#' + playerId),
  contentWindow = iframe[0].contentWindow,
  targetOriginUrl = iframe.attr('src').split('?')[0];
console.log(iframe);
console.log(contentWindow);
console.log(targetOriginUrl);

contentWindow.postMessage({ 'method': 'addEventListener', 'value': 'pause' }, "http:"+targetOriginUrl);
contentWindow.postMessage({ 'method': 'addEventListener', 'value': 'play' }, "http:"+targetOriginUrl);

return {
play: function () {
    contentWindow.postMessage({ 'method': 'play' }, "http:"+targetOriginUrl);

},

pause: function() {
  contentWindow.postMessage({ 'method': 'pause' }, "http:"+targetOriginUrl);

},

unload: function() {
  contentWindow.postMessage({ 'method': 'unload' }, "http:"+targetOriginUrl);
}
}
}

// Listen for postMessage events
$(window).on('message', function(e) {
var data = $.parseJSON(e.originalEvent.data);

if (data.event === 'ready') {
var vimeoPlayer = new VimeoPlayer(data.player_id);

vimeoPlayers.push(vimeoPlayer);
}
if(data.event==='play'){
   console.log('play');
 }
 if(data.event==='pause'){
   console.log('pause');
 }

 console.log(data);
});



$('.vimeo-controls .pause-all').on('click', function () {
for (var i = 0; i < vimeoPlayers.length; i++) {
vimeoPlayers[i].pause();
}
 });

$('.vimeo-controls .play-all').on('click', function () {
for (var i = 0; i < vimeoPlayers.length; i++) {
vimeoPlayers[i].play();
}
 });

$('.vimeo-controls .unload-all').on('click', function () {
for (var i = 0; i < vimeoPlayers.length; i++) {
 vimeoPlayers[i].unload();
 }
   });
person Shile    schedule 30.11.2014
comment
Можете ли да предоставите резюме на вашето решение? Правенето на ръчна разлика към вашия въпрос не е много полезно. - person Andy; 11.12.2015