Added textAscent and textDescent functions on Webgl

[Forchapeatl]

trafficstars

Added textAscent and textDescent functions on Webgl

Resolves #4958 Changes:

Screenshots of the change:

Before :

After :

example

let font;

function preload() {
  font = loadFont('consola_mono/ConsolaMono-Bold.ttf'); 
}

function setup() {
  createCanvas(900, 900, WEBGL);
  textFont(font); // Set the loaded font
}

function draw() {
  translate(-width/2, -height/2);
  background(0);
  fill('white');
  
  textSize(12);
  text('WEBGL : textAscent', 200, 20);
  text('12: ' + textAscent(), 20, 20);
  
  textSize(14);
  text('14: ' + textAscent(), 20, 40);
  
  textSize(16);
  text('16: ' + textAscent(), 20, 60);
  
  textSize(32);
  text('32: ' + textAscent(), 20, 100);
}

PR Checklist

• [x] npm run lint passes
• [ ] Inline documentation is included / updated
• [ ] Unit tests are included / updated

[Forchapeatl]

@davepagurek , Please for a review. I hope you don't mind.

[davepagurek]

Thanks for making the changes! Looks like this code will work, which is great. Currently it will recreate the value every time instead of using the same caching flow as 2D mode, so it's probably worth looking into whether we can get the two systems working the same way. If there are any unforeseen issues when we look into that, we can fall back to the technique you're using here.

It seems the underlying issue is that 2D mode sets the cached ascent and descent values back to null when font things change, via _applyTextProperties: https://github.com/processing/p5.js/blob/0b01116011758ac4fef59d053490e54a91e05720/src/core/p5.Renderer2D.js#L1307-L1312

Meanwhile, the WebGL implementation of this is empty: https://github.com/processing/p5.js/blob/0b01116011758ac4fef59d053490e54a91e05720/src/webgl/text.js#L8-L11

So rather than overriding the ascent and descent functions, we just need to also set them to null in the WebGL implementation of _applyTextProperties?

[Forchapeatl]

Hi @davepagurek , thank you for the help. I have done as instructed.