Merge pull request #1764 from googlefonts/issue-1752-missing-translat…

…ion-keys

Add missing translation keys

src/fontra/client/core/glyph-controller.js

@@ -224,7 +224,7 @@ export class VariableGlyphController {
     }
     return locationStrings.map((s) =>
       bag[s]?.length > 1
-        ? `location is not unique in sources ${bag[s]
+        ? `location is not unique in sources ${bag[s] // TODO: translation
             .map((i) => this.sources[i].name)
             .join(", ")}`
         : null

src/fontra/client/core/localization.js

@@ -4,6 +4,7 @@ import { ObservableController } from "./observable-object.js";
 export const languages = [
   { code: "en", langEn: "English", langLang: "English", status: "done" },
   { code: "zh-CN", langEn: "Simplified Chinese", langLang: "简体中文", status: "beta" },
+  { code: "ja", langEn: "Japanese", langLang: "日本語", status: "wip" },
   { code: "fr", langEn: "French", langLang: "Français", status: "beta" },
   { code: "de", langEn: "German", langLang: "Deutsch", status: "wip" },
   { code: "nl", langEn: "Dutch", langLang: "Nederlands", status: "beta" },

src/fontra/client/web-components/modal-dialog.js

@@ -1,5 +1,6 @@
 import * as html from "/core/html-utils.js";
 import { SimpleElement } from "/core/html-utils.js";
+import { translate } from "/core/localization.js";
 import { enumerate } from "/core/utils.js";
 
 export async function dialog(headline, message, buttonDefs, autoDismissTimeout) {
@@ -24,7 +25,9 @@ export async function dialogSetup(headline, message, buttonDefs, autoDismissTime
 }
 
 export function message(headline, message) {
-  return dialog(headline, message, [{ title: "Okay", isDefaultButton: true }]);
+  return dialog(headline, message, [
+    { title: translate("dialog.okay"), isDefaultButton: true },
+  ]);
 }
 
 export class ModalDialog extends SimpleElement {

src/fontra/client/web-components/plugin-manager.js

@@ -1,5 +1,6 @@
 import * as html from "../core/html-utils.js";
 import { SimpleElement, createDomElement } from "../core/html-utils.js";
+import { translate } from "../core/localization.js";
 import { ObservableController } from "../core/observable-object.js";
 import "/web-components/add-remove-buttons.js";
 import { dialogSetup, message } from "/web-components/modal-dialog.js";
@@ -50,18 +51,30 @@ export class PluginManager extends SimpleElement {
   }
 
   async promptAddPlugin(text = "") {
-    const newPluginPrompt = await dialogSetup("Add plugin", "", [
-      { title: "Cancel", resultValue: "no", isCancelButton: true },
-      { title: "Create", resultValue: "ok", isDefaultButton: true, disabled: true },
-    ]);
+    const newPluginPrompt = await dialogSetup(
+      translate("plugin-manager.add-plugin-dialog.title"),
+      "",
+      [
+        { title: translate("dialog.cancel"), resultValue: "no", isCancelButton: true },
+        {
+          title: translate("dialog.create"),
+          resultValue: "ok",
+          isDefaultButton: true,
+          disabled: true,
+        },
+      ]
+    );
     let address = text;
     const pluginContent = html.div(
       {
         style:
           "display: grid; grid-template-columns: auto 1fr; grid-gap: 1rem; align-items: center;",
       },
       [
-        html.label({ for: `plugin-path` }, "Plugin path:"),
+        html.label(
+          { for: `plugin-path` },
+          translate("plugin-manager.add-plugin-dialog.label.path")
+        ),
         html.input({
           id: "plugin-path",
           autofocus: true,
@@ -95,7 +108,10 @@ export class PluginManager extends SimpleElement {
         ]);
         this.renderPlugins();
       } else {
-        await message("Error", errorMessage);
+        await message(
+          translate("plugin-manager.add-plugin-dialog.warning.title"),
+          errorMessage
+        );
         return this.promptAddPlugin(address);
       }
     }
@@ -107,16 +123,16 @@ export class PluginManager extends SimpleElement {
         ({ address }) => parsePluginBasePath(address) === pluginPath
       )
     ) {
-      return [false, "Plugin exists."];
+      return [false, translate("plugin-manager.warning.plugin-exists")];
     }
     let response;
     try {
       response = await fetch(`${pluginPath}/plugin.json`);
     } catch (e) {
-      return [false, "An error occured when fetching the plugin."];
+      return [false, translate("plugin-manager.warning.fetching-error")];
     }
     if (response.status === 404) {
-      return [false, "Plugin not found."];
+      return [false, translate("plugin-manager.warning.not-found")];
     }
     return [true];
   }
@@ -128,7 +144,7 @@ export class PluginManager extends SimpleElement {
 
   render() {
     const fragment = document.createDocumentFragment();
-    fragment.appendChild(html.div({}, ["Fontra plugins:"]));
+    fragment.appendChild(html.div({}, [translate("plugin-manager.title")]));
     fragment.appendChild(this.pluginList);
     fragment.appendChild(
       (this.addRemoveButton = createDomElement("add-remove-buttons", {

src/fontra/views/applicationsettings/panel-shortcuts.js

@@ -73,7 +73,7 @@ export class ShortCutsPanel extends BaseInfoPanel {
       html.input({
         type: "button",
         style: `justify-self: start;`,
-        value: "Reset all shortcuts",
+        value: translate("shortcuts.reset-all"),
         onclick: (event) => this.resetToDefault(),
       })
     );
@@ -82,7 +82,7 @@ export class ShortCutsPanel extends BaseInfoPanel {
       html.input({
         type: "button",
         style: `justify-self: start;`,
-        value: "Export shortcuts",
+        value: translate("shortcuts.export"),
         onclick: (event) => this.exportShortCuts(),
       })
     );
@@ -91,7 +91,7 @@ export class ShortCutsPanel extends BaseInfoPanel {
       html.input({
         type: "button",
         style: `justify-self: start;`,
-        value: "Import shortcuts",
+        value: translate("shortcuts.import"),
         onclick: (event) => this.importShortCuts(),
       })
     );
@@ -115,11 +115,11 @@ export class ShortCutsPanel extends BaseInfoPanel {
 
   async resetToDefault() {
     const result = await dialog(
-      "Reset to default",
-      "Are you sure you want to reset all shortcuts to their default settings?",
+      translate("shortcuts.dialog.reset-all.title"),
+      translate("shortcuts.dialog.reset-all.content"),
       [
         { title: translate("dialog.cancel"), isCancelButton: true },
-        { title: "Okay", isDefaultButton: true },
+        { title: translate("dialog.okay"), isDefaultButton: true },
       ]
     );
     if (!result) {
@@ -206,7 +206,12 @@ function validateShortCutDefinition(key, definition) {
     }
     for (const otherDefinition of getShortCuts(otherKey)) {
       if (isShortCutDefinitionEqual(otherDefinition, definition)) {
-        warnings.push(`⚠️ ShortCut exists for "${getActionTitle(otherKey)}"`);
+        warnings.push(
+          `⚠️ ${translate(
+            "application-settings.shortcuts.warning.exists",
+            getActionTitle(otherKey)
+          )}`
+        );
         break;
       }
     }
@@ -305,12 +310,7 @@ class ShortCutElement extends HTMLElement {
       }
     }
     if (warnings.length > 0) {
-      message(
-        `Duplicate ShortCut "${getShortCutRepresentation(
-          newShortCutDefinitions[0]
-        )}" for "${this.shortCutLabel}":`,
-        warnings.join("\n")
-      );
+      message(translate("shortcuts.dialog.warning.title"), warnings.join("\n"));
       return false;
     }
     setCustomShortCuts(this.actionIdentifier, newShortCutDefinitions);
@@ -428,7 +428,9 @@ class ShortCutElement extends HTMLElement {
         "onkeydown": (event) => this.recordShortCut(id, event),
         "onkeyup": (event) => this.recordShortCutKeyUp(id, event),
         "onblur": (event) => this.handleOnBlur(id),
-        "data-tooltip": "Click and record a shortcut",
+        "data-tooltip": translate(
+          "application-settings.shortcuts.tooltip.click-and-record"
+        ),
         "data-tooltipposition": "top",
       })
     );
@@ -442,7 +444,9 @@ class ShortCutElement extends HTMLElement {
         "class": "fontra-ui-shortcuts-panel-icon",
         "src": "/tabler-icons/refresh.svg",
         "onclick": (event) => this.resetShortCut(id),
-        "data-tooltip": "Reset to default",
+        "data-tooltip": translate(
+          "application-settings.shortcuts.tooltip.reset-to-default"
+        ),
         "data-tooltipposition": "top",
       })
     );
@@ -452,7 +456,7 @@ class ShortCutElement extends HTMLElement {
         "class": "fontra-ui-shortcuts-panel-icon",
         "src": "/tabler-icons/x.svg",
         "onclick": (event) => this.deleteShortCut(id),
-        "data-tooltip": "Clear",
+        "data-tooltip": translate("shortcuts.tooltip.clear"),
         "data-tooltipposition": "top",
       })
     );

src/fontra/views/editor/edit-tools-knife.js

@@ -91,7 +91,7 @@ export class KnifeTool extends BaseTool {
         for (const [layerName, layerPath] of Object.entries(layerPaths)) {
           glyph.layers[layerName].glyph.path = layerPath;
         }
-        return "slice glyph";
+        return translate("edit-tools-knife.undo.slice-glyph");
       },
       undefined,
       true

src/fontra/views/editor/edit-tools-pen.js

@@ -1,5 +1,6 @@
 import { recordChanges } from "../core/change-recorder.js";
 import { ChangeCollector, applyChange, consolidateChanges } from "../core/changes.js";
+import { translate } from "../core/localization.js";
 import { insertHandles, insertPoint, scalePoint } from "../core/path-functions.js";
 import { isEqualSet } from "../core/set-ops.js";
 import { modulo, parseSelection } from "../core/utils.js";
@@ -169,7 +170,7 @@ export class PenToolCubic extends BaseTool {
       }
       delete this.sceneModel.pathConnectTargetPoint;
       this.sceneController.selection = selection;
-      return "Insert Point";
+      return translate("edit-tools-pen.undo.insert-point");
     });
   }
 
@@ -189,7 +190,7 @@ export class PenToolCubic extends BaseTool {
       }
       delete this.sceneModel.pathInsertHandles;
       this.sceneController.selection = selection;
-      return "Insert Handles";
+      return translate("edit-tools-pen.undo.insert-handles");
     });
   }
 
@@ -354,7 +355,7 @@ function getPenToolBehavior(sceneController, initialEvent, path, curveType) {
 }
 
 class PenToolBehavior {
-  undoLabel = "add point(s)";
+  undoLabel = translate("edit-tools-pen.undo.add-points");
 
   constructor(getPointFromEvent, appendInfo, behaviorFuncs, curveType) {
     this.getPointFromEvent = getPointFromEvent;

src/fontra/views/editor/edit-tools-pointer.js

@@ -28,6 +28,7 @@ import {
   strokeRoundNode,
   strokeSquareNode,
 } from "./visualization-layer-definitions.js";
+import { translate } from "/core/localization.js";
 import { copyComponent } from "/core/var-glyph.js";
 
 const transformHandleMargin = 6;
@@ -283,7 +284,7 @@ export class PointerTool extends BaseTool {
       for (const layerGlyph of Object.values(layerGlyphs)) {
         newPointType = toggleSmooth(layerGlyph.path, pointIndices, newPointType);
       }
-      return "Toggle Smooth";
+      return translate("edit-tools-pointer.undo.toggle-smooth");
     });
   }
 
@@ -419,7 +420,9 @@ export class PointerTool extends BaseTool {
         }
       }
       return {
-        undoLabel: "drag selection" + (shouldConnect ? " and connect contours" : ""),
+        undoLabel: shouldConnect
+          ? translate("edit-tools-pointer.undo.drag-selection-and-connect-contours")
+          : translate("edit-tools-pointer.undo.drag-selection"),
         changes: changes,
         broadcast: true,
       };
@@ -590,7 +593,9 @@ export class PointerTool extends BaseTool {
       );
 
       return {
-        undoLabel: `${rotation ? "rotate" : "resize"} selection`,
+        undoLabel: rotation
+          ? translate("edit-tools-pointer.undo.rotate-selection")
+          : translate("edit-tools-pointer.undo.resize-selection"),
         changes: changes,
         broadcast: true,
       };
@@ -702,7 +707,7 @@ function getSelectModeFunction(event) {
 
 registerVisualizationLayerDefinition({
   identifier: "fontra.transform.selection",
-  name: "Transform selection",
+  name: "edit-tools-pointer.transform.selection",
   selectionMode: "editing",
   userSwitchable: true,
   defaultOn: true,