使用FlowPlayer API,有沒有辦法捕捉視頻進度?我期待捕捉視頻的進度,以便我可以在視頻中的某些點將事件觸發到頁面。在Flash中,有Progress事件觸發每一幀,我希望自FlowPlayer是Flash以來,Progress事件也將暴露。我似乎無法在FlowPlayer文檔中找到任何簡單的內容。Flowplayer視頻進度跟蹤?
如果進度事件不存在。有沒有關於如何使用JS setInterval和現有的FlowPlayer API方法來構建這樣的東西的建議?
使用FlowPlayer API,有沒有辦法捕捉視頻進度?我期待捕捉視頻的進度,以便我可以在視頻中的某些點將事件觸發到頁面。在Flash中,有Progress事件觸發每一幀,我希望自FlowPlayer是Flash以來,Progress事件也將暴露。我似乎無法在FlowPlayer文檔中找到任何簡單的內容。Flowplayer視頻進度跟蹤?
如果進度事件不存在。有沒有關於如何使用JS setInterval和現有的FlowPlayer API方法來構建這樣的東西的建議?
我破解了一個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
事件註冊,以便在視頻暫停/停止後清除間隔。
也許你可以使用Flowplayers 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);
});
});
我能夠設計一個使用提示點的方法。我特別的問題是我需要動態地確定視頻播放時間的25%和50%。我發現玩家最早發現視頻持續時間在onMetaData事件中。這工作對我來說: – Lounge9
這對我工作*: https://gist.github.com/1161365 *它不適用於iOS時使用FP iPad插件。但是這似乎是一個更大的FlowPlayer問題。 – Lounge9