libpgs - npm Package Compare versions

Comparing version 0.3.2 to 0.4.0

dist/libpgs.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.libpgs=t():e.libpgs=t()}(self,(()=>(()=>{"use strict";var e={97:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.PgsRenderer=void 0,t.PgsRenderer=class{constructor(e){var t,s;if(this.$timeOffset=0,this.onTimeUpdate=()=>{this.renderAtVideoTimestamp()},this.updateTimestamps=[],this.previousTimestampIndex=0,this.onWorkerMessage=e=>{"loaded"===e.data.op&&(this.updateTimestamps=e.data.updateTimestamps,this.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)}const i=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:i},[i]),this.$timeOffset=null!==(s=e.timeOffset)&&void 0!==s?s:0,e.subUrl&&this.loadFromUrl(e.subUrl),this.registerVideoEvents()}get timeOffset(){return this.$timeOffset}set timeOffset(e){this.$timeOffset!==e&&(this.$timeOffset=e,this.renderAtVideoTimestamp())}registerVideoEvents(){this.video&&this.video.addEventListener("timeupdate",this.onTimeUpdate)}unregisterVideoEvents(){this.video&&this.video.removeEventListener("timeupdate",this.onTimeUpdate)}renderAtVideoTimestamp(){this.video&&this.renderAtTimestamp(this.video.currentTime+this.$timeOffset)}createCanvasElement(){const 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}destroyCanvasElement(){this.canvas.remove()}renderAtTimestamp(e){e=1e3*e*90;let t=-1;for(const s of this.updateTimestamps){if(s>e)break;t++}this.previousTimestampIndex!=t&&(this.previousTimestampIndex=t,this.worker.postMessage({op:"render",index:t}))}loadFromUrl(e){this.worker.postMessage({op:"loadFromUrl",url:e})}loadFromBuffer(e){this.worker.postMessage({op:"loadFromBuffer",buffer:e})}dispose(){this.worker.terminate(),this.unregisterVideoEvents(),this.canvasOwner&&this.destroyCanvasElement()}}}},t={};function s(i){var r=t[i];if(void 0!==r)return r.exports;var o=t[i]={exports:{}};return e[i](o,o.exports,s),o.exports}var i={};return(()=>{var e=i;Object.defineProperty(e,"__esModule",{value:!0}),e.PgsRenderer=void 0;const t=s(97);Object.defineProperty(e,"PgsRenderer",{enumerable:!0,get:function(){return t.PgsRenderer}})})(),i})()));
+var e=function(){function e(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("loaded"===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(e.prototype,"timeOffset",{get:function(){return this.$timeOffset},set:function(e){this.$timeOffset!==e&&(this.$timeOffset=e,this.renderAtVideoTimestamp())},enumerable:!1,configurable:!0}),e.prototype.registerVideoEvents=function(){this.video&&this.video.addEventListener("timeupdate",this.onTimeUpdate)},e.prototype.unregisterVideoEvents=function(){this.video&&this.video.removeEventListener("timeupdate",this.onTimeUpdate)},e.prototype.renderAtVideoTimestamp=function(){this.video&&this.renderAtTimestamp(this.video.currentTime+this.$timeOffset)},e.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},e.prototype.destroyCanvasElement=function(){this.canvas.remove()},e.prototype.renderAtTimestamp=function(e){e=1e3*e*90;for(var t=-1,s=0,i=this.updateTimestamps;s<i.length;s++){if(i[s]>e)break;t++}this.previousTimestampIndex!==t&&(this.previousTimestampIndex=t,this.worker.postMessage({op:"render",index:t}))},e.prototype.loadFromUrl=function(e){this.worker.postMessage({op:"loadFromUrl",url:e})},e.prototype.loadFromBuffer=function(e){this.worker.postMessage({op:"loadFromBuffer",buffer:e})},e.prototype.dispose=function(){this.worker.terminate(),this.unregisterVideoEvents(),this.canvasOwner&&this.destroyCanvasElement()},e}();export{e as PgsRenderer};

dist/libpgs.worker.js

@@ -1,1 +0,1 @@
-(()=>{"use strict";var t={719:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.DisplaySet=void 0;const n=i(498),s=i(866),o=i(818),r=i(207),a=i(32);e.DisplaySet=class{constructor(){this.presentationTimestamp=0,this.decodingTimestamp=0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[]}read(t,e){for(this.presentationTimestamp=0,this.decodingTimestamp=0,this.presentationComposition=void 0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[];;){if(e){if(20551!=t.readUInt16())throw new Error("Invalid magic number!");this.presentationTimestamp=t.readUInt32(),this.decodingTimestamp=t.readUInt32()}const i=t.readUInt8(),d=t.readUInt16();switch(i){case a.SegmentType.paletteDefinition:const e=new s.PaletteDefinitionSegment;e.read(t,d),this.paletteDefinitions.push(e);break;case a.SegmentType.objectDefinition:const h=new o.ObjectDefinitionSegment;h.read(t,d),this.objectDefinitions.push(h);break;case a.SegmentType.presentationComposition:const c=new n.PresentationCompositionSegment;c.read(t,d),this.presentationComposition=c;break;case a.SegmentType.windowDefinition:const p=new r.WindowDefinitionSegment;p.read(t,d),this.windowDefinitions.push(p);break;case a.SegmentType.end:return;default:throw new Error(`Unsupported segment type ${i}`)}}}}},818:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.ObjectDefinitionSegment=void 0;const n=i(32);e.ObjectDefinitionSegment=class{constructor(){this.id=0,this.versionNumber=0,this.lastInSequenceFlag=0,this.width=0,this.height=0,this.dataLength=0}get isFirstInSequence(){return!!(128&this.lastInSequenceFlag)}get isLastInSequence(){return!!(64&this.lastInSequenceFlag)}get segmentType(){return n.SegmentType.objectDefinition}read(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)}}},866:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.PaletteDefinitionSegment=e.PaletteEntry=void 0;const n=i(32);class s{constructor(){this.y=0,this.cr=0,this.cb=0,this.r=0,this.g=0,this.b=0,this.a=0}}e.PaletteEntry=s;class o{constructor(){this.id=0,this.versionNumber=0,this.entries={}}get segmentType(){return n.SegmentType.paletteDefinition}read(t,e){this.id=t.readUInt8(),this.versionNumber=t.readUInt8();const i=(e-2)/5;this.entries={};for(let e=0;e<i;e++){const e=t.readUInt8(),i=new s;i.y=t.readUInt8(),i.cr=t.readUInt8(),i.cb=t.readUInt8(),i.a=t.readUInt8();const n=i.y,r=i.cb-128,a=i.cr-128;i.r=o.clamp(Math.round(n+1.402*a),0,255),i.g=o.clamp(Math.round(n-.34414*r-.71414*a),0,255),i.b=o.clamp(Math.round(n+1.772*r),0,255),this.entries[e]=i}}static clamp(t,e,i){return Math.max(e,Math.min(t,i))}}e.PaletteDefinitionSegment=o},498:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.PresentationCompositionSegment=e.CompositionObject=void 0;const n=i(32);class s{constructor(){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}get hasCropping(){return!!(128&this.croppedFlag)}}e.CompositionObject=s,e.PresentationCompositionSegment=class{constructor(){this.width=0,this.height=0,this.frameRate=0,this.compositionNumber=0,this.compositionState=0,this.paletteUpdateFlag=0,this.paletteId=0,this.compositionObjects=[]}get segmentType(){return n.SegmentType.presentationComposition}read(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();const i=t.readUInt8();this.compositionObjects=[];for(let e=0;e<i;e++){const e=new s;e.id=t.readUInt16(),e.windowId=t.readUInt8(),e.croppedFlag=t.readUInt8(),e.horizontalPosition=t.readUInt16(),e.verticalPosition=t.readUInt16(),e.hasCropping&&(e.croppingHorizontalPosition=t.readUInt16(),e.croppingVerticalPosition=t.readUInt16(),e.croppingWidth=t.readUInt16(),e.croppingHeightPosition=t.readUInt16()),this.compositionObjects.push(e)}}}},32:(t,e)=>{var i;Object.defineProperty(e,"__esModule",{value:!0}),e.SegmentType=void 0,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||(e.SegmentType=i={}))},207:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.WindowDefinitionSegment=e.WindowDefinition=void 0;const n=i(32);class s{constructor(){this.id=0,this.horizontalPosition=0,this.verticalPosition=0,this.width=0,this.height=0}}e.WindowDefinition=s,e.WindowDefinitionSegment=class{constructor(){this.windows=[]}get segmentType(){return n.SegmentType.windowDefinition}read(t,e){const i=t.readUInt8();this.windows=[];for(let e=0;e<i;e++){const e=new s;e.id=t.readUInt8(),e.horizontalPosition=t.readUInt16(),e.verticalPosition=t.readUInt16(),e.width=t.readUInt16(),e.height=t.readUInt16(),this.windows.push(e)}}}},16:function(t,e,i){var n=this&&this.__awaiter||function(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{d(n.next(t))}catch(t){o(t)}}function a(t){try{d(n.throw(t))}catch(t){o(t)}}function d(t){var e;t.done?s(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,a)}d((n=n.apply(t,e||[])).next())}))};Object.defineProperty(e,"__esModule",{value:!0}),e.PgsRendererInternal=void 0;const s=i(719),o=i(489),r=i(494),a=i(381);e.PgsRendererInternal=class{constructor(){this.displaySets=[],this.updateTimestamps=[]}loadFromUrlAsync(t){return n(this,void 0,void 0,(function*(){const e=yield fetch(t),i=yield e.arrayBuffer();this.loadFromBuffer(i)}))}loadFromBuffer(t){this.displaySets=[],this.updateTimestamps=[];const e=new o.BigEndianBinaryReader(new Uint8Array(t));for(;e.position<e.length;){const t=new s.DisplaySet;t.read(e,!0),this.displaySets.push(t),this.updateTimestamps.push(t.presentationTimestamp)}}setCanvas(t){this.canvas=t,this.context=t.getContext("2d")}renderAtIndex(t){var e,i;if(!this.canvas||!this.context)return;if(this.context.clearRect(0,0,this.canvas.width,this.canvas.height),t<0||t>=this.displaySets.length)return;const n=this.displaySets[t];if(!n.presentationComposition)return;this.canvas.width==n.presentationComposition.width&&this.canvas.height==n.presentationComposition.height||(this.canvas.width=n.presentationComposition.width,this.canvas.height=n.presentationComposition.height);const s=[],o=[],r=[];let a=t;for(;a>=0&&(s.unshift(...this.displaySets[a].objectDefinitions),o.unshift(...this.displaySets[a].paletteDefinitions),r.unshift(...this.displaySets[a].windowDefinitions.flatMap((t=>t.windows))),0===(null===(e=this.displaySets[a].presentationComposition)||void 0===e?void 0:e.compositionState));)a--;let d=o.find((t=>{var e;return t.id===(null===(e=n.presentationComposition)||void 0===e?void 0:e.paletteId)}));if(d)for(const t of n.presentationComposition.compositionObjects){let e=r.find((e=>e.id===t.windowId));if(!e)continue;const n=this.getPixelDataFromComposition(t,d,s);n&&(null===(i=this.context)||void 0===i||i.drawImage(n,e.horizontalPosition,e.verticalPosition))}}getPixelDataFromComposition(t,e,i){let n=0,s=0;const o=[];for(const e of i)e.id==t.id&&(e.isFirstInSequence&&(n=e.width,s=e.height),e.data&&o.push(e.data));if(0==o.length)return;const d=new a.CombinedBinaryReader(o),h=new OffscreenCanvas(n,s),c=h.getContext("2d"),p=c.createImageData(n,s),l=p.data;return r.RunLengthEncoding.decode(d,((t,i,n,s)=>{const o=null==e?void 0:e.entries[s];o&&(l[4*t]=o.r,l[4*t+1]=o.g,l[4*t+2]=o.b,l[4*t+3]=o.a)})),c.putImageData(p,0,0),h}}},385:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.ArrayBinaryReader=void 0,e.ArrayBinaryReader=class{constructor(t){this.$position=0,this.array=t}get position(){return this.$position}get length(){return this.array.length}readByte(){return this.array[this.$position++]}readBytes(t){const e=this.array.slice(this.$position,this.$position+t);return this.$position+=t,e}}},489:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.BigEndianBinaryReader=void 0;const n=i(385);e.BigEndianBinaryReader=class{constructor(t){t instanceof Uint8Array?this.reader=new n.ArrayBinaryReader(t):this.reader=t}get position(){return this.reader.position}get length(){return this.reader.length}readUInt8(){return this.reader.readByte()}readUInt16(){return(this.reader.readByte()<<8)+this.reader.readByte()}readUInt24(){return(this.reader.readByte()<<16)+(this.reader.readByte()<<8)+this.reader.readByte()}readUInt32(){return(this.reader.readByte()<<24)+(this.reader.readByte()<<16)+(this.reader.readByte()<<8)+this.reader.readByte()}readBytes(t){return this.reader.readBytes(t)}}},381:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.CombinedBinaryReader=void 0;const n=i(385);e.CombinedBinaryReader=class{constructor(t){this.$position=0,this.subReaderIndex=0,this.subReaders=t.map((t=>t instanceof Uint8Array?new n.ArrayBinaryReader(t):t));let e=0;for(const i of t)e+=i.length;this.$length=e}get position(){return this.$position}get length(){return this.$length}readByte(){for(;this.subReaders[this.subReaderIndex].position>=this.subReaders[this.subReaderIndex].length;)this.subReaderIndex++;return this.$position++,this.subReaders[this.subReaderIndex].readByte()}readBytes(t){const e=new Uint8Array(t);for(let i=0;i<t;i++)e[i]=this.readByte();return e}}},494:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.RunLengthEncoding=void 0;const n=i(385);e.RunLengthEncoding=class{static decode(t,e){t instanceof Uint8Array&&(t=new n.ArrayBinaryReader(t));let i=0,s=0,o=0;for(;t.position<t.length;){const n=t.readByte();if(0!=n){e(o++,i++,s,n);continue}const r=t.readByte();if(0==r){i=0,s++;continue}const a=!!(128&r);let d=63&r;64&r&&(d=(d<<8)+t.readByte());const h=a?t.readByte():0;for(let t=0;t<d;t++)e(o++,i++,s,h)}}}}},e={};function i(n){var s=e[n];if(void 0!==s)return s.exports;var o=e[n]={exports:{}};return t[n].call(o.exports,o,o.exports,i),o.exports}(()=>{const t=new(i(16).PgsRendererInternal),e=()=>{postMessage({op:"loaded",updateTimestamps:t.updateTimestamps})};onmessage=i=>{switch(i.data.op){case"init":const n=i.data.canvas;t.setCanvas(n);break;case"loadFromUrl":const s=i.data.url;t.loadFromUrlAsync(s).then((()=>{e()}));break;case"loadFromBuffer":const o=i.data.buffer;t.loadFromBuffer(o),e();break;case"render":const r=i.data.index;t.renderAtIndex(r)}}})()})();
+function t(t,e,n,i){return new(n||(n=Promise))((function(r,o){function a(t){try{d(i.next(t))}catch(t){o(t)}}function s(t){try{d(i.throw(t))}catch(t){o(t)}}function d(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(a,s)}d((i=i.apply(t,e||[])).next())}))}function e(t,e){var n,i,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(d){return function(s){if(n)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(a=0)),a;)try{if(n=1,i&&(r=2&s[0]?i.return:s[0]?i.throw||((r=i.return)&&r.call(i),0):i.next)&&!(r=r.call(i,s[1])).done)return r;switch(i=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++,i=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],i=0}finally{n=r=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,d])}}}var n;"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"}(n||(n={}));var i=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 n.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 n=t.readUInt8();this.compositionObjects=[];for(var r=0;r<n;r++){var o=new i;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(){this.y=0,this.cr=0,this.cb=0,this.r=0,this.g=0,this.b=0,this.a=0},a=function(){function t(){this.id=0,this.versionNumber=0,this.entries={}}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return n.paletteDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(e,n){this.id=e.readUInt8(),this.versionNumber=e.readUInt8();var i=(n-2)/5;this.entries={};for(var r=0;r<i;r++){var a=e.readUInt8(),s=new o;s.y=e.readUInt8(),s.cr=e.readUInt8(),s.cb=e.readUInt8(),s.a=e.readUInt8();var d=s.y,p=s.cb-128,h=s.cr-128;s.r=t.clamp(Math.round(d+1.402*h),0,255),s.g=t.clamp(Math.round(d-.34414*p-.71414*h),0,255),s.b=t.clamp(Math.round(d+1.772*p),0,255),this.entries[a]=s}},t.clamp=function(t,e,n){return Math.max(e,Math.min(t,n))},t}(),s=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 n.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}(),d=function(){this.id=0,this.horizontalPosition=0,this.verticalPosition=0,this.width=0,this.height=0},p=function(){function t(){this.windows=[]}return Object.defineProperty(t.prototype,"segmentType",{get:function(){return n.windowDefinition},enumerable:!1,configurable:!0}),t.prototype.read=function(t,e){var n=t.readUInt8();this.windows=[];for(var i=0;i<n;i++){var r=new d;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}(),h=function(){function t(){this.presentationTimestamp=0,this.decodingTimestamp=0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[]}return t.prototype.read=function(t,e){for(this.presentationTimestamp=0,this.decodingTimestamp=0,this.presentationComposition=void 0,this.paletteDefinitions=[],this.objectDefinitions=[],this.windowDefinitions=[];;){var i=0,o=0;if(e){if(20551!=t.readUInt16())throw new Error("Invalid magic number!");i=t.readUInt32(),o=t.readUInt32()}var d=t.readUInt8(),h=t.readUInt16();switch(d){case n.paletteDefinition:var u=new a;u.read(t,h),this.paletteDefinitions.push(u);break;case n.objectDefinition:var c=new s;c.read(t,h),this.objectDefinitions.push(c);break;case n.presentationComposition:var f=new r;f.read(t,h),this.presentationComposition=f,this.presentationTimestamp=i,this.decodingTimestamp=o;break;case n.windowDefinition:var l=new p;l.read(t,h),this.windowDefinitions.push(l);break;case n.end:return;default:throw new Error("Unsupported segment type ".concat(d))}}},t}(),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}),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}(),c=function(){function t(t){t instanceof Uint8Array?this.reader=new u(t):this.reader=t}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}),t.prototype.readUInt8=function(){return this.reader.readByte()},t.prototype.readUInt16=function(){return(this.reader.readByte()<<8)+this.reader.readByte()},t.prototype.readUInt24=function(){return(this.reader.readByte()<<16)+(this.reader.readByte()<<8)+this.reader.readByte()},t.prototype.readUInt32=function(){return(this.reader.readByte()<<24)+(this.reader.readByte()<<16)+(this.reader.readByte()<<8)+this.reader.readByte()},t.prototype.readBytes=function(t){return this.reader.readBytes(t)},t}(),f=function(){function t(){}return t.decode=function(t,e){t instanceof Uint8Array&&(t=new u(t));for(var n=0,i=0,r=0;t.position<t.length;){var o=t.readByte();if(0==o){var a=t.readByte();if(0!=a){var s=!!(128&a),d=63&a;!!(64&a)&&(d=(d<<8)+t.readByte());for(var p=s?t.readByte():0,h=0;h<d;h++)e(r++,n++,i,p)}else n=0,i++}else e(r++,n++,i,o)}},t}(),l=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,n=0,i=t;n<i.length;n++){e+=i[n].length}this.$length=e}return 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}),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),n=0;n<t;n++)e[n]=this.readByte();return e},t}(),y=new(function(){function n(){this.displaySets=[],this.updateTimestamps=[]}return n.prototype.loadFromUrlAsync=function(n){return t(this,void 0,void 0,(function(){var t;return e(this,(function(e){switch(e.label){case 0:return[4,fetch(n)];case 1:return[4,e.sent().arrayBuffer()];case 2:return t=e.sent(),this.loadFromBuffer(t),[2]}}))}))},n.prototype.loadFromBuffer=function(t){this.displaySets=[],this.updateTimestamps=[];for(var e=new c(new Uint8Array(t));e.position<e.length;){var n=new h;n.read(e,!0),this.displaySets.push(n),this.updateTimestamps.push(n.presentationTimestamp)}},n.prototype.setCanvas=function(t){this.canvas=t,this.context=t.getContext("2d")},n.prototype.renderAtTimestamp=function(t){t=1e3*t*90;for(var e=-1,n=0,i=this.updateTimestamps;n<i.length;n++){if(i[n]>t)break;e++}this.renderAtIndex(e)},n.prototype.renderAtIndex=function(t){var e;if(this.canvas&&this.context&&(this.context.clearRect(0,0,this.canvas.width,this.canvas.height),!(t<0||t>=this.displaySets.length))){var n=this.displaySets[t];if(n.presentationComposition){this.canvas.width==n.presentationComposition.width&&this.canvas.height==n.presentationComposition.height||(this.canvas.width=n.presentationComposition.width,this.canvas.height=n.presentationComposition.height);for(var i=[],r=[],o=[],a=t;a>=0&&(i.unshift.apply(i,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=n.presentationComposition)||void 0===e?void 0:e.paletteId)}));if(s)for(var d=function(t){var e=o.find((function(e){return e.id===t.windowId}));if(!e)return"continue";var n=p.getPixelDataFromComposition(t,s,i);n&&p.context.drawImage(n,e.horizontalPosition,e.verticalPosition)},p=this,h=0,u=n.presentationComposition.compositionObjects;h<u.length;h++){d(u[h])}}}},n.prototype.createCanvas=function(t,e){if("undefined"!=typeof document){var n=document.createElement("canvas");return n.width=t,n.height=e,n}return new OffscreenCanvas(t,e)},n.prototype.getPixelDataFromComposition=function(t,e,n){for(var i=0,r=0,o=[],a=0,s=n;a<s.length;a++){var d=s[a];d.id==t.id&&(d.isFirstInSequence&&(i=d.width,r=d.height),d.data&&o.push(d.data))}if(0!=o.length){var p=new l(o),h=this.createCanvas(i,r),u=h.getContext("2d"),c=u.createImageData(i,r),y=c.data;return f.decode(p,(function(t,n,i,r){var o=null==e?void 0:e.entries[r];o&&(y[4*t]=o.r,y[4*t+1]=o.g,y[4*t+2]=o.b,y[4*t+3]=o.a)})),u.putImageData(c,0,0),h}},n}()),m=function(){postMessage({op:"loaded",updateTimestamps:y.updateTimestamps})};onmessage=function(t){switch(t.data.op){case"init":var e=t.data.canvas;y.setCanvas(e);break;case"loadFromUrl":var n=t.data.url;y.loadFromUrlAsync(n).then((function(){m()}));break;case"loadFromBuffer":var i=t.data.buffer;y.loadFromBuffer(i),m();break;case"render":var r=t.data.index;y.renderAtIndex(r)}};

dist/pgsRendererInternal.d.ts

@@ -33,2 +33,7 @@ import { DisplaySet } from "./pgs/displaySet";
     /**
+     * Renders the subtitle at the given timestamp.
+     * @param time The timestamp in seconds.
+     */
+    renderAtTimestamp(time: number): void;
+    /**
      * Renders the subtitle with the given index.
@@ -38,3 +43,4 @@ * @param index The index of the display set to render.
     renderAtIndex(index: number): void;
+    private createCanvas;
     private getPixelDataFromComposition;
 }

jest.config.js

@@ -1,2 +0,2 @@
-module.exports = {
+export default {
     transform: {'^.+\\.ts?$': 'ts-jest'},
@@ -3,0 +3,0 @@ testEnvironment: 'node',

package.json

 {
   "name": "libpgs",
-  "version": "0.3.2",
+  "version": "0.4.0",
   "author": "David Schulte",
@@ -23,4 +23,5 @@ "license": "MIT",
   "types": "dist/libpgs.d.ts",
+  "type": "module",
   "scripts": {
-    "build": "webpack -c webpack.configuration.js",
+    "build": "rollup -c",
     "test": "jest",
@@ -30,12 +31,15 @@ "clear": "rm -rf ./dist"
   "devDependencies": {
+    "@rollup/plugin-terser": "^0.4.4",
+    "@rollup/plugin-typescript": "^11.1.6",
     "@tsconfig/recommended": "^1.0.6",
     "@types/jest": "^29.5.12",
+    "canvas": "^2.11.2",
     "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "rollup": "^4.18.0",
     "ts-jest": "^29.1.4",
-    "ts-loader": "^9.5.1",
     "ts-node": "^10.9.2",
-    "typescript": "^5.4.5",
-    "webpack": "^5.91.0",
-    "webpack-cli": "^5.1.4"
+    "tslib": "^2.6.3",
+    "typescript": "^5.4.5"
   }
 }

src/pgs/displaySet.ts

@@ -37,2 +37,5 @@ import {BigEndianBinaryReader} from "../utils/bigEndianBinaryReader";
         {
+            let presentationTimestamp: number = 0;
+            let decodingTimestamp: number = 0;
+
             // The header is included before every segment. Even for the end segment.
@@ -46,4 +49,4 @@ if (includeHeader)
 
-                this.presentationTimestamp = reader.readUInt32();
-                this.decodingTimestamp = reader.readUInt32();
+                presentationTimestamp = reader.readUInt32();
+                decodingTimestamp = reader.readUInt32();
             }
@@ -68,2 +71,6 @@
                     this.presentationComposition = pcs;
+
+                    // SubtitleEdit only writes the relevant timestamp to the PCS.
+                    this.presentationTimestamp = presentationTimestamp;
+                    this.decodingTimestamp = decodingTimestamp;
                     break;
@@ -70,0 +77,0 @@ case SegmentType.windowDefinition:

src/pgsRenderer.ts

@@ -147,3 +147,3 @@ import {PgsRendererOptions} from "./pgsRendererOptions";
         // Only tell the worker, if the subtitle index was changed!
-        if (this.previousTimestampIndex == index) return;
+        if (this.previousTimestampIndex === index) return;
         this.previousTimestampIndex = index;
@@ -150,0 +150,0 @@

src/pgsRendererInternal.ts

@@ -71,2 +71,22 @@ import {DisplaySet} from "./pgs/displaySet";
     /**
+     * Renders the subtitle at the given timestamp.
+     * @param time The timestamp in seconds.
+     */
+    public renderAtTimestamp(time: number): void {
+        time = time * 1000 * 90; // Convert to PGS time
+
+        // Find the last subtitle index for the given time stamp
+        let index = -1;
+        for (const updateTimestamp of this.updateTimestamps) {
+
+            if (updateTimestamp > time) {
+                break;
+            }
+            index++;
+        }
+
+        this.renderAtIndex(index);
+    }
+
+    /**
      * Renders the subtitle with the given index.
@@ -132,3 +152,3 @@ * @param index The index of the display set to render.
             if (pixelData) {
-                this.context?.drawImage(pixelData, window.horizontalPosition, window.verticalPosition);
+                this.context.drawImage(pixelData, window.horizontalPosition, window.verticalPosition);
             }
@@ -138,6 +158,16 @@ }
 
+    private createCanvas(width: number, height: number): OffscreenCanvas | HTMLCanvasElement {
+        if (typeof document !== 'undefined') {
+            const canvas = document.createElement("canvas");
+            canvas.width = width;
+            canvas.height = height;
+            return canvas;
+        } else {
+            return new OffscreenCanvas(width, height);
+        }
+    }
 
     private getPixelDataFromComposition(composition: CompositionObject, palette: PaletteDefinitionSegment,
                                         ctxObjects: ObjectDefinitionSegment[]):
-        OffscreenCanvas | undefined {
+        OffscreenCanvas | HTMLCanvasElement | undefined {
 
@@ -169,4 +199,4 @@ // Multiple object definition can define a single subtitle image.
         // Building a canvas element with the subtitle image data.
-        const canvas = new OffscreenCanvas(width, height);
-        const context = canvas.getContext('2d')!;
+        const canvas = this.createCanvas(width, height);
+        const context = canvas.getContext('2d')! as OffscreenCanvasRenderingContext2D | CanvasRenderingContext2D;
         const imageData = context.createImageData(width, height);
@@ -173,0 +203,0 @@ const buffer = imageData.data;

tsconfig.json

 {
   "extends": "@tsconfig/recommended/tsconfig.json",
   "compilerOptions": {
-    "target": "es2016",
-    "module": "commonjs",
+    "target": "es5",
+    "module": "esnext",
     "esModuleInterop": true,
@@ -7,0 +7,0 @@ "forceConsistentCasingInFileNames": true,

No alert changes

Improved metrics

Total package byte prevSize

176597

increased by156.92%

Number of package files

57

increased by14%

Lines of code

1505

increased by11.07%

Is type module

Yes

Worsened metrics

Dev dependency count

12

increased by33.33%

No dependency changes