jmuxer 2.0.1 → 2.0.4

package/src/jmuxer.js

@@ -8,19 +8,22 @@ import RemuxController from './controller/remux.js';
 import BufferController from './controller/buffer.js';
 import { Duplex } from 'stream';
 
-export default class JMuxmer extends Event {
+export default class JMuxer extends Event {
     static isSupported(codec) {
         return (window.MediaSource && window.MediaSource.isTypeSupported(codec));
     }
 
     constructor(options) {
         super('jmuxer');
+        this.isReset = false;
         let defaults = {
             node: '',
             mode: 'both', // both, audio, video
-            flushingTime: 1500,
+            flushingTime: 500,
+            maxDelay: 500,
             clearBuffer: true,
             fps: 30,
+            readFpsFromTrack: false, // set true to fetch fps value from NALu
             debug: false,
             onReady: function() {}, // function called when MSE is ready to accept frames
             onError: function() {}, // function called when jmuxer encounters any buffer related error
@@ -37,11 +40,8 @@ export default class JMuxmer extends Event {
         this.frameDuration = (1000 / this.options.fps) | 0;
         this.remuxController = new RemuxController(this.env);
         this.remuxController.addTrack(this.options.mode);
-        this.lastCleaningTime = Date.now();
-        this.kfPosition = [];
-        this.kfCounter  = 0;
-        this.pendingUnits = {};
-        this.remainingData = new Uint8Array();
+
+        this.initData();
 
         /* events callback */
         this.remuxController.on('buffer', this.onBuffer.bind(this));
@@ -49,6 +49,14 @@ export default class JMuxmer extends Event {
             this.remuxController.on('ready', this.createBuffer.bind(this));
             this.initBrowser();
         }
+    }
+
+    initData() {
+        this.lastCleaningTime = Date.now();
+        this.kfPosition = [];
+        this.kfCounter = 0;
+        this.pendingUnits = {};
+        this.remainingData = new Uint8Array();
         this.startInterval();
     }
 
@@ -59,7 +67,6 @@ export default class JMuxmer extends Event {
         this.node = typeof this.options.node === 'string' ? document.getElementById(this.options.node) : this.options.node;
         this.mseReady = false;
         this.setupMSE();
-        this.sourceBuffers = {};
     }
 
     createStream() {
@@ -88,13 +95,26 @@ export default class JMuxmer extends Event {
         }
         this.isMSESupported = !!window.MediaSource;
         this.mediaSource = new MediaSource();
-        this.node.src = URL.createObjectURL(this.mediaSource);
+        this.url = URL.createObjectURL(this.mediaSource);
+        this.node.src = this.url;
+        this.mseEnded = false;
         this.mediaSource.addEventListener('sourceopen', this.onMSEOpen.bind(this));
         this.mediaSource.addEventListener('sourceclose', this.onMSEClose.bind(this));
         this.mediaSource.addEventListener('webkitsourceopen', this.onMSEOpen.bind(this));
         this.mediaSource.addEventListener('webkitsourceclose', this.onMSEClose.bind(this));
     }
 
+    endMSE() {
+        if (!this.mseEnded) {
+            try {
+                this.mseEnded = true;
+                this.mediaSource.endOfStream();
+            } catch (e) {
+                debug.error('mediasource is not available to end');
+            }
+        }
+    }
+
     feed(data) {
         let remux = false,
             slices,
@@ -107,20 +127,28 @@ export default class JMuxmer extends Event {
 
         if (!data || !this.remuxController) return;
         duration = data.duration ? parseInt(data.duration) : 0;
+
         if (data.video) {
             data.video = appendByteArray(this.remainingData, data.video);
             [slices, left] = H264Parser.extractNALu(data.video);
+            this.remainingData = left || new Uint8Array();
+
             if (slices.length > 0) {
                 chunks.video = this.getVideoFrames(slices, duration);
                 remux = true;
+            } else {
+                debug.error('Failed to extract any NAL units from video data:', left);
+                return;
             }
-            this.remainingData = left || new Uint8Array();
         }
         if (data.audio) {
             slices = AACParser.extractAAC(data.audio);
             if (slices.length > 0) {
                 chunks.audio = this.getAudioFrames(slices, duration);
                 remux = true;
+            } else {
+                debug.error('Failed to extract audio data from:', data.audio);
+                return;
             }
         }
         if (!remux) {
@@ -138,9 +166,9 @@ export default class JMuxmer extends Event {
             keyFrame = false,
             vcl = false;
         if (this.pendingUnits.units) {
-            units      = this.pendingUnits.units;
-            vcl        = this.pendingUnits.vcl;
-            keyFrame   = this.pendingUnits.keyFrame;
+            units = this.pendingUnits.units;
+            vcl = this.pendingUnits.vcl;
+            keyFrame = this.pendingUnits.keyFrame;
             this.pendingUnits = {};
         }
         for (let nalu of nalus) {
@@ -177,12 +205,14 @@ export default class JMuxmer extends Event {
                 });
             } else {
                 let last = frames.length - 1;
-                frames[last].units = frames[last].units.concat(units);
+                if (last >= 0) {
+                    frames[last].units = frames[last].units.concat(units);
+                }
             }
         }
         fd = duration ? duration / frames.length | 0 : this.frameDuration;
         tt = duration ? (duration - (fd * frames.length)) : 0;
-        
+
         frames.map((frame) => {
             frame.duration = fd;
             if (tt > 0) {
@@ -204,7 +234,7 @@ export default class JMuxmer extends Event {
             tt = 0;
 
         for (let units of aacFrames) {
-            frames.push({units});
+            frames.push({ units });
         }
         fd = duration ? duration / frames.length | 0 : this.frameDuration;
         tt = duration ? (duration - (fd * frames.length)) : 0;
@@ -220,16 +250,6 @@ export default class JMuxmer extends Event {
 
     destroy() {
         this.stopInterval();
-        if (this.mediaSource) {
-            try {
-                if (this.bufferControllers) {
-                    this.mediaSource.endOfStream();
-                }
-            } catch (e) {
-                debug.error(`mediasource is not available to end ${e.message}`);
-            }
-            this.mediaSource = null;
-        }
         if (this.stream) {
             this.remuxController.flush();
             this.stream.push(null);
@@ -244,10 +264,33 @@ export default class JMuxmer extends Event {
                 this.bufferControllers[type].destroy();
             }
             this.bufferControllers = null;
+            this.endMSE();
         }
         this.node = false;
         this.mseReady = false;
         this.videoStarted = false;
+        this.mediaSource = null;
+    }
+
+    reset() {
+        this.stopInterval();
+        this.isReset = true;
+        this.node.pause();
+        if (this.remuxController) {
+            this.remuxController.reset();
+        }
+        if (this.bufferControllers) {
+            for (let type in this.bufferControllers) {
+                this.bufferControllers[type].destroy();
+            }
+            this.bufferControllers = null;
+            this.endMSE();
+        }
+        this.initData();
+        if (this.env == 'browser') {
+            this.initBrowser();
+        }
+        debug.log('JMuxer was reset');
     }
 
     createBuffer() {
@@ -255,24 +298,24 @@ export default class JMuxmer extends Event {
         this.bufferControllers = {};
         for (let type in this.remuxController.tracks) {
             let track = this.remuxController.tracks[type];
-            if (!JMuxmer.isSupported(`${type}/mp4; codecs="${track.mp4track.codec}"`)) {
+            if (!JMuxer.isSupported(`${type}/mp4; codecs="${track.mp4track.codec}"`)) {
                 debug.error('Browser does not support codec');
                 return false;
             }
             let sb = this.mediaSource.addSourceBuffer(`${type}/mp4; codecs="${track.mp4track.codec}"`);
             this.bufferControllers[type] = new BufferController(sb, type);
-            this.sourceBuffers[type] = sb;
             this.bufferControllers[type].on('error', this.onBufferError.bind(this));
         }
     }
 
     startInterval() {
-        this.interval = setInterval(()=>{
-            if (this.bufferControllers) {
-                this.releaseBuffer();
-                this.clearBuffer();
+        this.interval = setInterval(() => {
+            if (this.options.flushingTime) {
+                this.applyAndClearBuffer();
+            } else if (this.bufferControllers) {
+                this.cancelDelay();
             }
-        }, this.options.flushingTime);
+        }, this.options.flushingTime || 1000);
     }
 
     stopInterval() {
@@ -281,12 +324,29 @@ export default class JMuxmer extends Event {
         }
     }
 
+    cancelDelay() {
+        if (this.node.buffered && this.node.buffered.length > 0 && !this.node.seeking) {
+            const end = this.node.buffered.end(0);
+            if (end - this.node.currentTime > (this.options.maxDelay / 1000)) {
+                console.log('delay');
+                this.node.currentTime = end - 0.001;
+            }
+        }
+    }
+
     releaseBuffer() {
         for (let type in this.bufferControllers) {
             this.bufferControllers[type].doAppend();
         }
     }
 
+    applyAndClearBuffer() {
+        if (this.bufferControllers) {
+            this.releaseBuffer();
+            this.clearBuffer();
+        }
+    }
+
     getSafeClearOffsetOfBuffer(offset) {
         let maxLimit = (this.options.mode === 'audio' && offset) || 0,
             adjacentOffset;
@@ -297,7 +357,7 @@ export default class JMuxmer extends Event {
             adjacentOffset = this.kfPosition[i];
         }
         if (adjacentOffset) {
-            this.kfPosition = this.kfPosition.filter( kfDelimiter => {
+            this.kfPosition = this.kfPosition.filter(kfDelimiter => {
                 if (kfDelimiter < adjacentOffset) {
                     maxLimit = kfDelimiter;
                 }
@@ -318,22 +378,31 @@ export default class JMuxmer extends Event {
     }
 
     onBuffer(data) {
+        if (this.options.readFpsFromTrack && typeof data.fps !== 'undefined' && this.options.fps != data.fps) {
+            this.options.fps = data.fps;
+            this.frameDuration = Math.ceil(1000 / data.fps);
+            debug.log(`JMuxer changed FPS to ${data.fps} from track data`);
+        }
         if (this.env == 'browser') {
             if (this.bufferControllers && this.bufferControllers[data.type]) {
                 this.bufferControllers[data.type].feed(data.payload);
             }
-        } else if(this.stream) {
+        } else if (this.stream) {
             this.stream.push(data.payload);
         }
+        if (this.options.flushingTime === 0) {
+            this.applyAndClearBuffer();
+        }
     }
 
     /* Events on MSE */
     onMSEOpen() {
         this.mseReady = true;
+        URL.revokeObjectURL(this.url);
+        // this.createBuffer();
         if (typeof this.options.onReady === 'function') {
-            this.options.onReady.call(null);
+            this.options.onReady.call(null, this.isReset);
         }
-        this.createBuffer();
     }
 
     onMSEClose() {
@@ -342,23 +411,20 @@ export default class JMuxmer extends Event {
     }
 
     onBufferError(data) {
-        if (typeof this.options.onError === 'function') {
-            this.options.onError.call(null, data);
-        }
         if (data.name == 'QuotaExceeded') {
+            debug.log(`JMuxer cleaning ${data.type} buffer due to QuotaExceeded error`);
             this.bufferControllers[data.type].initCleanup(this.node.currentTime);
             return;
         }
-
-        if (this.mediaSource.sourceBuffers.length > 0 && this.sourceBuffers[data.type]) {
-            this.mediaSource.removeSourceBuffer(this.sourceBuffers[data.type]);
+        else if (data.name == 'InvalidStateError') {
+            debug.log('JMuxer is reseting due to InvalidStateError');
+            this.reset();
         }
-        if (this.mediaSource.sourceBuffers.length == 0) {
-            try {
-                this.mediaSource.endOfStream();
-            } catch (e) {
-                debug.error('mediasource is not available to end');
-            }
+        else {
+            this.endMSE();
+        }
+        if (typeof this.options.onError === 'function') {
+            this.options.onError.call(null, data);
         }
     }
-}
+}

package/src/parsers/h264.js

@@ -98,8 +98,30 @@ export class H264Parser {
             picWidthInMbsMinus1,
             picHeightInMapUnitsMinus1,
             frameMbsOnlyFlag,
-            scalingListCount;
-        decoder.readUByte();
+            scalingListCount,
+            fps = 0;
+        decoder.readUByte(); // skip NAL header
+
+        // rewrite NAL
+        let rbsp = [],
+            hdr_bytes = 1,
+            nal_bytes = data.byteLength;
+        for (let i = hdr_bytes; i < nal_bytes; i ++) {
+            if ((i + 2) < nal_bytes && decoder.readBits(24, false) === 0x000003) {
+                rbsp.push(decoder.readBits(8));
+                rbsp.push(decoder.readBits(8));
+                i += 2;
+
+                // emulation_prevention_three_byte
+                decoder.readBits(8);
+            }
+            else {
+                rbsp.push(decoder.readBits(8));
+            }
+        }
+        decoder.setData(new Uint8Array(rbsp));
+        // end of rewrite data
+
         profileIdc = decoder.readUByte(); // profile_idc
         profileCompat = decoder.readBits(5); // constraint_set[0-4]_flag, u(5)
         decoder.skipBits(3); // reserved_zero_3bits u(3),
@@ -191,7 +213,7 @@ export class H264Parser {
                         break;
                     }
                 }
-                if (sarRatio) {
+                if (sarRatio && sarRatio[0] > 0 && sarRatio[1] > 0) {
                     sarScale = sarRatio[0] / sarRatio[1];
                 }
             }
@@ -212,9 +234,14 @@ export class H264Parser {
                 let timeScale = decoder.readUInt();
                 let fixedFrameRate = decoder.readBoolean();
                 let frameDuration = timeScale / (2 * unitsInTick);
+
+                if (fixedFrameRate) {
+                    fps = frameDuration;
+                }
             }
         }
         return {
+            fps: fps > 0 ? fps : undefined,
             width: Math.ceil((((picWidthInMbsMinus1 + 1) * 16) - frameCropLeftOffset * 2 - frameCropRightOffset * 2) * sarScale),
             height: ((2 - frameMbsOnlyFlag) * (picHeightInMapUnitsMinus1 + 1) * 16) - ((frameMbsOnlyFlag ? 2 : 4) * (frameCropTopOffset + frameCropBottomOffset)),
         };
@@ -229,12 +256,12 @@ export class H264Parser {
     constructor(remuxer) {
         this.remuxer = remuxer;
         this.track = remuxer.mp4track;
-        this.isSafari = remuxer.env = 'browser' && /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor);
     }
 
     parseSPS(sps) {
         var config = H264Parser.readSPS(new Uint8Array(sps));
 
+        this.track.fps = config.fps;
         this.track.width = config.width;
         this.track.height = config.height;
         this.track.sps = [new Uint8Array(sps)];
@@ -273,15 +300,13 @@ export class H264Parser {
                 push = true;
                 break;
             case NALU.SPS:
-                if (!this.track.sps || this.isSafari) {
+                if (!this.track.sps) {
                     this.parseSPS(unit.getPayload());
                     if (!this.remuxer.readyToDecode && this.track.pps && this.track.sps) {
                         this.remuxer.readyToDecode = true;
                     }
                 }
-                if (!this.isSafari) {
-                    push = true;
-                }
+                push = true;
                 break;
             case NALU.AUD:
                 debug.log('AUD - ignoing');

package/src/remuxer/aac.js

@@ -4,12 +4,11 @@ import { BaseRemuxer } from './base.js';
 
 export class AACRemuxer extends BaseRemuxer {
 
-    constructor(timescale, env) {
+    constructor(timescale) {
         super();
         this.readyToDecode = false;
         this.nextDts = 0;
         this.dts = 0;
-        this.env = env;
         this.mp4track = {
             id: BaseRemuxer.getTrackID(),
             type: 'audio',
@@ -22,7 +21,6 @@ export class AACRemuxer extends BaseRemuxer {
             config: '',
             codec: '',
         };
-
         this.samples = [];
         this.aac = new AACParser(this);
     }
@@ -33,6 +31,8 @@ export class AACRemuxer extends BaseRemuxer {
         this.mp4track.channelCount = '';
         this.mp4track.config = '';
         this.mp4track.timescale = this.timescale;
+        this.nextDts = 0;
+        this.dts = 0;
     }
 
     remux(frames) {

package/src/remuxer/h264.js

@@ -4,12 +4,11 @@ import { BaseRemuxer } from './base.js';
 
 export class H264Remuxer extends BaseRemuxer {
 
-    constructor(timescale, env) {
+    constructor(timescale) {
         super();
         this.readyToDecode = false;
         this.nextDts = 0;
         this.dts = 0;
-        this.env = env;
         this.mp4track = {
             id: BaseRemuxer.getTrackID(),
             type: 'video',
@@ -17,6 +16,7 @@ export class H264Remuxer extends BaseRemuxer {
             fragmented: true,
             sps: '',
             pps: '',
+            fps: 30,
             width: 0,
             height: 0,
             timescale: timescale,
@@ -31,6 +31,8 @@ export class H264Remuxer extends BaseRemuxer {
         this.readyToDecode = false;
         this.mp4track.sps = '';
         this.mp4track.pps = '';
+        this.nextDts = 0;
+        this.dts = 0;
     }
 
     remux(frames) {
@@ -99,7 +101,7 @@ export class H264Remuxer extends BaseRemuxer {
         }
 
         if (!samples.length) return null;
-        
+
         return new Uint8Array(payload.buffer, 0, this.mp4track.len);
     }
 }

package/src/util/exp-golomb.js

@@ -10,6 +10,12 @@ export class ExpGolomb {
         this.bitLength = data.byteLength * 8;
     }
 
+    setData(data) {
+        this.data = data;
+        this.index = 0;
+        this.bitLength = data.byteLength * 8;
+    }
+
     get bitsAvailable() {
         return this.bitLength - this.index;
     }