From d3652996d62d33d49360db70c3829ebae2e8b109 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 12 Jul 2021 20:45:19 +0100 Subject: [PATCH] Convert FontManager to TS --- package.json | 1 + src/@types/global.d.ts | 2 ++ src/utils/{FontManager.js => FontManager.ts} | 16 ++++++++-------- yarn.lock | 5 +++++ 4 files changed, 16 insertions(+), 8 deletions(-) rename src/utils/{FontManager.js => FontManager.ts} (95%) diff --git a/package.json b/package.json index bb92ad11d8..27c4f39a09 100644 --- a/package.json +++ b/package.json @@ -126,6 +126,7 @@ "@types/classnames": "^2.2.11", "@types/commonmark": "^0.27.4", "@types/counterpart": "^0.18.1", + "@types/css-font-loading-module": "^0.0.6", "@types/diff-match-patch": "^1.0.32", "@types/flux": "^3.1.9", "@types/jest": "^26.0.20", diff --git a/src/@types/global.d.ts b/src/@types/global.d.ts index 759cc306f5..7192eb81cc 100644 --- a/src/@types/global.d.ts +++ b/src/@types/global.d.ts @@ -15,6 +15,8 @@ limitations under the License. */ import "matrix-js-sdk/src/@types/global"; // load matrix-js-sdk's type extensions first +// Load types for the WG CSS Font Loading APIs https://github.com/Microsoft/TypeScript/issues/13569 +import "@types/css-font-loading-module"; import "@types/modernizr"; import ContentMessages from "../ContentMessages"; diff --git a/src/utils/FontManager.js b/src/utils/FontManager.ts similarity index 95% rename from src/utils/FontManager.js rename to src/utils/FontManager.ts index accb8f4280..deb0c1810c 100644 --- a/src/utils/FontManager.js +++ b/src/utils/FontManager.ts @@ -1,5 +1,5 @@ /* -Copyright 2019 The Matrix.org Foundation C.I.C. +Copyright 2019 - 2021 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -21,7 +21,7 @@ limitations under the License. * MIT license */ -function safariVersionCheck(ua) { +function safariVersionCheck(ua: string): boolean { console.log("Browser is Safari - checking version for COLR support"); try { const safariVersionMatch = ua.match(/Mac OS X ([\d|_]+).*Version\/([\d|.]+).*Safari/); @@ -44,7 +44,7 @@ function safariVersionCheck(ua) { return false; } -async function isColrFontSupported() { +async function isColrFontSupported(): Promise { console.log("Checking for COLR support"); const { userAgent } = navigator; @@ -101,7 +101,7 @@ async function isColrFontSupported() { } let colrFontCheckStarted = false; -export async function fixupColorFonts() { +export async function fixupColorFonts(): Promise { if (colrFontCheckStarted) { return; } @@ -112,14 +112,14 @@ export async function fixupColorFonts() { document.fonts.add(new FontFace("Twemoji", path, {})); // For at least Chrome on Windows 10, we have to explictly add extra // weights for the emoji to appear in bold messages, etc. - document.fonts.add(new FontFace("Twemoji", path, { weight: 600 })); - document.fonts.add(new FontFace("Twemoji", path, { weight: 700 })); + document.fonts.add(new FontFace("Twemoji", path, { weight: "600" })); + document.fonts.add(new FontFace("Twemoji", path, { weight: "700" })); } else { // fall back to SBIX, generated via https://github.com/matrix-org/twemoji-colr/tree/matthew/sbix const path = `url('${require("../../res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2")}')`; document.fonts.add(new FontFace("Twemoji", path, {})); - document.fonts.add(new FontFace("Twemoji", path, { weight: 600 })); - document.fonts.add(new FontFace("Twemoji", path, { weight: 700 })); + document.fonts.add(new FontFace("Twemoji", path, { weight: "600" })); + document.fonts.add(new FontFace("Twemoji", path, { weight: "700" })); } // ...and if SBIX is not supported, the browser will fall back to one of the native fonts specified. } diff --git a/yarn.lock b/yarn.lock index 90f415673d..96c02681fd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1488,6 +1488,11 @@ resolved "https://registry.yarnpkg.com/@types/counterpart/-/counterpart-0.18.1.tgz#b1b784d9e54d9879f0a8cb12f2caedab65430fe8" integrity sha512-PRuFlBBkvdDOtxlIASzTmkEFar+S66Ek48NVVTWMUjtJAdn5vyMSN8y6IZIoIymGpR36q2nZbIYazBWyFxL+IQ== +"@types/css-font-loading-module@^0.0.6": + version "0.0.6" + resolved "https://registry.yarnpkg.com/@types/css-font-loading-module/-/css-font-loading-module-0.0.6.tgz#1ac3417ed31eeb953134d29b56bca921644b87c0" + integrity sha512-MBvSMSxXFtIukyXRU3HhzL369rIWaqMVQD5kmDCYIFFD6Fe3lJ4c9UnLD02MLdTp7Z6ti7rO3SQtuDo7C80mmw== + "@types/diff-match-patch@^1.0.32": version "1.0.32" resolved "https://registry.yarnpkg.com/@types/diff-match-patch/-/diff-match-patch-1.0.32.tgz#d9c3b8c914aa8229485351db4865328337a3d09f"