Merge pull request #32 from h-sug1no/fix-petaluma-support

Fix petaluma support
h-sug1no · Apr 16, 2020 · 50c4f41 · 50c4f41
2 parents 1ed7a66 + 381fa3b
commit 50c4f41
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 8 deletions.
diff --git a/docs/app.html b/docs/app.html
@@ -318,6 +318,11 @@
             type="checkbox" />cutOutSW<span class="val"></span></label>
         <label title="The Cartesian coordinates in staff spaces of the top left corner of a nominal rectangle that intersects the bottom right corner of the glyph's bounding box."><input
             type="checkbox" />cutOutSE<span class="val"></span></label>
+        <label title="cutOut anchor points are relative to the:
+        unchecked: glyph origin.
+        checked: bottom left-hand corner of the glyph bounding box(old spec).
+        "><input
+            type="checkbox" />cutOutOrigin_BBL<span class="val"></span></label>
         <label title="The Cartesian coordinates in staff spaces of the position at which the glyph graceNoteSlashStemUp should be positioned relative to the stem-up flag of an unbeamed grace note; alternatively, the bottom left corner of a diagonal line drawn instead of using the above glyph."><input
             type="checkbox" />graceNoteSlashSW<span class="val"></span></label>
         <label title="The Cartesian coordinates in staff spaces of the top right corner of a diagonal line drawn instead of using the glyph graceNoteSlashStemUp for a stem-up flag of an unbeamed grace note."><input

diff --git a/docs/ssrenderer.js b/docs/ssrenderer.js
@@ -126,6 +126,10 @@ class SSRenderer {
       const ast = dCtx.toScreenCSX(that.engravingDefaults.arrowShaftThickness);
       const glyphData = util._getGlyphData('arrowheadBlackRight');
       const m = util._measureGlyph(glyphData, 0, 0, dCtx.sbl);
+      if (!m.scaledBBox) {
+        console.warn('no arrowheadBlackRight bbox.');
+        return;
+      }
       ctx.save();
       ctx.lineWidth = ast;
       ctx.beginPath();

diff --git a/docs/viewer.js b/docs/viewer.js
@@ -173,7 +173,10 @@ class SMuFLFontViewer {
       const hintLabel = hintLabels[li];
       hintLabel.id = toHintlabelIdStr(hintLabel.textContent);
       const inputElm = hintLabel.firstElementChild;
-      inputElm.checked = true;
+
+      if (!hintLabel.textContent.startsWith('cutOutOrigin_BBL')) {
+        inputElm.checked = true;
+      }
 
       const isIndeterminate = hintLabel.textContent.startsWith('stem') ||
         hintLabel.textContent.startsWith('splitStem') ||
@@ -187,6 +190,9 @@ class SMuFLFontViewer {
     const $smuflGlyphHints_repatOffset3StateBox =
       $smuflGlyphHints.find('#' + toHintlabelIdStr('repeatOffset') + ' input');
 
+    const $smuflGlyphHints_cutOutOrigin_BBL =
+      $smuflGlyphHints.find('#' + toHintlabelIdStr('cutOutOrigin_BBL') + ' input');
+
     var c = document.getElementById('smuflGlyphCanvas');
     var ctx = c.getContext('2d');
 
@@ -287,8 +293,10 @@ class SMuFLFontViewer {
         $body.addClass('fakeDialogVisible');
         $dialogTitle.text(title);
         $contentContainer.prop('title', description);
+        $body.scrollTop($contentContainer.$contentDom.prevScrollTop||0);
       };
       infoDialogElm.close = function() {
+        $contentContainer.$contentDom.prevScrollTop = $body.scrollTop();
         $body.removeClass('fakeDialogVisible');
         $contentContainer.prop('title', '');
         document.body.scrollIntoView(); // reset vertical scroll position.
@@ -504,12 +512,13 @@ class SMuFLFontViewer {
     function _$infoDialog_showModal(key, func) {
       let $contentDom = _$infoDialog_contentDoms[key];
       if (!$contentDom) {
-        $contentDom = _$infoDialog_contentDoms[key] = $('<div></div>');
+        $contentDom = _$infoDialog_contentDoms[key] = $('<div class="infoDialogContents"></div>');
         func($contentDom);
       }
       const contentDomElm = $contentDom.get(0);
       $contentContainer.empty();
       $contentContainer.append($contentDom);
+      $contentContainer.$contentDom = $contentDom;
       $infoDialog.get(0).showModal(key);
 
       if (contentDomElm.dlRepaint) {
@@ -855,10 +864,10 @@ class SMuFLFontViewer {
       return val * sbl;
     }
 
-    function _anchorCsToScreenCs(scaledBBox, anchor, sbl) {
+    function _anchorCsToScreenCs(scaledBBox, anchor, sbl, relativeToBBL) {
       return {
-        x: scaledBBox.x + anchorCsToScreenCsX(Number(anchor[0]), sbl),
-        y: scaledBBox.y + anchorCsToScreenCsY(Number(anchor[1]), sbl)
+        x: (relativeToBBL ? scaledBBox.W : scaledBBox.x) + anchorCsToScreenCsX(Number(anchor[0]), sbl),
+        y: (relativeToBBL ? scaledBBox.S : scaledBBox.y) + anchorCsToScreenCsY(Number(anchor[1]), sbl)
       };
     }
 
@@ -872,7 +881,10 @@ class SMuFLFontViewer {
       let w;
       let h;
       const sbl = scaledBBox.sbl;
-      let vals = _anchorCsToScreenCs(scaledBBox, anchor, sbl);
+      const isCutOut = akey.startsWith('cutOut');
+      const isCutOutOriginBBL = $smuflGlyphHints_cutOutOrigin_BBL.prop('checked');
+      let vals = _anchorCsToScreenCs(scaledBBox, anchor, sbl,
+        isCutOut && isCutOutOriginBBL);
 
       // eslint-disable-next-line no-unused-vars
       let halign = 'L';
@@ -911,9 +923,16 @@ class SMuFLFontViewer {
       });
       bbs[akey].vals = vals;
       ctx.save();
-      if (akey.startsWith('cutOut')) {
-        ctx.fillStyle = '#cccccccc';
+      if (isCutOut) {
+        if (isCutOutOriginBBL) {
+          ctx.fillStyle = '#ccccd5cc';
+        }
+        else {
+          ctx.fillStyle = '#cccccccc';
+        }
         ctx.fillRect(x, y, w, h);
+        ctx.fillStyle = '#44aaffcc';
+        _renderCross(vals.x, vals.y);
       }
       else if (akey.startsWith('splitStem') || akey.startsWith('stem') ||
         akey.startsWith('numeral') || akey.startsWith('graceNoteSlash') || akey === 'repeatOffset' ||
@@ -1422,12 +1441,19 @@ class SMuFLFontViewer {
       const anchors = sMuFLMetadata.fontMetadata().glyphsWithAnchors;
       const anchor = anchors ? anchors[glyphname] : undefined;
       hintLabels.hide();
+
+      let hasCutOut = false;
       if (anchor) {
         for (const key in anchor) {
+          hasCutOut |= key.startsWith('cutOut');
           $smuflGlyphHints.children(`#${toHintlabelIdStr(key)}`).show();
         }
       }
 
+      if (hasCutOut) {
+        $smuflGlyphHints.children(`#${toHintlabelIdStr('cutOutOrigin_BBL')}`).show();
+      }
+
       currentGlyphData = {
         codepoint: codepoint,
         glyphname: glyphname,