2016-02-19 24 views
0

我發現在Vimeo的一個bug上的jsfiddle的JavaScript API,並把它的一個例子(看到這個帖子的鏈接的最末端和代碼(計算器上粘貼代碼堅持用的jsfiddle一起)vimeo api - 玩事件並不總是可行,可能的解決方法?

我告訴Vimeo的關於它,但他們從來沒有告訴我他們是否可以複製該錯誤,或​​者是否有任何可以使用的解決方法。

因此,我發佈了以下問題的描述(您可以看到代碼並在jsfiddle),如果你有任何想法(是否真的是一個Vimeo錯誤,而不是我的bug,是否有一系列的調用我可以做,以解決問題),那麼請讓我知道。是描述:

的錯誤可以被描述爲:「玩事件只觸發的它應該是火一小部分時間」

重現步驟:

  1. 運行的jsfiddle。視頻將播放幾毫秒並停止播放。警報會彈出「play-event」字樣,表示正如預期的那樣,遊戲事件被解僱。

  2. 暫停視頻

  3. 播放視頻。

  4. 您每次播放視頻時都會看到一個提示:「播放事件」。

  5. 再次暫停視頻。

  6. 單擊NEXT按鈕。這個按鈕會在視頻的中間找到一個位置(實際上它使用的是一個有4個位置的陣列,所以當你第一次尋找時,你會到第一個位置,下次你尋找時,你會到第二個位置,等等)

  7. 該視頻將跳轉到中間的部分。視頻將開始播放。 BUG在這裏出現。應該出現指示「玩事件」的警報。但它不!

  8. CLUE:如果您完全不點擊下一步按鈕,直到視頻播放到接近尾聲,然後點擊下一步按鈕,您可能會很幸運,而「播放事件」會引發火災!!!!!我的猜測是,當視頻主要是在用戶計算機上緩存,那麼API工作得更好

    https://jsfiddle.net/3f9z7ffo/

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 
    
    <script type="text/javascript" src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script> 
    
    
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css" /> 
    
    <script type="text/javascript"> 
        var globalcount = 0; 
        var windowwidth = 0; 
    
        var initialseek = true; 
        var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; 
        var timeoutID; 
        var stoparray = new Array("48", "103.979", "346.513", "407.459"); 
        var quiz = false; 
    
        var startPosition = 0; 
        var stoplength = stoparray.length; 
        var stopindex = -1; 
        var timeinterval = 10; 
        var defaultwidth = 3; 
        var gDuration; 
        var gPlayer; 
        var gvideowidth; 
        var gvideoheight; 
        var hiderank; 
        var gPlayer; 
        var vimeoPlayers; 
    
    </script> 
    

    <center> 
    
        <table> 
         <tr> 
          <td style="width:33%;text-align:right;padding-right:14px"></td> 
          <td style="width:33%"> 
           <div id="HoldPlayer" style="position:relative"> 
            <iframe src='https://player.vimeo.com/video/152639172?autoplay=0&api=1&player_id=player1' 
              id='player1' 
              width='640' height='360' 
              frameborder='0'></iframe> 
           </div> 
          </td> 
          <td style="width:33%"></td> 
         </tr> 
        </table> 
    
        <table style="width:100%"> 
         <tr> 
          <td style="text-align:center"> 
           Window (total time in seconds): <input type="text" id="windowwidth" maxlength="3" style="width: 30px;" /> 
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
           <label><input type="checkbox" checked="checked" id="chkplayvid" />Play</label> 
          </td> 
         </tr> 
    
    
        </table> 
    
    </center> 
    
    
    <center> 
        <table> 
         <tr> 
          <td style="text-align:center"> 
           <input type="button" id="nextbutton" onclick="nextPlayer(); return (false);" value="Next" /> 
          </td> 
         </tr> 
         <tr> 
          <td align="center"></td> 
         </tr> 
    
    
        </table> 
    
    </center> 
    
    <div id="oPara"></div> 
    
    
    <script type="text/javascript"> 
    
    
        // +++++++++++++ 
        function ready2() { 
    
         setupEventListeners(); 
         gPlayer.api('getDuration', function (value, player_id) { 
          gDuration = value; // this will be set whenever callback fires 
          playVideo(); 
         }); 
    
        } 
        // +++++++++++++ 
        function setupEventListeners() { 
         gPlayer.addEvent('pause', pauseEvent); 
         gPlayer.addEvent('finish', endEvent); 
         gPlayer.addEvent('play', playEvent); 
        } 
    
    
        function endEvent() { 
         alert("end event!!!"); 
         gidClearTimeout(timeoutID); 
        } 
        function pauseEvent() { 
         alert("pauseEvent!!!"); 
         return; 
        } 
        function playEvent() { 
         alert("playEvent!!!"); 
         globalcount = globalcount + 1; 
    
         if (initialseek) { 
          timeoutID = setTimeout(pausePlayer, 60); 
          initialseek = false; 
         } 
         else { 
          timeoutID = setTimeout(pausePlayer, windowwidth); 
         } 
         return; 
        } 
    
    
        $(document).ready(function() { 
    
    
         $("#windowwidth").val(defaultwidth); 
         setTimeout(addReadyEvent, 60); 
        }); 
        // +++++++++++++ 
        function addReadyEvent() { 
    
         var iframe = $('#player1')[0]; 
         gPlayer = $f(iframe); 
         gPlayer.addEvent('ready', ready2); 
        } 
    
        // +++++++++++++ 
        function showNextButton() { 
         $("#nextbutton").removeAttr('disabled'); 
        } 
        // +++++++++++++ 
        function playVideo() { 
    
         gPlayer.api('play'); 
         return; 
        } 
        // +++++++++++++ 
        function pausePlayer() { 
    
         gPlayer.api('pause'); 
         $("#nextbutton").removeAttr('disabled'); 
         return true; 
        } 
    
        // +++++++++++++ 
        function nextPlayer() { 
         var startPosition = 0; 
         var str = ""; 
         var prevpos = -5; 
         var stopPosition = 0; 
    
         var dur = gDuration; 
         windowwidth = 3; 
         windowwidth = parseFloat(windowwidth); 
         if (isNaN(windowwidth)) { 
          windowwidth = defaultwidth; 
         } 
         if (windowwidth < 1) { 
          windowwidth = 1; 
         } 
         if (windowwidth > 3600) { 
          windowwidth = 3600; 
         } 
         windowwidth = Math.round(windowwidth); 
         stopindex = stopindex + 1; 
    
    
         stopPosition = parseFloat(stoparray[stopindex]); 
    
         if (stopPosition > dur) { 
          stopPosition = dur; 
         } 
         /* was here */ 
    
         startPosition = parseInt(stopPosition - windowwidth, 10); 
    
    
         gPlayer.api('seekTo', startPosition); 
         gPlayer.api('pause'); 
         setTimeout(playVideo, 60); 
    
         return false; 
        } 
    
    </script> 
    

回答

0

Vimeo做了答案 - 一種解決方法是,假設您的視頻已暫停,首先調用'play',然後調用'seek',然後playevent將觸發。

相關問題