Hey community,

I'm looking for testers among you who use macOS (especially macOS!) or Linux for a small JSFX experiment.
Feedback from Windows users (Win7 or older) is also very welcome.

In the past, I've encountered some challenges regarding the correct cross-platform rendering and scaling of text in JSFX.

If you have a few minutes to spare, it would be great if you could test the provided JSFX and give me your feedback on the text rendering.

Expected behavior:

• The text always stays within the bounds of the rectangle.
• The text is always displayed as large as possible (until max font size 72 is reached).
• When changing the font, the text size (relative to filling the rectangle) remains constant.
• When scaling the plugin window, the text scaling occurs smoothly.
• At maximum rectangle size (100% width, 100% height) the text size is capped at max 72.

Does the expected behavior hold true for you?

Please also describe any deviations or unexpected behavior. It would be helpful if you could state your operating system (including version).

Thanks in advance to everyone who takes the time and shares their observations.

Code:

desc:font_size_test_72

slider1:rect_w=25<1,100,.1>w%
slider2:rect_h=25<1,100,.1>h%
slider3:value=50<0,100,.01>value
slider4:font=0<0,2,1{Arial,Verdana,Times New Roman}>font

@init
gfx_ext_retina = 1;
font_idx = 1;
font_size = 72;
format = "%.2f";

function _round(val) ( floor(val + 0.5) );

function hex_to_rgb(hex_color)
local(r_int, g_int, b_int)
(
  hex_color = floor(hex_color);
  r_int = floor(hex_color / 65536) % 256;
  g_int = floor(hex_color / 256) % 256;
  b_int = hex_color % 256;
  gfx_r = r_int / 255;
  gfx_g = g_int / 255;
  gfx_b = b_int / 255;
);

function draw_scaled_text(
  rect_x, rect_y, rect_w, rect_h,  // bounding
  textColor,                       // hex-colro
  value,                           // "text", wert (oder slider-index wenn mode = 1)
  mode,                            // 0 = text/zahl, 1 = slider-enum
  format,                          // formatstring (optional)
  font_idx, font_face, font_size,  // font definition
  show_debug_rect                  // debug box
)
local(
  prev_font, text, enum_str,
  text_w, text_h,
  curr_size, scale, was_resized,
  init_size,
  draw_x, draw_y,
  x, y, w, h, orig_alpha
)
(
  prev_font = gfx_getfont();
  was_resized = 0;
  text = #dst_text_buffer;
  enum_str = #dst_enum_buffer;
  mode == 1 ? (
    strcpy_fromslider(enum_str, floor(value));
 
    format ?
      sprintf(text, format, enum_str) :
      strcpy(text, enum_str);
  ) : (
    format ?
      sprintf(text, format, value) :
      strcpy(text, value);
  );
  rect_w > 0 && rect_h > 0 ? (
    curr_size = max(4, floor(font_size));
    init_size = curr_size;
    font_idx > 0 && font_idx <= 16 && font_face ? (
      gfx_setfont(font_idx, font_face, curr_size);
    ) : font_idx == 0 ? (
      gfx_setfont(0);
      curr_size = gfx_texth;
      init_size = curr_size;
    ) : (
      gfx_setfont(prev_font);
      curr_size = gfx_texth;
      init_size = curr_size;
      font_idx = prev_font;
    );
    gfx_measurestr(text, text_w, text_h);
    (text_w > rect_w || text_h > rect_h) && font_idx > 0 ? (
      scale = min(
        min(
          (text_w > 0 && rect_w > 0) ? rect_w / text_w : 1,
          (text_h > 0 && rect_h > 0) ? rect_h / text_h : 1
        ),
        1
      );
 
      curr_size = max(4, floor(init_size * scale));
      gfx_setfont(font_idx, font_face, curr_size);
      was_resized = 1;
 
      gfx_measurestr(text, text_w, text_h);
    );
    draw_x = rect_x + (rect_w - text_w) / 2;
    draw_y = rect_y + (rect_h - text_h) / 2;
    hex_to_rgb(textColor);
    gfx_x = _round(draw_x);
    gfx_y = _round(draw_y);
    gfx_drawstr(text);
    show_debug_rect ? (
      orig_alpha = gfx_a;
      gfx_a = 1.0;
 
      x = _round(rect_x);
      y = _round(rect_y);
      w = _round(rect_w);
      h = _round(rect_h);
 
      gfx_rect(x, y, w, h, 0);
 
      gfx_a = orig_alpha;
    );
    was_resized && font_idx > 0 ? (
      gfx_setfont(font_idx, font_face, init_size);
    );
  );
  gfx_setfont(prev_font);
);

@gfx 500 250
w = gfx_w / 100 * rect_w;
h = gfx_h / 100 * rect_h;
x = gfx_w/2 - w/2;
y = gfx_h/2 - h/2;

font_face = font == 0 ? "Arial" : (font == 1 ? "Verdana" : "Times New Roman");

draw_scaled_text( x,y,w,h, 0xFFFFFF, value,0,format, font_idx,font_face,font_size*gfx_ext_retina, 1 );

 

Last edited: May 16, 2025 at 11:18 AM

Would really like to help you, but I have no clue how to name this? I copied and past the code in a file "SinusWell" and put it in the Effects folder, but Reaper does not recognize it. Then I renamed the file to "SinusWell.jsfx-inc", but still no recognition in Reaper.
I am using windows Reaper v6.67 portable under Wine in MX21 and I use Linus version Reaper v6.75.
Maybe I have to do something different?

 

Hey @paul_audioz
'SinusWell.jsfx' should suffice as the filename. The suffix '*.jsfx-inc' would prevent it from being displayed in the plugin browser, as it is used for dependencies.

Reaper will need to be restarted, or the plugin browser refreshed (F5 on Windows), for the plugin to be displayed. In the plugin browser, it should then be displayed as 'font_size_test'.

 

Ah, good to know. Here are the results form The Netherlands:
1. windows Reaper v6.67
- name is JS: font_size_test [SinusWell.jsfx]
- w% works, the displayed number gets smaller when w is lower
- h% works, the displayed number gets smaller when h is lower
- value changes and shows correct number
- all 3 fonts work

2. Linux Reaper v6.75
- name is JS: font_size_test
- w% works, the displayed number gets smaller when w is lower
- h% works, the displayed number gets smaller when h is lower
- value changes and shows correct number
- all 3 fonts work

So the only strange thing is the name of your effect. Reaper Linux does not show my given name SinusWell, only the name you gave it. Where windows Reaper does show my given name.
But overall I would like to give douze points from Pays Bas.

 

Reaper v7.39 Win7
1.yes
2.yes till size 72
3.yes
4.all good
5.no - the numbers font goes to its maximum at about size 72 (comparing to notepad font) after which it just remains in the middle of the rectangular

the fx screen at its maximum in the attachment: rectangular grows to the borders, numbers stay in the middle

 

This could be an indication of a file duplicate or a temporary file indexing issue. It's Reaper-specific behavior and has nothing to do with the code itself. A browser refresh should clear it up. Thanks for testing!

That's a very valuable insight! Thanks for testing!

 

SOLVED!

 

Last edited: May 16, 2025 at 12:05 PM

Yes, can confirm nr 5 from Synclavier:
https://www.directupload.eu/file/d/8921/z93tragf_jpg

 

Yes, that could be due to one of the following possible reasons:

1. (unlikely): Win7 and Linux can only display a max font size of 72p.
2. (likely): The fonts I use on Win11 are mordern Microsoft fonts with an extremely high max point size (>1000p). Linux and Win7 use a fallback font of the same font family. The fallback font is limited to 72p.

At some time I might come back to this topic with further test requests once I have decided on specific OTFs for my designs. For the moment, 72p is absolutely sufficient.

 

Okay, glad I could have been of help!