2013-11-20 4 views
0

Мы используем Vimeo для размещения корпоративных обучающих видеороликов и задавались вопросом, есть ли способ использовать API для запуска события после завершения воспроизведения?! .. Мы пытаемся войти в систему, когда пользователи полностью смотрел учебный материал.Vimeo API Trigger Event

Любые предложения приветствуются. Заранее спасибо.

ответ

0

Я установил это как страницу на своем сервере, и она работает. Как только видеопроигрыватель пройдет 3 секунды, слова «Ты только что запустил мою функцию». появляются внутри тегов.

Я включил полный код страницы - большая часть javascript из примера Vimeo API, и вам это не понадобится.

Несколько вещей, с которыми я столкнулся - я не мог заставить это работать на JQuery 1.10.X - похоже, что это может работать только с jQuery 1.7.2.

Также обратите внимание, что после того, как элемент отображается, он остается на экране, поэтому, если вы хотите, чтобы он снова спрятался, если человек перематывает плеер, вам придется его построить, возможно, с помощью «else», заявление.

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

<html xmlns="http://www.w3.org/1999/xhtml"> 
<meta name="viewport" content="width = device-width, initial-scale = 1.0" /> 

<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script> 
</head> 
<iframe id="player1" src="http://player.vimeo.com/video/27855315?api=1&player_id=player1" width="400" height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> 

<p>Video status: <span class="status">...</span></p> 
<p><button>Play</button> <button>Pause</button></p> 
<h3 id="show"></h3><!-- thats where the message will show --> 
<script> 
jQuery(document).ready(function($) { // WordPress needs jquery like this... 
var iframe = $('#player1')[0], 
    player = $f(iframe), 
    status = $('.status'); 

// When the player is ready, add listeners for pause, finish, and playProgress 
player.addEvent('ready', function() { 
    status.text('ready'); 

    player.addEvent('pause', onPause); 
    player.addEvent('finish', onFinish); 
    player.addEvent('playProgress', onPlayProgress); 
}); 

// Call the API when a button is pressed 
$('button').bind('click', function() { 
    player.api($(this).text().toLowerCase()); 
}); 

function onPause(id) { 
    status.text('paused'); 

} 

function onFinish(id) { 
    status.text('finished'); 
} 

function onPlayProgress(data, id) { 
    status.text(data.seconds + 's played'); 
    var time = data.seconds; //I added this var and the little if below...that's it. 
    if (time > 3) { 
    show.innerHTML = "You just made my function run."; } 
} 
// add an appropriate event listener 


}); 
</script> 
</html> 
0

я использую Vimoe player.js

<script src="https://player.vimeo.com/api/player.js"></script> 

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

player.on('ended', function(){ 
    // Video Finished 
    // ajax call for custom event in WordPress 
    $.ajax({ 
      url : '<?php echo admin_url("admin-ajax.php") ?>', 
      data : { 
       action: "create_update_user", 
       user_id : "<?php echo $user->ID; ?>", 
       post_id : "<?php echo get_the_ID(); ?>", 
       status : 'complete' }, 
      dataType : "post", 
      type: "post", 
      success: function(response){ 
      } 
    }); 

Надеется, что это полезно, потому что player.js полезнее вместо froogaloop2.min.js

благодаря