122 lines
3.5 KiB
HTML
122 lines
3.5 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<script src="media-source-loader.js"></script>
|
||
|
<script src="../resources/runner.js"></script>
|
||
|
<script>
|
||
|
var loader;
|
||
|
var video;
|
||
|
var longMediaSegment;
|
||
|
|
||
|
function concatArrayBuffers() {
|
||
|
var byteLength = 0;
|
||
|
Array.prototype.forEach.call(arguments, arrayBuffer => {
|
||
|
if (!arrayBuffer.byteLength)
|
||
|
throw "Not an ArrayBuffer!";
|
||
|
byteLength += arrayBuffer.byteLength;
|
||
|
});
|
||
|
|
||
|
|
||
|
var view = new Uint8Array(byteLength);
|
||
|
var offset = 0;
|
||
|
Array.prototype.forEach.call(arguments, arrayBuffer => {
|
||
|
view.set(new Uint8Array(arrayBuffer), offset);
|
||
|
offset += arrayBuffer.byteLength;
|
||
|
});
|
||
|
return view.buffer;
|
||
|
}
|
||
|
|
||
|
function concatMediaData() {
|
||
|
return new Promise((resolve, reject) => {
|
||
|
var segments = new Array(100);
|
||
|
segments.fill(loader.everyMediaSegment);
|
||
|
longMediaSegment = concatArrayBuffers.apply(this, segments);
|
||
|
resolve(longMediaSegment);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
window.addEventListener('load', () => {
|
||
|
PerfTestRunner.prepareToMeasureValuesAsync({
|
||
|
unit: 'ms',
|
||
|
done: function () {
|
||
|
if (video) {
|
||
|
video.src = null;
|
||
|
video.load();
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
|
||
|
loader = new MediaSourceLoader('test-fragmented-video.json');
|
||
|
loader.loadMediaData().then(concatMediaData).then(runTest);
|
||
|
});
|
||
|
|
||
|
function remove30SecondsAtATimeTillEmpty(sourceBuffer) {
|
||
|
return new Promise(resolve => {
|
||
|
var removeNext30Seconds = () => {
|
||
|
var start = sourceBuffer.buffered.start(0);
|
||
|
sourceBuffer.remove(start, start + 30)
|
||
|
}
|
||
|
sourceBuffer.onupdate = () => {
|
||
|
if (sourceBuffer.buffered.length == 0 || sourceBuffer.buffered.start(0) - sourceBuffer.buffered.end(0) == 0) {
|
||
|
sourceBuffer.onupdate = null;
|
||
|
resolve();
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
removeNext30Seconds();
|
||
|
};
|
||
|
removeNext30Seconds();
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function runTest() {
|
||
|
video = document.createElement('video');
|
||
|
|
||
|
loadMediaDataIntoVideo(video).then(sourceBuffer => {
|
||
|
startTime = PerfTestRunner.now();
|
||
|
return remove30SecondsAtATimeTillEmpty(sourceBuffer);
|
||
|
}).then(() => {
|
||
|
if (PerfTestRunner.measureValueAsync(PerfTestRunner.now() - startTime))
|
||
|
setTimeout(runTest, 0);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function loadMediaDataIntoVideo(video, segmentCount) {
|
||
|
return new Promise((resolve, reject) => {
|
||
|
var source = new MediaSource();
|
||
|
source.onsourceopen = () => {
|
||
|
source.onsourceopen = null;
|
||
|
source.duration = loader.duration * 100;
|
||
|
var currentMediaSegment = 0;
|
||
|
var sourceBuffer = source.addSourceBuffer(loader.type);
|
||
|
sourceBuffer.mode = 'sequence';
|
||
|
sourceBuffer.appendBuffer(loader.initSegment);
|
||
|
|
||
|
var appendedMediaSegment = false;
|
||
|
sourceBuffer.onupdate = () => {
|
||
|
|
||
|
if (appendedMediaSegment) {
|
||
|
if (source.readyState !== 'ended') {
|
||
|
source.endOfStream();
|
||
|
sourceBuffer.onupdate = null;
|
||
|
sourceBuffer.onerror = null;
|
||
|
resolve(sourceBuffer);
|
||
|
}
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
sourceBuffer.appendBuffer(longMediaSegment);
|
||
|
appendedMediaSegment = true;
|
||
|
};
|
||
|
sourceBuffer.onerror = error => {
|
||
|
reject(error);
|
||
|
};
|
||
|
};
|
||
|
video.src = URL.createObjectURL(source);
|
||
|
});
|
||
|
}
|
||
|
</script>
|
||
|
</head>
|
||
|
<body>
|
||
|
</body>
|
||
|
</html>
|