use finish pdf strategy logic

libs/remix-ui/solidity-uml-gen/src/lib/utilities/UmlDownloadStrategy.ts

@@ -1,6 +1,7 @@
 import jsPDF from 'jspdf'
 import 'svg2pdf.js'
 
+
 const jsPdf = new jsPDF('landscape', 'px', 'a4')
 
 interface IUmlDownloadStrategy {
@@ -17,38 +18,55 @@ class PdfUmlDownloadStrategy implements IUmlDownloadStrategy {
   public download (uml: string, fileName: string): void {
     const parser = new DOMParser()
     const parsedDocument = parser.parseFromString(uml, 'image/svg+xml')
-    const element = parsedDocument.getElementsByTagName('svg')[0]
+    const element = parsedDocument.documentElement
+    const pageWidth = this.doc.internal.pageSize.getWidth()
+    const pageHeight = this.doc.internal.pageSize.getHeight()
+    const widthScale = pageWidth / parseInt(element.getAttribute('width'))
+    const heightScale = pageHeight / parseInt(element.getAttribute('height'))
+    const scale = Math.min(widthScale, heightScale)
+    element.setAttribute('width', (parseInt(element.getAttribute('width')) * scale).toString())
+    element.setAttribute('height', (parseInt(element.getAttribute('height')) * scale).toString())
+    console.log({ element, pageWidth, pageHeight, widthScale, heightScale, scale })
     this.doc.svg(element, {
-      x: 20,
-      y: 20,
-      width: this.doc.internal.pageSize.getWidth() - 20,
-      height: this.doc.internal.pageSize.getHeight() - 40
+      x: 10,
+      y: 10,
+      width: pageWidth,
+      height: pageHeight
     }).then(() => {
+      const pages = this.doc.internal.pages
+      console.log({ pages })
       this.doc.save(fileName.split('/')[1].split('.')[0].concat('.pdf'))
     }).catch((err) => {
       console.log(err)
     })
+    // const options = {
+    //   filename: fileName.split('/')[1].split('.')[0].concat('.pdf')
+    // }
+    // downloadPdf(element, options, function(t) {
+    //   console.log({ t })
+    // })
   }
 }
 
 class ImageUmlDownloadStrategy implements IUmlDownloadStrategy {
   public download (uml: string, fileName: string): void {
-    const svg = new Blob([uml], { type: 'image/svg+xml;charset=utf-8' })
-    const url = URL.createObjectURL(svg)
-    const img = new Image()
-    img.onload = () => {
-      const canvas = document.createElement('canvas')
-      canvas.width = img.width
-      canvas.height = img.height
-      const ctx = canvas.getContext('2d')
-      ctx.drawImage(img, 0, 0)
-      const png = canvas.toDataURL('image/png')
-      const a = document.createElement('a')
-      a.download = fileName.split('/')[1].split('.')[0].concat('.png')
-      a.href = png
-      a.click()
-    }
-    img.src = url
+  //   const svg = new Blob([uml], { type: 'image/svg+xml;charset=utf-8' })
+  //   const url = URL.createObjectURL(svg)
+  //   const img = new Image()
+  //   img.onload = () => {
+  //     const canvas = document.createElement('canvas')
+  //     canvas.width = img.width
+  //     canvas.height = img.height
+  //     const ctx = canvas.getContext('2d')
+  //     ctx.drawImage(img, 0, 0)
+  //     const png = canvas.toDataURL('image/png')
+  //     const a = document.createElement('a')
+  //     a.download = fileName.split('/')[1].split('.')[0].concat('.png')
+  //     a.href = png
+  //     a.click()
+  //   }
+  //   img.src = url
+  // }
   }
 }
 

package.json

@@ -153,7 +153,6 @@
     "core-js": "^3.6.5",
     "deep-equal": "^1.0.1",
     "document-register-element": "1.13.1",
-    "dom-to-pdf": "^0.3.1",
     "eslint-config-prettier": "^8.5.0",
     "ethers": "^5.4.2",
     "ethjs-util": "^0.1.6",

yarn.lock

@@ -11473,18 +11473,6 @@ dom-serializer@^2.0.0:
     domhandler "^5.0.2"
     entities "^4.2.0"
 
-"dom-to-image@https://github.com/dmapper/dom-to-image":
-  version "2.6.0"
-  resolved "https://github.com/dmapper/dom-to-image#a7c386a8ea813930f05449ac71ab4be0c262dff3"
-
-dom-to-pdf@^0.3.1:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/dom-to-pdf/-/dom-to-pdf-0.3.1.tgz#06db966acc73a7b81ce183202f7b6ff1f5f38578"
-  integrity sha512-2duxMNttyQr5XySV2t7gftCVhHr+zoE/f1h0nQDp/1KugAsk07EkZ9zcPFgZihcyj4dXBUWyVSxOik8czuFGDQ==
-  dependencies:
-    dom-to-image "https://github.com/dmapper/dom-to-image"
-    jspdf "^2.5.1"
-
 dom-walk@^0.1.0:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.2.tgz#0c548bef048f4d1f2a97249002236060daa3fd84"