2013-11-20 6 views
2

Я просмотрел документы в SO и Vimeo и, похоже, не может понять, как вызвать метод API вне события Ready в Vimeo. Я создал свой Vimeo плеер, встраивая его в teacher.js:Froogaloop Vimeo API - Не удается вызвать методы API за пределами готового события

$(".video-player").prepend('<iframe id="player" src="//player.vimeo.com/video/'+video_id+'?api=1&player_id=player&badge=0&title=0&byline=0&portrait=0" width="100%" height="100%" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'); 

    player = $('iframe#player')[0]; 
    vimeoSetup(player); 

который затем вызывает vimeoSetup в другой сценарий:

function vimeoSetup (player) { 
$f(player).addEvent('ready', ready); 

    function addEvent(element, eventName, callback) { 
    if (element.addEventListener) { 
     element.addEventListener(eventName, callback, false); 
    } 
    else { 
     element.attachEvent('on'+eventName, callback); 
    } 
    } 

    function ready(player_id) { 
    // Keep a reference to Froogaloop for this player 
    container = document.getElementById(player_id).parentNode.parentNode; 
    froogaloop = $f(player_id);  
    var buttons = container.querySelector('div#video-player-controls-holder-teacher div'), 
    playBtn = document.querySelector('#play-pause'); 

    //play-pause -- I wanted to have a single play-pause button, which is working fine 
    addEvent(playBtn, 'click', function() { 
     froogaloop.api('paused', function(paused) { 
     if(paused) { 
      froogaloop.api('play'); 
     } else { 
      froogaloop.api('pause'); 
     } 
     }); 
    }); 
    ... 

Теперь, если я хочу сказать, что вызов $ F (игрок) .api ('пауза'); in teacher.js, я получаю эту ошибку: не удается отправить сообщение на http://player.vimeo.com. Получатель имеет происхождение mydomain. Кажется, такая простая проблема - я не уверен, связано ли это с использованием этого «этого», которое в настоящее время находится за пределами меня, или если я захватываю игрока Vimeo неправильно встраиванием - я получил много «никакого метода» .api для этого объекта "в эксперименте.

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

Есть ли другие события, кроме «щелчка» и созданных пользователем событий, которые я могу использовать? Как событие, в котором говорилось, что была вызвана другая функция? Кажется обходным ... Моя точка зрения позвоночника выглядит следующим образом:

pause: function() { 
    this.player.pauseVideo(); //this is for a YouTube API which works great 
    //I want to be able to similarly call something like froogaloop.api('pause'); 
    }, 

Спасибо так много - StackOverflow научил меня удивительное количество.

+0

О, кажется, я не заметил, что вы уже пытались вызвать $ f (player) .api ('pause «); и не смог опубликовать сообщение, вызываете ли вы их после завершения готового мероприятия? –

+0

и для «no method .api для этого объекта», как я сказал ниже, из-за передачи id в $ f() во второй раз вместо объекта по этому id –

ответ

0

Итак, если событие 'ready' работает, тогда все должно быть настроено правильно. Но вот одна из возможных проблем.
В:

player = $('iframe#player')[0]; 
vimeoSetup(player); 

вы получаете Object по идентификатору 'player', а затем, в vimeoSetup(player); пропускании Object в $f(player) который работает.
И все же, далее вниз код в ready функции вы проходите до $f(player_id) только id, а не Object, поэтому api звонки не работают.

Вам просто нужно, чтобы получить Object снова player_id и передать его в $f() или сохранить player = $('iframe#player')[0]; как глобальное var, а затем вызвать все методы API на нем (хотя может быть не очень хорошим вариантом, если вы хотите сделать что-то вроде мало динамически создавая игроков, каждый из которых имеет собственные элементы управления, или если вы только один из тех, кто боится глобальных переменных)