paulrosen / abcjs

javascript for rendering abc music notation

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Centered text offset when using expandtowidest set true

seisiuneer opened this issue · comments

Just updated to 6.2.3 and have users reporting that in many cases, if they had centered text, for example either by %%center tags or additional T: tags in the ABC, that if the notation is one of the expandtowidest cases where it resets the top text, the centered text is offset to the left.

Example (with expandtowidest set true at render time):

X:1
T:The Kail Pot
M:4/4
R:strathspey
Q:140
L:1/8
K:Dmin
|:"Dm"d>^cd>e f>ed>e|"F"f>ef>a "C"ge|"Dm"d>^cd>e f>ed>e|"F"f>ef>a "C"ge|"F"f>ef>a "Gm"g>f"C"e>g|1"A"(3fed (3^cde "Dm"d<D D2:|2"A"(3fed (3^cde "Dm"d<D D|]
% User likes to do this to create tune sets...
T:Airlie Bobbies
T:(by Jim Ritchie, in 1938 age 11)
R:reel
[Q:180]
M:4/4
L:1/8
K:Amaj
%%center Here is some centered text
E|"A"A/A/A AB "E"AECE|"A"AEAc "E"e2 dc|"G"B/B/B Bc BFDF|BABc "D"defd|

Screenshot:

Screen Shot 2023-11-22 at 11 29 33 AM

I provided them with a way to specifically disable the expandtowidest on specific tunes (added a private ABC directive for my tool) to make it work more like 6.2.2, but looked to me that this was fairly complicated to fix, since the absolute text position has already been established for the text elements before the new top element is added to to the expandtowidest resize. Seems almost like it would require a second rendering pass to re-layout the text once the maxwidth was determined, more than I was willing to risk on my own.

Something like this after the new TopText add as a first order fix when expandtowidest is true seems to do the job with the centered text and subtitles in the ABC:

abcTune.topText = new TopText(abcTune.metaText, abcTune.metaTextInfo, abcTune.formatting, abcTune.lines, maxWidth, this.renderer.isPrint, this.renderer.padding.left, this.renderer.spacing, this.getTextSize);

if ((abcTune.lines)&&(abcTune.lines.length > 0)){

  var nlines = abcTune.lines.length;

  for (var i=0;i<nlines;++i){

    var entry = abcTune.lines[i];

    if (entry.nonMusic){

      if ((entry.nonMusic.rows) && (entry.nonMusic.rows.length > 0)){

        var nRows = entry.nonMusic.rows.length;

        for (var j=0;j<nRows;++j){

          var thisRow = entry.nonMusic.rows[j];

          // This adjusts the position of the element
          if (thisRow.left){

            if (entry.subtitle){

              console.log("Got centered subtitle: "+entry.subtitle.text);

              thisRow.left = (maxWidth/2) + this.renderer.padding.left;

            }
            else
            if ((entry.text)&&(entry.text.length>0)){

              if (entry.text[0].center){

                console.log("Got centered text element: "+entry.text[0].text);

                thisRow.left = (maxWidth/2) + this.renderer.padding.left;

              }
            }
          }
        }
      }
    }
  }

Here's an example with the above fix in place with both %%center text and additional T: tags in the ABC below the header:

image