Merge pull request #847 from brendandahl/errorhandling

Improved error handling

src/core.js

@@ -39,11 +39,15 @@ function getPdf(arg, callback) {
   if ('error' in params)
     xhr.onerror = params.error || undefined;
 
-  xhr.onreadystatechange = function getPdfOnreadystatechange() {
-    if (xhr.readyState === 4 && xhr.status === xhr.expected) {
-      var data = (xhr.mozResponseArrayBuffer || xhr.mozResponse ||
-                  xhr.responseArrayBuffer || xhr.response);
-      callback(data);
+  xhr.onreadystatechange = function getPdfOnreadystatechange(e) {
+    if (xhr.readyState === 4) {
+      if (xhr.status === xhr.expected) {
+        var data = (xhr.mozResponseArrayBuffer || xhr.mozResponse ||
+                    xhr.responseArrayBuffer || xhr.response);
+        callback(data);
+      } else if (params.error) {
+        params.error(e);
+      }
     }
   };
   xhr.send(null);
@@ -63,6 +67,9 @@ var Page = (function pagePage() {
     };
     this.xref = xref;
     this.ref = ref;
+
+    this.ctx = null;
+    this.callback = null;
   }
 
   constructor.prototype = {
@@ -165,8 +172,10 @@ var Page = (function pagePage() {
           try {
             self.display(gfx, self.callback);
           } catch (e) {
-            if (self.callback) self.callback(e.toString());
-            throw e;
+            if (self.callback)
+              self.callback(e);
+            else
+              throw e;
           }
         });
       };
@@ -590,6 +599,14 @@ var PDFDoc = (function pdfDoc() {
         }
       }.bind(this));
 
+      messageHandler.on('page_error', function pdfDocError(data) {
+        var page = this.pageCache[data.pageNum];
+        if (page.callback)
+          page.callback(data.error);
+        else
+          throw data.error;
+      }, this);
+
       setTimeout(function pdfDocFontReadySetTimeout() {
         messageHandler.send('doc', this.data);
         this.workerReadyPromise.resolve(true);

src/worker.js

@@ -14,7 +14,6 @@ function MessageHandler(name, comObj) {
   ah['console_error'] = [function ahConsoleError(data) {
       console.error.apply(console, data);
   }];
-
   comObj.onmessage = function messageHandlerComObjOnMessage(event) {
     var data = event.data;
     if (data.action in ah) {
@@ -67,7 +66,6 @@ var WorkerMessageHandler = {
     handler.on('page_request', function wphSetupPageRequest(pageNum) {
       pageNum = parseInt(pageNum);
 
-      var page = pdfDoc.getPage(pageNum);
 
       // The following code does quite the same as
       // Page.prototype.startRendering, but stops at one point and sends the
@@ -77,9 +75,23 @@ var WorkerMessageHandler = {
       var start = Date.now();
 
       var dependency = [];
-
-      // Pre compile the pdf page and fetch the fonts/images.
-      var IRQueue = page.getIRQueue(handler, dependency);
+      var IRQueue = null;
+      try {
+        var page = pdfDoc.getPage(pageNum);
+        // Pre compile the pdf page and fetch the fonts/images.
+        IRQueue = page.getIRQueue(handler, dependency);
+      } catch (e) {
+        // Turn the error into an obj that can be serialized
+        e = {
+          message: e.message,
+          stack: e.stack
+        };
+        handler.send('page_error', {
+          pageNum: pageNum,
+          error: e
+        });
+        return;
+      }
 
       console.log('page=%d - getIRQueue: time=%dms, len=%d', pageNum,
                                   Date.now() - start, IRQueue.fnArray.length);

test/driver.js

@@ -162,9 +162,11 @@ function nextPage(task, loadError) {
 
       page.startRendering(
         ctx,
-        function nextPageStartRendering(e) {
-          snapshotCurrentPage(task, (!failure && e) ?
-            ('render : ' + e) : failure);
+        function nextPageStartRendering(error) {
+          var failureMessage = false;
+          if (error)
+            failureMessage = 'render : ' + error.message;
+          snapshotCurrentPage(task, failureMessage);
         }
       );
     } catch (e) {

web/viewer.css

@@ -273,6 +273,38 @@ canvas {
   display: none;
 }
 
+#errorWrapper {
+  background: none repeat scroll 0 0 #FF5555;
+  color: white;
+  left: 0;
+  position: fixed;
+  right: 0;
+  top: 30px;
+  z-index: 1000;
+  padding: 3px;
+  font-size: 0.8em;
+}
+
+#errorMessageLeft {
+  float: left;
+}
+
+#errorMessageRight {
+  float: right;
+}
+
+#errorMoreInfo {
+  background-color: #FFFFFF;
+  color: black;
+  padding: 3px;
+  margin: 3px;
+  white-space: pre;
+}
+
+.clearBoth {
+  clear: both;
+}
+
 /* === Printed media overrides === */
 @media print {
   #sidebar {

web/viewer.html

@@ -97,6 +97,24 @@
 
       <span id="info">--</span>
     </div>
+    <div id="errorWrapper" hidden='true'>
+      <div id="errorMessageLeft">
+        <span id="errorMessage"></span>
+        <button id="errorShowMore" onclick="" oncontextmenu="return false;">
+          More Information
+        </button>
+        <button id="errorShowLess" onclick="" oncontextmenu="return false;" hidden='true'>
+          Less Information
+        </button>
+      </div>
+      <div id="errorMessageRight">
+        <button id="errorClose" oncontextmenu="return false;">
+          Close
+        </button>
+      </div>
+      <div class="clearBoth"></div>
+      <div id="errorMoreInfo" hidden='true'></div>
+    </div>
 
     <div id="sidebar">
       <div id="sidebarBox">

web/viewer.js

@@ -129,7 +129,14 @@ var PDFView = {
           if (evt.lengthComputable)
             self.progress(evt.loaded / evt.total);
         },
-        error: self.error
+        error: function getPdfError(e) {
+          var loadingIndicator = document.getElementById('loading');
+          loadingIndicator.innerHTML = 'Error';
+          var moreInfo = {
+            message: 'Unexpected server response of ' + e.target.status + '.'
+          };
+          self.error('An error occurred while loading the PDF.', moreInfo);
+        }
       },
       function getPdfLoad(data) {
         self.loading = true;
@@ -181,9 +188,47 @@ var PDFView = {
     return '';
   },
 
-  error: function pdfViewError() {
-    var loadingIndicator = document.getElementById('loading');
-    loadingIndicator.innerHTML = 'Error';
+  /**
+   * Show the error box.
+   * @param {String} message A message that is human readable.
+   * @param {Object} moreInfo (optional) Further information about the error
+   *                            that is more technical.  Should have a 'message'
+   *                            and optionally a 'stack' property.
+   */
+  error: function pdfViewError(message, moreInfo) {
+    var errorWrapper = document.getElementById('errorWrapper');
+    errorWrapper.removeAttribute('hidden');
+
+    var errorMessage = document.getElementById('errorMessage');
+    errorMessage.innerHTML = message;
+
+    var closeButton = document.getElementById('errorClose');
+    closeButton.onclick = function() {
+      errorWrapper.setAttribute('hidden', 'true');
+    };
+
+    var errorMoreInfo = document.getElementById('errorMoreInfo');
+    var moreInfoButton = document.getElementById('errorShowMore');
+    var lessInfoButton = document.getElementById('errorShowLess');
+    moreInfoButton.onclick = function() {
+      errorMoreInfo.removeAttribute('hidden');
+      moreInfoButton.setAttribute('hidden', 'true');
+      lessInfoButton.removeAttribute('hidden');
+    };
+    lessInfoButton.onclick = function() {
+      errorMoreInfo.setAttribute('hidden', 'true');
+      moreInfoButton.removeAttribute('hidden');
+      lessInfoButton.setAttribute('hidden', 'true');
+    };
+    moreInfoButton.removeAttribute('hidden');
+    lessInfoButton.setAttribute('hidden', 'true');
+    errorMoreInfo.innerHTML = 'PDF.JS Build: ' + PDFJS.build + '\n';
+
+    if (moreInfo) {
+      errorMoreInfo.innerHTML += 'Message: ' + moreInfo.message;
+      if (moreInfo.stack)
+        errorMoreInfo.innerHTML += '\n' + 'Stack: ' + moreInfo.stack;
+    }
   },
 
   progress: function pdfViewProgress(level) {
@@ -200,6 +245,9 @@ var PDFView = {
       };
     }
 
+    var errorWrapper = document.getElementById('errorWrapper');
+    errorWrapper.setAttribute('hidden', 'true');
+
     var loadingIndicator = document.getElementById('loading');
     loadingIndicator.setAttribute('hidden', 'true');
 
@@ -216,7 +264,12 @@ var PDFView = {
     while (container.hasChildNodes())
       container.removeChild(container.lastChild);
 
-    var pdf = new PDFJS.PDFDoc(data);
+    var pdf;
+    try {
+      pdf = new PDFJS.PDFDoc(data);
+    } catch (e) {
+      this.error('An error occurred while reading the PDF.', e);
+    }
     var pagesCount = pdf.numPages;
     document.getElementById('numPages').innerHTML = pagesCount;
     document.getElementById('pageNumber').max = pagesCount;
@@ -505,11 +558,15 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
     ctx.translate(-this.x * scale, -this.y * scale);
 
     stats.begin = Date.now();
-    this.content.startRendering(ctx, (function pageViewDrawCallback() {
-      this.updateStats();
-      if (this.onAfterDraw)
-        this.onAfterDraw();
-    }).bind(this), textLayer);
+    this.content.startRendering(ctx,
+      (function pageViewDrawCallback(error) {
+        if (error)
+          PDFView.error('An error occurred while rendering the page.', error);
+        this.updateStats();
+        if (this.onAfterDraw)
+          this.onAfterDraw();
+      }).bind(this), textLayer
+    );
 
     setupLinks(this.content, this.scale);
     div.setAttribute('data-loaded', true);