bluebey-studio: 縦書きの「ー」を少し下げて上の文字と離す

回転した長音は字枠の中央だと上の文字に近いので、セル内で 0.14em 下げた。

1 files changed, 8 insertions, 2 deletions

diff --git a/public/bluebey-studio/src/caption.js b/public/bluebey-studio/src/caption.js
index 821ccb5..ab5c022 100644
--- a/public/bluebey-studio/src/caption.js
+++ b/public/bluebey-studio/src/caption.js
@@ -110,6 +110,12 @@ for (const ch of '」』）〕') VERTICAL_OFFSETS.set(ch, { dx: -0.14, dy: 0.12
  */
 const VERTICAL_ROTATED = new Set(['ー', '～', '〜', '―']);
 
+/**
+ * How far a rotated glyph is nudged down inside its cell, in em. The rotated `ー`
+ * is centred otherwise, which leaves it hugging the character above it.
+ */
+const VERTICAL_ROTATED_DROP = 0.14;
+
 /** Offset used for the characters that need no special placement. */
 const NO_OFFSET = Object.freeze({ dx: 0, dy: 0 });
 
@@ -422,7 +428,7 @@ function drawText(ctx, layout, state, font) {
         const ch = chars[j];
         if (VERTICAL_ROTATED.has(ch)) {
           ctx.save();
-          ctx.translate(x + fontSize / 2, top + j * fontSize + fontSize / 2);
+          ctx.translate(x + fontSize / 2, top + j * fontSize + fontSize / 2 + VERTICAL_ROTATED_DROP * fontSize);
           ctx.rotate(Math.PI / 2);
           ctx.textAlign = 'center';
           ctx.textBaseline = 'middle';
@@ -488,7 +494,7 @@ function liveText(state, layout, font, fill, places) {
         const ch = chars[j];
         if (VERTICAL_ROTATED.has(ch)) {
           const cx = x + fontSize / 2;
-          const cy = top + j * fontSize + fontSize / 2;
+          const cy = top + j * fontSize + fontSize / 2 + VERTICAL_ROTATED_DROP * fontSize;
           rotated.push(`<text ${base} text-anchor="middle" dy="0.36em"`
             + ` transform="rotate(90 ${formatNumber(cx, places)} ${formatNumber(cy, places)})"`
             + ` x="${formatNumber(cx, places)}" y="${formatNumber(cy, places)}">${escapeText(ch)}</text>`);