-
Notifications
You must be signed in to change notification settings - Fork 37.3k
Terminal: show dimensions overlay while resizing #284244
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Terminal: show dimensions overlay while resizing #284244
Conversation
|
@microsoft-github-policy-service agree |
Tyriar
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great work, looks fantastic 👏
|
|
||
| this._terminalService.setContainers(parentElement, this._terminalContainer); | ||
|
|
||
| this._register(this._terminalService.onDidChangeInstanceDimensions(instance => this._handleInstanceDimensionsChanged(instance))); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Something I noticed is this shows up when not explicitly dragging it, such as when it's resized on window launch. Could we restrict this to show only when manually resizing somehow?
src/vs/workbench/contrib/terminal/browser/terminalTabbedView.ts
Outdated
Show resolved
Hide resolved
|
Hi @Tyriar, Thanks for the feedback and suggestions! I’ll update the PR to: -Restrict the overlay to show only during manual resizing. -Change the overlay text format to ${instance.cols} x ${instance.rows}. I’ll push the changes shortly. |
|
Hi @Tyriar, I’ve updated the PR to restrict the overlay so it only appears during manual resizing, and I’ve updated the text format to ${cols} x ${rows} as suggested. Please let me know if this looks good or if you’d like any further adjustments. Thanks! |
| private _ensureResizeOverlay(): HTMLElement { | ||
| if (!this._resizeOverlay) { | ||
| this._resizeOverlay = $('.terminal-resize-overlay'); | ||
| this._resizeOverlay.setAttribute('role', 'status'); | ||
| this._resizeOverlay.setAttribute('aria-live', 'polite'); | ||
| this._parentElement.append(this._resizeOverlay); | ||
| this._register(toDisposable(() => this._resizeOverlay?.remove())); | ||
| } | ||
| return this._resizeOverlay; | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Playing around with this more, it should probably actually live in TerminalInstance since this falls over right now when there are multiple terminals or tabs are shown:
It's also fine that it shows for all split terminals at once, not just the active one. But we do want to make sure that the window startup and terminal start up problem is handled. Moving it into TerminalInstance should make it a lot easier to accomplish this as it knows when it was just launched, it knows the first resize event, etc.
…nal and manual resize
|
Hi @Tyriar, I’ve moved the overlay logic to TerminalInstance as suggested.
I’ve incorporated all requested changes and accept them. The PR is ready for your review. |
Tyriar
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @tharani-2006 👏
I made a few tweaks that were easier to do on my end than explain.
Fixes #284046
Adds a temporary overlay to the integrated terminal that displays
the current terminal dimensions (columns × rows) while resizing.