# HG changeset patch
# User Bernhard Reiter <bernhard@intevation.de>
# Date 1548072152 -3600
# Node ID 1aa2921d88321f8aae84e10b190b1bc733474736
# Parent  e734d48ef964043fc76ebec302c11cc6bef4a2c8
client: pdf-gen: make scalebar box size dynamic

 * Change the calculation of the size of the scalebar to use a fixed
   maximum size and draw the box around it, when the size has been
   cacalculated. Use a fixed placement in the lower right corner for now.

diff -r e734d48ef964 -r 1aa2921d8832 client/src/components/Pdftool.vue
--- a/client/src/components/Pdftool.vue	Mon Jan 21 12:21:01 2019 +0100
+++ b/client/src/components/Pdftool.vue	Mon Jan 21 13:02:32 2019 +0100
@@ -158,10 +158,6 @@
       var mapExtent = map.getView().calculateExtent(mapSize);
 
       var pdf = new jsPDF(this.form.format, "mm", this.form.paperSize);
-      var scalebarSize =
-        this.form.format === "portrait" && this.form.paperSize === "a4"
-          ? 10
-          : 15;
       var northarrowSize = 3;
       var self = this;
 
@@ -187,32 +183,7 @@
 
         var data = canvas.toDataURL("image/jpeg");
         pdf.addImage(data, "JPEG", 0, 0, width, height);
-        self.addRoundedBox(
-          pdf,
-          width - scalebarSize * 5.2,
-          height - scalebarSize,
-          scalebarSize * 5,
-          scalebarSize
-        );
-        self.addScalebar(
-          pdf,
-          width - scalebarSize * 5,
-          height - scalebarSize / 2,
-          scalebarSize * 4,
-          scaleNominator
-        );
-        /*
-        self.addText(
-          pdf,
-          width - scalebarSize * 5,
-          height - scalebarSize * 0.6,
-          10,
-          "black",
-          50,
-          "Scale 1:" + scaleNominator
-        );
-        */
-        //self.addText(pdf, 150, 20, 10, "black", 70, "some text");
+        self.addScaleBar(pdf, width, height, scaleNominator);
         self.addNorthArrow(pdf, 15, 9, northarrowSize);
         self.addPageInfo(pdf);
         self.addAboutBox(pdf, width, height);
@@ -259,10 +230,12 @@
       doc.setFillColor(255, 255, 255);
       doc.roundedRect(x, y, w, h, 3, 3, "FD");
     },
-    addScalebar(doc, x, y, maxWidth, scaleNominator) {
-      // maxWidth in mm
+    addScaleBar(doc, docWidth, docHeight, scaleNominator) {
       // scaleNominator is the x in 1:x of the map scale
 
+      // hardcode maximal width for now and place in lower right corner
+      let maxWidth = 80; // in mm
+
       // reduce width until we'll find a nice number for printing
       // strategy:
       //           1. check which unit prefix we shall use to get [10:10000[
@@ -315,7 +288,11 @@
       }
 
       let size = (length * unitConversionFactor) / scaleNominator / 4;
-      // DEBUG console.log(length, size);
+
+      let x = docWidth - (size * 4 + 8);
+      let y = docHeight - 6;
+
+      this.addRoundedBox(doc, x - 4 , y - 4, size * 4 + 12, 10);
 
       doc.setDrawColor(0, 0, 0);
       doc.setFillColor(0, 0, 0);