From 7d47641e2b98cb3cd7d361cb99f4ecdbd06c5b7b Mon Sep 17 00:00:00 2001
From: Daniel Petri Rocha <daniel.petri@tum.de>
Date: Wed, 29 Jun 2022 14:07:28 +0200
Subject: [PATCH] BG slide quality control, cropped PDF support

---
 export-annotations/config/settings.json |  4 +++
 export-annotations/workers/collector.js | 37 ++++++++++---------------
 export-annotations/workers/process.js   | 13 +++++----
 3 files changed, 27 insertions(+), 27 deletions(-)

diff --git a/export-annotations/config/settings.json b/export-annotations/config/settings.json
index 399f60adbe..79598b29c7 100644
--- a/export-annotations/config/settings.json
+++ b/export-annotations/config/settings.json
@@ -6,6 +6,10 @@
       "presDir": "/var/bigbluebutton",
       "presAnnDropboxDir": "/tmp/pres-ann-dropbox"
     },
+    "collector": {
+      "backgroundSlideDPI": 300,
+      "backgroundSlidePPI": 200
+    },
     "process": {
       "whiteboardTextEncoding": "utf-8",
       "pointsPerInch": 72,
diff --git a/export-annotations/workers/collector.js b/export-annotations/workers/collector.js
index 430932e833..b8af5a95fa 100644
--- a/export-annotations/workers/collector.js
+++ b/export-annotations/workers/collector.js
@@ -68,32 +68,25 @@ let exportJob = JSON.parse(job);
         let pageNumber = p.page;
         let svgFile = path.join(exportJob.presLocation, 'svgs',  `slide${pageNumber}.svg`)
         let outputFile = path.join(dropbox, `slide${pageNumber}`);
-        let svgFileExists = fs.existsSync(svgFile);
         
         // CairoSVG doesn't handle transparent SVG and PNG embeds properly, e.g., in rasterized text.
         // So textboxes may get a black background when downloading/exporting repeatedly.
-        // To avoid that, we take slides from the uploaded file, but probe the dimensions from the SVG
+        // To avoid that, we take slides from the uploaded file, but later probe the dimensions from the SVG
         // so it matches what was shown in the browser -- Tldraw unfortunately uses absolute coordinates.
-        // This rasterizing process does mean a loss in quality.
-  
-        if (svgFileExists) {
-          let dimensions = probe.sync(fs.readFileSync(svgFile));
-          let slideWidth = parseInt(dimensions.width, 10);
-          let slideHeight = parseInt(dimensions.height, 10);
-          
-          let extract_png_from_pdf = [
-            'pdftocairo',
-            '-png', 
-            '-f', pageNumber, 
-            '-l', pageNumber,
-            '-scale-to-x', slideWidth,
-            '-scale-to-y', slideHeight,
-            '-singlefile',
-            pdfFile, outputFile,
-            ].join(' ')
-            
-            execSync(extract_png_from_pdf);
-        }
+
+        let extract_png_from_pdf = [
+          'pdftocairo',
+          '-png',
+          '-f', pageNumber, 
+          '-l', pageNumber,
+          '-r', config.collector.backgroundSlidePPI,
+          '-singlefile',
+          '-cropbox',
+          pdfFile, outputFile,
+        ].join(' ')
+
+        execSync(extract_png_from_pdf);
+        fs.copyFileSync(svgFile, path.join(dropbox, `slide${pageNumber}.svg`));
       }
     }
 
diff --git a/export-annotations/workers/process.js b/export-annotations/workers/process.js
index 0d0d980c6e..35ef8d770b 100644
--- a/export-annotations/workers/process.js
+++ b/export-annotations/workers/process.js
@@ -744,6 +744,7 @@ let ghostScriptInput = ""
 for (let currentSlide of pages) {
 
     let backgroundImagePath = path.join(dropbox, `slide${currentSlide.page}`);
+    let svgFileExists = fs.existsSync(`${backgroundImagePath}.svg`)
     let backgroundFormat = fs.existsSync(`${backgroundImagePath}.png`) ? 'png' : 'jpeg'
 
     // Output dimensions in pixels even if stated otherwise (pt)
@@ -751,7 +752,9 @@ for (let currentSlide of pages) {
     // that would prevent loading file in memory
     // Ideally, use dimensions provided by tldraw's background image asset
     // (this is not yet always provided)
-    let dimensions = probe.sync(fs.readFileSync(`${backgroundImagePath}.${backgroundFormat}`));
+    let dimensions = svgFileExists ? 
+        probe.sync(fs.readFileSync(`${backgroundImagePath}.svg`)) :
+        probe.sync(fs.readFileSync(`${backgroundImagePath}.${backgroundFormat}`));
 
     let slideWidth = parseInt(dimensions.width, 10);
     let slideHeight = parseInt(dimensions.height, 10);
@@ -761,8 +764,8 @@ for (let currentSlide of pages) {
         .ele('svg', {
             xmlns: 'http://www.w3.org/2000/svg',
             'xmlns:xlink': 'http://www.w3.org/1999/xlink',
-            width: slideWidth,
-            height: slideHeight,
+            width: `${slideWidth}px`,
+            height: `${slideHeight}px`,
         })
         .dtd({
             pubID: '-//W3C//DTD SVG 1.1//EN',
@@ -770,8 +773,8 @@ for (let currentSlide of pages) {
         })
         .ele('image', {
             'xlink:href': `file://${dropbox}/slide${currentSlide.page}.${backgroundFormat}`,
-            width: slideWidth,
-            height: slideHeight,
+            width: `${slideWidth}px`,
+            height: `${slideHeight}px`,
         })
         .up()
         .ele('g', {