计算或跟踪HTML5视频的所寻求 /伤口 /船长 /时间

Question

如果用户跳过一些，我想测量视频播放期间跳过的时间。

使用Video.currenttime

首先看起来很琐碎

Listen to seeking and get the currentTime A
Listen to seekend and get the currentTime B
B - A = Seeked Time

当我在Chrome中这样做时，结果为0。这是为什么？如果您收听timeupdate tu，它会很明显。简化序列：

Press Play
TU: 1
TU: 2
TU: 3 // now i use the mouse to seek forward to 19
TU: 19
//chrome & ff fire pause in between, ie not
Seek Start: 19
TU: 19
Seek End: 19
TU: 19
//chrome & ff fire play, ie not
TU: 20
...

我知道我可以玩肮脏并保存当前时间的位置，但不能以可靠的方式; - ）

使用timeranges video.played

我可以使用计时来计算寻找/跳过的时间。但是问题是：按列表的顺序和归一化形式出现。因此，如果用户跳出后背，范围将合并并订购=>无法准确跟踪。

我只是看不到更复杂的批准吗？

Answer 1

我如何解决它。

我从这里使用了ringbuffer（尺寸10）https://stackoverflow.com/a/a/28038535/2588818，然后每次timeupdate推动Math.round(video.currentTime)。在 seekend上，我在ringbuffer中向左（上一个上述），然后取第一个与当前时间不同的基准。

工作良好，足以将其用于跟踪跳过的时间。

var createRingBuffer = createRingBuffer || function(length) {
  /* https://stackoverflow.com/a/4774081 */
  var pointer = 0, buffer = [];
  return {
    ...
    push : function(item){
      buffer[pointer] = item;
      pointer = (pointer + 1) % length;
      return item;
    },
    ...
    getFirstDifference: function() {
        var last_value = buffer[pointer - 1],
            prev_value;
        for (var i = 1; i <= length; i++) {
            prev_value = buffer[(pointer - i) % length]
            //check for undefined or initialize the buffer beforehand
            if(prev_value === undefined || last_value === prev_value) {
            } else {
                return prev_value;
            }
        }
        return last_value;
    },
    print: function() {
        console.log(JSON.stringify(buffer));
    }
  };
};

...

var seekTimes = createRingBuffer(10);
handleUpdateTime = function() {
    seekTimes.push(Math.round(video.currentTime));
},
handleSeekEnd = function(e) {
    seekTimes.print();
    console.log("%s - %s", seekTimes.getFirstDifference(), Math.round(video.currentTime));
},

...