feat: add support for positioning of diacritic marks (e.g. Thai)

protectwise · Oct 8, 2023 · 301c34c · 301c34c
1 parent 1e358b2
commit 301c34c
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 26 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/troika-examples/text/TextExample.jsx b/packages/troika-examples/text/TextExample.jsx
@@ -55,11 +55,9 @@ November 19, 1863`,
 
   'Arabic': 'وللناس مذاهبهم المختلفة في التخفف من الهموم والتخلص من الأحزان، فمنهم من يتسلى عنها بالقراءة، ومنهم من يتسلى عنها بالرياضة، ومنهم من يتسلى عنها بالاستماع للموسيقى والغناء، ومنهم من يذهب غير هذه المذاهب كلها لينسى نفسه ويفر من حياته الحاضرة وما تثقله به من الأعباء.',
 
-  /*
   'Hebrew': `של קרן בידור אדריכלות ארכיאולוגיה, עסקים האטמוספירה רבה על. של היום שנתי חפש. אל חבריכם חרטומים אקטואליה אנא. אנא בידור ביוני חינוך אם, אם כדור באגים המשפט אחר.
 
 שכל מה מדעי מושגי אחרונים. זאת את שנתי שדרות, כתב מה ניהול הגרפים. רבה גם מיזמי תרומה אקראי. ציור רפואה ייִדיש שער דת, מה מתוך ופיתוחה קרן. מיזם תרבות לערוך על היא. ב ציור רביעי כלל, שמו על ואמנות לעריכת לערכים, סדר לשון פולנית וכמקובל אל.`,
-  */
 
   'Bidi': `ان أول إطلاق مداري ناجح للفضاء بواسطة البعثة السوفياتية بدون طيار سبوتنيك 1 ("ساتليت 1") في 4 تشرين الأول / أكتوبر 1957. وكان وزن القمر الصناعي حوالي 83 كجم (183 رطلا)، ويعتقد أنه قد دار حول كوكب الأرض على ارتفاع حوالي 250 كم (160 ميل). كان لها اثنين من أجهزة الإرسال اللاسلكية (20 و40 ميجا هرتز)، والتي تنبعث منها "الصفافير" التي يمكن أن يسمع من قبل أجهزة الراديو في جميع أنحاء العالم. وأستخدم تحليل الإشارات الراديوية لجمع معلومات عن كثافة الإلكترون في الغلاف الأيوني، بينما شفرت بيانات درجة الحرارة والضغط في مدى الصفافير الراديوية radio beeps. وأظهرت النتائج أن الساتل أو الستالايت لم يثقبهُ أي نيزك. ولقد إطلقت المركبة (سبوتنيك 1 ) من قبل صاروخ R-7. وأحترقت عند دخولها الغلاف الجوي للأرض في 3 كانون الثاني / يناير 1958.
 
@@ -69,6 +67,8 @@ November 19, 1863`,
 
 厳理女格久世投目文抗単落供年鵬蜂兆。品内災塾初鎌法成担間危芸拡根日済材。徳治索作現更思北計写席懸順済。当利新突男岡感受意断済売絵紙家毎備記香高。表道氷草正公断人文今時意芸日熊提管全保取。容渡急振索功自際円愛親派抗要。良強図着亡警新毎医傷臭劇日訴馬熱活明。配法載楽教要孤国最日回情飾柴未天置申。供問子住初最列福有愛夢議。`,
 
+  'Thai': `ห้องน้ำ\nห้องนํ้า\nห้องน้ํา\nพื้นที่รับแขก\nตู้เสื้อผ้า\nและชั้นวางของ`,
+
   'Emoji': 'Examples of emoji are 😂, 😃, 🧘🏻‍♂️, 🌍, 🌦️, 🥖, 🚗, 📱, 🎉, ❤️, ✅, and 🏁.',
 
   // TODO fix in XR:

diff --git a/packages/troika-three-text/libs/typr.factory.js b/packages/troika-three-text/libs/typr.factory.js
diff --git a/packages/troika-three-text/package.json b/packages/troika-three-text/package.json
@@ -23,7 +23,7 @@
     "three": ">=0.125.0"
   },
   "devDependencies": {
-    "@fredli74/typr": "0.3.8",
+    "@lojjic/typr": "0.3.8-lojjic1",
     "@unicode-font-resolver/client": "1.0.2",
     "fflate": "^0.7.0",
     "node-fetch": "^2.6.0"

diff --git a/packages/troika-three-text/rollup.config.build-typr.js b/packages/troika-three-text/rollup.config.build-typr.js
@@ -36,7 +36,7 @@ const [banner, footer] = OUTPUT_TEMPLATE.split('$$CONTENT$$')
 
 
 export default {
-  input: LERNA_ROOT_PATH + '/node_modules/@fredli74/typr/dist/Typr.js',
+  input: LERNA_ROOT_PATH + '/node_modules/@lojjic/typr/dist/Typr.js',
   plugins: [
     nodeResolve(),
     commonjs(),
@@ -62,6 +62,8 @@ export default {
         // and improves performance, so don't need the original
         removeMethodAssignment('Typr.U.stringToGlyphs')
         removeMethodAssignment('Typr.U._getWPfeature')
+        // Same for position adjustments to support mark anchoring
+        removeMethodAssignment('Typr.U.getPairAdjustment')
 
         return source
 

diff --git a/packages/troika-three-text/src/FontParser.js b/packages/troika-three-text/src/FontParser.js
@@ -159,7 +159,9 @@ function parserFactory(Typr, woff2otf) {
     return glyphIds
   }
 
-  //
+  // Calculate advances and x/y offsets for each glyph, e.g. kerning and mark
+  // attachments. This is a more complete version of Typr.U.getPairAdjustment
+  // and should become an upstream replacement eventually.
   function calcGlyphPositions(font, glyphIds) {
     const positions = new Int16Array(glyphIds.length * 3); // [offsetX, offsetY, advanceX, ...]
     let glyphIndex = 0;

diff --git a/packages/troika-three-text/src/Typesetter.js b/packages/troika-three-text/src/Typesetter.js
@@ -256,7 +256,7 @@ export function createTypesetter(resolveFonts, bidi) {
 
         const runText = text.slice(run.start, run.end + 1)
         let prevGlyphX, prevGlyphObj
-        fontObj.forEachGlyph(runText, fontSize, letterSpacing, (glyphObj, glyphX, charIndex) => {
+        fontObj.forEachGlyph(runText, fontSize, letterSpacing, (glyphObj, glyphX, glyphY, charIndex) => {
           glyphX += prevRunEndX
           charIndex += run.start
           prevGlyphX = glyphX
@@ -314,6 +314,7 @@ export function createTypesetter(resolveFonts, bidi) {
           let fly = currentLine.glyphAt(currentLine.count)
           fly.glyphObj = glyphObj
           fly.x = glyphX + lineXOffset
+          fly.y = glyphY
           fly.width = glyphWidth
           fly.charIndex = charIndex
           fly.fontData = fontData
@@ -554,7 +555,7 @@ export function createTypesetter(resolveFonts, bidi) {
 
                 // Determine final glyph position and add to glyphPositions array
                 const glyphX = glyphInfo.x + anchorXOffset
-                const glyphY = line.baseline + anchorYOffset
+                const glyphY = glyphInfo.y + line.baseline + anchorYOffset
                 glyphPositions[idx * 2] = glyphX
                 glyphPositions[idx * 2 + 1] = glyphY
 
@@ -684,7 +685,7 @@ export function createTypesetter(resolveFonts, bidi) {
   function TextLine() {
     this.data = []
   }
-  const textLineProps = ['glyphObj', 'x', 'width', 'charIndex', 'fontData']
+  const textLineProps = ['glyphObj', 'x', 'y', 'width', 'charIndex', 'fontData']
   TextLine.prototype = {
     width: 0,
     lineHeight: 0,