From b65fa5f3437e1f43b4bf8dabf8e819805b369f7d Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Thu, 9 Mar 2023 17:49:03 +0530 Subject: [PATCH 1/6] Allow textAlign(CENTER, CENTER) with max width but no max height --- lib/addons/p5.sound.js | 2 +- src/core/p5.Renderer.js | 26 ++++++++++++++------------ src/typography/attributes.js | 4 ++-- 3 files changed, 17 insertions(+), 15 deletions(-) diff --git a/lib/addons/p5.sound.js b/lib/addons/p5.sound.js index a8a7e3f450..e7456789a8 100644 --- a/lib/addons/p5.sound.js +++ b/lib/addons/p5.sound.js @@ -10618,7 +10618,7 @@ var soundRecorder_ac = main.audiocontext; * // send result to soundFile * recorder.stop(); * - * text('Done! Tap to play and download', width/2, height/2, width - 20); + * text('Done! Tap to play and download', width/2, height/2, width - 100); * state++; * } * diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js index 3ffba0a05b..36f4ae78e7 100644 --- a/src/core/p5.Renderer.js +++ b/src/core/p5.Renderer.js @@ -296,18 +296,20 @@ p5.Renderer.prototype.text = function(str, x, y, maxWidth, maxHeight) { if (this._textBaseline === constants.CENTER) { finalMaxHeight = originalY + maxHeight - ascent / 2; } - } else { - // no text-height specified, show warning for BOTTOM / CENTER - if (this._textBaseline === constants.BOTTOM) { - return console.warn( - 'textAlign(*, BOTTOM) requires x, y, width and height' - ); - } - if (this._textBaseline === constants.CENTER) { - return console.warn( - 'textAlign(*, CENTER) requires x, y, width and height' - ); - } + // fix for #5933 (when MaxHeight not defined) + else if (typeof maxHeight === 'undefined') { + let ascent = p.textAscent(); + switch (this._textBaseline) { + case constants.BOTTOM: + y -= ascent; + finalMinHeight += ascent; + break; + case constants.CENTER: + y -= ascent / 2; + finalMinHeight += ascent / 2; + break; + } + } } // Render lines of text according to settings of textWrap diff --git a/src/typography/attributes.js b/src/typography/attributes.js index 3f36edc413..bc40c67539 100644 --- a/src/typography/attributes.js +++ b/src/typography/attributes.js @@ -61,9 +61,9 @@ import p5 from '../core/main'; * textAlign(CENTER, BASELINE); * text('BASELINE', 0, 62, width); * - * line(0, 87, width, 87); + * line(0, 97, width, 97); * textAlign(CENTER, BOTTOM); - * text('BOTTOM', 0, 87, width); + * text('BOTTOM', 0, 97, width); * * describe(`The names of the four vertical alignments (TOP, CENTER, BASELINE, * and BOTTOM) rendered each showing that alignment's placement relative to a From d58ca110677ea2e270d13989c66d1ad1c5f3f434 Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Thu, 9 Mar 2023 18:35:49 +0530 Subject: [PATCH 2/6] update --- src/core/p5.Renderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js index 36f4ae78e7..6063c457dd 100644 --- a/src/core/p5.Renderer.js +++ b/src/core/p5.Renderer.js @@ -309,7 +309,7 @@ p5.Renderer.prototype.text = function(str, x, y, maxWidth, maxHeight) { finalMinHeight += ascent / 2; break; } - } + } } // Render lines of text according to settings of textWrap From 4e231d95ca9408252d464cd4395c3244c0566e19 Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Sun, 12 Mar 2023 00:31:22 +0530 Subject: [PATCH 3/6] Allow textAlign(CENTER, CENTER) without specifying max height --- src/core/p5.Renderer.js | 21 ++++++++------------- 1 file changed, 8 insertions(+), 13 deletions(-) diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js index 6063c457dd..b76c41f7ab 100644 --- a/src/core/p5.Renderer.js +++ b/src/core/p5.Renderer.js @@ -296,19 +296,14 @@ p5.Renderer.prototype.text = function(str, x, y, maxWidth, maxHeight) { if (this._textBaseline === constants.CENTER) { finalMaxHeight = originalY + maxHeight - ascent / 2; } - // fix for #5933 (when MaxHeight not defined) - else if (typeof maxHeight === 'undefined') { - let ascent = p.textAscent(); - switch (this._textBaseline) { - case constants.BOTTOM: - y -= ascent; - finalMinHeight += ascent; - break; - case constants.CENTER: - y -= ascent / 2; - finalMinHeight += ascent / 2; - break; - } + } else { + // no text-height specified, show warning for BOTTOM / CENTER + if (this._textBaseline === constants.BOTTOM || + this._textBaseline === constants.CENTER) { + // use rectHeight as an approximation for text height + let rectHeight = p.textSize() * (this._textLeading || 1.25); + finalMinHeight = y - rectHeight / 2; + finalMaxHeight = y + rectHeight / 2; } } From 5146ba4ebac8445a2e0f551d23550cf4a4f55f5d Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Sun, 12 Mar 2023 23:06:25 +0530 Subject: [PATCH 4/6] Update p5.sound.js --- lib/addons/p5.sound.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/addons/p5.sound.js b/lib/addons/p5.sound.js index e7456789a8..a8a7e3f450 100644 --- a/lib/addons/p5.sound.js +++ b/lib/addons/p5.sound.js @@ -10618,7 +10618,7 @@ var soundRecorder_ac = main.audiocontext; * // send result to soundFile * recorder.stop(); * - * text('Done! Tap to play and download', width/2, height/2, width - 100); + * text('Done! Tap to play and download', width/2, height/2, width - 20); * state++; * } * From 2985c65ca11c6686e6071678c02e31a818a14172 Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Sun, 12 Mar 2023 23:07:40 +0530 Subject: [PATCH 5/6] Update p5.Renderer.js --- src/core/p5.Renderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js index b76c41f7ab..6ca02b3882 100644 --- a/src/core/p5.Renderer.js +++ b/src/core/p5.Renderer.js @@ -301,7 +301,7 @@ p5.Renderer.prototype.text = function(str, x, y, maxWidth, maxHeight) { if (this._textBaseline === constants.BOTTOM || this._textBaseline === constants.CENTER) { // use rectHeight as an approximation for text height - let rectHeight = p.textSize() * (this._textLeading || 1.25); + let rectHeight = p.textSize() * (this._textLeading); finalMinHeight = y - rectHeight / 2; finalMaxHeight = y + rectHeight / 2; } From 8c9bf58510eb03f0fb2a7768eed52f45b2d0cdd4 Mon Sep 17 00:00:00 2001 From: Sawai Singh Rajpurohit <49401909+sawaisinghh@users.noreply.github.com> Date: Sun, 12 Mar 2023 23:24:13 +0530 Subject: [PATCH 6/6] update p5.renderer.js --- src/core/p5.Renderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js index 6ca02b3882..ecb1680326 100644 --- a/src/core/p5.Renderer.js +++ b/src/core/p5.Renderer.js @@ -301,7 +301,7 @@ p5.Renderer.prototype.text = function(str, x, y, maxWidth, maxHeight) { if (this._textBaseline === constants.BOTTOM || this._textBaseline === constants.CENTER) { // use rectHeight as an approximation for text height - let rectHeight = p.textSize() * (this._textLeading); + let rectHeight = p.textSize() * this._textLeading; finalMinHeight = y - rectHeight / 2; finalMaxHeight = y + rectHeight / 2; }