libpgs - npm Package Compare versions

Comparing version 0.4.1 to 0.5.0

dist/libpgs.js

@@ -1,1 +0,1 @@
-var e=function(){function e(){}return e.getIndexFromTimestamps=function(e,t){var s=1e3*e*90,i=-1;if(t.length>0&&s<t[t.length-1])for(var o=0,r=t;o<r.length;o++){if(r[o]>s)break;i++}return i},e}(),t=function(){function t(e){var t,s,i=this;if(this.$timeOffset=0,this.onTimeUpdate=function(){i.renderAtVideoTimestamp()},this.updateTimestamps=[],this.previousTimestampIndex=0,this.onWorkerMessage=function(e){if("updateTimestamps"===e.data.op)i.updateTimestamps=e.data.updateTimestamps,i.renderAtVideoTimestamp()},e.video&&(this.video=e.video),e.canvas)this.canvas=e.canvas,this.canvasOwner=!1;else{if(!this.video)throw new Error("No canvas or video element was provided!");this.canvas=this.createCanvasElement(),this.canvasOwner=!0,this.video.parentElement.appendChild(this.canvas)}var o=this.canvas.transferControlToOffscreen(),r=null!==(t=e.workerUrl)&&void 0!==t?t:"libpgs.worker.js";this.worker=new Worker(r),this.worker.onmessage=this.onWorkerMessage,this.worker.postMessage({op:"init",canvas:o},[o]),this.$timeOffset=null!==(s=e.timeOffset)&&void 0!==s?s:0,e.subUrl&&this.loadFromUrl(e.subUrl),this.registerVideoEvents()}return Object.defineProperty(t.prototype,"timeOffset",{get:function(){return this.$timeOffset},set:function(e){this.$timeOffset!==e&&(this.$timeOffset=e,this.renderAtVideoTimestamp())},enumerable:!1,configurable:!0}),t.prototype.registerVideoEvents=function(){this.video&&this.video.addEventListener("timeupdate",this.onTimeUpdate)},t.prototype.unregisterVideoEvents=function(){this.video&&this.video.removeEventListener("timeupdate",this.onTimeUpdate)},t.prototype.renderAtVideoTimestamp=function(){this.video&&this.renderAtTimestamp(this.video.currentTime+this.$timeOffset)},t.prototype.createCanvasElement=function(){var e=document.createElement("canvas");return e.style.position="absolute",e.style.top="0",e.style.left="0",e.style.right="0",e.style.bottom="0",e.style.pointerEvents="none",e.style.objectFit="contain",e.style.width="100%",e.style.height="100%",e},t.prototype.destroyCanvasElement=function(){this.canvas.remove()},t.prototype.renderAtTimestamp=function(t){var s=e.getIndexFromTimestamps(t,this.updateTimestamps);this.previousTimestampIndex!==s&&(this.previousTimestampIndex=s,this.worker.postMessage({op:"render",index:s}))},t.prototype.loadFromUrl=function(e){this.worker.postMessage({op:"loadFromUrl",url:e})},t.prototype.loadFromBuffer=function(e){this.worker.postMessage({op:"loadFromBuffer",buffer:e})},t.prototype.dispose=function(){this.worker.terminate(),this.unregisterVideoEvents(),this.canvasOwner&&this.destroyCanvasElement()},t}();export{t as PgsRenderer};
+var t=function(e,i){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])},t(e,i)};function e(e,i){if("function"!=typeof i&&null!==i)throw new TypeError("Class extends value "+String(i)+" is not a constructor or null");function o(){this.constructor=e}t(e,i),e.prototype=null===i?Object.create(i):(o.prototype=i.prototype,new o)}"function"==typeof SuppressedError&&SuppressedError;var i=function(){function t(){}return t.getIndexFromTimestamps=function(t,e){var i=1e3*t*90,o=-1;if(e.length>0&&i<e[e.length-1])for(var n=0,s=e;n<s.length;n++){if(s[n]>i)break;o++}return o},t}(),o=function(t){function i(e){var i,o=t.call(this)||this;o.$onWorkerMessage=function(t){o.onWorkerMessage(t)};var n=null!==(i=e.workerUrl)&&void 0!==i?i:"libpgs.worker.js";return o.worker=new Worker(n),o.worker.onmessage=o.$onWorkerMessage,o}return e(i,t),i.prototype.loadFromUrl=function(t){this.worker.postMessage({op:"loadFromUrl",url:t})},i.prototype.loadFromBuffer=function(t){this.worker.postMessage({op:"loadFromBuffer",buffer:t})},i.prototype.onWorkerMessage=function(t){if("updateTimestamps"===t.data.op)this.updateTimestamps=t.data.updateTimestamps,this.onTimestampsUpdated&&this.onTimestampsUpdated()},i.prototype.dispose=function(){this.worker.terminate()},i}(function(){function t(){this.updateTimestamps=[],this.previousTimestampIndex=0}return t.prototype.renderAtTimestamp=function(t){var e=i.getIndexFromTimestamps(t,this.updateTimestamps);this.renderAtIndex(e)},t.prototype.renderAtIndex=function(t){this.previousTimestampIndex!==t&&(this.previousTimestampIndex=t,this.render(t))},t}()),n=function(t){function i(e,i){var o=t.call(this,e)||this,n=i.transferControlToOffscreen();return o.worker.postMessage({op:"init",canvas:n},[n]),o}return e(i,t),i.prototype.render=function(t){this.worker.postMessage({op:"render",index:t})},i}(o),s=function(){function t(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0}return t.prototype.reset=function(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0},t.prototype.set=function(t,e,i,o){void 0===i&&(i=0),void 0===o&&(o=0),this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=o},t.prototype.union=function(t,e,i,o){void 0===i&&(i=0),void 0===o&&(o=0),this.empty?(this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=o):(t<this.x&&(this.width+=this.x-t,this.x=t),e<this.y&&(this.height+=this.y-e,this.y=e),t+i>this.x+this.width&&(this.width=t+i-this.x),e+o>this.y+this.height&&(this.height=e+o-this.y))},t}(),r=function(){function t(t){this.dirtyArea=new s,this.canvas=t,this.context=t.getContext("2d")}return t.prototype.draw=function(t){this.canvas&&this.context&&(this.dirtyArea.empty||(this.context.clearRect(this.dirtyArea.x,this.dirtyArea.y,this.dirtyArea.width,this.dirtyArea.height),this.dirtyArea.reset()),t&&(this.canvas.width==t.width&&this.canvas.height==t.height||(this.canvas.width=t.width,this.canvas.height=t.height),this.drawSubtitleData(t,this.dirtyArea)))},t.prototype.drawSubtitleData=function(t,e){for(var i=0,o=t.compositionData;i<o.length;i++){var n=o[i];this.drawSubtitleCompositionData(n,e)}},t.prototype.drawSubtitleCompositionData=function(t,e){var i;null===(i=this.context)||void 0===i||i.putImageData(t.pixelData,t.window.horizontalPosition,t.window.verticalPosition),null==e||e.union(t.window.horizontalPosition,t.window.verticalPosition,t.pixelData.width,t.pixelData.height)},t}(),a=function(t){function i(e,i){var o=t.call(this,e)||this;return o.renderer=new r(i),o.worker.postMessage({op:"init"}),o}return e(i,t),i.prototype.render=function(t){this.worker.postMessage({op:"requestSubtitleData",index:t})},i.prototype.onWorkerMessage=function(e){if("subtitleData"===e.data.op){var i=e.data.subtitleData;this.renderer&&this.renderer.draw(i)}else t.prototype.onWorkerMessage.call(this,e)},i}(o),h=function(){function t(t){var e,i=this;if(this.$timeOffset=0,this.onTimeUpdate=function(){i.renderAtVideoTimestamp()},t.video&&(this.video=t.video),t.canvas)this.canvas=t.canvas,this.canvasOwner=!1;else{if(!this.video)throw new Error("No canvas or video element was provided!");this.canvas=this.createCanvasElement(),this.canvasOwner=!0,this.video.parentElement.appendChild(this.canvas)}var o=this.isOffscreenCanvasSupported();console.log("isOffscreenCanvasSupported: ".concat(o)),this.implementation=o?new n(t,this.canvas):new a(t,this.canvas),this.implementation.onTimestampsUpdated=function(){i.renderAtVideoTimestamp()},this.$timeOffset=null!==(e=t.timeOffset)&&void 0!==e?e:0,t.subUrl&&this.loadFromUrl(t.subUrl),this.registerVideoEvents()}return t.prototype.isOffscreenCanvasSupported=function(){return!!HTMLCanvasElement.prototype.transferControlToOffscreen},t.prototype.loadFromUrl=function(t){this.implementation.loadFromUrl(t)},t.prototype.loadFromBuffer=function(t){this.implementation.loadFromBuffer(t)},t.prototype.renderAtTimestamp=function(t){this.implementation.renderAtTimestamp(t)},Object.defineProperty(t.prototype,"timeOffset",{get:function(){return this.$timeOffset},set:function(t){this.$timeOffset!==t&&(this.$timeOffset=t,this.renderAtVideoTimestamp())},enumerable:!1,configurable:!0}),t.prototype.registerVideoEvents=function(){var t;null===(t=this.video)||void 0===t||t.addEventListener("timeupdate",this.onTimeUpdate)},t.prototype.unregisterVideoEvents=function(){var t;null===(t=this.video)||void 0===t||t.removeEventListener("timeupdate",this.onTimeUpdate)},t.prototype.renderAtVideoTimestamp=function(){this.video&&this.renderAtTimestamp(this.video.currentTime+this.$timeOffset)},t.prototype.createCanvasElement=function(){var t=document.createElement("canvas");return t.style.position="absolute",t.style.top="0",t.style.left="0",t.style.right="0",t.style.bottom="0",t.style.pointerEvents="none",t.style.objectFit="contain",t.style.width="100%",t.style.height="100%",t},t.prototype.destroyCanvasElement=function(){this.canvas.remove()},t.prototype.dispose=function(){this.implementation.dispose(),this.unregisterVideoEvents(),this.canvasOwner&&this.destroyCanvasElement()},t}();export{h as PgsRenderer};

dist/libpgs.worker.js

@@ -1,1 +0,1 @@
-function t(t,e,i,n){return new(i||(i=Promise))((function(r,o){function a(t){try{h(n.next(t))}catch(t){o(t)}}function s(t){try{h(n.throw(t))}catch(t){o(t)}}function h(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(a,s)}h((n=n.apply(t,e||[])).next())}))}function e(t,e){var i,n,r,o,a={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(s){return function(h){return function(s){if(i)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(a=0)),a;)try{if(i=1,n&&(r=2&s[0]?n.return:s[0]?n.throw||((r=n.return)&&r.call(n),0):n.next)&&!(r=r.call(n,s[1])).done)return r;switch(n=0,r&&(s=[2&s[0],r.value]),s[0]){case 0:case 1:r=s;break;case 4:return a.label++,{value:s[1],done:!1};case 5:a.label++,n=s[1],s=[0];continue;case 7:s=a.ops.pop(),a.trys.pop();continue;default:if(!(r=a.trys,(r=r.length>0&&r[r.length-1])||6!==s[0]&&2!==s[0])){a=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]<r[3])){a.label=s[1];break}if(6===s[0]&&a.label<r[1]){a.label=r[1],r=s;break}if(r&&a.label<r[2]){a.label=r[2],a.ops.push(s);break}r[2]&&a.ops.pop(),a.trys.pop();continue}s=e.call(t,a)}catch(t){s=[6,t],n=0}finally{i=r=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,h])}}}var i;"function"==typeof SuppressedError&&SuppressedError,function(t){t[t.paletteDefinition=20]="paletteDefinition",t[t.objectDefinition=21]="objectDefinition",t[t.presentationComposition=22]="presentationComposition",t[t.windowDefinition=23]="windowDefinition",t[t.end=128]="end"}(i||(i={}));var n=function(){function t(){this.id=0,this.windowId=0,this.croppedFlag=0,this.horizontalPosition=0,this.verticalPosition=0,this.croppingHorizontalPosition=0,this.croppingVerticalPosition=0,this.croppingWidth=0,this.croppingHeightPosition=0}return Object.defineProperty(t.prototype,"hasCropping",{get:function(){return!!(128&this.croppedFlag)},enumerable:!1,configurable:!0}),t}(),r=function(){function t(){this.width=0,this.height=0,this.frameRate=0,this.compositionNumber=0,this.compositionState=0,this.paletteUpdateFlag=0,this.paletteId=0,this.compositionObjects=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return i.presentationComposition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){this.width=t.readUInt16(),this.height=t.readUInt16(),this.frameRate=t.readUInt8(),this.compositionNumber=t.readUInt16(),this.compositionState=t.readUInt8(),this.paletteUpdateFlag=t.readUInt8(),this.paletteId=t.readUInt8();var i=t.readUInt8();this.compositionObjects=[];for(var r=0;r<i;r++){var o=new n;o.id=t.readUInt16(),o.windowId=t.readUInt8(),o.croppedFlag=t.readUInt8(),o.horizontalPosition=t.readUInt16(),o.verticalPosition=t.readUInt16(),o.hasCropping&&(o.croppingHorizontalPosition=t.readUInt16(),o.croppingVerticalPosition=t.readUInt16(),o.croppingWidth=t.readUInt16(),o.croppingHeightPosition=t.readUInt16()),this.compositionObjects.push(o)}},t}(),o=function(){function t(){this.id=0,this.versionNumber=0,this.rgba=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return i.paletteDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(e,i){this.id=e.readUInt8(),this.versionNumber=e.readUInt8();var n=(i-2)/5,r=new Uint32Array(1),o=new Uint8Array(r.buffer);this.rgba=[];for(var a=0;a<n;a++){var s=e.readUInt8(),h=e.readUInt8(),d=e.readUInt8()-128,u=e.readUInt8()-128,p=e.readUInt8(),c=t.clamp(Math.round(h+1.402*d),0,255),f=t.clamp(Math.round(h-.34414*u-.71414*d),0,255),l=t.clamp(Math.round(h+1.772*u),0,255);o[0]=c,o[1]=f,o[2]=l,o[3]=p,this.rgba[s]=r[0]}},t.clamp=function(t,e,i){return t<e?e:t>i?i:t},t}(),a=function(){function t(){this.id=0,this.versionNumber=0,this.lastInSequenceFlag=0,this.width=0,this.height=0,this.dataLength=0}return Object.defineProperty(t.prototype,"isFirstInSequence",{get:function(){return!!(128&this.lastInSequenceFlag)},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"isLastInSequence",{get:function(){return!!(64&this.lastInSequenceFlag)},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"segmentType",{get:function(){return i.objectDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){this.id=t.readUInt16(),this.versionNumber=t.readUInt8(),this.lastInSequenceFlag=t.readUInt8(),this.isFirstInSequence?(this.dataLength=t.readUInt24(),this.width=t.readUInt16(),this.height=t.readUInt16(),this.data=t.readBytes(e-11)):this.data=t.readBytes(e-4)},t}(),s=function(){this.id=0,this.horizontalPosition=0,this.verticalPosition=0,this.width=0,this.height=0},h=function(){function t(){this.windows=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return i.windowDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){var i=t.readUInt8();this.windows=[];for(var n=0;n<i;n++){var r=new s;r.id=t.readUInt8(),r.horizontalPosition=t.readUInt16(),r.verticalPosition=t.readUInt16(),r.width=t.readUInt16(),r.height=t.readUInt16(),this.windows.push(r)}},t}(),d=function(){function n(){this.presentationTimestamp=0,this.decodingTimestamp=0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[]}return n.prototype.read=function(n,s){return t(this,void 0,void 0,(function(){var t,d,u,p,c,f,l,y,b;return e(this,(function(e){switch(e.label){case 0:this.presentationTimestamp=0,this.decodingTimestamp=0,this.presentationComposition=void 0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[],t=void 0,"requestData"in n.baseReader&&(t=n.baseReader),e.label=1;case 1:return d=0,u=0,s?[4,null==t?void 0:t.requestData(10)]:[3,3];case 2:if(e.sent(),20551!=n.readUInt16())throw new Error("Invalid magic number!");d=n.readUInt32(),u=n.readUInt32(),e.label=3;case 3:return[4,null==t?void 0:t.requestData(3)];case 4:return e.sent(),p=n.readUInt8(),c=n.readUInt16(),[4,null==t?void 0:t.requestData(c)];case 5:switch(e.sent(),p){case i.paletteDefinition:(f=new o).read(n,c),this.paletteDefinitions.push(f);break;case i.objectDefinition:(l=new a).read(n,c),this.objectDefinitions.push(l);break;case i.presentationComposition:(y=new r).read(n,c),this.presentationComposition=y,this.presentationTimestamp=d,this.decodingTimestamp=u;break;case i.windowDefinition:(b=new h).read(n,c),this.windowDefinitions.push(b);break;case i.end:return[2];default:throw new Error("Unsupported segment type ".concat(p))}return[3,1];case 6:return[2]}}))}))},n}(),u=function(){function t(t){this.$position=0,this.array=t}return Object.defineProperty(t.prototype,"position",{get:function(){return this.$position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.array.length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.position>=this.length},enumerable:!1,configurable:!0}),t.prototype.readByte=function(){return this.array[this.$position++]},t.prototype.readBytes=function(t){var e=this.array.slice(this.$position,this.$position+t);return this.$position+=t,e},t}(),p=function(){function t(t){t instanceof Uint8Array?this.baseReader=new u(t):this.baseReader=t}return Object.defineProperty(t.prototype,"position",{get:function(){return this.baseReader.position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.baseReader.length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.baseReader.eof},enumerable:!1,configurable:!0}),t.prototype.readUInt8=function(){return this.baseReader.readByte()},t.prototype.readUInt16=function(){return(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readUInt24=function(){return(this.baseReader.readByte()<<16)+(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readUInt32=function(){return(this.baseReader.readByte()<<24)+(this.baseReader.readByte()<<16)+(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readBytes=function(t){return this.baseReader.readBytes(t)},t}(),c=function(){function t(){}return t.decode=function(t,e,i){t instanceof Uint8Array&&(t=new u(t));for(var n=0;t.position<t.length;){var r=t.readByte();if(0==r){var o=t.readByte();if(0!=o){var a=!!(128&o),s=63&o;!!(64&o)&&(s=(s<<8)+t.readByte());for(var h=a?t.readByte():0,d=0;d<s;d++)i[n++]=e[h]}}else i[n++]=e[r]}return n},t}(),f=function(){function t(t){this.$position=0,this.subReaderIndex=0,this.subReaders=t.map((function(t){return t instanceof Uint8Array?new u(t):t}));for(var e=0,i=0,n=t;i<n.length;i++){e+=n[i].length}this.$length=e}return t.prototype.push=function(t){t instanceof Uint8Array?this.subReaders.push(new u(t)):this.subReaders.push(t),this.$length+=t.length},Object.defineProperty(t.prototype,"position",{get:function(){return this.$position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.$length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.position>=this.length},enumerable:!1,configurable:!0}),t.prototype.readByte=function(){for(;this.subReaders[this.subReaderIndex].position>=this.subReaders[this.subReaderIndex].length;)this.subReaderIndex++;return this.$position++,this.subReaders[this.subReaderIndex].readByte()},t.prototype.readBytes=function(t){for(var e=new Uint8Array(t),i=0;i<t;i++)e[i]=this.readByte();return e},t}(),l=function(){function t(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0}return t.prototype.reset=function(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0},t.prototype.set=function(t,e,i,n){void 0===i&&(i=0),void 0===n&&(n=0),this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=n},t.prototype.union=function(t,e,i,n){void 0===i&&(i=0),void 0===n&&(n=0),this.empty?(this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=n):(t<this.x&&(this.width+=this.x-t,this.x=t),e<this.y&&(this.height+=this.y-e,this.y=e),t+i>this.x+this.width&&(this.width=t+i-this.x),e+n>this.y+this.height&&(this.height=e+n-this.y))},t}(),y=function(){function i(t){this.$eof=!1,this.stream=t,this.reader=new f([])}return Object.defineProperty(i.prototype,"position",{get:function(){return this.reader.position},enumerable:!1,configurable:!0}),Object.defineProperty(i.prototype,"length",{get:function(){return this.reader.length},enumerable:!1,configurable:!0}),Object.defineProperty(i.prototype,"eof",{get:function(){return this.$eof},enumerable:!1,configurable:!0}),i.prototype.readByte=function(){return this.reader.readByte()},i.prototype.readBytes=function(t){return this.reader.readBytes(t)},i.prototype.requestData=function(){return t(this,arguments,void 0,(function(t){var i,n,r;return void 0===t&&(t=0),e(this,(function(e){switch(e.label){case 0:return this.reader.position+t+1>this.reader.length&&!this.$eof?[4,this.stream.read()]:[3,2];case 1:return i=e.sent(),n=i.value,r=i.done,n&&this.reader.push(n),r&&(this.$eof=!0),[3,0];case 2:return[2,this.reader.position+t<=this.reader.length]}}))}))},i}(),b=function(){function t(t,e,i){this.width=t,this.height=e,this.compositionData=i}return t.prototype.draw=function(t,e){for(var i=0,n=this.compositionData;i<n.length;i++){n[i].draw(t,e)}},t}(),g=function(){function t(t,e){this.window=t,this.pixelData=e}return t.prototype.draw=function(t,e){t.drawImage(this.pixelData,this.window.horizontalPosition,this.window.verticalPosition),null==e||e.union(this.window.horizontalPosition,this.window.verticalPosition,this.pixelData.width,this.pixelData.height)},t}(),m=function(){function t(){}return t.getIndexFromTimestamps=function(t,e){var i=1e3*t*90,n=-1;if(e.length>0&&i<e[e.length-1])for(var r=0,o=e;r<o.length;r++){if(o[r]>i)break;n++}return n},t}(),w=new(function(){function i(){this.displaySets=[],this.updateTimestamps=[],this.dirtyArea=new l}return i.prototype.loadFromUrl=function(i,n){return t(this,void 0,void 0,(function(){var t,r,o,a;return e(this,(function(e){switch(e.label){case 0:return[4,fetch(i)];case 1:if(!(t=e.sent()).ok)throw new Error("HTTP error: ".concat(t.status));return r=null===(a=t.body)||void 0===a?void 0:a.getReader(),o=new y(r),[4,this.loadFromReader(o,n)];case 2:return e.sent(),[2]}}))}))},i.prototype.loadFromBuffer=function(i,n){return t(this,void 0,void 0,(function(){return e(this,(function(t){switch(t.label){case 0:return[4,this.loadFromReader(new u(new Uint8Array(i)),n)];case 1:return t.sent(),[2]}}))}))},i.prototype.loadFromReader=function(i,n){return t(this,void 0,void 0,(function(){var t,r,o,a;return e(this,(function(e){switch(e.label){case 0:this.displaySets=[],this.updateTimestamps=[],this.cachedRenderData=void 0,t=performance.now(),r=new p(i),e.label=1;case 1:return i.eof?[3,3]:[4,(o=new d).read(r,!0)];case 2:return e.sent(),this.displaySets.push(o),this.updateTimestamps.push(o.presentationTimestamp),(null==n?void 0:n.onProgress)&&(a=performance.now())>t+1e3&&(t=a,n.onProgress()),[3,1];case 3:return(null==n?void 0:n.onProgress)&&n.onProgress(),[2]}}))}))},i.prototype.setCanvas=function(t){this.canvas=t,this.context=t.getContext("2d")},i.prototype.renderAtTimestamp=function(t){var e=m.getIndexFromTimestamps(t,this.updateTimestamps);this.renderAtIndex(e)},i.prototype.renderAtIndex=function(t){if(this.canvas&&this.context){this.dirtyArea.empty||(this.context.clearRect(this.dirtyArea.x,this.dirtyArea.y,this.dirtyArea.width,this.dirtyArea.height),this.dirtyArea.reset());var e=this.buildRenderDataAtIndex(t);e&&(this.canvas.width==e.width&&this.canvas.height==e.height||(this.canvas.width=e.width,this.canvas.height=e.height),e.draw(this.context,this.dirtyArea));var i=t+1,n=this.buildRenderDataAtIndex(t+1);this.cachedRenderData={index:i,data:n}}},i.prototype.buildRenderDataAtIndex=function(t){var e;if(this.cachedRenderData&&this.cachedRenderData.index===t)return this.cachedRenderData.data;if(!(t<0||t>=this.displaySets.length)){var i=this.displaySets[t];if(i.presentationComposition){for(var n=[],r=[],o=[],a=t;a>=0&&(n.unshift.apply(n,this.displaySets[a].objectDefinitions),r.unshift.apply(r,this.displaySets[a].paletteDefinitions),o.unshift.apply(o,this.displaySets[a].windowDefinitions.flatMap((function(t){return t.windows}))),0===(null===(e=this.displaySets[a].presentationComposition)||void 0===e?void 0:e.compositionState));)a--;var s=r.find((function(t){var e;return t.id===(null===(e=i.presentationComposition)||void 0===e?void 0:e.paletteId)}));if(s){for(var h=[],d=function(t){var e=o.find((function(e){return e.id===t.windowId}));if(!e)return"continue";var i=u.getPixelDataFromComposition(t,s,n);i&&h.push(new g(e,i))},u=this,p=0,c=i.presentationComposition.compositionObjects;p<c.length;p++){d(c[p])}if(0!==h.length)return new b(i.presentationComposition.width,i.presentationComposition.height,h)}}}},i.prototype.createCanvas=function(t,e){if("undefined"!=typeof document){var i=document.createElement("canvas");return i.width=t,i.height=e,i}return new OffscreenCanvas(t,e)},i.prototype.getPixelDataFromComposition=function(t,e,i){for(var n=0,r=0,o=[],a=0,s=i;a<s.length;a++){var h=s[a];h.id==t.id&&(h.isFirstInSequence&&(n=h.width,r=h.height),h.data&&o.push(h.data))}if(0!=o.length){var d=new f(o),u=this.createCanvas(n,r),p=u.getContext("2d"),l=p.createImageData(n,r),y=new Uint32Array(l.data.buffer);return c.decode(d,e.rgba,y),p.putImageData(l,0,0),u}},i}()),v=function(){postMessage({op:"updateTimestamps",updateTimestamps:w.updateTimestamps})};onmessage=function(t){switch(t.data.op){case"init":var e=t.data.canvas;w.setCanvas(e);break;case"loadFromUrl":var i=t.data.url;w.loadFromUrl(i,{onProgress:function(){v()}}).then((function(){v()}));break;case"loadFromBuffer":var n=t.data.buffer;w.loadFromBuffer(n).then((function(){v()}));break;case"render":var r=t.data.index;requestAnimationFrame((function(){w.renderAtIndex(r)}))}};
+var t=function(){function t(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0}return t.prototype.reset=function(){this.empty=!0,this.x=0,this.y=0,this.width=0,this.height=0},t.prototype.set=function(t,e,i,n){void 0===i&&(i=0),void 0===n&&(n=0),this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=n},t.prototype.union=function(t,e,i,n){void 0===i&&(i=0),void 0===n&&(n=0),this.empty?(this.empty=!1,this.x=t,this.y=e,this.width=i,this.height=n):(t<this.x&&(this.width+=this.x-t,this.x=t),e<this.y&&(this.height+=this.y-e,this.y=e),t+i>this.x+this.width&&(this.width=t+i-this.x),e+n>this.y+this.height&&(this.height=e+n-this.y))},t}(),e=function(){function e(e){this.dirtyArea=new t,this.canvas=e,this.context=e.getContext("2d")}return e.prototype.draw=function(t){this.canvas&&this.context&&(this.dirtyArea.empty||(this.context.clearRect(this.dirtyArea.x,this.dirtyArea.y,this.dirtyArea.width,this.dirtyArea.height),this.dirtyArea.reset()),t&&(this.canvas.width==t.width&&this.canvas.height==t.height||(this.canvas.width=t.width,this.canvas.height=t.height),this.drawSubtitleData(t,this.dirtyArea)))},e.prototype.drawSubtitleData=function(t,e){for(var i=0,n=t.compositionData;i<n.length;i++){var r=n[i];this.drawSubtitleCompositionData(r,e)}},e.prototype.drawSubtitleCompositionData=function(t,e){var i;null===(i=this.context)||void 0===i||i.putImageData(t.pixelData,t.window.horizontalPosition,t.window.verticalPosition),null==e||e.union(t.window.horizontalPosition,t.window.verticalPosition,t.pixelData.width,t.pixelData.height)},e}();function i(t,e,i,n){return new(i||(i=Promise))((function(r,o){function a(t){try{h(n.next(t))}catch(t){o(t)}}function s(t){try{h(n.throw(t))}catch(t){o(t)}}function h(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(a,s)}h((n=n.apply(t,e||[])).next())}))}function n(t,e){var i,n,r,o,a={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(s){return function(h){return function(s){if(i)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(a=0)),a;)try{if(i=1,n&&(r=2&s[0]?n.return:s[0]?n.throw||((r=n.return)&&r.call(n),0):n.next)&&!(r=r.call(n,s[1])).done)return r;switch(n=0,r&&(s=[2&s[0],r.value]),s[0]){case 0:case 1:r=s;break;case 4:return a.label++,{value:s[1],done:!1};case 5:a.label++,n=s[1],s=[0];continue;case 7:s=a.ops.pop(),a.trys.pop();continue;default:if(!(r=a.trys,(r=r.length>0&&r[r.length-1])||6!==s[0]&&2!==s[0])){a=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]<r[3])){a.label=s[1];break}if(6===s[0]&&a.label<r[1]){a.label=r[1],r=s;break}if(r&&a.label<r[2]){a.label=r[2],a.ops.push(s);break}r[2]&&a.ops.pop(),a.trys.pop();continue}s=e.call(t,a)}catch(t){s=[6,t],n=0}finally{i=r=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,h])}}}"function"==typeof SuppressedError&&SuppressedError;var r,o=function(){function t(t){this.$position=0,this.array=t}return Object.defineProperty(t.prototype,"position",{get:function(){return this.$position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.array.length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.position>=this.length},enumerable:!1,configurable:!0}),t.prototype.readByte=function(){return this.array[this.$position++]},t.prototype.readBytes=function(t){var e=this.array.slice(this.$position,this.$position+t);return this.$position+=t,e},t}(),a=function(){function t(t){t instanceof Uint8Array?this.baseReader=new o(t):this.baseReader=t}return Object.defineProperty(t.prototype,"position",{get:function(){return this.baseReader.position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.baseReader.length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.baseReader.eof},enumerable:!1,configurable:!0}),t.prototype.readUInt8=function(){return this.baseReader.readByte()},t.prototype.readUInt16=function(){return(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readUInt24=function(){return(this.baseReader.readByte()<<16)+(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readUInt32=function(){return(this.baseReader.readByte()<<24)+(this.baseReader.readByte()<<16)+(this.baseReader.readByte()<<8)+this.baseReader.readByte()},t.prototype.readBytes=function(t){return this.baseReader.readBytes(t)},t}();!function(t){t[t.paletteDefinition=20]="paletteDefinition",t[t.objectDefinition=21]="objectDefinition",t[t.presentationComposition=22]="presentationComposition",t[t.windowDefinition=23]="windowDefinition",t[t.end=128]="end"}(r||(r={}));var s=function(){function t(){this.id=0,this.windowId=0,this.croppedFlag=0,this.horizontalPosition=0,this.verticalPosition=0,this.croppingHorizontalPosition=0,this.croppingVerticalPosition=0,this.croppingWidth=0,this.croppingHeightPosition=0}return Object.defineProperty(t.prototype,"hasCropping",{get:function(){return!!(128&this.croppedFlag)},enumerable:!1,configurable:!0}),t}(),h=function(){function t(){this.width=0,this.height=0,this.frameRate=0,this.compositionNumber=0,this.compositionState=0,this.paletteUpdateFlag=0,this.paletteId=0,this.compositionObjects=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return r.presentationComposition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){this.width=t.readUInt16(),this.height=t.readUInt16(),this.frameRate=t.readUInt8(),this.compositionNumber=t.readUInt16(),this.compositionState=t.readUInt8(),this.paletteUpdateFlag=t.readUInt8(),this.paletteId=t.readUInt8();var i=t.readUInt8();this.compositionObjects=[];for(var n=0;n<i;n++){var r=new s;r.id=t.readUInt16(),r.windowId=t.readUInt8(),r.croppedFlag=t.readUInt8(),r.horizontalPosition=t.readUInt16(),r.verticalPosition=t.readUInt16(),r.hasCropping&&(r.croppingHorizontalPosition=t.readUInt16(),r.croppingVerticalPosition=t.readUInt16(),r.croppingWidth=t.readUInt16(),r.croppingHeightPosition=t.readUInt16()),this.compositionObjects.push(r)}},t}(),u=function(){function t(){this.id=0,this.versionNumber=0,this.rgba=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return r.paletteDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(e,i){this.id=e.readUInt8(),this.versionNumber=e.readUInt8();var n=(i-2)/5,r=new Uint32Array(1),o=new Uint8Array(r.buffer);this.rgba=[];for(var a=0;a<n;a++){var s=e.readUInt8(),h=e.readUInt8(),u=e.readUInt8()-128,d=e.readUInt8()-128,p=e.readUInt8(),c=t.clamp(Math.round(h+1.402*u),0,255),f=t.clamp(Math.round(h-.34414*d-.71414*u),0,255),l=t.clamp(Math.round(h+1.772*d),0,255);o[0]=c,o[1]=f,o[2]=l,o[3]=p,this.rgba[s]=r[0]}},t.clamp=function(t,e,i){return t<e?e:t>i?i:t},t}(),d=function(){function t(){this.id=0,this.versionNumber=0,this.lastInSequenceFlag=0,this.width=0,this.height=0,this.dataLength=0}return Object.defineProperty(t.prototype,"isFirstInSequence",{get:function(){return!!(128&this.lastInSequenceFlag)},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"isLastInSequence",{get:function(){return!!(64&this.lastInSequenceFlag)},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"segmentType",{get:function(){return r.objectDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){this.id=t.readUInt16(),this.versionNumber=t.readUInt8(),this.lastInSequenceFlag=t.readUInt8(),this.isFirstInSequence?(this.dataLength=t.readUInt24(),this.width=t.readUInt16(),this.height=t.readUInt16(),this.data=t.readBytes(e-11)):this.data=t.readBytes(e-4)},t}(),p=function(){this.id=0,this.horizontalPosition=0,this.verticalPosition=0,this.width=0,this.height=0},c=function(){function t(){this.windows=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return r.windowDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){var i=t.readUInt8();this.windows=[];for(var n=0;n<i;n++){var r=new p;r.id=t.readUInt8(),r.horizontalPosition=t.readUInt16(),r.verticalPosition=t.readUInt16(),r.width=t.readUInt16(),r.height=t.readUInt16(),this.windows.push(r)}},t}(),f=function(){function t(){this.presentationTimestamp=0,this.decodingTimestamp=0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[]}return t.prototype.read=function(t,e){return i(this,void 0,void 0,(function(){var i,o,a,s,p,f,l,y,b;return n(this,(function(n){switch(n.label){case 0:this.presentationTimestamp=0,this.decodingTimestamp=0,this.presentationComposition=void 0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[],i=void 0,"requestData"in t.baseReader&&(i=t.baseReader),n.label=1;case 1:return o=0,a=0,e?[4,null==i?void 0:i.requestData(10)]:[3,3];case 2:if(n.sent(),20551!=t.readUInt16())throw new Error("Invalid magic number!");o=t.readUInt32(),a=t.readUInt32(),n.label=3;case 3:return[4,null==i?void 0:i.requestData(3)];case 4:return n.sent(),s=t.readUInt8(),p=t.readUInt16(),[4,null==i?void 0:i.requestData(p)];case 5:switch(n.sent(),s){case r.paletteDefinition:(f=new u).read(t,p),this.paletteDefinitions.push(f);break;case r.objectDefinition:(l=new d).read(t,p),this.objectDefinitions.push(l);break;case r.presentationComposition:(y=new h).read(t,p),this.presentationComposition=y,this.presentationTimestamp=o,this.decodingTimestamp=a;break;case r.windowDefinition:(b=new c).read(t,p),this.windowDefinitions.push(b);break;case r.end:return[2];default:throw new Error("Unsupported segment type ".concat(s))}return[3,1];case 6:return[2]}}))}))},t}(),l=function(){function t(t){this.$position=0,this.subReaderIndex=0,this.subReaders=t.map((function(t){return t instanceof Uint8Array?new o(t):t}));for(var e=0,i=0,n=t;i<n.length;i++){e+=n[i].length}this.$length=e}return t.prototype.push=function(t){t instanceof Uint8Array?this.subReaders.push(new o(t)):this.subReaders.push(t),this.$length+=t.length},Object.defineProperty(t.prototype,"position",{get:function(){return this.$position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.$length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.position>=this.length},enumerable:!1,configurable:!0}),t.prototype.readByte=function(){for(;this.subReaders[this.subReaderIndex].position>=this.subReaders[this.subReaderIndex].length;)this.subReaderIndex++;return this.$position++,this.subReaders[this.subReaderIndex].readByte()},t.prototype.readBytes=function(t){for(var e=new Uint8Array(t),i=0;i<t;i++)e[i]=this.readByte();return e},t}(),y=function(){function t(t){this.$eof=!1,this.stream=t,this.reader=new l([])}return Object.defineProperty(t.prototype,"position",{get:function(){return this.reader.position},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"length",{get:function(){return this.reader.length},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"eof",{get:function(){return this.$eof},enumerable:!1,configurable:!0}),t.prototype.readByte=function(){return this.reader.readByte()},t.prototype.readBytes=function(t){return this.reader.readBytes(t)},t.prototype.requestData=function(){return i(this,arguments,void 0,(function(t){var e,i,r;return void 0===t&&(t=0),n(this,(function(n){switch(n.label){case 0:return this.reader.position+t+1>this.reader.length&&!this.$eof?[4,this.stream.read()]:[3,2];case 1:return e=n.sent(),i=e.value,r=e.done,i&&this.reader.push(i),r&&(this.$eof=!0),[3,0];case 2:return[2,this.reader.position+t<=this.reader.length]}}))}))},t}(),b=function(t,e,i){this.width=t,this.height=e,this.compositionData=i},g=function(t,e){this.window=t,this.pixelData=e},m=function(){function t(){}return t.decode=function(t,e,i){t instanceof Uint8Array&&(t=new o(t));for(var n=0;t.position<t.length;){var r=t.readByte();if(0==r){var a=t.readByte();if(0!=a){var s=!!(128&a),h=63&a;!!(64&a)&&(h=(h<<8)+t.readByte());for(var u=s?t.readByte():0,d=0;d<h;d++)i[n++]=e[u]}}else i[n++]=e[r]}return n},t}(),w=function(){function t(){}return t.getIndexFromTimestamps=function(t,e){var i=1e3*t*90,n=-1;if(e.length>0&&i<e[e.length-1])for(var r=0,o=e;r<o.length;r++){if(o[r]>i)break;n++}return n},t}(),v=new(function(){function t(){this.displaySets=[],this.updateTimestamps=[]}return t.prototype.loadFromUrl=function(t,e){return i(this,void 0,void 0,(function(){var i,r,o,a;return n(this,(function(n){switch(n.label){case 0:return[4,fetch(t)];case 1:if(!(i=n.sent()).ok)throw new Error("HTTP error: ".concat(i.status));return r=null===(a=i.body)||void 0===a?void 0:a.getReader(),o=new y(r),[4,this.loadFromReader(o,e)];case 2:return n.sent(),[2]}}))}))},t.prototype.loadFromBuffer=function(t,e){return i(this,void 0,void 0,(function(){return n(this,(function(i){switch(i.label){case 0:return[4,this.loadFromReader(new o(new Uint8Array(t)),e)];case 1:return i.sent(),[2]}}))}))},t.prototype.loadFromReader=function(t,e){return i(this,void 0,void 0,(function(){var i,r,o,s;return n(this,(function(n){switch(n.label){case 0:this.displaySets=[],this.updateTimestamps=[],this.cachedSubtitleData=void 0,i=performance.now(),r=new a(t),n.label=1;case 1:return t.eof?[3,3]:[4,(o=new f).read(r,!0)];case 2:return n.sent(),this.displaySets.push(o),this.updateTimestamps.push(o.presentationTimestamp),(null==e?void 0:e.onProgress)&&(s=performance.now())>i+1e3&&(i=s,e.onProgress()),[3,1];case 3:return(null==e?void 0:e.onProgress)&&e.onProgress(),[2]}}))}))},t.prototype.cacheSubtitleAtIndex=function(t){var e=this.getSubtitleAtIndex(t);this.cachedSubtitleData={index:t,data:e}},t.prototype.getSubtitleAtTimestamp=function(t){var e=w.getIndexFromTimestamps(t,this.updateTimestamps);return this.getSubtitleAtIndex(e)},t.prototype.getSubtitleAtIndex=function(t){var e;if(this.cachedSubtitleData&&this.cachedSubtitleData.index===t)return this.cachedSubtitleData.data;if(!(t<0||t>=this.displaySets.length)){var i=this.displaySets[t];if(i.presentationComposition){for(var n=[],r=[],o=[],a=t;a>=0&&(n.unshift.apply(n,this.displaySets[a].objectDefinitions),r.unshift.apply(r,this.displaySets[a].paletteDefinitions),o.unshift.apply(o,this.displaySets[a].windowDefinitions.flatMap((function(t){return t.windows}))),0===(null===(e=this.displaySets[a].presentationComposition)||void 0===e?void 0:e.compositionState));)a--;var s=r.find((function(t){var e;return t.id===(null===(e=i.presentationComposition)||void 0===e?void 0:e.paletteId)}));if(s){for(var h=[],u=function(t){var e=o.find((function(e){return e.id===t.windowId}));if(!e)return"continue";var i=d.getPixelDataFromComposition(t,s,n);i&&h.push(new g(e,i))},d=this,p=0,c=i.presentationComposition.compositionObjects;p<c.length;p++){u(c[p])}if(0!==h.length)return new b(i.presentationComposition.width,i.presentationComposition.height,h)}}}},t.prototype.getPixelDataFromComposition=function(t,e,i){for(var n=0,r=0,o=[],a=0,s=i;a<s.length;a++){var h=s[a];h.id==t.id&&(h.isFirstInSequence&&(n=h.width,r=h.height),h.data&&o.push(h.data))}if(0!=o.length){var u=new l(o),d=new Uint32Array(n*r);return m.decode(u,e.rgba,d),new ImageData(new Uint8ClampedArray(d.buffer),n,r)}},t}()),I=void 0,U=function(){postMessage({op:"updateTimestamps",updateTimestamps:v.updateTimestamps})};onmessage=function(t){switch(t.data.op){case"init":var i=t.data.canvas;i&&(I=new e(i));break;case"loadFromUrl":var n=t.data.url;v.loadFromUrl(n,{onProgress:function(){U()}}).then((function(){U()}));break;case"loadFromBuffer":var r=t.data.buffer;v.loadFromBuffer(r).then((function(){U()}));break;case"render":var o=t.data.index,a=v.getSubtitleAtIndex(o);requestAnimationFrame((function(){null==I||I.draw(a)})),v.cacheSubtitleAtIndex(o+1);break;case"requestSubtitleData":o=t.data.index;var s=v.getSubtitleAtIndex(o);postMessage({op:"subtitleData",subtitleData:s}),v.cacheSubtitleAtIndex(o+1)}};

dist/pgsRenderer.d.ts

@@ -5,4 +5,2 @@ import { PgsRendererOptions } from "./pgsRendererOptions";
  * video element is provided.
- *
- * The actual rendering is done by {@link PgsRendererInternal} inside a web-worker so optimize performance.
  */
@@ -15,2 +13,22 @@ export declare class PgsRenderer {
     constructor(options: PgsRendererOptions);
+    /**
+     * Checks if the offscreen-canvas and `transferControlToOffscreen` are supported in the current environment.
+     */
+    private isOffscreenCanvasSupported;
+    private implementation;
+    /**
+     * Loads the subtitle file from the given url.
+     * @param url The url to the PGS file.
+     */
+    loadFromUrl(url: string): void;
+    /**
+     * Loads the subtitle file from the given buffer.
+     * @param buffer The PGS data.
+     */
+    loadFromBuffer(buffer: ArrayBuffer): void;
+    /**
+     * Renders the subtitle for the given timestamp.
+     * @param time The timestamp in seconds.
+     */
+    renderAtTimestamp(time: number): void;
     private readonly video?;
@@ -35,22 +53,3 @@ private $timeOffset;
     private destroyCanvasElement;
-    private updateTimestamps;
-    private previousTimestampIndex;
     /**
-     * Renders the subtitle for the given timestamp.
-     * @param time The timestamp in seconds.
-     */
-    renderAtTimestamp(time: number): void;
-    private readonly worker;
-    private onWorkerMessage;
-    /**
-     * Loads the subtitle file from the given url.
-     * @param url The url to the PGS file.
-     */
-    loadFromUrl(url: string): void;
-    /**
-     * Loads the subtitle file from the given buffer.
-     * @param buffer The PGS data.
-     */
-    loadFromBuffer(buffer: ArrayBuffer): void;
-    /**
      * Destroys the subtitle canvas and removes event listeners.
@@ -57,0 +56,0 @@ */

dist/utils/runLengthEncoding.d.ts

@@ -13,3 +13,3 @@ import { BinaryReader } from "./binaryReader";
      */
-    static decode(reader: BinaryReader | Uint8Array, source: number[] | Uint8Array | Uint16Array | Uint32Array, target: number[] | Uint8Array | Uint16Array | Uint32Array): number;
+    static decode(reader: BinaryReader | Uint8Array, source: number[] | Uint8Array | Uint8ClampedArray | Uint16Array | Uint32Array, target: number[] | Uint8Array | Uint8ClampedArray | Uint16Array | Uint32Array): number;
 }

package.json

 {
   "name": "libpgs",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "author": "David Schulte",
@@ -5,0 +5,0 @@ "license": "MIT",

README.md

 # libpgs-js
 
-This library renders the graphical subtitles format PGS _(.sub / .sup)_ in the browser.
+This library renders the graphical subtitles format PGS _(.sup files)_ in the browser.
 
@@ -15,4 +15,6 @@ ## Work in progress
 This library requires the following web features:
-- [OffscreenCanvas](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas)
 - [Web Worker API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API)
+- [OffscreenCanvas](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas) *(optional sine 0.5.0)*
+  - If available rendering is done inside the web-worker. If `transferControlToOffscreen` isn't supported a fallback 
+  is used where the subtitles are renderer on the main thread.
 
@@ -19,0 +21,0 @@ ## Usage

src/pgsRenderer.ts

 import {PgsRendererOptions} from "./pgsRendererOptions";
-import {PgsRendererHelper} from "./pgsRendererHelper";
+import {PgsRendererImpl} from "./pgsRendererImpl";
+import {PgsRendererInWorkerWithOffscreenCanvas} from "./pgsRendererInWorkerWithOffscreenCanvas";
+import {PgsRendererInWorkerWithoutOffscreenCanvas} from "./pgsRendererInWorkerWithoutOffscreenCanvas";
 
@@ -7,4 +9,2 @@ /**
  * video element is provided.
- *
- * The actual rendering is done by {@link PgsRendererInternal} inside a web-worker so optimize performance.
  */
@@ -35,13 +35,20 @@ export class PgsRenderer {
 
+        // Jellyfin still supports webOS 5 aka Chrome 69. There `transferControlToOffscreen` is not available.
+        // In that case we will render the canvas on the main thread.
+        // If required we could add a non-worker implementation in the future. Also, we could add an option to force a
+        // certain implementation when needed.
+        const isOffscreenCanvasSupported = this.isOffscreenCanvasSupported();
+        console.log(`isOffscreenCanvasSupported: ${isOffscreenCanvasSupported}`);
+        if (isOffscreenCanvasSupported) {
+            this.implementation = new PgsRendererInWorkerWithOffscreenCanvas(options, this.canvas);
 
-        // Init worker
-        const offscreenCanvas = this.canvas.transferControlToOffscreen();
-        const workerUrl = options.workerUrl ?? 'libpgs.worker.js';
-        this.worker = new Worker(workerUrl);
-        this.worker.onmessage = this.onWorkerMessage;
-        this.worker.postMessage({
-            op: 'init',
-            canvas: offscreenCanvas,
-        }, [offscreenCanvas])
+        } else {
+            this.implementation = new PgsRendererInWorkerWithoutOffscreenCanvas(options, this.canvas);
+        }
 
+        // Re-render the current subtitle if the timestamps were updates (e.g. through partial load).
+        this.implementation.onTimestampsUpdated = () => {
+            this.renderAtVideoTimestamp();
+        }
+
         // Load initial settings
@@ -56,2 +63,35 @@ this.$timeOffset = options.timeOffset ?? 0;
 
+    /**
+     * Checks if the offscreen-canvas and `transferControlToOffscreen` are supported in the current environment.
+     */
+    private isOffscreenCanvasSupported(): boolean {
+        return !!HTMLCanvasElement.prototype.transferControlToOffscreen;
+    }
+
+    private implementation: PgsRendererImpl;
+
+    /**
+     * Loads the subtitle file from the given url.
+     * @param url The url to the PGS file.
+     */
+    public loadFromUrl(url: string): void {
+        this.implementation.loadFromUrl(url);
+    }
+
+    /**
+     * Loads the subtitle file from the given buffer.
+     * @param buffer The PGS data.
+     */
+    public loadFromBuffer(buffer: ArrayBuffer): void {
+        this.implementation.loadFromBuffer(buffer);
+    }
+
+    /**
+     * Renders the subtitle for the given timestamp.
+     * @param time The timestamp in seconds.
+     */
+    public renderAtTimestamp(time: number): void {
+        this.implementation.renderAtTimestamp(time);
+    }
+
     // region Video
@@ -81,11 +121,7 @@
     private registerVideoEvents(): void {
-        if (this.video) {
-            this.video.addEventListener('timeupdate', this.onTimeUpdate);
-        }
+        this.video?.addEventListener('timeupdate', this.onTimeUpdate);
     }
 
     private unregisterVideoEvents(): void {
-        if (this.video) {
-            this.video.removeEventListener('timeupdate', this.onTimeUpdate);
-        }
+        this.video?.removeEventListener('timeupdate', this.onTimeUpdate);
     }
@@ -130,69 +166,2 @@
 
-    // region Rendering
-
-    private updateTimestamps: number[] = [];
-    private previousTimestampIndex: number = 0;
-
-    /**
-     * Renders the subtitle for the given timestamp.
-     * @param time The timestamp in seconds.
-     */
-    public renderAtTimestamp(time: number): void {
-        const index = PgsRendererHelper.getIndexFromTimestamps(time, this.updateTimestamps);
-
-        // Only tell the worker, if the subtitle index was changed!
-        if (this.previousTimestampIndex === index) return;
-        this.previousTimestampIndex = index;
-
-        // Tell the worker to render.
-        this.worker.postMessage({
-            op: 'render',
-            index: index
-        });
-    }
-
-    // endregion
-
-    // region Worker
-
-    private readonly worker: Worker;
-
-    private onWorkerMessage = (e: MessageEvent) => {
-        switch (e.data.op) {
-            // Is called once a subtitle file was loaded.
-            case 'updateTimestamps':
-                // Stores the update timestamps, so we don't need to push the timestamp to the worker on every tick.
-                // Instead, we push the timestamp index if it was changed.
-                this.updateTimestamps = e.data.updateTimestamps;
-
-                // Skip to the current timestamp
-                this.renderAtVideoTimestamp();
-                break;
-        }
-    }
-
-    /**
-     * Loads the subtitle file from the given url.
-     * @param url The url to the PGS file.
-     */
-    public loadFromUrl(url: string): void {
-        this.worker.postMessage({
-            op: 'loadFromUrl',
-            url: url,
-        })
-    }
-
-    /**
-     * Loads the subtitle file from the given buffer.
-     * @param buffer The PGS data.
-     */
-    public loadFromBuffer(buffer: ArrayBuffer): void {
-        this.worker.postMessage({
-            op: 'loadFromBuffer',
-            buffer: buffer,
-        })
-    }
-
-    // endregion
-
     // region Dispose
@@ -204,3 +173,3 @@
     public dispose(): void {
-        this.worker.terminate();
+        this.implementation.dispose();
         this.unregisterVideoEvents();
@@ -207,0 +176,0 @@

src/utils/runLengthEncoding.ts

@@ -16,4 +16,4 @@ import {BinaryReader} from "./binaryReader";
     static decode(reader: BinaryReader | Uint8Array,
-        source: number[] | Uint8Array | Uint16Array | Uint32Array,
-        target: number[] | Uint8Array | Uint16Array | Uint32Array): number {
+        source: number[] | Uint8Array | Uint8ClampedArray | Uint16Array | Uint32Array,
+        target: number[] | Uint8Array | Uint8ClampedArray | Uint16Array | Uint32Array): number {
         if (reader instanceof Uint8Array) {
@@ -20,0 +20,0 @@ reader = new ArrayBinaryReader(reader);

src/worker.ts

@@ -1,4 +0,6 @@
-import {PgsRendererInternal} from "./pgsRendererInternal";
+import {Renderer} from "./renderer";
+import {Pgs} from "./pgs";
 
-const renderer = new PgsRendererInternal();
+const pgs = new Pgs();
+let renderer: Renderer | undefined = undefined;
 
@@ -9,3 +11,3 @@ // Inform the main process that the subtitle data was loaded and return all update timestamps
         op: 'updateTimestamps',
-        updateTimestamps: renderer.updateTimestamps
+        updateTimestamps: pgs.updateTimestamps
     })
@@ -17,10 +19,18 @@ }
     switch (e.data.op) {
-        case 'init':
+
+        // Initialized the worker thread and receives the canvas (if supported).
+        case 'init': {
             const canvas: OffscreenCanvas = e.data.canvas;
-            renderer.setCanvas(canvas);
+
+            // The canvas is optional. If
+            if (canvas) {
+                renderer = new Renderer(canvas);
+            }
             break;
+        }
 
-        case 'loadFromUrl':
+        // Tells the worker to load a subtitle file from an url.
+        case 'loadFromUrl': {
             const url: string = e.data.url;
-            renderer.loadFromUrl(url, {
+            pgs.loadFromUrl(url, {
                 onProgress: () => {
@@ -33,6 +43,8 @@ submitTimestamps();
             break;
+        }
 
-        case 'loadFromBuffer':
+        // Tells the worker to load a subtitle file from the given buffer.
+        case 'loadFromBuffer': {
             const buffer: ArrayBuffer = e.data.buffer;
-            renderer.loadFromBuffer(buffer).then(() => {
+            pgs.loadFromBuffer(buffer).then(() => {
                 submitTimestamps();
@@ -42,11 +54,32 @@ });
             break;
+        }
 
-        case 'render':
+        // Renders the subtitle at the given index inside the worker.
+        // This is only supported if a canvas was provided to the worker.
+        case 'render': {
             const index: number = e.data.index;
+            const subtitleData = pgs.getSubtitleAtIndex(index);
             requestAnimationFrame(() => {
-                renderer.renderAtIndex(index);
+                renderer?.draw(subtitleData);
             });
+            pgs.cacheSubtitleAtIndex(index + 1);
             break;
+        }
+
+        // Requests to build the subtitle pixel data.
+        case 'requestSubtitleData': {
+            const index: number = e.data.index;
+            const subtitleData = pgs.getSubtitleAtIndex(index);
+
+            // Returns the data to the main thread.
+            postMessage({
+                op: 'subtitleData',
+                subtitleData: subtitleData
+            })
+
+            pgs.cacheSubtitleAtIndex(index + 1);
+            break;
+        }
     }
 }
 

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

216298

increased by7.69%

Number of package files

79

increased by16.18%

Lines of code

2341

increased by16.24%

Number of lines in readme file

100

increased by2.04%

No dependency changes