diff --git a/tabby-core/src/components/baseTab.component.ts b/tabby-core/src/components/baseTab.component.ts index 19536b53c0..94c52b4671 100644 --- a/tabby-core/src/components/baseTab.component.ts +++ b/tabby-core/src/components/baseTab.component.ts @@ -75,6 +75,7 @@ export abstract class BaseTabComponent extends BaseComponent { private titleChange = new Subject() private focused = new Subject() private blurred = new Subject() + private visibility = new Subject() private progress = new Subject() private activity = new Subject() private destroyed = new Subject() @@ -83,6 +84,7 @@ export abstract class BaseTabComponent extends BaseComponent { get focused$ (): Observable { return this.focused } get blurred$ (): Observable { return this.blurred } + get visibility$ (): Observable { return this.visibility } get titleChange$ (): Observable { return this.titleChange.pipe(distinctUntilChanged()) } get progress$ (): Observable { return this.progress.pipe(distinctUntilChanged()) } get activity$ (): Observable { return this.activity } @@ -177,6 +179,10 @@ export abstract class BaseTabComponent extends BaseComponent { this.blurred.next() } + emitVisibility (visibility: boolean): void { + this.visibility.next(visibility) + } + insertIntoContainer (container: ViewContainerRef): EmbeddedViewRef { this.viewContainerEmbeddedRef = container.insert(this.hostView) as EmbeddedViewRef this.viewContainer = container diff --git a/tabby-core/src/components/splitTab.component.ts b/tabby-core/src/components/splitTab.component.ts index c5622ec4ac..ae25688bbd 100644 --- a/tabby-core/src/components/splitTab.component.ts +++ b/tabby-core/src/components/splitTab.component.ts @@ -275,6 +275,7 @@ export class SplitTabComponent extends BaseTabComponent implements AfterViewInit } }) this.blurred$.subscribe(() => this.getAllTabs().forEach(x => x.emitBlurred())) + this.visibility$.subscribe(visibility => this.getAllTabs().forEach(x => x.emitVisibility(visibility))) this.tabAdded$.subscribe(() => this.updateTitle()) this.tabRemoved$.subscribe(() => this.updateTitle()) diff --git a/tabby-core/src/services/app.service.ts b/tabby-core/src/services/app.service.ts index 16829a2350..81ac218a0e 100644 --- a/tabby-core/src/services/app.service.ts +++ b/tabby-core/src/services/app.service.ts @@ -230,11 +230,13 @@ export class AppService { if (this._activeTab) { this._activeTab.clearActivity() this._activeTab.emitBlurred() + this._activeTab.emitVisibility(false) } this._activeTab = tab this.activeTabChange.next(tab) setImmediate(() => { this._activeTab?.emitFocused() + this._activeTab?.emitVisibility(true) }) this.hostWindow.setTitle(this._activeTab?.title) } diff --git a/tabby-terminal/src/api/baseTerminalTab.component.ts b/tabby-terminal/src/api/baseTerminalTab.component.ts index 8c89074560..e7c35a6cc2 100644 --- a/tabby-terminal/src/api/baseTerminalTab.component.ts +++ b/tabby-terminal/src/api/baseTerminalTab.component.ts @@ -408,6 +408,23 @@ export class BaseTerminalTabComponent

extends Bas this.blurred$.subscribe(() => { this.multifocus.cancel() }) + + this.visibility$.subscribe(visibility => { + if (this.frontend instanceof XTermFrontend) { + if (visibility) { + // this.frontend.resizeHandler() + const term = this.frontend.xterm as any + term._core._renderService.clear() + term._core._renderService.handleResize(term.cols, term.rows) + } else { + this.frontend.xterm.element?.querySelectorAll('canvas').forEach(c => { + c.height = c.width = 0 + c.style.height = c.style.width = '0px' + }) + } + } + console.log('visibility:', this.title, visibility) + }) } protected onFrontendReady (): void { diff --git a/tabby-terminal/src/frontends/xtermFrontend.ts b/tabby-terminal/src/frontends/xtermFrontend.ts index bfec17657e..110501d534 100644 --- a/tabby-terminal/src/frontends/xtermFrontend.ts +++ b/tabby-terminal/src/frontends/xtermFrontend.ts @@ -66,7 +66,7 @@ export class XTermFrontend extends Frontend { private configuredFontSize = 0 private configuredLinePadding = 0 private zoom = 0 - private resizeHandler: () => void + resizeHandler: () => void private configuredTheme: ITheme = {} private copyOnSelect = false private preventNextOnSelectionChangeEvent = false