xterm-addon-image - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

lib/xterm-addon-image.js

 /*! For license information please see xterm-addon-image.js.LICENSE.txt */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.ImageAddon=t():e.ImageAddon=t()}(self,(function(){return(()=>{"use strict";var e={477:(e,t)=>{function i(e){return 255&e}function r(e){return e>>>8&255}function s(e){return e>>>16&255}function o(e,t,i,r=255){return((255&r)<<24|(255&i)<<16|(255&t)<<8|255&e)>>>0}function a(e,t,i){return Math.max(e,Math.min(i,t))}function l(e,t,i){return i<0&&(i+=1),i>1&&(i-=1),6*i<1?t+6*(e-t)*i:2*i<1?e:3*i<2?t+(e-t)*(4-6*i):t}function n(e,t,i){return(4278190080|Math.round(i/100*255)<<16|Math.round(t/100*255)<<8|Math.round(e/100*255))>>>0}Object.defineProperty(t,"__esModule",{value:!0}),t.DEFAULT_FOREGROUND=t.DEFAULT_BACKGROUND=t.PALETTE_ANSI_256=t.PALETTE_VT340_GREY=t.PALETTE_VT340_COLOR=t.normalizeHLS=t.normalizeRGB=t.nearestColorIndex=t.fromRGBA8888=t.toRGBA8888=t.alpha=t.blue=t.green=t.red=t.BIG_ENDIAN=void 0,t.BIG_ENDIAN=255===new Uint8Array(new Uint32Array([4278190080]).buffer)[0],t.BIG_ENDIAN&&console.warn("BE platform detected. This version of node-sixel works only on LE properly."),t.red=i,t.green=r,t.blue=s,t.alpha=function(e){return e>>>24&255},t.toRGBA8888=o,t.fromRGBA8888=function(e){return[255&e,e>>8&255,e>>16&255,e>>>24]},t.nearestColorIndex=function(e,t){const o=i(e),a=r(e),l=s(e);let n=Number.MAX_SAFE_INTEGER,h=-1;for(let e=0;e<t.length;++e){const i=o-t[e][0],r=a-t[e][1],s=l-t[e][2],d=i*i+r*r+s*s;if(!d)return e;d<n&&(n=d,h=e)}return h},t.normalizeRGB=n,t.normalizeHLS=function(e,t,i){return function(e,t,i){if(!i){const e=Math.round(255*t);return o(e,e,e)}const r=t<.5?t*(1+i):t+i-t*i,s=2*t-r;return o(a(0,255,Math.round(255*l(r,s,e+1/3))),a(0,255,Math.round(255*l(r,s,e))),a(0,255,Math.round(255*l(r,s,e-1/3))))}((e+240)/360,t/100,i/100)},t.PALETTE_VT340_COLOR=new Uint32Array([n(0,0,0),n(20,20,80),n(80,13,13),n(20,80,20),n(80,20,80),n(20,80,80),n(80,80,20),n(53,53,53),n(26,26,26),n(33,33,60),n(60,26,26),n(33,60,33),n(60,33,60),n(33,60,60),n(60,60,33),n(80,80,80)]),t.PALETTE_VT340_GREY=new Uint32Array([n(0,0,0),n(13,13,13),n(26,26,26),n(40,40,40),n(6,6,6),n(20,20,20),n(33,33,33),n(46,46,46),n(0,0,0),n(13,13,13),n(26,26,26),n(40,40,40),n(6,6,6),n(20,20,20),n(33,33,33),n(46,46,46)]),t.PALETTE_ANSI_256=(()=>{const e=[o(0,0,0),o(205,0,0),o(0,205,0),o(205,205,0),o(0,0,238),o(205,0,205),o(0,250,205),o(229,229,229),o(127,127,127),o(255,0,0),o(0,255,0),o(255,255,0),o(92,92,255),o(255,0,255),o(0,255,255),o(255,255,255)],t=[0,95,135,175,215,255];for(let i=0;i<6;++i)for(let r=0;r<6;++r)for(let s=0;s<6;++s)e.push(o(t[i],t[r],t[s]));for(let t=8;t<=238;t+=10)e.push(o(t,t,t));return new Uint32Array(e)})(),t.DEFAULT_BACKGROUND=o(0,0,0,255),t.DEFAULT_FOREGROUND=o(255,255,255,255)},782:(e,t,i)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ImageRenderer=void 0;const r=i(477);class s{constructor(e,t){this._terminal=e,this._showPlaceholder=t,this._oldOpen=this._terminal._core.open,this._terminal._core.open=e=>{var t;null===(t=this._oldOpen)||void 0===t||t.call(this._terminal._core,e),this._open()},this._terminal._core.screenElement&&this._open(),this._optionsRefresh=this._terminal._core.optionsService.onOptionChange((e=>{var t;"fontSize"===e&&(this.rescaleCanvas(),null===(t=this._renderService)||void 0===t||t.refreshRows(0,this._terminal.rows))}))}static createCanvas(e,t){const i=document.createElement("canvas");return i.width=0|e,i.height=0|t,i}static createImageData(e,t,i,r){if("function"!=typeof ImageData){const s=e.createImageData(t,i);return r&&s.data.set(new Uint8ClampedArray(r,0,t*i*4)),s}return r?new ImageData(new Uint8ClampedArray(r,0,t*i*4),t,i):new ImageData(t,i)}static createImageBitmap(e){return"function"!=typeof createImageBitmap?Promise.resolve(void 0):createImageBitmap(e)}dispose(){var e,t;null===(e=this._optionsRefresh)||void 0===e||e.dispose(),this._removeLayerFromDom(),this._terminal._core&&this._oldOpen&&(this._terminal._core.open=this._oldOpen,this._oldOpen=void 0),this._renderService&&this._oldSetRenderer&&(this._renderService.setRenderer=this._oldSetRenderer,this._oldSetRenderer=void 0),this._renderService=void 0,this.canvas=void 0,this._ctx=void 0,null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0,this._placeholder=void 0}showPlaceholder(e){var t,i;e?this._placeholder||-1===this.cellSize.height||this._createPlaceHolder(Math.max(this.cellSize.height+1,24)):(null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0,this._placeholder=void 0),null===(i=this._renderService)||void 0===i||i.refreshRows(0,this._terminal.rows)}get dimensions(){var e;return null===(e=this._renderService)||void 0===e?void 0:e.dimensions}get cellSize(){var e,t;return{width:(null===(e=this.dimensions)||void 0===e?void 0:e.actualCellWidth)||-1,height:(null===(t=this.dimensions)||void 0===t?void 0:t.actualCellHeight)||-1}}clearLines(e,t){var i,r,s,o;null===(i=this._ctx)||void 0===i||i.clearRect(0,e*((null===(r=this.dimensions)||void 0===r?void 0:r.actualCellHeight)||0),(null===(s=this.dimensions)||void 0===s?void 0:s.canvasWidth)||0,(++t-e)*((null===(o=this.dimensions)||void 0===o?void 0:o.actualCellHeight)||0))}clearAll(){var e,t,i;null===(e=this._ctx)||void 0===e||e.clearRect(0,0,(null===(t=this.canvas)||void 0===t?void 0:t.width)||0,(null===(i=this.canvas)||void 0===i?void 0:i.height)||0)}draw(e,t,i,r,s=1){if(!this._ctx)return;const{width:o,height:a}=this.cellSize;if(-1===o||-1===a)return;this._rescaleImage(e,o,a);const l=e.actual,n=Math.ceil(l.width/o),h=t%n*o,d=Math.floor(t/n)*a,c=i*o,_=r*a,u=s*o+h>l.width?l.width-h:s*o,g=d+a>l.height?l.height-d:a;this._ctx.drawImage(l,Math.floor(h),Math.floor(d),Math.floor(u),Math.floor(g),Math.floor(c),Math.floor(_),Math.floor(u),Math.floor(g))}extractTile(e,t){const{width:i,height:r}=this.cellSize;if(-1===i||-1===r)return;this._rescaleImage(e,i,r);const o=e.actual,a=Math.ceil(o.width/i),l=t%a*i,n=Math.floor(t/a)*r,h=i+l>o.width?o.width-l:i,d=n+r>o.height?o.height-n:r,c=s.createCanvas(h,d),_=c.getContext("2d");return _?(_.drawImage(o,Math.floor(l),Math.floor(n),Math.floor(h),Math.floor(d),0,0,Math.floor(h),Math.floor(d)),c):void 0}drawPlaceholder(e,t,i=1){if((this._placeholderBitmap||this._placeholder)&&this._ctx){const{width:r,height:s}=this.cellSize;if(-1===r||-1===s)return;s>=this._placeholder.height&&this._createPlaceHolder(s+1),this._ctx.drawImage(this._placeholderBitmap||this._placeholder,e*r,t*s%2?0:1,r*i,s,e*r,t*s,r*i,s)}}rescaleCanvas(){var e,t,i;this.canvas&&(this.canvas.width===(null===(e=this.dimensions)||void 0===e?void 0:e.canvasWidth)&&this.canvas.height===this.dimensions.canvasHeight||(this.canvas.width=(null===(t=this.dimensions)||void 0===t?void 0:t.canvasWidth)||0,this.canvas.height=(null===(i=this.dimensions)||void 0===i?void 0:i.canvasHeight)||0))}_rescaleImage(e,t,i){if(t===e.actualCellSize.width&&i===e.actualCellSize.height)return;const{width:r,height:o}=e.origCellSize;if(t===r&&i===o)return e.actual=e.orig,e.actualCellSize.width=r,void(e.actualCellSize.height=o);const a=s.createCanvas(Math.ceil(e.orig.width*t/r),Math.ceil(e.orig.height*i/o)),l=a.getContext("2d");l&&(l.drawImage(e.orig,0,0,a.width,a.height),e.actual=a,e.actualCellSize.width=t,e.actualCellSize.height=i)}_open(){this._renderService=this._terminal._core._renderService,this._oldSetRenderer=this._renderService.setRenderer.bind(this._renderService),this._renderService.setRenderer=e=>{var t;this._removeLayerFromDom(),null===(t=this._oldSetRenderer)||void 0===t||t.call(this._renderService,e),this._insertLayerToDom()},this._insertLayerToDom(),this._showPlaceholder&&this._createPlaceHolder()}_insertLayerToDom(){var e,t,i;this.canvas=s.createCanvas((null===(e=this.dimensions)||void 0===e?void 0:e.canvasWidth)||0,(null===(t=this.dimensions)||void 0===t?void 0:t.canvasHeight)||0),this.canvas.classList.add("xterm-image-layer"),null===(i=this._terminal._core.screenElement)||void 0===i||i.appendChild(this.canvas),this._ctx=this.canvas.getContext("2d",{alpha:!0,desynchronized:!0})}_removeLayerFromDom(){var e,t;null===(t=null===(e=this.canvas)||void 0===e?void 0:e.parentNode)||void 0===t||t.removeChild(this.canvas)}_createPlaceHolder(e=24){var t;null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0;const i=32,o=s.createCanvas(i,e),a=o.getContext("2d",{alpha:!1});if(!a)return;const l=s.createImageData(a,i,e),n=new Uint32Array(l.data.buffer),h=(0,r.toRGBA8888)(0,0,0),d=(0,r.toRGBA8888)(255,255,255);n.fill(h);for(let t=0;t<e;++t){const e=t%2,r=t*i;for(let t=0;t<i;t+=2)n[r+t+e]=d}a.putImageData(l,0,0);const c=screen.width+i-1&-32||4096;this._placeholder=s.createCanvas(c,e);const _=this._placeholder.getContext("2d",{alpha:!1});if(_){for(let e=0;e<c;e+=i)_.drawImage(o,e,0);s.createImageBitmap(this._placeholder).then((e=>this._placeholderBitmap=e))}else this._placeholder=void 0}}t.ImageRenderer=s},216:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ImageStorage=t.ExtendedAttrsImage=t.CELL_SIZE_DEFAULT=void 0,t.CELL_SIZE_DEFAULT={width:7,height:14};class i{constructor(e=0,t=-1,i=-1,r=-1){this.underlineStyle=e,this.underlineColor=t,this.imageId=i,this.tileId=r}clone(){return new i(this.underlineStyle,this.underlineColor,this.imageId,this.tileId)}isEmpty(){return 0===this.underlineStyle&&-1===this.imageId}}t.ExtendedAttrsImage=i;const r=new i;t.ImageStorage=class{constructor(e,t,i){this._terminal=e,this._renderer=t,this._opts=i,this._images=new Map,this._lastId=0,this._lowestId=0,this._hasDrawn=!1,this._pixelLimit=25e5;try{this.setLimit(this._opts.storageLimit)}catch(e){console.error(e.message),console.warn(`storageLimit is set to ${this.getLimit()} MB`)}this._viewportMetrics={cols:this._terminal.cols,rows:this._terminal.rows}}dispose(){this.reset()}reset(){var e;for(const t of this._images.values())null===(e=t.marker)||void 0===e||e.dispose();this._images.clear(),this._renderer.clearAll()}getLimit(){return 4*this._pixelLimit/1e6}setLimit(e){if(e<1||e>1e3)throw RangeError("invalid storageLimit, should be at least 1 MB and not exceed 1G");this._pixelLimit=e/4*1e6>>>0,this._evictOldest(0)}getUsage(){return 4*this._getStoredPixels()/1e6}_getStoredPixels(){let e=0;for(const t of this._images.values())t.orig&&(e+=t.orig.width*t.orig.height,t.actual&&t.actual!==t.orig&&(e+=t.actual.width*t.actual.height));return e}wipeAlternate(){var e;const t=[];for(const[i,r]of this._images.entries())"alternate"===r.bufferType&&(null===(e=r.marker)||void 0===e||e.dispose(),t.push(i));for(const e of t)this._images.delete(e);this._hasDrawn=!0}addImage(e){var i;this._evictOldest(e.width*e.height);let r=this._renderer.cellSize;-1!==r.width&&-1!==r.height||(r=t.CELL_SIZE_DEFAULT);const s=Math.ceil(e.width/r.width),o=Math.ceil(e.height/r.height),a=++this._lastId,l=this._terminal._core.buffer,n=this._terminal.cols,h=this._terminal.rows,d=l.x,c=l.y;let _=d,u=0;this._opts.sixelScrolling||(this._terminal._core._dirtyRowService.markAllDirty(),l.x=0,l.y=0,_=0);for(let e=0;e<o;++e){const t=l.lines.get(l.y+l.ybase);for(let i=0;i<s&&!(_+i>=n);++i)this._writeToCell(t,_+i,a,e*s+i),u++;if(this._opts.sixelScrolling)e<o-1&&this._terminal._core._inputHandler.lineFeed();else if(++l.y>=h)break;l.x=_}this._opts.sixelScrolling?l.x=_:(l.x=d,l.y=c);const g=[];for(const[e,t]of this._images.entries())t.tileCount<1&&(null===(i=t.marker)||void 0===i||i.dispose(),g.push(e));for(const e of g)this._images.delete(e);const v=this._terminal.registerMarker(0);null==v||v.onDispose((()=>{this._images.get(a)&&this._images.delete(a)})),"alternate"===this._terminal.buffer.active.type&&this._evictOnAlternate();const f={orig:e,origCellSize:r,actual:e,actualCellSize:Object.assign({},r),marker:v||void 0,tileCount:u,bufferType:this._terminal.buffer.active.type};this._images.set(a,f)}render(e){if(!this._images.size||!this._renderer.canvas)return void(this._hasDrawn&&(this._renderer.clearAll(),this._hasDrawn=!1));const{start:t,end:i}=e,s=this._terminal._core.buffer,o=this._terminal._core.cols;this._hasDrawn=!1,this._renderer.clearLines(t,i),this._renderer.rescaleCanvas();for(let e=t;e<=i;++e){const t=s.lines.get(e+s.ydisp);if(!t)return;for(let i=0;i<o;++i)if(268435456&t.getBg(i)){let s=t._extendedAttrs[i]||r;const a=s.imageId;if(void 0===a||-1===a)continue;const l=this._images.get(a);if(-1!==s.tileId){const n=s.tileId,h=i;let d=1;for(;++i<o&&268435456&t.getBg(i)&&(s=t._extendedAttrs[i]||r)&&s.imageId===a&&s.tileId===n+d;)d++;i--,l?l.actual&&this._renderer.draw(l,n,h,e,d):this._opts.showPlaceholder&&this._renderer.drawPlaceholder(h,e,d),this._hasDrawn=!0}}}}viewportResize(e){var t;if(!this._images.size)return void(this._viewportMetrics=e);if(this._viewportMetrics.cols>=e.cols)return void(this._viewportMetrics=e);const i=this._terminal._core.buffer,s=i.lines.length,o=this._viewportMetrics.cols-1;for(let a=0;a<s;++a){const s=i.lines.get(a);if(268435456&s.getBg(o)){const i=s._extendedAttrs[o]||r,a=i.imageId;if(void 0===a||-1===a)continue;const l=this._images.get(a);if(!l)continue;const n=Math.ceil(((null===(t=l.actual)||void 0===t?void 0:t.width)||0)/l.actualCellSize.width);if(i.tileId%n+1>=n)continue;let h=!1;for(let t=o+1;t>e.cols;++t)if(4194303&s._data[3*t+0]){h=!0;break}if(h)continue;const d=Math.min(e.cols,n-i.tileId%n+o);let c=i.tileId;for(let e=o+1;e<d;++e)this._writeToCell(s,e,a,++c),l.tileCount++}}this._viewportMetrics=e}getImageAtBufferCell(e,t){var i;const s=this._terminal._core.buffer.lines.get(t);if(s&&268435456&s.getBg(e)){const t=s._extendedAttrs[e]||r;if(t.imageId&&-1!==t.imageId)return null===(i=this._images.get(t.imageId))||void 0===i?void 0:i.orig}}extractTileAtBufferCell(e,t){const i=this._terminal._core.buffer.lines.get(t);if(i&&268435456&i.getBg(e)){const t=i._extendedAttrs[e]||r;if(t.imageId&&-1!==t.imageId&&-1!==t.tileId){const e=this._images.get(t.imageId);if(e)return this._renderer.extractTile(e,t.tileId)}}}_evictOldest(e){var t;const i=this._getStoredPixels();let r=i;for(;this._pixelLimit<r+e&&this._images.size;){const e=this._images.get(++this._lowestId);e&&e.orig&&(r-=e.orig.width*e.orig.height,e.actual&&e.orig!==e.actual&&(r-=e.actual.width*e.actual.height),null===(t=e.marker)||void 0===t||t.dispose(),this._images.delete(this._lowestId))}return i-r}_writeToCell(e,t,r,s){if(268435456&e._data[3*t+2]){const o=e._extendedAttrs[t];if(o){if(void 0!==o.imageId){const e=this._images.get(o.imageId);return e&&e.tileCount--,o.imageId=r,void(o.tileId=s)}return void(e._extendedAttrs[t]=new i(o.underlineStyle,o.underlineColor,r,s))}}e._data[3*t+2]|=268435456,e._extendedAttrs[t]=new i(0,-1,r,s)}_evictOnAlternate(){var e,t;for(const e of this._images.values())"alternate"===e.bufferType&&(e.tileCount=0);const i=this._terminal._core.buffer;for(let t=0;t<this._terminal.rows;++t){const r=i.lines.get(t);if(r)for(let t=0;t<this._terminal.cols;++t)if(268435456&r._data[3*t+2]){const i=null===(e=r._extendedAttrs[t])||void 0===e?void 0:e.imageId;if(i){const e=this._images.get(i);e&&e.tileCount++}}}const r=[];for(const[e,i]of this._images.entries())"alternate"!==i.bufferType||i.tileCount||(null===(t=i.marker)||void 0===t||t.dispose(),r.push(e));for(const e of r)this._images.delete(e)}}},973:(e,t,i)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SixelHandler=void 0;const r=i(477),s=i(782);function o(e){return r.BIG_ENDIAN?e:(255&e)<<24|(e>>>8&255)<<16|(e>>>16&255)<<8|e>>>24&255}t.SixelHandler=class{constructor(e,t,i,r){this._opts=e,this._storage=t,this._coreTerminal=i,this._workerManager=r,this._size=0,this._fillColor=0,this._aborted=!1}reset(){console.log("SixelHandler.reset...")}hook(e){this._aborted=this._workerManager.failed,this._aborted||(this._fillColor=1===e.params[1]?0:function(e,t){let i=0;if(e.isInverse())if(e.isFgDefault())i=o(t.foreground.rgba);else if(e.isFgRGB()){const t=e.constructor.toColorRGB(e.getFgColor());i=(0,r.toRGBA8888)(...t)}else i=o(t.ansi[e.getFgColor()].rgba);else if(e.isBgDefault())i=o(t.background.rgba);else if(e.isBgRGB()){const t=e.constructor.toColorRGB(e.getBgColor());i=(0,r.toRGBA8888)(...t)}else i=o(t.ansi[e.getBgColor()].rgba);return i}(this._coreTerminal._core._inputHandler._curAttrData,this._coreTerminal._core._colorManager.colors),this._size=0,this._workerManager.sixelInit(this._fillColor,this._opts.sixelPaletteLimit))}put(e,t,i){if(this._aborted||this._workerManager.failed)return;if(this._workerManager.sizeExceeded)return this._workerManager.sixelEnd(!1),void(this._aborted=!0);if(this._size+=i-t,this._size>this._opts.sixelSizeLimit)return console.warn("SIXEL: too much data, aborting"),this._workerManager.sixelEnd(!1),void(this._aborted=!0);let r=t;for(;r<i;){const t=new Uint8Array(this._workerManager.getChunk()),s=Math.min(i-r,t.length);t.set(e.subarray(r,r+=s)),this._workerManager.sixelPut(t,s)}}unhook(e){if(this._aborted||this._workerManager.failed)return!0;const t=this._workerManager.sixelEnd(e);return!t||t.then((e=>{if(!e)return!0;const t=s.ImageRenderer.createCanvas(e.width,e.height),i=t.getContext("2d");if(i){const r=s.ImageRenderer.createImageData(i,e.width,e.height,e.buffer);i.putImageData(r,0,0),this._storage.addImage(t)}return this._workerManager.sixelSendBuffer(e.buffer),!0}))}}},870:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.WorkerManager=void 0,t.WorkerManager=class{constructor(e,t,i=131072,r=50){this.url=e,this._opts=t,this.chunkSize=i,this.maxPoolSize=r,this._memPool=[],this._failedToLoad=!1,this._lastActive=0,this.sizeExceeded=!1,this._startupError=()=>{console.warn("ImageAddon worker failed to load, image output is disabled."),this._failedToLoad=!0,this.dispose()},this._message=e=>{var t;const i=e.data;switch(i.type){case 6:this.storeChunk(i.payload);break;case 5:this._sixelResolver&&(this._sixelResolver(i.payload),this._sixelResolver=void 0);break;case 1:null===(t=this._worker)||void 0===t||t.removeEventListener("error",this._startupError);break;case 7:this.sizeExceeded=!0}}}_setSixelResolver(e){this._sixelResolver&&this._sixelResolver(null),this._sixelResolver=e}dispose(){var e;null===(e=this._worker)||void 0===e||e.terminate(),this._worker=void 0,this._setSixelResolver(),this.flushPool(),this._poolCheckerInterval&&(clearInterval(this._poolCheckerInterval),this._poolCheckerInterval=void 0)}reset(){this._worker&&this._worker.terminate(),this._worker=void 0,this._failedToLoad=!1}get failed(){return this._failedToLoad}get worker(){return this._worker||this._failedToLoad||(this._worker=new Worker(this.url),this._worker.addEventListener("message",this._message,!1),this._worker.addEventListener("error",this._startupError,!1),this._worker.postMessage({type:1,payload:0,options:{pixelLimit:this._opts.pixelLimit}})),this._worker}getChunk(){return this._lastActive=Date.now(),this._memPool.pop()||new ArrayBuffer(this.chunkSize)}storeChunk(e){this._poolCheckerInterval||(this._poolCheckerInterval=setInterval((()=>{Date.now()-this._lastActive>2e4&&(this.flushPool(),clearInterval(this._poolCheckerInterval),this._poolCheckerInterval=void 0)}),2e4)),this._memPool.length<this.maxPoolSize&&this._memPool.push(e)}flushPool(){this._memPool.length=0}sixelInit(e,t){var i;this._setSixelResolver(),this.sizeExceeded=!1,null===(i=this.worker)||void 0===i||i.postMessage({type:2,payload:{fillColor:e,limit:t}})}sixelPut(e,t){var i;null===(i=this.worker)||void 0===i||i.postMessage({type:3,payload:{buffer:e.buffer,length:t}},[e.buffer])}sixelEnd(e){var t;let i;return e&&this.worker&&(i=new Promise((e=>this._setSixelResolver(e)))),null===(t=this.worker)||void 0===t||t.postMessage({type:4,payload:e}),i}sixelSendBuffer(e){var t;null===(t=this.worker)||void 0===t||t.postMessage({type:6,payload:e},[e])}}}},t={};function i(r){var s=t[r];if(void 0!==s)return s.exports;var o=t[r]={exports:{}};return e[r](o,o.exports,i),o.exports}var r={};return(()=>{var e=r;Object.defineProperty(e,"__esModule",{value:!0}),e.ImageAddon=void 0;const t=i(782),s=i(216),o=i(973),a=i(870),l={enableSizeReports:!0,pixelLimit:16777216,sixelSupport:!0,sixelScrolling:!0,sixelPaletteLimit:256,sixelSizeLimit:25e6,storageLimit:128,showPlaceholder:!0};e.ImageAddon=class{constructor(e,t){this._disposables=[],this._handlers=new Map,this._opts=Object.assign({},l,t),this._defaultOpts=Object.assign({},l,t),this._workerManager=new a.WorkerManager(e,this._opts),this._disposeLater(this._workerManager)}dispose(){for(const e of this._disposables)e.dispose();this._disposables.length=0,this._handlers.clear()}_disposeLater(...e){for(const t of e)this._disposables.push(t)}activate(e){if(this._terminal=e,this._renderer=new t.ImageRenderer(e,this._opts.showPlaceholder),this._storage=new s.ImageStorage(e,this._renderer,this._opts),this._opts.enableSizeReports){const t=e.options.windowOptions||{};t.getWinSizePixels=!0,t.getCellSizePixels=!0,t.getWinSizeChars=!0,e.options.windowOptions=t}if(this._disposeLater(this._renderer,this._storage,e.parser.registerCsiHandler({prefix:"?",final:"h"},(e=>this._decset(e))),e.parser.registerCsiHandler({prefix:"?",final:"l"},(e=>this._decrst(e))),e.parser.registerCsiHandler({final:"c"},(e=>this._da1(e))),e.parser.registerCsiHandler({prefix:"?",final:"S"},(e=>this._xtermGraphicsAttributes(e))),e.onRender((e=>{var t;return null===(t=this._storage)||void 0===t?void 0:t.render(e)})),e.parser.registerCsiHandler({intermediates:"!",final:"p"},(()=>this.reset())),e.parser.registerEscHandler({final:"c"},(()=>this.reset())),e._core._inputHandler.onRequestReset((()=>this.reset())),e.buffer.onBufferChange((()=>{var e;return null===(e=this._storage)||void 0===e?void 0:e.wipeAlternate()})),e.onResize((e=>{var t;return null===(t=this._storage)||void 0===t?void 0:t.viewportResize(e)}))),this._opts.sixelSupport){const t=new o.SixelHandler(this._opts,this._storage,e,this._workerManager);this._handlers.set("sixel",t),this._disposeLater(e._core._inputHandler._parser.registerDcsHandler({final:"q"},t))}}reset(){var e;this._opts.sixelScrolling=this._defaultOpts.sixelScrolling,this._opts.sixelPaletteLimit=this._defaultOpts.sixelPaletteLimit,null===(e=this._storage)||void 0===e||e.reset(),this._workerManager.reset();for(const e of this._handlers.values())e.reset();return!1}get storageLimit(){var e;return(null===(e=this._storage)||void 0===e?void 0:e.getLimit())||-1}set storageLimit(e){var t;null===(t=this._storage)||void 0===t||t.setLimit(e),this._opts.storageLimit=e}get storageUsage(){return this._storage?this._storage.getUsage():-1}get showPlaceholder(){return this._opts.showPlaceholder}set showPlaceholder(e){var t;this._opts.showPlaceholder=e,null===(t=this._renderer)||void 0===t||t.showPlaceholder(e)}getImageAtBufferCell(e,t){var i;return null===(i=this._storage)||void 0===i?void 0:i.getImageAtBufferCell(e,t)}extractTileAtBufferCell(e,t){var i;return null===(i=this._storage)||void 0===i?void 0:i.extractTileAtBufferCell(e,t)}_report(e){var t;null===(t=this._terminal)||void 0===t||t._core.coreService.triggerDataEvent(e)}_decset(e){for(let t=0;t<e.length;++t)80===e[t]&&(this._opts.sixelScrolling=!1);return!1}_decrst(e){for(let t=0;t<e.length;++t)80===e[t]&&(this._opts.sixelScrolling=!0);return!1}_da1(e){return e[0]>0||!(!this._opts.sixelSupport||this._workerManager.failed)&&(this._report("[?62;4;9;22c"),!0)}_xtermGraphicsAttributes(e){var t,i,r,o,a,l;if(e.length<2)return!0;if(this._workerManager.failed)return this._report(`[?${e[0]};1S`),!0;if(1===e[0])switch(e[1]){case 1:return this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`),!0;case 2:return this._opts.sixelPaletteLimit=this._defaultOpts.sixelPaletteLimit,this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`),this._workerManager.reset(),!0;case 3:return e.length>2&&!(e[2]instanceof Array)&&e[2]<=4096?(this._opts.sixelPaletteLimit=e[2],this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`)):this._report(`[?${e[0]};2S`),!0;case 4:return this._report(`[?${e[0]};0;4096S`),!0;default:return this._report(`[?${e[0]};2S`),!0}if(2===e[0])switch(e[1]){case 1:let n=null===(i=null===(t=this._renderer)||void 0===t?void 0:t.dimensions)||void 0===i?void 0:i.canvasWidth,h=null===(o=null===(r=this._renderer)||void 0===r?void 0:r.dimensions)||void 0===o?void 0:o.canvasHeight;if(!n||!h){const e=s.CELL_SIZE_DEFAULT;n=((null===(a=this._terminal)||void 0===a?void 0:a.cols)||80)*e.width,h=((null===(l=this._terminal)||void 0===l?void 0:l.rows)||24)*e.height}if(n*h<this._opts.pixelLimit)this._report(`[?${e[0]};0;${n.toFixed(0)};${h.toFixed(0)}S`);else{const t=Math.floor(Math.sqrt(this._opts.pixelLimit));this._report(`[?${e[0]};0;${t};${t}S`)}return!0;case 4:const d=Math.floor(Math.sqrt(this._opts.pixelLimit));return this._report(`[?${e[0]};0;${d};${d}S`),!0;default:return this._report(`[?${e[0]};2S`),!0}return this._report(`[?${e[0]};1S`),!0}}})(),r})()}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.ImageAddon=t():e.ImageAddon=t()}(self,(function(){return(()=>{"use strict";var e={477:(e,t)=>{function i(e){return 255&e}function r(e){return e>>>8&255}function s(e){return e>>>16&255}function o(e,t,i,r=255){return((255&r)<<24|(255&i)<<16|(255&t)<<8|255&e)>>>0}function a(e,t,i){return Math.max(e,Math.min(i,t))}function l(e,t,i){return i<0&&(i+=1),i>1&&(i-=1),6*i<1?t+6*(e-t)*i:2*i<1?e:3*i<2?t+(e-t)*(4-6*i):t}function n(e,t,i){return(4278190080|Math.round(i/100*255)<<16|Math.round(t/100*255)<<8|Math.round(e/100*255))>>>0}Object.defineProperty(t,"__esModule",{value:!0}),t.DEFAULT_FOREGROUND=t.DEFAULT_BACKGROUND=t.PALETTE_ANSI_256=t.PALETTE_VT340_GREY=t.PALETTE_VT340_COLOR=t.normalizeHLS=t.normalizeRGB=t.nearestColorIndex=t.fromRGBA8888=t.toRGBA8888=t.alpha=t.blue=t.green=t.red=t.BIG_ENDIAN=void 0,t.BIG_ENDIAN=255===new Uint8Array(new Uint32Array([4278190080]).buffer)[0],t.BIG_ENDIAN&&console.warn("BE platform detected. This version of node-sixel works only on LE properly."),t.red=i,t.green=r,t.blue=s,t.alpha=function(e){return e>>>24&255},t.toRGBA8888=o,t.fromRGBA8888=function(e){return[255&e,e>>8&255,e>>16&255,e>>>24]},t.nearestColorIndex=function(e,t){const o=i(e),a=r(e),l=s(e);let n=Number.MAX_SAFE_INTEGER,h=-1;for(let e=0;e<t.length;++e){const i=o-t[e][0],r=a-t[e][1],s=l-t[e][2],d=i*i+r*r+s*s;if(!d)return e;d<n&&(n=d,h=e)}return h},t.normalizeRGB=n,t.normalizeHLS=function(e,t,i){return function(e,t,i){if(!i){const e=Math.round(255*t);return o(e,e,e)}const r=t<.5?t*(1+i):t+i-t*i,s=2*t-r;return o(a(0,255,Math.round(255*l(r,s,e+1/3))),a(0,255,Math.round(255*l(r,s,e))),a(0,255,Math.round(255*l(r,s,e-1/3))))}((e+240)/360,t/100,i/100)},t.PALETTE_VT340_COLOR=new Uint32Array([n(0,0,0),n(20,20,80),n(80,13,13),n(20,80,20),n(80,20,80),n(20,80,80),n(80,80,20),n(53,53,53),n(26,26,26),n(33,33,60),n(60,26,26),n(33,60,33),n(60,33,60),n(33,60,60),n(60,60,33),n(80,80,80)]),t.PALETTE_VT340_GREY=new Uint32Array([n(0,0,0),n(13,13,13),n(26,26,26),n(40,40,40),n(6,6,6),n(20,20,20),n(33,33,33),n(46,46,46),n(0,0,0),n(13,13,13),n(26,26,26),n(40,40,40),n(6,6,6),n(20,20,20),n(33,33,33),n(46,46,46)]),t.PALETTE_ANSI_256=(()=>{const e=[o(0,0,0),o(205,0,0),o(0,205,0),o(205,205,0),o(0,0,238),o(205,0,205),o(0,250,205),o(229,229,229),o(127,127,127),o(255,0,0),o(0,255,0),o(255,255,0),o(92,92,255),o(255,0,255),o(0,255,255),o(255,255,255)],t=[0,95,135,175,215,255];for(let i=0;i<6;++i)for(let r=0;r<6;++r)for(let s=0;s<6;++s)e.push(o(t[i],t[r],t[s]));for(let t=8;t<=238;t+=10)e.push(o(t,t,t));return new Uint32Array(e)})(),t.DEFAULT_BACKGROUND=o(0,0,0,255),t.DEFAULT_FOREGROUND=o(255,255,255,255)},782:(e,t,i)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ImageRenderer=void 0;const r=i(477);class s{constructor(e,t){this._terminal=e,this._showPlaceholder=t,this._oldOpen=this._terminal._core.open,this._terminal._core.open=e=>{var t;null===(t=this._oldOpen)||void 0===t||t.call(this._terminal._core,e),this._open()},this._terminal._core.screenElement&&this._open(),this._optionsRefresh=this._terminal._core.optionsService.onOptionChange((e=>{var t;"fontSize"===e&&(this.rescaleCanvas(),null===(t=this._renderService)||void 0===t||t.refreshRows(0,this._terminal.rows))}))}static createCanvas(e,t){const i=document.createElement("canvas");return i.width=0|e,i.height=0|t,i}static createImageData(e,t,i,r){if("function"!=typeof ImageData){const s=e.createImageData(t,i);return r&&s.data.set(new Uint8ClampedArray(r,0,t*i*4)),s}return r?new ImageData(new Uint8ClampedArray(r,0,t*i*4),t,i):new ImageData(t,i)}static createImageBitmap(e){return"function"!=typeof createImageBitmap?Promise.resolve(void 0):createImageBitmap(e)}dispose(){var e,t;null===(e=this._optionsRefresh)||void 0===e||e.dispose(),this._removeLayerFromDom(),this._terminal._core&&this._oldOpen&&(this._terminal._core.open=this._oldOpen,this._oldOpen=void 0),this._renderService&&this._oldSetRenderer&&(this._renderService.setRenderer=this._oldSetRenderer,this._oldSetRenderer=void 0),this._renderService=void 0,this.canvas=void 0,this._ctx=void 0,null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0,this._placeholder=void 0}showPlaceholder(e){var t,i;e?this._placeholder||-1===this.cellSize.height||this._createPlaceHolder(Math.max(this.cellSize.height+1,24)):(null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0,this._placeholder=void 0),null===(i=this._renderService)||void 0===i||i.refreshRows(0,this._terminal.rows)}get dimensions(){var e;return null===(e=this._renderService)||void 0===e?void 0:e.dimensions}get cellSize(){var e,t;return{width:(null===(e=this.dimensions)||void 0===e?void 0:e.actualCellWidth)||-1,height:(null===(t=this.dimensions)||void 0===t?void 0:t.actualCellHeight)||-1}}clearLines(e,t){var i,r,s,o;null===(i=this._ctx)||void 0===i||i.clearRect(0,e*((null===(r=this.dimensions)||void 0===r?void 0:r.actualCellHeight)||0),(null===(s=this.dimensions)||void 0===s?void 0:s.canvasWidth)||0,(++t-e)*((null===(o=this.dimensions)||void 0===o?void 0:o.actualCellHeight)||0))}clearAll(){var e,t,i;null===(e=this._ctx)||void 0===e||e.clearRect(0,0,(null===(t=this.canvas)||void 0===t?void 0:t.width)||0,(null===(i=this.canvas)||void 0===i?void 0:i.height)||0)}draw(e,t,i,r,s=1){if(!this._ctx)return;const{width:o,height:a}=this.cellSize;if(-1===o||-1===a)return;this._rescaleImage(e,o,a);const l=e.actual,n=Math.ceil(l.width/o),h=t%n*o,d=Math.floor(t/n)*a,c=i*o,_=r*a,u=s*o+h>l.width?l.width-h:s*o,g=d+a>l.height?l.height-d:a;this._ctx.drawImage(l,Math.floor(h),Math.floor(d),Math.floor(u),Math.floor(g),Math.floor(c),Math.floor(_),Math.floor(u),Math.floor(g))}extractTile(e,t){const{width:i,height:r}=this.cellSize;if(-1===i||-1===r)return;this._rescaleImage(e,i,r);const o=e.actual,a=Math.ceil(o.width/i),l=t%a*i,n=Math.floor(t/a)*r,h=i+l>o.width?o.width-l:i,d=n+r>o.height?o.height-n:r,c=s.createCanvas(h,d),_=c.getContext("2d");return _?(_.drawImage(o,Math.floor(l),Math.floor(n),Math.floor(h),Math.floor(d),0,0,Math.floor(h),Math.floor(d)),c):void 0}drawPlaceholder(e,t,i=1){if((this._placeholderBitmap||this._placeholder)&&this._ctx){const{width:r,height:s}=this.cellSize;if(-1===r||-1===s)return;s>=this._placeholder.height&&this._createPlaceHolder(s+1),this._ctx.drawImage(this._placeholderBitmap||this._placeholder,e*r,t*s%2?0:1,r*i,s,e*r,t*s,r*i,s)}}rescaleCanvas(){var e,t,i;this.canvas&&(this.canvas.width===(null===(e=this.dimensions)||void 0===e?void 0:e.canvasWidth)&&this.canvas.height===this.dimensions.canvasHeight||(this.canvas.width=(null===(t=this.dimensions)||void 0===t?void 0:t.canvasWidth)||0,this.canvas.height=(null===(i=this.dimensions)||void 0===i?void 0:i.canvasHeight)||0))}_rescaleImage(e,t,i){if(t===e.actualCellSize.width&&i===e.actualCellSize.height)return;const{width:r,height:o}=e.origCellSize;if(t===r&&i===o)return e.actual=e.orig,e.actualCellSize.width=r,void(e.actualCellSize.height=o);const a=s.createCanvas(Math.ceil(e.orig.width*t/r),Math.ceil(e.orig.height*i/o)),l=a.getContext("2d");l&&(l.drawImage(e.orig,0,0,a.width,a.height),e.actual=a,e.actualCellSize.width=t,e.actualCellSize.height=i)}_open(){this._renderService=this._terminal._core._renderService,this._oldSetRenderer=this._renderService.setRenderer.bind(this._renderService),this._renderService.setRenderer=e=>{var t;this._removeLayerFromDom(),null===(t=this._oldSetRenderer)||void 0===t||t.call(this._renderService,e),this._insertLayerToDom()},this._insertLayerToDom(),this._showPlaceholder&&this._createPlaceHolder()}_insertLayerToDom(){var e,t,i;this.canvas=s.createCanvas((null===(e=this.dimensions)||void 0===e?void 0:e.canvasWidth)||0,(null===(t=this.dimensions)||void 0===t?void 0:t.canvasHeight)||0),this.canvas.classList.add("xterm-image-layer"),null===(i=this._terminal._core.screenElement)||void 0===i||i.appendChild(this.canvas),this._ctx=this.canvas.getContext("2d",{alpha:!0,desynchronized:!0})}_removeLayerFromDom(){var e,t;null===(t=null===(e=this.canvas)||void 0===e?void 0:e.parentNode)||void 0===t||t.removeChild(this.canvas)}_createPlaceHolder(e=24){var t;null===(t=this._placeholderBitmap)||void 0===t||t.close(),this._placeholderBitmap=void 0;const i=32,o=s.createCanvas(i,e),a=o.getContext("2d",{alpha:!1});if(!a)return;const l=s.createImageData(a,i,e),n=new Uint32Array(l.data.buffer),h=(0,r.toRGBA8888)(0,0,0),d=(0,r.toRGBA8888)(255,255,255);n.fill(h);for(let t=0;t<e;++t){const e=t%2,r=t*i;for(let t=0;t<i;t+=2)n[r+t+e]=d}a.putImageData(l,0,0);const c=screen.width+i-1&-32||4096;this._placeholder=s.createCanvas(c,e);const _=this._placeholder.getContext("2d",{alpha:!1});if(_){for(let e=0;e<c;e+=i)_.drawImage(o,e,0);s.createImageBitmap(this._placeholder).then((e=>this._placeholderBitmap=e))}else this._placeholder=void 0}}t.ImageRenderer=s},216:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ImageStorage=t.ExtendedAttrsImage=t.CELL_SIZE_DEFAULT=void 0,t.CELL_SIZE_DEFAULT={width:7,height:14};class i{constructor(e=0,t=-1,i=-1,r=-1){this.underlineStyle=e,this.underlineColor=t,this.imageId=i,this.tileId=r}clone(){return new i(this.underlineStyle,this.underlineColor,this.imageId,this.tileId)}isEmpty(){return 0===this.underlineStyle&&-1===this.imageId}}t.ExtendedAttrsImage=i;const r=new i;t.ImageStorage=class{constructor(e,t,i){this._terminal=e,this._renderer=t,this._opts=i,this._images=new Map,this._lastId=0,this._lowestId=0,this._fullyCleared=!1,this._needsFullClear=!1,this._pixelLimit=25e5;try{this.setLimit(this._opts.storageLimit)}catch(e){console.error(e.message),console.warn(`storageLimit is set to ${this.getLimit()} MB`)}this._viewportMetrics={cols:this._terminal.cols,rows:this._terminal.rows}}dispose(){this.reset()}reset(){var e;for(const t of this._images.values())null===(e=t.marker)||void 0===e||e.dispose();this._images.clear(),this._renderer.clearAll()}getLimit(){return 4*this._pixelLimit/1e6}setLimit(e){if(e<1||e>1e3)throw RangeError("invalid storageLimit, should be at least 1 MB and not exceed 1G");this._pixelLimit=e/4*1e6>>>0,this._evictOldest(0)}getUsage(){return 4*this._getStoredPixels()/1e6}_getStoredPixels(){let e=0;for(const t of this._images.values())t.orig&&(e+=t.orig.width*t.orig.height,t.actual&&t.actual!==t.orig&&(e+=t.actual.width*t.actual.height));return e}wipeAlternate(){var e;const t=[];for(const[i,r]of this._images.entries())"alternate"===r.bufferType&&(null===(e=r.marker)||void 0===e||e.dispose(),t.push(i));for(const e of t)this._images.delete(e);this._needsFullClear=!0,this._fullyCleared=!1}addImage(e){var i;this._evictOldest(e.width*e.height);let r=this._renderer.cellSize;-1!==r.width&&-1!==r.height||(r=t.CELL_SIZE_DEFAULT);const s=Math.ceil(e.width/r.width),o=Math.ceil(e.height/r.height),a=++this._lastId,l=this._terminal._core.buffer,n=this._terminal.cols,h=this._terminal.rows,d=l.x,c=l.y;let _=d,u=0;this._opts.sixelScrolling||(this._terminal._core._dirtyRowService.markAllDirty(),l.x=0,l.y=0,_=0);for(let e=0;e<o;++e){const t=l.lines.get(l.y+l.ybase);for(let i=0;i<s&&!(_+i>=n);++i)this._writeToCell(t,_+i,a,e*s+i),u++;if(this._opts.sixelScrolling)e<o-1&&this._terminal._core._inputHandler.lineFeed();else if(++l.y>=h)break;l.x=_}this._opts.sixelScrolling?l.x=_:(l.x=d,l.y=c);const g=[];for(const[e,t]of this._images.entries())t.tileCount<1&&(null===(i=t.marker)||void 0===i||i.dispose(),g.push(e));for(const e of g)this._images.delete(e);const v=this._terminal.registerMarker(0);null==v||v.onDispose((()=>{this._images.get(a)&&this._images.delete(a)})),"alternate"===this._terminal.buffer.active.type&&this._evictOnAlternate();const f={orig:e,origCellSize:r,actual:e,actualCellSize:Object.assign({},r),marker:v||void 0,tileCount:u,bufferType:this._terminal.buffer.active.type};this._images.set(a,f)}render(e){if(!this._renderer.canvas)return;if(!this._images.size)return void(this._fullyCleared||(this._renderer.clearAll(),this._fullyCleared=!0));this._needsFullClear&&(this._renderer.clearAll(),this._fullyCleared=!0);const{start:t,end:i}=e,s=this._terminal._core.buffer,o=this._terminal._core.cols;this._renderer.clearLines(t,i),this._renderer.rescaleCanvas();for(let e=t;e<=i;++e){const t=s.lines.get(e+s.ydisp);if(!t)return;for(let i=0;i<o;++i)if(268435456&t.getBg(i)){let s=t._extendedAttrs[i]||r;const a=s.imageId;if(void 0===a||-1===a)continue;const l=this._images.get(a);if(-1!==s.tileId){const n=s.tileId,h=i;let d=1;for(;++i<o&&268435456&t.getBg(i)&&(s=t._extendedAttrs[i]||r)&&s.imageId===a&&s.tileId===n+d;)d++;i--,l?l.actual&&this._renderer.draw(l,n,h,e,d):this._opts.showPlaceholder&&this._renderer.drawPlaceholder(h,e,d),this._fullyCleared=!1}}}}viewportResize(e){var t;if(!this._images.size)return void(this._viewportMetrics=e);if(this._viewportMetrics.cols>=e.cols)return void(this._viewportMetrics=e);const i=this._terminal._core.buffer,s=i.lines.length,o=this._viewportMetrics.cols-1;for(let a=0;a<s;++a){const s=i.lines.get(a);if(268435456&s.getBg(o)){const i=s._extendedAttrs[o]||r,a=i.imageId;if(void 0===a||-1===a)continue;const l=this._images.get(a);if(!l)continue;const n=Math.ceil(((null===(t=l.actual)||void 0===t?void 0:t.width)||0)/l.actualCellSize.width);if(i.tileId%n+1>=n)continue;let h=!1;for(let t=o+1;t>e.cols;++t)if(4194303&s._data[3*t+0]){h=!0;break}if(h)continue;const d=Math.min(e.cols,n-i.tileId%n+o);let c=i.tileId;for(let e=o+1;e<d;++e)this._writeToCell(s,e,a,++c),l.tileCount++}}this._viewportMetrics=e}getImageAtBufferCell(e,t){var i;const s=this._terminal._core.buffer.lines.get(t);if(s&&268435456&s.getBg(e)){const t=s._extendedAttrs[e]||r;if(t.imageId&&-1!==t.imageId)return null===(i=this._images.get(t.imageId))||void 0===i?void 0:i.orig}}extractTileAtBufferCell(e,t){const i=this._terminal._core.buffer.lines.get(t);if(i&&268435456&i.getBg(e)){const t=i._extendedAttrs[e]||r;if(t.imageId&&-1!==t.imageId&&-1!==t.tileId){const e=this._images.get(t.imageId);if(e)return this._renderer.extractTile(e,t.tileId)}}}_evictOldest(e){var t;const i=this._getStoredPixels();let r=i;for(;this._pixelLimit<r+e&&this._images.size;){const e=this._images.get(++this._lowestId);e&&e.orig&&(r-=e.orig.width*e.orig.height,e.actual&&e.orig!==e.actual&&(r-=e.actual.width*e.actual.height),null===(t=e.marker)||void 0===t||t.dispose(),this._images.delete(this._lowestId))}return i-r}_writeToCell(e,t,r,s){if(268435456&e._data[3*t+2]){const o=e._extendedAttrs[t];if(o){if(void 0!==o.imageId){const e=this._images.get(o.imageId);return e&&e.tileCount--,o.imageId=r,void(o.tileId=s)}return void(e._extendedAttrs[t]=new i(o.underlineStyle,o.underlineColor,r,s))}}e._data[3*t+2]|=268435456,e._extendedAttrs[t]=new i(0,-1,r,s)}_evictOnAlternate(){var e,t;for(const e of this._images.values())"alternate"===e.bufferType&&(e.tileCount=0);const i=this._terminal._core.buffer;for(let t=0;t<this._terminal.rows;++t){const r=i.lines.get(t);if(r)for(let t=0;t<this._terminal.cols;++t)if(268435456&r._data[3*t+2]){const i=null===(e=r._extendedAttrs[t])||void 0===e?void 0:e.imageId;if(i){const e=this._images.get(i);e&&e.tileCount++}}}const r=[];for(const[e,i]of this._images.entries())"alternate"!==i.bufferType||i.tileCount||(null===(t=i.marker)||void 0===t||t.dispose(),r.push(e));for(const e of r)this._images.delete(e)}}},973:(e,t,i)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SixelHandler=void 0;const r=i(477),s=i(782);function o(e){return r.BIG_ENDIAN?e:(255&e)<<24|(e>>>8&255)<<16|(e>>>16&255)<<8|e>>>24&255}t.SixelHandler=class{constructor(e,t,i,r){this._opts=e,this._storage=t,this._coreTerminal=i,this._workerManager=r,this._size=0,this._fillColor=0,this._aborted=!1}reset(){console.log("SixelHandler.reset...")}hook(e){this._aborted=this._workerManager.failed,this._aborted||(this._fillColor=1===e.params[1]?0:function(e,t){let i=0;if(e.isInverse())if(e.isFgDefault())i=o(t.foreground.rgba);else if(e.isFgRGB()){const t=e.constructor.toColorRGB(e.getFgColor());i=(0,r.toRGBA8888)(...t)}else i=o(t.ansi[e.getFgColor()].rgba);else if(e.isBgDefault())i=o(t.background.rgba);else if(e.isBgRGB()){const t=e.constructor.toColorRGB(e.getBgColor());i=(0,r.toRGBA8888)(...t)}else i=o(t.ansi[e.getBgColor()].rgba);return i}(this._coreTerminal._core._inputHandler._curAttrData,this._coreTerminal._core._colorManager.colors),this._size=0,this._workerManager.sixelInit(this._fillColor,this._opts.sixelPaletteLimit))}put(e,t,i){if(this._aborted||this._workerManager.failed)return;if(this._workerManager.sizeExceeded)return this._workerManager.sixelEnd(!1),void(this._aborted=!0);if(this._size+=i-t,this._size>this._opts.sixelSizeLimit)return console.warn("SIXEL: too much data, aborting"),this._workerManager.sixelEnd(!1),void(this._aborted=!0);let r=t;for(;r<i;){const t=new Uint8Array(this._workerManager.getChunk()),s=Math.min(i-r,t.length);t.set(e.subarray(r,r+=s)),this._workerManager.sixelPut(t,s)}}unhook(e){if(this._aborted||this._workerManager.failed)return!0;const t=this._workerManager.sixelEnd(e);return!t||t.then((e=>{if(!e)return!0;const t=s.ImageRenderer.createCanvas(e.width,e.height),i=t.getContext("2d");if(i){const r=s.ImageRenderer.createImageData(i,e.width,e.height,e.buffer);i.putImageData(r,0,0),this._storage.addImage(t)}return this._workerManager.sixelSendBuffer(e.buffer),!0}))}}},870:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.WorkerManager=void 0,t.WorkerManager=class{constructor(e,t,i=131072,r=50){this.url=e,this._opts=t,this.chunkSize=i,this.maxPoolSize=r,this._memPool=[],this._failedToLoad=!1,this._lastActive=0,this.sizeExceeded=!1,this._startupError=()=>{console.warn("ImageAddon worker failed to load, image output is disabled."),this._failedToLoad=!0,this.dispose()},this._message=e=>{var t;const i=e.data;switch(i.type){case 6:this.storeChunk(i.payload);break;case 5:this._sixelResolver&&(this._sixelResolver(i.payload),this._sixelResolver=void 0);break;case 1:null===(t=this._worker)||void 0===t||t.removeEventListener("error",this._startupError);break;case 7:this.sizeExceeded=!0}}}_setSixelResolver(e){this._sixelResolver&&this._sixelResolver(null),this._sixelResolver=e}dispose(){var e;null===(e=this._worker)||void 0===e||e.terminate(),this._worker=void 0,this._setSixelResolver(),this.flushPool(),this._poolCheckerInterval&&(clearInterval(this._poolCheckerInterval),this._poolCheckerInterval=void 0)}reset(){this._worker&&this._worker.terminate(),this._worker=void 0,this._failedToLoad=!1}get failed(){return this._failedToLoad}get worker(){return this._worker||this._failedToLoad||(this._worker=new Worker(this.url),this._worker.addEventListener("message",this._message,!1),this._worker.addEventListener("error",this._startupError,!1),this._worker.postMessage({type:1,payload:0,options:{pixelLimit:this._opts.pixelLimit}})),this._worker}getChunk(){return this._lastActive=Date.now(),this._memPool.pop()||new ArrayBuffer(this.chunkSize)}storeChunk(e){this._poolCheckerInterval||(this._poolCheckerInterval=setInterval((()=>{Date.now()-this._lastActive>2e4&&(this.flushPool(),clearInterval(this._poolCheckerInterval),this._poolCheckerInterval=void 0)}),2e4)),this._memPool.length<this.maxPoolSize&&this._memPool.push(e)}flushPool(){this._memPool.length=0}sixelInit(e,t){var i;this._setSixelResolver(),this.sizeExceeded=!1,null===(i=this.worker)||void 0===i||i.postMessage({type:2,payload:{fillColor:e,limit:t}})}sixelPut(e,t){var i;null===(i=this.worker)||void 0===i||i.postMessage({type:3,payload:{buffer:e.buffer,length:t}},[e.buffer])}sixelEnd(e){var t;let i;return e&&this.worker&&(i=new Promise((e=>this._setSixelResolver(e)))),null===(t=this.worker)||void 0===t||t.postMessage({type:4,payload:e}),i}sixelSendBuffer(e){var t;null===(t=this.worker)||void 0===t||t.postMessage({type:6,payload:e},[e])}}}},t={};function i(r){var s=t[r];if(void 0!==s)return s.exports;var o=t[r]={exports:{}};return e[r](o,o.exports,i),o.exports}var r={};return(()=>{var e=r;Object.defineProperty(e,"__esModule",{value:!0}),e.ImageAddon=void 0;const t=i(782),s=i(216),o=i(973),a=i(870),l={enableSizeReports:!0,pixelLimit:16777216,sixelSupport:!0,sixelScrolling:!0,sixelPaletteLimit:256,sixelSizeLimit:25e6,storageLimit:128,showPlaceholder:!0};e.ImageAddon=class{constructor(e,t){this._disposables=[],this._handlers=new Map,this._opts=Object.assign({},l,t),this._defaultOpts=Object.assign({},l,t),this._workerManager=new a.WorkerManager(e,this._opts),this._disposeLater(this._workerManager)}dispose(){for(const e of this._disposables)e.dispose();this._disposables.length=0,this._handlers.clear()}_disposeLater(...e){for(const t of e)this._disposables.push(t)}activate(e){if(this._terminal=e,this._renderer=new t.ImageRenderer(e,this._opts.showPlaceholder),this._storage=new s.ImageStorage(e,this._renderer,this._opts),this._opts.enableSizeReports){const t=e.options.windowOptions||{};t.getWinSizePixels=!0,t.getCellSizePixels=!0,t.getWinSizeChars=!0,e.options.windowOptions=t}if(this._disposeLater(this._renderer,this._storage,e.parser.registerCsiHandler({prefix:"?",final:"h"},(e=>this._decset(e))),e.parser.registerCsiHandler({prefix:"?",final:"l"},(e=>this._decrst(e))),e.parser.registerCsiHandler({final:"c"},(e=>this._da1(e))),e.parser.registerCsiHandler({prefix:"?",final:"S"},(e=>this._xtermGraphicsAttributes(e))),e.onRender((e=>{var t;return null===(t=this._storage)||void 0===t?void 0:t.render(e)})),e.parser.registerCsiHandler({intermediates:"!",final:"p"},(()=>this.reset())),e.parser.registerEscHandler({final:"c"},(()=>this.reset())),e._core._inputHandler.onRequestReset((()=>this.reset())),e.buffer.onBufferChange((()=>{var e;return null===(e=this._storage)||void 0===e?void 0:e.wipeAlternate()})),e.onResize((e=>{var t;return null===(t=this._storage)||void 0===t?void 0:t.viewportResize(e)}))),this._opts.sixelSupport){const t=new o.SixelHandler(this._opts,this._storage,e,this._workerManager);this._handlers.set("sixel",t),this._disposeLater(e._core._inputHandler._parser.registerDcsHandler({final:"q"},t))}}reset(){var e;this._opts.sixelScrolling=this._defaultOpts.sixelScrolling,this._opts.sixelPaletteLimit=this._defaultOpts.sixelPaletteLimit,null===(e=this._storage)||void 0===e||e.reset(),this._workerManager.reset();for(const e of this._handlers.values())e.reset();return!1}get storageLimit(){var e;return(null===(e=this._storage)||void 0===e?void 0:e.getLimit())||-1}set storageLimit(e){var t;null===(t=this._storage)||void 0===t||t.setLimit(e),this._opts.storageLimit=e}get storageUsage(){return this._storage?this._storage.getUsage():-1}get showPlaceholder(){return this._opts.showPlaceholder}set showPlaceholder(e){var t;this._opts.showPlaceholder=e,null===(t=this._renderer)||void 0===t||t.showPlaceholder(e)}getImageAtBufferCell(e,t){var i;return null===(i=this._storage)||void 0===i?void 0:i.getImageAtBufferCell(e,t)}extractTileAtBufferCell(e,t){var i;return null===(i=this._storage)||void 0===i?void 0:i.extractTileAtBufferCell(e,t)}_report(e){var t;null===(t=this._terminal)||void 0===t||t._core.coreService.triggerDataEvent(e)}_decset(e){for(let t=0;t<e.length;++t)80===e[t]&&(this._opts.sixelScrolling=!1);return!1}_decrst(e){for(let t=0;t<e.length;++t)80===e[t]&&(this._opts.sixelScrolling=!0);return!1}_da1(e){return e[0]>0||!(!this._opts.sixelSupport||this._workerManager.failed)&&(this._report("[?62;4;9;22c"),!0)}_xtermGraphicsAttributes(e){var t,i,r,o,a,l;if(e.length<2)return!0;if(this._workerManager.failed)return this._report(`[?${e[0]};1S`),!0;if(1===e[0])switch(e[1]){case 1:return this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`),!0;case 2:return this._opts.sixelPaletteLimit=this._defaultOpts.sixelPaletteLimit,this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`),this._workerManager.reset(),!0;case 3:return e.length>2&&!(e[2]instanceof Array)&&e[2]<=4096?(this._opts.sixelPaletteLimit=e[2],this._report(`[?${e[0]};0;${this._opts.sixelPaletteLimit}S`)):this._report(`[?${e[0]};2S`),!0;case 4:return this._report(`[?${e[0]};0;4096S`),!0;default:return this._report(`[?${e[0]};2S`),!0}if(2===e[0])switch(e[1]){case 1:let n=null===(i=null===(t=this._renderer)||void 0===t?void 0:t.dimensions)||void 0===i?void 0:i.canvasWidth,h=null===(o=null===(r=this._renderer)||void 0===r?void 0:r.dimensions)||void 0===o?void 0:o.canvasHeight;if(!n||!h){const e=s.CELL_SIZE_DEFAULT;n=((null===(a=this._terminal)||void 0===a?void 0:a.cols)||80)*e.width,h=((null===(l=this._terminal)||void 0===l?void 0:l.rows)||24)*e.height}if(n*h<this._opts.pixelLimit)this._report(`[?${e[0]};0;${n.toFixed(0)};${h.toFixed(0)}S`);else{const t=Math.floor(Math.sqrt(this._opts.pixelLimit));this._report(`[?${e[0]};0;${t};${t}S`)}return!0;case 4:const d=Math.floor(Math.sqrt(this._opts.pixelLimit));return this._report(`[?${e[0]};0;${d};${d}S`),!0;default:return this._report(`[?${e[0]};2S`),!0}return this._report(`[?${e[0]};1S`),!0}}})(),r})()}));
 //# sourceMappingURL=xterm-addon-image.js.map

out/ImageStorage.js

@@ -46,4 +46,6 @@ "use strict";
         this._lowestId = 0;
-        // whether last render call has drawn anything
-        this._hasDrawn = false;
+        // whether a full clear happened before
+        this._fullyCleared = false;
+        // whether render should do a full clear
+        this._needsFullClear = false;
         // hard limit of stored pixels (fallback limit of 10 MB)
@@ -116,3 +118,4 @@ this._pixelLimit = 2500000;
         // mark canvas to be wiped on next render
-        this._hasDrawn = true;
+        this._needsFullClear = true;
+        this._fullyCleared = false;
     }
@@ -218,15 +221,22 @@ /**
     render(range) {
+        // exit early if we dont have a canvas
+        if (!this._renderer.canvas) {
+            return;
+        }
         // exit early if we dont have any images to test for
-        // FIXME: leaves garbage on screen for IL/DL
-        if (!this._images.size || !this._renderer.canvas) {
-            if (this._hasDrawn) {
+        if (!this._images.size) {
+            if (!this._fullyCleared) {
                 this._renderer.clearAll();
-                this._hasDrawn = false;
+                this._fullyCleared = true;
             }
             return;
         }
+        // buffer switches force a full clear
+        if (this._needsFullClear) {
+            this._renderer.clearAll();
+            this._fullyCleared = true;
+        }
         const { start, end } = range;
         const buffer = this._terminal._core.buffer;
         const cols = this._terminal._core.cols;
-        this._hasDrawn = false;
         // clear drawing area
@@ -275,3 +285,3 @@ this._renderer.clearLines(start, end);
                         }
-                        this._hasDrawn = true;
+                        this._fullyCleared = false;
                     }
@@ -278,0 +288,0 @@ }

package.json

 {
   "name": "xterm-addon-image",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "author": "Joerg Breitbart <[e-mail]>",
@@ -16,3 +16,3 @@ "main": "lib/xterm-addon-image.js",
   "peerDependencies": {
-    "xterm": "~4.18.0"
+    "xterm": "^4.16.0"
   },
@@ -19,0 +19,0 @@ "devDependencies": {

README.md

@@ -12,3 +12,3 @@ ## xterm-addon-image
 
-### Install from npm (not yet released)
+### Install from npm
 
@@ -19,2 +19,7 @@ ```bash
 
+### Release Compatibility
+
+- 0.1.0 - compatible to xterm.js 4.16.0 - 4.19.0
+
+
 ### Clone & Build
@@ -26,6 +31,6 @@
 ```bash
-curl -s https://raw.githubusercontent.com/jerch/xterm-addon-image/master/bootstrap.sh | XTERMJS=4.18.0 bash
+curl -s https://raw.githubusercontent.com/jerch/xterm-addon-image/master/bootstrap.sh | XTERMJS=4.19.0 bash
 ```
 
-The addon sources and npm package definition resides under `addons/xterm-addon-image`.
+The addon sources and npm package definition reside under `addons/xterm-addon-image`.
 
@@ -72,3 +77,2 @@
   By default scrolling is on, thus an image will advance the cursor at the bottom if needed.
-  The cursor will move with the image and be placed either right to the image or in the next line
   (see cursor positioning).
@@ -175,6 +179,39 @@
 - `pixelLimit`  
-  A constructor settings, thus you would have to anticipate, whether (multiple) terminals in your page gonna do lots of concurrent decoding. Since this is normally not the case and the memory usage is only temporarily peaking, a rather high value should work even with multiple terminals in one page.
+  A constructor setting, thus you would have to anticipate, whether (multiple) terminals in your page gonna do lots of concurrent decoding. Since this is normally not the case and the memory usage is only temporarily peaking, a rather high value should work even with multiple terminals in one page.
 - `storageLimit`  
-  A constructor and a runtime setting. In conjunction with `storageUsage` you can do runtime checks and adjust the limit to your needs. If you have to lower the limit below the current usage, images will be removed and may turn into a placeholder in the terminal's scrollback (if `showPlaceholder` is set). When adjusting keep in mind to leave enough room for memory peaking for decoding.
+  A constructor and a runtime setting. In conjunction with `storageUsage` you can do runtime checks and adjust the limit to your needs. If you have to lower the limit below the current usage, images will be removed in FIFO order and may turn into a placeholder in the terminal's scrollback (if `showPlaceholder` is set). When adjusting keep in mind to leave enough room for memory peaking for decoding.
 - `sixelSizeLimit`  
-  A constructor setting. This has only a small direct impact on peaking memory during decoding. It still will avoid processing of overly big or broken sequences at an earlier phase, thus may stop the decoder from entering its memory intensive task for potentially invalid data.
+  A constructor setting. This has only a small impact on peaking memory during decoding. It is meant to avoid processing of overly big or broken SIXEL sequences at an earlier phase, thus may stop the decoder from entering its memory intensive task for potentially invalid data.
+
+
+### Terminal Interaction
+
+- Images already on the terminal screen will reshape on font-rescaling to keep the terminal cell coverage intact.
+  This behavior might diverge from other terminals, but is in general the more desired one.
+- On terminal resize images may expand to the right automatically, if they were right-truncated before.
+  They never expand to the bottom, if they were bottom-truncated before (e.g. from scrolling-off).
+- Text autowrapping from terminal resize may break and wrap images into multiple parts. This is unfortunate,
+  but cannot be avoided, while sticking to the stronger terminal text-grid mechanics.
+  (Yes images are a second class citizen on a mainly text-driven interface.)
+- Characters written over an image will erase the image information for affected cells.
+- Images are painted above BG/FG data not erasing it. More advanced "composition tricks" like painting images
+  below FG/BG data are not possible. (We currently dont hook into BG/FG rendering itself.)
+- Previous image data at a cell will be erased on new image data. (We currently have no transparency composition.)
+
+
+### Performance & Latency
+
+- Performance should be good enough for occasional SIXEL output from REPLs, up to downscaled movies
+  from `mpv` with its SIXEL renderer (tested in the demo). For 3rd party xterm.js integrations this
+  furthermore depends highly on the overall incoming data throughput.
+- Image processing has a bad latency, partially caused by the internal worker design and its message overhead.
+  Most of the latency though is inherited from xterm.js' incoming data route (PTY -> server process -> websocket -> xterm.js async parsing), where every step creates more waiting time. Since we cannot do much about that "long line",
+  keep that in mind when you try to run more demanding applications with realtime drawing and interactive response needs.
+
+
+### Changelog
+
+- 0.1.1 bugfixes:
+  - clear sticky image tiles on render
+  - create xterm-addon-image folder from bootstrap.sh
+  - fix peer dependency in package.json

src/ImageStorage.ts

@@ -50,4 +50,6 @@ /**
   private _lowestId = 0;
-  // whether last render call has drawn anything
-  private _hasDrawn = false;
+  // whether a full clear happened before
+  private _fullyCleared = false;
+  // whether render should do a full clear
+  private _needsFullClear = false;
   // hard limit of stored pixels (fallback limit of 10 MB)
@@ -132,3 +134,4 @@ private _pixelLimit: number = 2500000;
     // mark canvas to be wiped on next render
-    this._hasDrawn = true;
+    this._needsFullClear = true;
+    this._fullyCleared = false;
   }
@@ -242,8 +245,11 @@
   public render(range: { start: number, end: number }): void {
+    // exit early if we dont have a canvas
+    if (!this._renderer.canvas) {
+      return;
+    }
     // exit early if we dont have any images to test for
-    // FIXME: leaves garbage on screen for IL/DL
-    if (!this._images.size || !this._renderer.canvas) {
-      if (this._hasDrawn) {
+    if (!this._images.size) {
+      if (!this._fullyCleared) {
         this._renderer.clearAll();
-        this._hasDrawn = false;
+        this._fullyCleared = true;
       }
@@ -253,6 +259,11 @@ return;
 
+    // buffer switches force a full clear
+    if (this._needsFullClear) {
+      this._renderer.clearAll();
+      this._fullyCleared = true;
+    }
+
     const { start, end } = range;
     const buffer = this._terminal._core.buffer;
     const cols = this._terminal._core.cols;
-    this._hasDrawn = false;
 
@@ -303,3 +314,3 @@ // clear drawing area
             }
-            this._hasDrawn = true;
+            this._fullyCleared = false;
           }
@@ -306,0 +317,0 @@ }

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

378699

increased by0.89%

Lines of code

3284

increased by0.64%

Number of lines in readme file

213

increased by21.71%

No dependency changes