fixup! Pop open a message when user deletes an annotation

Fix l10n
mozilla · Oct 18, 2024 · 51d6d9e · 51d6d9e
1 parent b881a4c
commit 51d6d9e
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 17 deletions.
diff --git a/l10n/en-US/viewer.ftl b/l10n/en-US/viewer.ftl
@@ -494,9 +494,16 @@ pdfjs-editor-alt-text-settings-show-dialog-button-label = Show alt text editor r
 pdfjs-editor-alt-text-settings-show-dialog-description = Helps you make sure all your images have alt text.
 pdfjs-editor-alt-text-settings-close-button = Close
 
+## "Annotations removed" bar
+
+pdfjs-editor-undo-bar-message-highlight = Highlight removed
+pdfjs-editor-undo-bar-message-freetext = Text removed
+pdfjs-editor-undo-bar-message-ink = Drawing removed
+pdfjs-editor-undo-bar-message-stamp = Image removed
 # Variables:
-#   $type (String) - the type of annotation that was just removed with an optional quantity.
-pdfjs-editor-undo-bar-message = { $type } removed
+#   $count (Number) - the number of removed annotations.
+pdfjs-editor-undo-bar-message-multiple = { $count } annotations removed
+
 pdfjs-editor-undo-bar-undo-button =
     .title = Undo
 pdfjs-editor-undo-bar-undo-button-label = Undo

diff --git a/src/display/editor/tools.js b/src/display/editor/tools.js
@@ -2008,9 +2008,7 @@ class AnnotationEditorUIManager {
     const cmd = () => {
       this.#editorUndoBar?.show(
         undo,
-        editors.length > 1
-          ? `${editors.length} annotations`
-          : editors[0].editorType
+        editors.length === 1 ? editors[0].editorType : editors.length
       );
       for (const editor of editors) {
         editor.remove();

diff --git a/web/app.js b/web/app.js
@@ -452,9 +452,16 @@ const PDFViewerApplication = {
           )
         : null;
     }
-    const editorUndoBar = (this.editorUndoBar = appConfig.editorUndoBar
-      ? new EditorUndoBar(appConfig.editorUndoBar, eventBus)
-      : null);
+
+    let editorUndoBar = null;
+    if (appConfig.editorUndoBar) {
+      editorUndoBar = new EditorUndoBar(
+        appConfig.editorUndoBar,
+        eventBus,
+        l10n
+      );
+    }
+    this.editorUndoBar = editorUndoBar;
 
     const enableHWA = AppOptions.get("enableHWA");
     const pdfViewer = new PDFViewer({

diff --git a/web/editor_undo_bar.js b/web/editor_undo_bar.js
@@ -20,14 +20,25 @@ class EditorUndoBar {
 
   isOpen = false;
 
+  #l10n;
+
   #message;
 
   #undoButton;
 
-  constructor({ container, message, undoButton, closeButton }, eventBus) {
+  static #l10nMessages = Object.freeze({
+    highlight: "pdfjs-editor-undo-bar-message-highlight",
+    freetext: "pdfjs-editor-undo-bar-message-freetext",
+    stamp: "pdfjs-editor-undo-bar-message-stamp",
+    ink: "pdfjs-editor-undo-bar-message-ink",
+    __multiple: "pdfjs-editor-undo-bar-message-multiple",
+  });
+
+  constructor({ container, message, undoButton, closeButton }, eventBus, l10n) {
     this.#container = container;
     this.#message = message;
     this.#undoButton = undoButton;
+    this.#l10n = l10n;
 
     // Caveat: we have to pick between registering these everytime the bar is
     // shown and not having the ability to cleanup using AbortController.
@@ -37,22 +48,26 @@ class EditorUndoBar {
     eventBus._on("download", boundHide);
   }
 
-  show(action, type) {
+  async show(undoAction, messageData) {
     this.hide();
-    this.#message.setAttribute("data-l10n-args", JSON.stringify({ type }));
-    this.#container.hidden = false;
     this.isOpen = true;
-
     this.#controller = new AbortController();
-    const opts = { signal: this.#controller.signal };
+
+    this.#message.textContent =
+      typeof messageData === "string"
+        ? await this.#l10n.get(EditorUndoBar.#l10nMessages[messageData])
+        : await this.#l10n.get(EditorUndoBar.#l10nMessages.__multiple, {
+            count: messageData,
+          });
+    this.#container.hidden = false;
 
     this.#undoButton.addEventListener(
       "click",
       () => {
-        action();
+        undoAction();
         this.hide();
       },
-      opts
+      { signal: this.#controller.signal }
     );
     this.#undoButton.focus();
   }

diff --git a/web/viewer.html b/web/viewer.html
@@ -689,7 +689,7 @@
       <div id="editorUndoBar" class="messageBar" hidden>
         <div>
           <div>
-            <span id="editorUndoBarMessage" class="description" data-l10n-id="pdfjs-editor-undo-bar-message" data-l10n-args='{ "type": "Annotation" }'>[Annotation] removed</span>
+            <span id="editorUndoBarMessage" class="description"></span>
           </div>
           <button id="editorUndoBarUndoButton" class="undoButton" type="button" tabindex="0" title="Undo" data-l10n-id="pdfjs-editor-undo-bar-undo-button">
             <span data-l10n-id="pdfjs-editor-undo-bar-undo-button-label">Undo</span>