Skip to content
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

Allow all overflowing characters to extend to the next cell if followed by a space (Emojis etc) #997

Merged
merged 4 commits into from
Sep 17, 2017

Conversation

mofux
Copy link
Contributor

@mofux mofux commented Sep 15, 2017

Fixes #974

This PR tries to provide a more generic way of detecting overlapping characters and allowing them to be drawn to the next cell if that cell is empty (space). The first time a character is seen, it will measure the width of that character and then check if the character is overlapping. It will then cache that result, so subsequent character appearances don't have to be measured again. The cache will be cleared if the font, or the measured character width changes.

@mofux mofux requested a review from Tyriar September 15, 2017 15:45
Copy link
Member

@Tyriar Tyriar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This fixes #974?

}

// Set the correct character font for the current context
let font;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of doing this use this._ctx.save() before you change .font and .restore() after. This allows you to temporarily change the style and then revert the changes after restore.

* Whether a character is overlapping to the
* next cell.
*/
private _isOverlapping(char: string): boolean {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's also pass in char code, maybe the CharData object would be easier since we need 2 of its props?

* next cell.
*/
private _isOverlapping(char: string): boolean {

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The common case:

if (code < 256) {
  return false;
}

It should be safe to assume this.

if (font) this._ctx.font = font;

// Cache and return
return this._characterOverlapCache[char] = overlaps;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's make this 2 lines, I always have to have a second look as doing this behaves very differently in different languages.

// Measure the width of the character, but Math.floor it
// because that is what the renderer does when it calculates
// the character dimensions we are comparing against
const overlaps = Math.floor(this._ctx.measureText(char).width) > this._characterWidth;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function seems a lot faster than I was expecting 😄

@Tyriar Tyriar added this to the 3.0.0 milestone Sep 15, 2017
@coveralls
Copy link

coveralls commented Sep 15, 2017

Coverage Status

Coverage decreased (-0.2%) to 69.971% when pulling 7b5d0dd on mofux:overlap into 1f49879 on sourcelair:v3.

@coveralls
Copy link

coveralls commented Sep 15, 2017

Coverage Status

Coverage decreased (-0.2%) to 69.971% when pulling 7b5d0dd on mofux:overlap into 1f49879 on sourcelair:v3.

@coveralls
Copy link

coveralls commented Sep 15, 2017

Coverage Status

Coverage decreased (-0.2%) to 69.962% when pulling a141c42 on mofux:overlap into 1f49879 on sourcelair:v3.

@coveralls
Copy link

coveralls commented Sep 16, 2017

Coverage Status

Coverage decreased (-0.2%) to 69.962% when pulling b3efd7e on mofux:overlap into 1f49879 on sourcelair:v3.

@mofux mofux merged commit c4da832 into xtermjs:v3 Sep 17, 2017
@mofux mofux deleted the overlap branch September 15, 2023 08:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants