server pdf stability improvements

2 files changed, 27 insertions, 19 deletions

diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 41825cda7..450add208 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -136,16 +136,18 @@ export class PDFViewer extends DocAnnotatableComponent<IViewerProps, PdfDocument
         if (matches !== null) {
             const properPath = Utils.prepend(`/files/pdfs/${matches[0]}`);
             console.log(properPath);
-            console.log(`The two (url and proper path) ${url === properPath ? "were" : "were not equal"}`);
             if (!properPath.includes(url)) {
+                console.log(`The two (url and proper path) were not equal`);
                 const proto = Doc.GetProto(Document);
                 proto[this.props.fieldKey] = new PdfField(properPath);
                 proto[backup] = url;
+            } else {
+                console.log(`The two (url and proper path) were equal`);
             }
         } else {
             console.log("Outer matches was null!");
         }
-        const path = Utils.prepend(`/files/pdf_thumbnails${this.props.url.substring("files/pdfs/".length, this.props.url.length - ".pdf".length)}-${(this.Document.curPage || 1)}.png`);
+        const path = Utils.prepend(`/thumbnail${this.props.url.substring("files/pdfs/".length, this.props.url.length - ".pdf".length)}-${(this.Document.curPage || 1)}.png`);
         this._coverPath = JSON.parse(await rp.get(path));
         runInAction(() => this._showWaiting = this._showCover = true);
         this.props.startupLive && this.setupPdfJsViewer();
@@ -623,7 +625,8 @@ export class PDFViewer extends DocAnnotatableComponent<IViewerProps, PdfDocument
         }
         const nativeWidth = (this.Document.nativeWidth || 0);
         const nativeHeight = (this.Document.nativeHeight || 0);
-        return <img key={this._coverPath.path} src={this._coverPath.path} onError={action(() => this._coverPath.path = "http://www.cs.brown.edu/~bcz/face.gif")} onLoad={action(() => this._showWaiting = false)}
+        const resolved = Utils.prepend(this._coverPath.path);
+        return <img key={resolved} src={resolved} onError={action(() => this._coverPath.path = "http://www.cs.brown.edu/~bcz/face.gif")} onLoad={action(() => this._showWaiting = false)}
             style={{ position: "absolute", display: "inline-block", top: 0, left: 0, width: `${nativeWidth}px`, height: `${nativeHeight}px` }} />;
     }
 
diff --git a/src/server/ApiManagers/PDFManager.ts b/src/server/ApiManagers/PDFManager.ts
index a190ab0cb..30fadfebd 100644
--- a/src/server/ApiManagers/PDFManager.ts
+++ b/src/server/ApiManagers/PDFManager.ts
@@ -24,6 +24,14 @@ export default class PDFManager extends ApiManager {
 
 }
 
+function dispatchThumbnail(res: express.Response, { width, height }: Pdfjs.PDFPageViewport, thumbnailName: string) {
+    res.send({
+        path: clientPathToFile(Directory.pdf_thumbnails, thumbnailName),
+        width,
+        height
+    });
+}
+
 function getOrCreateThumbnail(thumbnailName: string, res: express.Response) {
     const noExtension = thumbnailName.substring(0, thumbnailName.length - ".png".length);
     const pageString = noExtension.split('-')[1];
@@ -33,17 +41,13 @@ function getOrCreateThumbnail(thumbnailName: string, res: express.Response) {
         exists(path, (exists: boolean) => {
             if (exists) {
                 const existingThumbnail = createReadStream(path);
-                imageSize(existingThumbnail, (err: any, { width, height }: any) => {
+                imageSize(existingThumbnail, (err: any, viewport: any) => {
                     if (err) {
                         console.log(red(`In PDF thumbnail response, unable to determine dimensions of ${thumbnailName}:`));
                         console.log(err);
                         return;
                     }
-                    res.send({
-                        path: clientPathToFile(Directory.pdf_thumbnails, thumbnailName),
-                        width,
-                        height
-                    });
+                    dispatchThumbnail(res, viewport, thumbnailName);
                 });
             } else {
                 const offset = thumbnailName.length - pageString.length - 5;
@@ -70,19 +74,20 @@ async function CreateThumbnail(file: string, pageNumber: number, res: express.Re
     await page.render(renderContext).promise;
     const pngStream = canvas.createPNGStream();
     const filenames = path.basename(file).split(".");
-    const pngFile = serverPathToFile(Directory.pdf_thumbnails, `${filenames[0]}-${pageNumber}.png`);
+    const thumbnailName = `${filenames[0]}-${pageNumber}.png`;
+    const pngFile = serverPathToFile(Directory.pdf_thumbnails, thumbnailName);
     const out = createWriteStream(pngFile);
     pngStream.pipe(out);
-    out.on("finish", () => {
-        res.send({
-            path: pngFile,
-            width: viewport.width,
-            height: viewport.height
+    return new Promise<void>((resolve, reject) => {
+        out.on("finish", () => {
+            dispatchThumbnail(res, viewport, thumbnailName);
+            resolve();
+        });
+        out.on("error", error => {
+            console.log(red(`In PDF thumbnail creation, encountered the following error when piping ${pngFile}:`));
+            console.log(error);
+            reject();
         });
-    });
-    out.on("error", error => {
-        console.log(red(`In PDF thumbnail creation, encountered the following error when piping ${pngFile}:`));
-        console.log(error);
     });
 }