allow transparency composition

jerch / xterm-addon-image

Image addon for xterm.js

MIT License

51 stars 6 forks source link

allow transparency composition #16

Open jerch opened 2 years ago

jerch commented 2 years ago

In older terminals the graphics output would get printed above any previous content. With backgroundSelect=1 SIXEL has a mode to take advantage of that, where old pixels get not touched, if not explicitly colored by SIXEL data.

We cannot do it quite the same way, as we mix in graphics late during rendering. We could still fake the partial "overprinting" by allowing transparent pixels to blend with old pixels from a previous graphics print.

tsl0922 commented 1 year ago

ohh, it's happing on ttyd(xterm.js) too, clear doesn't work.

jerch commented 1 year ago

@tsl0922 eww- how did you end up with that output? Can you show me the commands?

tsl0922 commented 1 year ago

well, I can't reporduce it stably

pmp-p commented 1 year ago

well, I can't reporduce it stably

same i have it often randomly on pygbag debug screen https://pmp-p.github.io/python-wasm-plus/pythons.html#debug

edit/ i think it happens only when there's no scrolling before clear

jerch commented 1 year ago

Well there is an aggressive optimization in xterm.js - it normally updates the screen only for lines, that have seen changes in the terminal buffer. The graphics layer does the same - it crops graphics information for those lines and clears + redraws it.

Meanwhile, as a quickfix, I can change that to full redraw and clear everything upfront. This should cure "sticky" image tiles. (created #32 for it)

If you can narrow down the circumstances when this happens, that would be really helpful. I kinda suspect some terminal action in xterm.js not properly updating the changed lines record, which the renderer evaluates for screen updates.

jerch commented 1 year ago

@tsl0922, @pmp-p Did a patch release 0.1.1 which hopefully fixes the issue. Please let me know if it doesnt work for you.

pmp-p commented 1 year ago

@jerch i would gladly try it and even provide a python testsuite later, but could you provide a build ( maybe CI+gh-pages ? ) . Tbh i don't remember how i've built the addon (xterm.js + xterm-addon-image.js + xterm-addon-image-worker.js) ~6 month ago and i'm not usually very lucky when building xterm.js or typescript stuff in general.

jerch commented 1 year ago

@pmp-p If free CDN assets dont scare you, you could download the needed resources from here:

https://unpkg.com/xterm-addon-image@0.1.1/lib/xterm-addon-image.js (addon js file)
https://unpkg.com/xterm-addon-image@0.1.1/lib/xterm-addon-image-worker.js (worker js file)

Alternatively you can also download the npm package (npm repo might be more trustworthy) and extract the assets from the lib/ folder. You can grab the tarball url from https://registry.npmjs.org/xterm-addon-image/.

pmp-p commented 1 year ago

here's my findings https://github.com/jerch/xterm-addon-image/issues/32#issuecomment-1232019182