Flowplayer视频进度跟踪？

Question

使用FlowPlayer API，有没有一种方法可以捕获视频进度？我想要捕获视频的进度，以便在视频的某些点上向页面触发事件。在Flash中，每帧都会触发一个Progress事件，我希望由于FlowPlayer是Flash，所以Progress事件也会被公开。但我似乎在FlowPlayer文档中找不到任何直接了当的东西。

如果Progress事件不存在。是否有任何建议如何使用JS setInterval和现有的FlowPlayer API方法构建这样一个事件？

- Lounge9

---

我能够设计出一种使用cuepoints的方法。我的特定问题是，我需要动态确定视频播放了25％、50％和75％的时间。我发现最早得知视频持续时间的事件是onMetaData事件。这对我很有效： - Lounge9

这对我有用： https://gist.github.com/1161365*如果使用FP iPad插件在iOS上使用，则无法正常工作。但那似乎是一个更大的FlowPlayer问题。 - Lounge9

Answer 1

我编写了一个简短的JavaScript代码片段，用于与Flowplayer的 Player 和 Clip 对象交互，以确定视频进度。

var videoProgressInterval;

flowplayer("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.15.swf");
flowplayer("player").onStart(startVideoProgressChecking);
flowplayer("player").onResume(startVideoProgressChecking);
flowplayer("player").onStop(stopVideoProgressChecking);
flowplayer("player").onPause(stopVideoProgressChecking);
flowplayer("player").onFinish(stopVideoProgressChecking);

function startVideoProgressChecking() {
    videoProgressInterval = setInterval(checkVideoProgress, 1000);
    videoProgressInterval();
}

function stopVideoProgressChecking() {
    clearInterval(videoProgressInterval);  
}

function checkVideoProgress() {
    var time_completed = flowplayer("player").getTime();
    var total_time = flowplayer("player").getClip().fullDuration;
    var percent_done = Math.floor((time_completed / total_time) * 100);

    console.log(percent_done + "% of video done");
}

您可以在JSFiddle上查看演示。

它为播放器的start和resume事件注册事件处理程序。一旦视频播放开始，它会注册一个定时器，每秒运行一次（可以随意修改以更频繁地运行）。该定时器每次执行时都会调用checkVideoProgress()，然后从Clip对象获取当前播放时间和总持续时间来计算进度。

此外，还为stop、pause和finish事件注册了事件处理程序，以便在视频暂停/停止后清除定时器。

- Aamir

Answer 2

也许你可以使用Flowplayer的Cuepoints功能。将cuepoints添加到数据属性中（可以是秒数，或者以负号结尾的距离视频结尾的秒数）。

<div class="flowplayer" data-cuepoints="[1.5, 2, 3, -1]"><!-- video here --></div>

然后绑定一个事件：

flowplayer(function (api, root) {
    api.bind("cuepoint", function (e, api, cuepoint) {
       console.log(cuepoint);
    });
});

- oliver_siegel