mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update components
This commit is contained in:
parent
3e61abaf71
commit
73b495f48c
62 changed files with 875 additions and 512 deletions
|
@ -67,7 +67,7 @@ class BufferController extends EventHandler {
|
|||
this.mediaSource = null;
|
||||
this.media = null;
|
||||
this.pendingTracks = null;
|
||||
this.sourceBuffer = null;
|
||||
this.sourceBuffer = {};
|
||||
}
|
||||
this.onmso = this.onmse = this.onmsc = null;
|
||||
this.hls.trigger(Event.MEDIA_DETACHED);
|
||||
|
@ -122,18 +122,16 @@ class BufferController extends EventHandler {
|
|||
|
||||
onBufferReset() {
|
||||
var sourceBuffer = this.sourceBuffer;
|
||||
if (sourceBuffer) {
|
||||
for(var type in sourceBuffer) {
|
||||
var sb = sourceBuffer[type];
|
||||
try {
|
||||
this.mediaSource.removeSourceBuffer(sb);
|
||||
sb.removeEventListener('updateend', this.onsbue);
|
||||
sb.removeEventListener('error', this.onsbe);
|
||||
} catch(err) {
|
||||
}
|
||||
for(var type in sourceBuffer) {
|
||||
var sb = sourceBuffer[type];
|
||||
try {
|
||||
this.mediaSource.removeSourceBuffer(sb);
|
||||
sb.removeEventListener('updateend', this.onsbue);
|
||||
sb.removeEventListener('error', this.onsbe);
|
||||
} catch(err) {
|
||||
}
|
||||
this.sourceBuffer = null;
|
||||
}
|
||||
this.sourceBuffer = {};
|
||||
this.flushRange = [];
|
||||
this.appended = 0;
|
||||
}
|
||||
|
@ -146,19 +144,24 @@ class BufferController extends EventHandler {
|
|||
return;
|
||||
}
|
||||
|
||||
if (!this.sourceBuffer) {
|
||||
var sourceBuffer = {}, mediaSource = this.mediaSource;
|
||||
for (trackName in tracks) {
|
||||
var sourceBuffer = this.sourceBuffer,mediaSource = this.mediaSource;
|
||||
|
||||
for (trackName in tracks) {
|
||||
if(!sourceBuffer[trackName]) {
|
||||
track = tracks[trackName];
|
||||
// use levelCodec as first priority
|
||||
codec = track.levelCodec || track.codec;
|
||||
mimeType = `${track.container};codecs=${codec}`;
|
||||
logger.log(`creating sourceBuffer with mimeType:${mimeType}`);
|
||||
sb = sourceBuffer[trackName] = mediaSource.addSourceBuffer(mimeType);
|
||||
sb.addEventListener('updateend', this.onsbue);
|
||||
sb.addEventListener('error', this.onsbe);
|
||||
try {
|
||||
sb = sourceBuffer[trackName] = mediaSource.addSourceBuffer(mimeType);
|
||||
sb.addEventListener('updateend', this.onsbue);
|
||||
sb.addEventListener('error', this.onsbe);
|
||||
} catch(err) {
|
||||
logger.error(`error while trying to add sourceBuffer:${err.message}`);
|
||||
this.hls.trigger(Event.ERROR, {type: ErrorTypes.MEDIA_ERROR, details: ErrorDetails.BUFFER_ADD_CODEC_ERROR, fatal: false, err: err, mimeType : mimeType});
|
||||
}
|
||||
}
|
||||
this.sourceBuffer = sourceBuffer;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -223,10 +226,8 @@ class BufferController extends EventHandler {
|
|||
// let's recompute this.appended, which is used to avoid flush looping
|
||||
var appended = 0;
|
||||
var sourceBuffer = this.sourceBuffer;
|
||||
if (sourceBuffer) {
|
||||
for (var type in sourceBuffer) {
|
||||
appended += sourceBuffer[type].buffered.length;
|
||||
}
|
||||
for (var type in sourceBuffer) {
|
||||
appended += sourceBuffer[type].buffered.length;
|
||||
}
|
||||
this.appended = appended;
|
||||
this.hls.trigger(Event.BUFFER_FLUSHED);
|
||||
|
@ -251,9 +252,16 @@ class BufferController extends EventHandler {
|
|||
var segment = segments.shift();
|
||||
try {
|
||||
//logger.log(`appending ${segment.type} SB, size:${segment.data.length});
|
||||
sourceBuffer[segment.type].appendBuffer(segment.data);
|
||||
this.appendError = 0;
|
||||
this.appended++;
|
||||
if(sourceBuffer[segment.type]) {
|
||||
sourceBuffer[segment.type].appendBuffer(segment.data);
|
||||
this.appendError = 0;
|
||||
this.appended++;
|
||||
} else {
|
||||
// in case we don't have any source buffer matching with this segment type,
|
||||
// it means that Mediasource fails to create sourcebuffer
|
||||
// discard this segment, and trigger update end
|
||||
this.onSBUpdateEnd();
|
||||
}
|
||||
} catch(err) {
|
||||
// in case any error occured while appending, put back segment in segments table
|
||||
logger.error(`error while trying to append buffer:${err.message}`);
|
||||
|
|
|
@ -8,20 +8,30 @@ import EventHandler from '../event-handler';
|
|||
class CapLevelController extends EventHandler {
|
||||
constructor(hls) {
|
||||
super(hls,
|
||||
Event.FPS_DROP_LEVEL_CAPPING,
|
||||
Event.MEDIA_ATTACHING,
|
||||
Event.MANIFEST_PARSED);
|
||||
}
|
||||
|
||||
destroy() {
|
||||
if (this.hls.config.capLevelToPlayerSize) {
|
||||
this.media = null;
|
||||
this.media = this.restrictedLevels = null;
|
||||
this.autoLevelCapping = Number.POSITIVE_INFINITY;
|
||||
if (this.timer) {
|
||||
this.timer = clearInterval(this.timer);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
onFpsDropLevelCapping(data) {
|
||||
if (!this.restrictedLevels) {
|
||||
this.restrictedLevels = [];
|
||||
}
|
||||
if (!this.isLevelRestricted(data.droppedLevel)) {
|
||||
this.restrictedLevels.push(data.droppedLevel);
|
||||
}
|
||||
}
|
||||
|
||||
onMediaAttaching(data) {
|
||||
this.media = data.media instanceof HTMLVideoElement ? data.media : null;
|
||||
}
|
||||
|
@ -56,7 +66,7 @@ class CapLevelController extends EventHandler {
|
|||
* returns level should be the one with the dimensions equal or greater than the media (player) dimensions (so the video will be downscaled)
|
||||
*/
|
||||
getMaxLevel(capLevelIndex) {
|
||||
let result,
|
||||
let result = 0,
|
||||
i,
|
||||
level,
|
||||
mWidth = this.mediaWidth,
|
||||
|
@ -66,6 +76,9 @@ class CapLevelController extends EventHandler {
|
|||
|
||||
for (i = 0; i <= capLevelIndex; i++) {
|
||||
level = this.levels[i];
|
||||
if (this.isLevelRestricted(i)) {
|
||||
break;
|
||||
}
|
||||
result = i;
|
||||
lWidth = level.width;
|
||||
lHeight = level.height;
|
||||
|
@ -76,6 +89,10 @@ class CapLevelController extends EventHandler {
|
|||
return result;
|
||||
}
|
||||
|
||||
isLevelRestricted(level) {
|
||||
return (this.restrictedLevels && this.restrictedLevels.indexOf(level) !== -1) ? true : false;
|
||||
}
|
||||
|
||||
get contentScaleFactor() {
|
||||
let pixelRatio = 1;
|
||||
try {
|
||||
|
|
|
@ -3,46 +3,72 @@
|
|||
*/
|
||||
|
||||
import Event from '../events';
|
||||
import EventHandler from '../event-handler';
|
||||
import {logger} from '../utils/logger';
|
||||
|
||||
class FPSController {
|
||||
class FPSController extends EventHandler{
|
||||
|
||||
constructor(hls) {
|
||||
this.hls = hls;
|
||||
this.timer = setInterval(this.checkFPS, hls.config.fpsDroppedMonitoringPeriod);
|
||||
super(hls, Event.MEDIA_ATTACHING);
|
||||
}
|
||||
|
||||
destroy() {
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
this.isVideoPlaybackQualityAvailable = false;
|
||||
}
|
||||
|
||||
checkFPS() {
|
||||
var v = this.hls.video;
|
||||
if (v) {
|
||||
var decodedFrames = v.webkitDecodedFrameCount, droppedFrames = v.webkitDroppedFrameCount, currentTime = new Date();
|
||||
if (decodedFrames) {
|
||||
if (this.lastTime) {
|
||||
var currentPeriod = currentTime - this.lastTime;
|
||||
var currentDropped = droppedFrames - this.lastDroppedFrames;
|
||||
var currentDecoded = decodedFrames - this.lastDecodedFrames;
|
||||
var decodedFPS = 1000 * currentDecoded / currentPeriod;
|
||||
var droppedFPS = 1000 * currentDropped / currentPeriod;
|
||||
if (droppedFPS > 0) {
|
||||
logger.log(`checkFPS : droppedFPS/decodedFPS:${droppedFPS.toFixed(1)}/${decodedFPS.toFixed(1)}`);
|
||||
if (currentDropped > this.hls.config.fpsDroppedMonitoringThreshold * currentDecoded) {
|
||||
logger.warn('drop FPS ratio greater than max allowed value');
|
||||
this.hls.trigger(Event.FPS_DROP, {currentDropped: currentDropped, currentDecoded: currentDecoded, totalDroppedFrames: droppedFrames});
|
||||
|
||||
onMediaAttaching(data) {
|
||||
if (this.hls.config.capLevelOnFPSDrop) {
|
||||
this.video = data.media instanceof HTMLVideoElement ? data.media : null;
|
||||
if (typeof this.video.getVideoPlaybackQuality === 'function') {
|
||||
this.isVideoPlaybackQualityAvailable = true;
|
||||
}
|
||||
clearInterval(this.timer);
|
||||
this.timer = setInterval(this.checkFPSInterval.bind(this), this.hls.config.fpsDroppedMonitoringPeriod);
|
||||
}
|
||||
}
|
||||
|
||||
checkFPS(video, decodedFrames, droppedFrames) {
|
||||
let currentTime = performance.now();
|
||||
if (decodedFrames) {
|
||||
if (this.lastTime) {
|
||||
let currentPeriod = currentTime - this.lastTime,
|
||||
currentDropped = droppedFrames - this.lastDroppedFrames,
|
||||
currentDecoded = decodedFrames - this.lastDecodedFrames,
|
||||
droppedFPS = 1000 * currentDropped / currentPeriod;
|
||||
this.hls.trigger(Event.FPS_DROP, {currentDropped: currentDropped, currentDecoded: currentDecoded, totalDroppedFrames: droppedFrames});
|
||||
if (droppedFPS > 0) {
|
||||
//logger.log('checkFPS : droppedFPS/decodedFPS:' + droppedFPS/(1000 * currentDecoded / currentPeriod));
|
||||
if (currentDropped > this.hls.config.fpsDroppedMonitoringThreshold * currentDecoded) {
|
||||
let currentLevel = this.hls.currentLevel;
|
||||
logger.warn('drop FPS ratio greater than max allowed value for currentLevel: ' + currentLevel);
|
||||
if (currentLevel > 0 && (this.hls.autoLevelCapping === -1 || this.hls.autoLevelCapping >= currentLevel)) {
|
||||
currentLevel = currentLevel - 1;
|
||||
this.hls.trigger(Event.FPS_DROP_LEVEL_CAPPING, {level: currentLevel, droppedLevel: this.hls.currentLevel});
|
||||
this.hls.autoLevelCapping = currentLevel;
|
||||
this.hls.streamController.nextLevelSwitch();
|
||||
}
|
||||
}
|
||||
}
|
||||
this.lastTime = currentTime;
|
||||
this.lastDroppedFrames = droppedFrames;
|
||||
this.lastDecodedFrames = decodedFrames;
|
||||
}
|
||||
this.lastTime = currentTime;
|
||||
this.lastDroppedFrames = droppedFrames;
|
||||
this.lastDecodedFrames = decodedFrames;
|
||||
}
|
||||
}
|
||||
|
||||
checkFPSInterval() {
|
||||
if (this.video) {
|
||||
if (this.isVideoPlaybackQualityAvailable) {
|
||||
let videoPlaybackQuality = this.video.getVideoPlaybackQuality();
|
||||
this.checkFPS(this.video, videoPlaybackQuality.totalVideoFrames, videoPlaybackQuality.droppedVideoFrames);
|
||||
} else {
|
||||
this.checkFPS(this.video, this.video.webkitDecodedFrameCount, this.video.webkitDroppedFrameCount);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default FPSController;
|
||||
|
|
|
@ -234,10 +234,15 @@ class LevelController extends EventHandler {
|
|||
|
||||
onLevelLoaded(data) {
|
||||
// check if current playlist is a live playlist
|
||||
if (data.details.live && !this.timer) {
|
||||
if (data.details.live) {
|
||||
// if live playlist we will have to reload it periodically
|
||||
// set reload period to playlist target duration
|
||||
this.timer = setInterval(this.ontick, 1000 * data.details.targetduration);
|
||||
// set reload period to average of the frag duration, if average not set then use playlist target duration
|
||||
let timerInterval = data.details.averagetargetduration ? data.details.averagetargetduration : data.details.targetduration;
|
||||
if (!this.timer || timerInterval !== this.timerInterval) {
|
||||
clearInterval(this.timer);
|
||||
this.timer = setInterval(this.ontick, 1000 * timerInterval);
|
||||
this.timerInterval = timerInterval;
|
||||
}
|
||||
}
|
||||
if (!data.details.live && this.timer) {
|
||||
// playlist is not live and timer is armed : stopping it
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue