Simplify the l10n-handling in the mobile-viewer example

- Remove the `errorWrapper`-element, since it simplifies the example and is consistent with the default viewer; see PR 15533.

 - Simplify the l10n-handling, since the `NullL10n` should be able to translate everything e.g. without fallback values; see PR 17146.

examples/mobile-viewer/viewer.css

@@ -240,31 +240,3 @@ canvas {
   background-repeat: no-repeat;
   animation: progressIndeterminate 2s linear infinite;
 }
-
-#errorWrapper {
-  background: none repeat scroll 0 0 rgb(255 85 85 / 1);
-  color: rgb(255 255 255 / 1);
-  left: 0;
-  position: absolute;
-  right: 0;
-  top: 3.2rem;
-  z-index: 1000;
-  padding: 0.3rem;
-  font-size: 0.8em;
-}
-
-#errorMessageLeft {
-  float: left;
-}
-
-#errorMessageRight {
-  float: right;
-}
-
-#errorMoreInfo {
-  background-color: rgb(255 255 255 / 1);
-  color: rgb(0 0 0 / 1);
-  padding: 0.3rem;
-  margin: 0.3rem;
-  width: 98%;
-}

examples/mobile-viewer/viewer.html

@@ -42,25 +42,6 @@ limitations under the License.
       <div class="glimmer"></div>
     </div>
 
-    <div id="errorWrapper" hidden="true">
-      <div id="errorMessageLeft">
-        <span id="errorMessage"></span>
-        <button id="errorShowMore">
-          More Information
-        </button>
-        <button id="errorShowLess">
-          Less Information
-        </button>
-      </div>
-      <div id="errorMessageRight">
-        <button id="errorClose">
-          Close
-        </button>
-      </div>
-      <div class="clearBoth"></div>
-      <textarea id="errorMoreInfo" hidden="true" readonly="readonly"></textarea>
-    </div>
-
     <footer>
       <button class="toolbarButton pageUp" title="Previous Page" id="previous"></button>
       <button class="toolbarButton pageDown" title="Next Page" id="next"></button>

examples/mobile-viewer/viewer.mjs

@@ -87,41 +87,17 @@ const PDFViewerApplication = {
         self.loadingBar.hide();
         self.setTitleUsingMetadata(pdfDocument);
       },
-      function (exception) {
+      function (reason) {
-        const message = exception && exception.message;
+        let key = "pdfjs-loading-error";
-        const l10n = self.l10n;
+        if (reason instanceof pdfjsLib.InvalidPDFException) {
-        let loadingErrorMessage;
+          key = "pdfjs-invalid-file-error";
-
+        } else if (reason instanceof pdfjsLib.MissingPDFException) {
-        if (exception instanceof pdfjsLib.InvalidPDFException) {
+          key = "pdfjs-missing-file-error";
-          // change error message also for other builds
+        } else if (reason instanceof pdfjsLib.UnexpectedResponseException) {
-          loadingErrorMessage = l10n.get(
+          key = "pdfjs-unexpected-response-error";
-            "pdfjs-invalid-file-error",
-            null,
-            "Invalid or corrupted PDF file."
-          );
-        } else if (exception instanceof pdfjsLib.MissingPDFException) {
-          // special message for missing PDFs
-          loadingErrorMessage = l10n.get(
-            "pdfjs-missing-file-error",
-            null,
-            "Missing PDF file."
-          );
-        } else if (exception instanceof pdfjsLib.UnexpectedResponseException) {
-          loadingErrorMessage = l10n.get(
-            "pdfjs-unexpected-response-error",
-            null,
-            "Unexpected server response."
-          );
-        } else {
-          loadingErrorMessage = l10n.get(
-            "pdfjs-loading-error",
-            null,
-            "An error occurred while loading the PDF."
-          );
         }
-
+        self.l10n.get(key).then(msg => {
-        loadingErrorMessage.then(function (msg) {
+          self.error(msg, { message: reason?.message });
-          self.error(msg, { message });
         });
         self.loadingBar.hide();
       }
@@ -134,9 +110,6 @@ const PDFViewerApplication = {
    *                      destruction is completed.
    */
   close() {
-    const errorWrapper = document.getElementById("errorWrapper");
-    errorWrapper.hidden = true;
-
     if (!this.pdfLoadingTask) {
       return Promise.resolve();
     }
@@ -229,83 +202,25 @@ const PDFViewerApplication = {
   },
 
   error: function pdfViewError(message, moreInfo) {
-    const l10n = this.l10n;
     const moreInfoText = [
-      l10n.get(
+      `PDF.js v${pdfjsLib.version || "?"} (build: ${pdfjsLib.build || "?"})`,
-        "pdfjs-error-version-info",
-        { version: pdfjsLib.version || "?", build: pdfjsLib.build || "?" },
-        "PDF.js v{ $version } (build: { $build })"
-      ),
     ];
-
     if (moreInfo) {
-      moreInfoText.push(
+      moreInfoText.push(`Message: ${moreInfo.message}`);
-        l10n.get(
+
-          "pdfjs-error-message",
-          { message: moreInfo.message },
-          "Message: { $message }"
-        )
-      );
       if (moreInfo.stack) {
-        moreInfoText.push(
+        moreInfoText.push(`Stack: ${moreInfo.stack}`);
-          l10n.get(
-            "pdfjs-error-stack",
-            { stack: moreInfo.stack },
-            "Stack: { $stack }"
-          )
-        );
       } else {
         if (moreInfo.filename) {
-          moreInfoText.push(
+          moreInfoText.push(`File: ${moreInfo.filename}`);
-            l10n.get(
-              "pdfjs-error-file",
-              { file: moreInfo.filename },
-              "File: { $file }"
-            )
-          );
         }
         if (moreInfo.lineNumber) {
-          moreInfoText.push(
+          moreInfoText.push(`Line: ${moreInfo.lineNumber}`);
-            l10n.get(
-              "pdfjs-error-line",
-              { line: moreInfo.lineNumber },
-              "Line: { $line }"
-            )
-          );
         }
       }
     }
 
-    const errorWrapper = document.getElementById("errorWrapper");
+    console.error(`${message}\n\n${moreInfoText.join("\n")}`);
-    errorWrapper.hidden = false;
-
-    const errorMessage = document.getElementById("errorMessage");
-    errorMessage.textContent = message;
-
-    const closeButton = document.getElementById("errorClose");
-    closeButton.onclick = function () {
-      errorWrapper.hidden = true;
-    };
-
-    const errorMoreInfo = document.getElementById("errorMoreInfo");
-    const moreInfoButton = document.getElementById("errorShowMore");
-    const lessInfoButton = document.getElementById("errorShowLess");
-    moreInfoButton.onclick = function () {
-      errorMoreInfo.hidden = false;
-      moreInfoButton.hidden = true;
-      lessInfoButton.hidden = false;
-      errorMoreInfo.style.height = errorMoreInfo.scrollHeight + "px";
-    };
-    lessInfoButton.onclick = function () {
-      errorMoreInfo.hidden = true;
-      moreInfoButton.hidden = false;
-      lessInfoButton.hidden = true;
-    };
-    moreInfoButton.hidden = false;
-    lessInfoButton.hidden = true;
-    Promise.all(moreInfoText).then(function (parts) {
-      errorMoreInfo.value = parts.join("\n");
-    });
   },
 
   progress: function pdfViewProgress(level) {