chore: Release 3.0.1

update manifest
chore: Release 3.0.0
2024-02-16 14:33:49 +00:00 · 2024-02-16 15:32:22 +01:00 · 2023-06-26 11:20:06 +00:00 · 2023-06-26 13:15:39 +02:00 · 2023-06-26 12:43:35 +02:00 · 2022-10-07 12:55:26 +00:00
32 changed files with 1728 additions and 842 deletions
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -4,11 +4,11 @@ variables:

 include:
  - project: '$CI_PROJECT_ROOT_NAMESPACE/ci-tools/pipeline/ci-tools-pipeline-release'
-    ref: 1.0.0
+    ref: 2.0.0
    file: '/release-common.yml'
  - project: '$CI_PROJECT_ROOT_NAMESPACE/ci-tools/pipeline/ci-tools-pipeline-release-node'
-    ref: 1.0.1
+    ref: 1.0.2
    file: '/release-node.yml'
  - project: '$CI_PROJECT_ROOT_NAMESPACE/ci-tools/pipeline/ci-tools-pipeline-project-foundry-module'
-    ref: main
+    ref: 1.1.0
    file: '/pipeline-foundry-module.yml'
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,16 @@
 ## In development

+## 1.2.0
+
+### New features
+
+- HTML Responsive Export Characters sheet
+- Add contextual menu to actor to HTML responsive Export Characters sheet
+
+## 1.1.0
+
+- Add contextual menu to actor to PDF Export Characters sheet
+
 ## 1.0.0

 ### New features
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
 # WFRP 4 Actor Sheet Print

-This module allow to export characters sheet on a friendly print pdf.
+This module allow to export characters sheet on a friendly print pdf or a responsive html.

 # Authors

@@ -28,12 +28,8 @@ A print buton is added on top of sheet to export as pdf

 ![Print button](media/actor-sheet-print-button.png)

+A Contextual menu is added on Actor menu, one for pdf, an other for html
+
+![Actor button](media/actor-sheet-print-actor-button.png)
+
 ## Comming soon
-
-## Module link
-
-https://raw.githubusercontent.com/mcailleaux/WFRP4-FoundryVTT-wfrp4e-actor-sheet-print/dist/module.json
-
-## Module Beta link
-
-https://raw.githubusercontent.com/mcailleaux/WFRP4-FoundryVTT-wfrp4e-actor-sheet-print/dist-beta/module-beta.json
--- a/lang/en.json
+++ b/lang/en.json
@@ -1 +1,4 @@
-{}
+{
+  "WFRP4SHEETPRINT.export.pdf": "Export to PDF",
+  "WFRP4SHEETPRINT.export.html": "Export to Html"
+}
--- a/lang/fr.json
+++ b/lang/fr.json
@@ -1 +1,4 @@
-{}
+{
+  "WFRP4SHEETPRINT.export.pdf": "Exporter en PDF",
+  "WFRP4SHEETPRINT.export.html": "Exporter en Html"
+}
--- a/local-deploy.sh
+++ b/local-deploy.sh
@@ -0,0 +1,6 @@
+#!/bin/bash
+set -e
+
+cp -r ./dist/* $LOCAL_FOUNDRY
+
+
--- a/media/actor-sheet-print-actor-button.png
+++ b/media/actor-sheet-print-actor-button.png
--- a/module.json
+++ b/module.json
@@ -1,28 +1,48 @@
 {
-  "name": "wfrp4e-actor-sheet-print",
+  "id": "wfrp4e-actor-sheet-print",
  "title": "[WFRP4] Actor Sheet Print",
  "description": "Functions to print actor sheet",
  "version": "${MODULE_VERSION}",
-  "minimumCoreVersion": "0.8.0",
-  "compatibleCoreVersion": "0.8.9",
-  "author": "Skeroujvapluvit",
-  "systems": ["wfrp4e"],
-  "dependencies": [],
+  "compatibility": {
+    "minimum": "10",
+    "verified": "11.315",
+    "maximum": "11"
+  },
+  "authors": [
+    {
+      "name": "Skeroujvapluvit",
+      "flags": {}
+    }
+  ],
+  "relationships": {
+    "systems": [
+      {
+        "id": "wfrp4e",
+        "type": "system",
+        "compatibility": {
+          "verified": "6.5.9"
+        }
+      }
+    ],
+    "requires": []
+  },
  "esmodules": ["main.js"],
  "languages": [
    {
      "lang": "en",
      "name": "English",
-      "path": "lang/en.json"
+      "path": "lang/en.json",
+      "flags": {}
    },
    {
      "lang": "fr",
      "name": "Français",
-      "path": "lang/fr.json"
+      "path": "lang/fr.json",
+      "flags": {}
    }
  ],
  "styles": ["./styles/main.css"],
-  "url": "https://github.com/mcailleaux/WFRP4-FoundryVTT-wfrp4e-actor-sheet-print",
+  "url": "https://gitlab.com/greenskin-foundryvtt/wfrp4-actor-sheet-print",
  "download": "https://gitlab.com/greenskin-foundryvtt/wfrp4-actor-sheet-print/-/releases/${MODULE_VERSION}/downloads/dist/wfrp4-actor-sheet-print.zip",
  "manifest": "https://gitlab.com/greenskin-foundryvtt/wfrp4-actor-sheet-print/-/releases/${MODULE_VERSION}/downloads/dist/module.json",
  "readme": "https://gitlab.com/greenskin-foundryvtt/wfrp4-actor-sheet-print/-/raw/${MODULE_VERSION}/README.md",
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,7 @@
 {
-  "requires": true,
+  "version": "3.0.1",
  "lockfileVersion": 1,
+  "requires": true,
  "dependencies": {
    "@babel/code-frame": {
      "version": "7.15.8",
@@ -89,15 +90,15 @@
      }
    },
    "@discoveryjs/json-ext": {
-      "version": "0.5.5",
-      "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.5.tgz",
-      "integrity": "sha512-6nFkfkmSeV/rqSaS4oWHgmpnYw194f6hmWF5is6b0J1naJZoiD0NTc9AiUwPHvWsowkjuHErCZT1wa0jg+BLIA==",
+      "version": "0.5.6",
+      "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.6.tgz",
+      "integrity": "sha512-ws57AidsDvREKrZKYffXddNkyaF14iHNHm8VQnZH6t99E8gczjNN0GpvcGny0imC80yQ0tHz1xVUKk/KFQSUyA==",
      "dev": true
    },
    "@league-of-foundry-developers/foundry-vtt-types": {
-      "version": "0.8.8-8",
-      "resolved": "https://registry.npmjs.org/@league-of-foundry-developers/foundry-vtt-types/-/foundry-vtt-types-0.8.8-8.tgz",
-      "integrity": "sha512-DjWRdl9PHh5CrnqmQBw19Swe/W1asmD5PjU0arMHL1Ni7Zo91o7eHoHqciOAU0M/Nu1BK0CH/Q+nXpNY9dsr3Q==",
+      "version": "0.8.9-9",
+      "resolved": "https://registry.npmjs.org/@league-of-foundry-developers/foundry-vtt-types/-/foundry-vtt-types-0.8.9-9.tgz",
+      "integrity": "sha512-CLpFu5XY6BnxVNou28MKZcvmjWWzv+UYLZ21QL+9OxFegMr5iE15pqyNHcTuJPhmJwnBD2WYUzl+vsAMjUfLLg==",
      "dev": true,
      "requires": {
        "@types/jquery": "~3.5.6",
@@ -106,8 +107,7 @@
        "pixi-particles": "4.3.1",
        "pixi.js": "5.3.4",
        "socket.io-client": "4.1.2",
-        "tinymce": "5.8.1",
-        "typescript": "^4.3.5"
+        "tinymce": "5.8.1"
      }
    },
    "@pixi/accessibility": {
@@ -488,15 +488,15 @@
      }
    },
    "@types/component-emitter": {
-      "version": "1.2.10",
-      "resolved": "https://registry.npmjs.org/@types/component-emitter/-/component-emitter-1.2.10.tgz",
-      "integrity": "sha512-bsjleuRKWmGqajMerkzox19aGbscQX5rmmvvXl3wlIp5gMG1HgkiwPxsN5p070fBDKTNSPgojVbuY1+HWMbFhg==",
+      "version": "1.2.11",
+      "resolved": "https://registry.npmjs.org/@types/component-emitter/-/component-emitter-1.2.11.tgz",
+      "integrity": "sha512-SRXjM+tfsSlA9VuG8hGO2nft2p8zjXCK1VcC6N4NXbBbYbSia9kzCChYQajIjzIqOOOuh5Ock6MmV2oux4jDZQ==",
      "dev": true
    },
    "@types/eslint": {
-      "version": "7.28.1",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.28.1.tgz",
-      "integrity": "sha512-XhZKznR3i/W5dXqUhgU9fFdJekufbeBd5DALmkuXoeFcjbQcPk+2cL+WLHf6Q81HWAnM2vrslIHpGVyCAviRwg==",
+      "version": "8.2.1",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.2.1.tgz",
+      "integrity": "sha512-UP9rzNn/XyGwb5RQ2fok+DzcIRIYwc16qTXse5+Smsy8MOIccCChT15KAwnsgQx4PzJkaMq4myFyZ4CL5TjhIQ==",
      "dev": true,
      "requires": {
        "@types/estree": "*",
@@ -504,9 +504,9 @@
      }
    },
    "@types/eslint-scope": {
-      "version": "3.7.1",
-      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.1.tgz",
-      "integrity": "sha512-SCFeogqiptms4Fg29WpOTk5nHIzfpKCemSN63ksBQYKTcXoJEmJagV+DhVmbapZzY4/5YaOV1nZwrsU79fFm1g==",
+      "version": "3.7.2",
+      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.2.tgz",
+      "integrity": "sha512-TzgYCWoPiTeRg6RQYgtuW7iODtVoKu3RVL72k3WohqhjfaOLK5Mg2T4Tg1o2bSfu0vPkoI48wdQFv5b/Xe04wQ==",
      "dev": true,
      "requires": {
        "@types/eslint": "*",
@@ -519,10 +519,16 @@
      "integrity": "sha512-C6N5s2ZFtuZRj54k2/zyRhNDjJwwcViAM3Nbm8zjBpbqAdZ00mr0CFxvSKeO8Y/e03WVFLpQMdHYVfUd6SB+Hw==",
      "dev": true
    },
+    "@types/file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-zv9kNf3keYegP5oThGLaPk8E081DFDuwfqjtiTzm6PoxChdJ1raSuADf2YGCVIyrSynLrgc8JWv296s7Q7pQSQ==",
+      "dev": true
+    },
    "@types/jquery": {
-      "version": "3.5.7",
-      "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.7.tgz",
-      "integrity": "sha512-Why+9t1KuqWtIqYKtbk6wgWbE1PjyXJOyGkpmTUh0RX5p4HL7nnRuBkjAO9P2r9tGQP6bLWxl77jRLew3V5xXg==",
+      "version": "3.5.11",
+      "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.11.tgz",
+      "integrity": "sha512-lYZGdfOtUa0XFjIATQgiogqeTY5PNNMOmp3Jq48ghmJALL8t/IqABRqlEwdHfuUdA8iIE1uGD1HoI4a7Tiy6OA==",
      "dev": true,
      "requires": {
        "@types/sizzle": "*"
@@ -541,9 +547,9 @@
      "dev": true
    },
    "@types/node": {
-      "version": "16.10.4",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.10.4.tgz",
-      "integrity": "sha512-EITwVTX5B4nDjXjGeQAfXOrm+Jn+qNjDmyDRtWoD+wZsl/RDPRTFRKivs4Mt74iOFlLOrE5+Kf+p5yjyhm3+cA==",
+      "version": "17.0.5",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.5.tgz",
+      "integrity": "sha512-w3mrvNXLeDYV1GKTZorGJQivK6XLCoGwpnyJFbJVK/aTBQUxOCaa/GlFAAN3OTDFcb7h5tiFG+YXCO2By+riZw==",
      "dev": true
    },
    "@types/parse-json": {
@@ -753,9 +759,9 @@
      "dev": true
    },
    "acorn": {
-      "version": "8.5.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.5.0.tgz",
-      "integrity": "sha512-yXbYeFy+jUuYd3/CDcg2NkIYE991XYX/bje7LmjJigUciaeO1JR4XxXgCIV1/Zc/dRuFEyw1L0pbA+qynJkW5Q==",
+      "version": "8.7.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.7.0.tgz",
+      "integrity": "sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==",
      "dev": true
    },
    "acorn-import-assertions": {
@@ -852,15 +858,15 @@
      }
    },
    "browserslist": {
-      "version": "4.17.4",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.17.4.tgz",
-      "integrity": "sha512-Zg7RpbZpIJRW3am9Lyckue7PLytvVxxhJj1CaJVlCWENsGEAOlnlt8X0ZxGRPp7Bt9o8tIRM5SEXy4BCPMJjLQ==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.19.1.tgz",
+      "integrity": "sha512-u2tbbG5PdKRTUoctO3NBD8FQ5HdPh1ZXPHzp1rwaa5jTc+RV9/+RlWiAIKmjRPQF+xbGM9Kklj5bZQFa2s/38A==",
      "dev": true,
      "requires": {
-        "caniuse-lite": "^1.0.30001265",
-        "electron-to-chromium": "^1.3.867",
+        "caniuse-lite": "^1.0.30001286",
+        "electron-to-chromium": "^1.4.17",
        "escalade": "^3.1.1",
-        "node-releases": "^2.0.0",
+        "node-releases": "^2.0.1",
        "picocolors": "^1.0.0"
      }
    },
@@ -882,9 +888,9 @@
      "dev": true
    },
    "caniuse-lite": {
-      "version": "1.0.30001267",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001267.tgz",
-      "integrity": "sha512-r1mjTzAuJ9W8cPBGbbus8E0SKcUP7gn03R14Wk8FlAlqhH9hroy9nLqmpuXlfKEw/oILW+FGz47ipXV2O7x8lg==",
+      "version": "1.0.30001293",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001293.tgz",
+      "integrity": "sha512-A4I5fB8Kxo0p/H3aXlaOkBp9mD0GspKmXfWHXOzcl0iHLi07EEVJdJeQPT4Yv3/dffRnrwluYZyXvMjbr6WhIA==",
      "dev": true
    },
    "canvg": {
@@ -1029,9 +1035,9 @@
      }
    },
    "debug": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz",
-      "integrity": "sha512-mOp8wKcvj7XxC78zLgw/ZA+6TSgkoE2C/ienthhRD298T7UNwAg9diBpLRxC0mOezLl4B0xV7M0cCO6P/O0Xhw==",
+      "version": "4.3.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.3.tgz",
+      "integrity": "sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==",
      "dev": true,
      "requires": {
        "ms": "2.1.2"
@@ -1050,9 +1056,9 @@
      "dev": true
    },
    "electron-to-chromium": {
-      "version": "1.3.868",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.868.tgz",
-      "integrity": "sha512-kZYCHqwJ1ctGrYDlOcWQH+/AftAm/KD4lEnLDNwS0kKwx1x6dU4zv+GuDjsPPOGn/2TjnKBaZjDyjXaoix0q/A==",
+      "version": "1.4.28",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.28.tgz",
+      "integrity": "sha512-Gzbf0wUtKfyPaqf0Plz+Ctinf9eQIzxEqBHwSvbGfeOm9GMNdLxyu1dNiCUfM+x6r4BE0xUJNh3Nmg9gfAtTmg==",
      "dev": true
    },
    "end-of-stream": {
@@ -1159,9 +1165,9 @@
      },
      "dependencies": {
        "estraverse": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
-          "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
          "dev": true
        }
      }
@@ -1224,6 +1230,11 @@
      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz",
      "integrity": "sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA=="
    },
+    "file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
    "fill-range": {
      "version": "7.0.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@@ -1482,9 +1493,9 @@
      "dev": true
    },
    "jest-worker": {
-      "version": "27.2.5",
-      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.2.5.tgz",
-      "integrity": "sha512-HTjEPZtcNKZ4LnhSp02NEH4vE+5OpJ0EsOWYvGQpHgUMLngydESAAMH5Wd/asPf29+XUDQZszxpLg1BkIIA2aw==",
+      "version": "27.4.5",
+      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.4.5.tgz",
+      "integrity": "sha512-f2s8kEdy15cv9r7q4KkzGXvlY0JTcmCbMHZBfSQDwW77REr45IDWwd0lksDFeVHH2jJ5pqb90T77XscrjeGzzg==",
      "dev": true,
      "requires": {
        "@types/node": "*",
@@ -1595,18 +1606,18 @@
      }
    },
    "mime-db": {
-      "version": "1.50.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.50.0.tgz",
-      "integrity": "sha512-9tMZCDlYHqeERXEHO9f/hKfNXhre5dK2eE/krIvUjZbS2KPcqGDfNShIWS1uW9XOTKQKqK6qbeOci18rbfW77A==",
+      "version": "1.51.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.51.0.tgz",
+      "integrity": "sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g==",
      "dev": true
    },
    "mime-types": {
-      "version": "2.1.33",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.33.tgz",
-      "integrity": "sha512-plLElXp7pRDd0bNZHw+nMd52vRYjLwQjygaNg7ddJ2uJtTlmnTCjWuPKxVu6//AdaRuME84SvLW91sIkBqGT0g==",
+      "version": "2.1.34",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.34.tgz",
+      "integrity": "sha512-6cP692WwGIs9XXdOO4++N+7qjqv0rqxxVvJ3VHPh/Sc9mVZcQP+ZGhkKiTvWMQRr2tbHkJP/Yn7Y0npb3ZBs4A==",
      "dev": true,
      "requires": {
-        "mime-db": "1.50.0"
+        "mime-db": "1.51.0"
      }
    },
    "mimic-fn": {
@@ -1668,9 +1679,9 @@
      "dev": true
    },
    "node-releases": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.0.tgz",
-      "integrity": "sha512-aA87l0flFYMzCHpTM3DERFSYxc6lv/BltdbRTOMZuxZ0cwZCD3mejE5n9vLhSJCN++/eOqr77G1IO5uXxlQYWA==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.1.tgz",
+      "integrity": "sha512-CqyzN6z7Q6aMeF/ktcMVTzhAHCEpf8SOarwpzpf8pNBY2k5/oM34UHldUwp8VKI7uxct2HxSRdJjBaZeESzcxA==",
      "dev": true
    },
    "npm-run-path": {
@@ -2171,9 +2182,9 @@
      "dev": true
    },
    "source-map-support": {
-      "version": "0.5.20",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.20.tgz",
-      "integrity": "sha512-n1lZZ8Ve4ksRqizaBQgxXDgKwttHDhyfQjA6YZZn8+AroHbsIz+JjwxQDxbp+7y5OYCI8t1Yk7etjD9CRd2hIw==",
+      "version": "0.5.21",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
+      "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
      "dev": true,
      "requires": {
        "buffer-from": "^1.0.0",
@@ -2214,9 +2225,9 @@
      "dev": true
    },
    "terser": {
-      "version": "5.9.0",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.9.0.tgz",
-      "integrity": "sha512-h5hxa23sCdpzcye/7b8YqbE5OwKca/ni0RQz1uRX3tGh8haaGHqcuSqbGRybuAKNdntZ0mDgFNXPJ48xQ2RXKQ==",
+      "version": "5.10.0",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.10.0.tgz",
+      "integrity": "sha512-AMmF99DMfEDiRJfxfY5jj5wNH/bYO09cniSqhfoyxc8sFoYIgkJy86G04UoZU5VjlpnplVu0K6Tx6E9b5+DlHA==",
      "dev": true,
      "requires": {
        "commander": "^2.20.0",
@@ -2233,13 +2244,12 @@
      }
    },
    "terser-webpack-plugin": {
-      "version": "5.2.4",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.2.4.tgz",
-      "integrity": "sha512-E2CkNMN+1cho04YpdANyRrn8CyN4yMy+WdFKZIySFZrGXZxJwJP6PMNGGc/Mcr6qygQHUUqRxnAPmi0M9f00XA==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.0.tgz",
+      "integrity": "sha512-LPIisi3Ol4chwAaPP8toUJ3L4qCM1G0wao7L3qNv57Drezxj6+VEyySpPw4B1HSO2Eg/hDY/MNF5XihCAoqnsQ==",
      "dev": true,
      "requires": {
-        "jest-worker": "^27.0.6",
-        "p-limit": "^3.1.0",
+        "jest-worker": "^27.4.1",
        "schema-utils": "^3.1.1",
        "serialize-javascript": "^6.0.0",
        "source-map": "^0.6.1",
@@ -2283,15 +2293,15 @@
      }
    },
    "typescript": {
-      "version": "4.3.5",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.3.5.tgz",
-      "integrity": "sha512-DqQgihaQ9cUrskJo9kIyW/+g0Vxsk8cDtZ52a3NGh0YNTfpUSArXSohyUGnvbPazEPLu398C0UxmKSOrPumUzA==",
+      "version": "4.5.4",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.5.4.tgz",
+      "integrity": "sha512-VgYs2A2QIRuGphtzFV7aQJduJ2gyfTljngLzjpfW9FoYZF6xuw1W0vW9ghCKLfcWrCFxK81CSGRAvS1pn4fIUg==",
      "dev": true
    },
    "uglify-js": {
-      "version": "3.14.2",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.14.2.tgz",
-      "integrity": "sha512-rtPMlmcO4agTUfz10CbgJ1k6UAoXM2gWb3GoMPPZB/+/Ackf8lNWk11K4rYi2D0apgoFRLtQOZhb+/iGNJq26A==",
+      "version": "3.14.5",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.14.5.tgz",
+      "integrity": "sha512-qZukoSxOG0urUTvjc2ERMTcAy+BiFh3weWAkeurLwjrCba73poHmG3E36XEjd/JGukMzwTL7uCxZiAexj8ppvQ==",
      "dev": true,
      "optional": true
    },
@@ -2339,16 +2349,10 @@
        }
      }
    },
-    "v8-compile-cache": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz",
-      "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
-      "dev": true
-    },
    "watchpack": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.2.0.tgz",
-      "integrity": "sha512-up4YAn/XHgZHIxFBVCdlMiWDj6WaLKpwVeGQk2I5thdYxF/KmF0aaz6TfJZ/hfl1h/XlcDr7k1KH7ThDagpFaA==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz",
+      "integrity": "sha512-x0t0JuydIo8qCNctdDrn1OzH/qDzk2+rdCOC3YzumZ42fiMqmQ7T3xQurykYMhYfHaPHTp4ZxAx2NfUo1K6QaA==",
      "dev": true,
      "requires": {
        "glob-to-regexp": "^0.4.1",
@@ -2356,9 +2360,9 @@
      }
    },
    "webpack": {
-      "version": "5.58.2",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.58.2.tgz",
-      "integrity": "sha512-3S6e9Vo1W2ijk4F4PPWRIu6D/uGgqaPmqw+av3W3jLDujuNkdxX5h5c+RQ6GkjVR+WwIPOfgY8av+j5j4tMqJw==",
+      "version": "5.65.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.65.0.tgz",
+      "integrity": "sha512-Q5or2o6EKs7+oKmJo7LaqZaMOlDWQse9Tm5l1WAfU/ujLGN5Pb0SqGeVkN/4bpPmEqEP5RnVhiqsOtWtUVwGRw==",
      "dev": true,
      "requires": {
        "@types/eslint-scope": "^3.7.0",
@@ -2383,14 +2387,14 @@
        "schema-utils": "^3.1.0",
        "tapable": "^2.1.1",
        "terser-webpack-plugin": "^5.1.3",
-        "watchpack": "^2.2.0",
-        "webpack-sources": "^3.2.0"
+        "watchpack": "^2.3.1",
+        "webpack-sources": "^3.2.2"
      }
    },
    "webpack-cli": {
-      "version": "4.9.0",
-      "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-4.9.0.tgz",
-      "integrity": "sha512-n/jZZBMzVEl4PYIBs+auy2WI0WTQ74EnJDiyD98O2JZY6IVIHJNitkYp/uTXOviIOMfgzrNvC9foKv/8o8KSZw==",
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-4.9.1.tgz",
+      "integrity": "sha512-JYRFVuyFpzDxMDB+v/nanUdQYcZtqFPGzmlW4s+UkPMFhSpfRNmf1z4AwYcHJVdvEFAM7FFCQdNTpsBYhDLusQ==",
      "dev": true,
      "requires": {
        "@discoveryjs/json-ext": "^0.5.0",
@@ -2404,7 +2408,6 @@
        "import-local": "^3.0.2",
        "interpret": "^2.2.0",
        "rechoir": "^0.7.0",
-        "v8-compile-cache": "^2.2.0",
        "webpack-merge": "^5.7.3"
      },
      "dependencies": {
@@ -2456,9 +2459,9 @@
      }
    },
    "webpack-sources": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.1.tgz",
-      "integrity": "sha512-t6BMVLQ0AkjBOoRTZgqrWm7xbXMBzD+XDq2EZ96+vMfn3qKgsvdXZhbPZ4ElUOpdv4u+iiGe+w3+J75iy/bYGA==",
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.2.tgz",
+      "integrity": "sha512-cp5qdmHnu5T8wRg2G3vZZHoJPN14aqQ89SyQ11NpGH5zEMDCclt49rzo+MaRazk7/UeILhAI+/sEtcM+7Fr0nw==",
      "dev": true
    },
    "which": {
--- a/package.json
+++ b/package.json
@@ -2,18 +2,20 @@
  "scripts": {
    "old-build": "tsc -p tsconfig.json && cp -r ./src ./dist",
    "package": "sh ./package.sh",
-    "build": "webpack"
+    "build": "webpack",
+    "local-deploy": "npm run package && sh ./local-deploy.sh"
  },
-  "version": "1.0.4",
+  "version": "3.0.1",
  "devDependencies": {
-    "@league-of-foundry-developers/foundry-vtt-types": "0.8.8-8",
+    "@league-of-foundry-developers/foundry-vtt-types": "0.8.9-9",
    "husky": "4.3.7",
    "prettier": "2.2.1",
    "pretty-quick": "3.1.0",
-    "typescript": "4.3.5",
+    "typescript": "4.5.4",
    "ts-loader": "9.2.6",
-    "webpack": "5.58.2",
-    "webpack-cli": "4.9.0"
+    "webpack": "5.65.0",
+    "webpack-cli": "4.9.1",
+    "@types/file-saver": "2.0.5"
  },
  "husky": {
    "hooks": {
@@ -21,6 +23,7 @@
    }
  },
  "dependencies": {
-    "jspdf": "2.4.0"
+    "jspdf": "2.4.0",
+    "file-saver": "2.0.5"
  }
 }
--- a/package.sh
+++ b/package.sh
@@ -1,6 +1,8 @@
+#!/bin/bash
+set -e
+
+rm -fr dist
 npm run build
-mkdir -p ./dist/lang
-mkdir -p ./dist/styles
-cp ./lang/* ./dist/lang/
-cp ./styles/* ./dist/styles/
-cp module.json ./dist/module.json
+cp -r $MODULE_DIRS dist/
+export MODULE_VERSION=$(jq ".version" package.json | sed -r 's/["]+//g')
+envsubst '${MODULE_VERSION}' < ./module.json > ./dist/module.json
--- a/src/abstract-builder.ts
+++ b/src/abstract-builder.ts
@@ -0,0 +1,14 @@
+import { AbstractElement } from './elements/abstract-element';
+import { GenerateTypeEnum } from './elements/generate-type.enum';
+
+export abstract class AbstractBuilder {
+  public abstract build(elements: AbstractElement[]);
+
+  public abstract getLabelledRowHeight(): number;
+
+  public abstract save(name: string);
+
+  public abstract getImageScale(): number;
+
+  public abstract getGenerateType(): GenerateTypeEnum;
+}
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,7 +1,11 @@
 export const i18n = () => (<any>game).i18n;
 export const i18nLocalize = (id: string) => i18n().localize(id);
 export const i18nFormat = (id: string, data?: any) => i18n().format(id, data);
+export const user = () => (<any>game).user;
+export const isGM = () => user()?.isGM ?? false;

 export const TEXT_SIZE = 8;
 export const LABEL_SIZE = 6;
+export const HTML_TEXT_SIZE = 1;
+export const HTML_LABEL_SIZE = 0.75;
 export const MARGINS = { top: 10, left: 10, bottom: 10, right: 10 };
--- a/src/elements/abstract-container-element.ts
+++ b/src/elements/abstract-container-element.ts
@@ -0,0 +1,38 @@
+import { AbstractElement } from './abstract-element';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';
+
+export abstract class AbstractContainerElement extends AbstractElement {
+  public pdfElements: AbstractElement[] = [];
+  public htmlElements: AbstractElement[] = [];
+  public contextElements: AbstractElement[] = [];
+
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    maxWidth: number | undefined,
+    elements: AbstractElement[] = [],
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, maxWidth, context);
+    this.htmlElements = this.context.isHtml
+      ? elements.filter((el) => el.context.isHtml)
+      : [];
+    this.pdfElements = this.context.isPdf
+      ? elements.filter((el) => el.context.isPdf)
+      : [];
+    this.contextElements =
+      this.globalType === GenerateTypeEnum.HTML
+        ? this.htmlElements
+        : this.pdfElements;
+  }
+
+  public getElements(): AbstractElement[] {
+    const elements: AbstractElement[] = [];
+    for (const element of this.contextElements) {
+      elements.push(...element.getElements());
+    }
+    return elements;
+  }
+}
--- a/src/elements/abstract-element.ts
+++ b/src/elements/abstract-element.ts
@@ -1,15 +1,36 @@
 import jsPDF from 'jspdf';
 import { MARGINS } from '../constants';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export abstract class AbstractElement {
+  public static readonly DEFAULT_CONTEXT: IContext = {
+    isHtml: true,
+    isPdf: true,
+    name: 'element',
+  };
+
+  public globalType: GenerateTypeEnum;
  public x: number;
  public y: number;
  public maxWidth?: number;
+  public context: IContext = AbstractElement.DEFAULT_CONTEXT;

-  constructor(x: number, y: number, maxWidth?: number | undefined) {
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    maxWidth?: number | undefined,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    this.globalType = globalType;
    this.x = x >= MARGINS.left ? x : MARGINS.left;
    this.y = y >= MARGINS.top ? y : MARGINS.top;
    this.maxWidth = maxWidth;
+    this.context = {
+      ...this.context,
+      ...context,
+    };
  }

  public getHeightFromPx(doc: jsPDF, size: number) {
@@ -28,6 +49,13 @@ export abstract class AbstractElement {

  public abstract render(doc: jsPDF, maxWidth?: number): jsPDF;

+  public abstract renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document;
+
  public abstract getHeight(doc?: jsPDF): number;

  public abstract getCheckNewPageHeight(doc?: jsPDF): number;
--- a/src/elements/blank.ts
+++ b/src/elements/blank.ts
@@ -1,14 +1,23 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF from 'jspdf';
 import { Box } from './box';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Blank extends Box {
-  constructor(x: number, y: number, w: number, h: number) {
-    super(x, y, w, h);
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    w: number,
+    h: number,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, w, h, context);
  }

-  public static heightBlank(h: number) {
-    return new Blank(0, 0, 0, h);
+  public static heightBlank(globalType: GenerateTypeEnum, h: number) {
+    return new Blank(globalType, 0, 0, 0, h);
  }

  public getCheckNewPageHeight(doc?: jsPDF): number {
--- a/src/elements/box.ts
+++ b/src/elements/box.ts
@@ -1,12 +1,21 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF from 'jspdf';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Box extends AbstractElement {
  public w: number;
  public h: number;

-  constructor(x: number, y: number, w: number, h: number) {
-    super(x, y, w);
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    w: number,
+    h: number,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, w, context);
    this.w = w;
    this.h = h;
  }
@@ -20,6 +29,34 @@ export class Box extends AbstractElement {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    const css = `box-${this.w ?? 0}-${this.h ?? 0}`;
+    div.classList.add(`box`);
+    div.classList.add(css);
+    div.classList.add(this.context.name);
+    if (!cssRules.includes(css)) {
+      cssRules.push(css);
+      let rule = 'width: 100%;';
+      if (this.w > 0) {
+        rule += `max-width: ${this.w}px;`;
+        rule += `min-width: ${this.w}px;`;
+      }
+      if (this.h > 0) {
+        rule += `max-height: ${this.h}px;`;
+        rule += `min-height: ${this.h}px;`;
+      }
+      sheet.innerHTML += ` .${css} { ${rule} }`;
+    }
+    parent.append(div);
+    return doc;
+  }
+
  public getHeight(_doc): number {
    return this.h;
  }
--- a/src/elements/column.ts
+++ b/src/elements/column.ts
@@ -1,16 +1,22 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF from 'jspdf';
+import { IContext } from './context';
+import { AbstractContainerElement } from './abstract-container-element';
+import { GenerateTypeEnum } from './generate-type.enum';

-export class Column extends AbstractElement {
-  public elements: AbstractElement[] = [];
-
-  constructor(x: number, y: number, elements: AbstractElement[]) {
-    super(x, y);
-    this.elements = elements;
+export class Column extends AbstractContainerElement {
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    elements: AbstractElement[],
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, undefined, elements, context);
  }

  public prepareRender(doc: jsPDF, _maxWidth?: number): jsPDF {
-    const elements = this.elements ?? [];
+    const elements = this.pdfElements ?? [];

    let currentY = this.y;
    for (let i = 0; i < elements.length; i++) {
@@ -29,9 +35,27 @@ export class Column extends AbstractElement {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    div.classList.add(`column`);
+    div.classList.add(this.context.name);
+    const elements = this.htmlElements ?? [];
+    for (let i = 0; i < elements.length; i++) {
+      const element = elements[i];
+      element.renderHtml(doc, div, cssRules, sheet);
+    }
+    parent.append(div);
+    return doc;
+  }
+
  public getHeight(doc): number {
-    return this.elements.length > 0
-      ? this.elements
+    return this.pdfElements.length > 0
+      ? this.pdfElements
          .map((e) => e.getHeight(doc))
          .reduce((p, c, i) => {
            if (i === 0) {
@@ -43,20 +67,8 @@ export class Column extends AbstractElement {
  }

  public getCheckNewPageHeight(doc?: jsPDF): number {
-    return this.elements.length > 0
-      ? this.elements[0].getCheckNewPageHeight(doc)
+    return this.pdfElements.length > 0
+      ? this.pdfElements[0].getCheckNewPageHeight(doc)
      : 0;
  }
-
-  public getElements(): AbstractElement[] {
-    const elements: AbstractElement[] = [];
-    for (const element of this.elements) {
-      elements.push(...element.getElements());
-    }
-    return elements;
-  }
-
-  public isEmpty(): boolean {
-    return this.elements.length === 0;
-  }
 }
--- a/src/elements/context.ts
+++ b/src/elements/context.ts
@@ -0,0 +1,5 @@
+export interface IContext {
+  name: string;
+  isHtml: boolean;
+  isPdf: boolean;
+}
--- a/src/elements/generate-type.enum.ts
+++ b/src/elements/generate-type.enum.ts
@@ -0,0 +1,4 @@
+export enum GenerateTypeEnum {
+  PDF = 'PDF',
+  HTML = 'HTML',
+}
--- a/src/elements/image.ts
+++ b/src/elements/image.ts
@@ -1,12 +1,22 @@
 import { Box } from './box';
 import jsPDF from 'jspdf';
 import { AbstractElement } from './abstract-element';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Image extends Box {
  public imageData: string;

-  constructor(x: number, y: number, w: number, h: number, imageData: string) {
-    super(x, y, w, h);
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    w: number,
+    h: number,
+    imageData: string,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, w, h, context);
    this.imageData = imageData;
  }

@@ -21,6 +31,32 @@ export class Image extends Box {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const img = doc.createElement('img');
+    img.src = this.imageData;
+    const css = `img-${this.w ?? 0}`;
+    img.classList.add(`img`);
+    img.classList.add(css);
+    img.classList.add(this.context.name);
+    if (!cssRules.includes(css)) {
+      cssRules.push(css);
+      let rule = '';
+      if (this.w > 0) {
+        rule += `width: ${this.w}px;`;
+      }
+      if (rule.length > 0) {
+        sheet.innerHTML += ` .${css} { ${rule} }`;
+      }
+    }
+    parent.append(img);
+    return doc;
+  }
+
  public getElements(): AbstractElement[] {
    return [this];
  }
--- a/src/elements/labelled-text.ts
+++ b/src/elements/labelled-text.ts
@@ -1,21 +1,31 @@
 import jsPDF, { TextOptionsLight } from 'jspdf';
 import { Text } from './text';
-import { i18nLocalize, LABEL_SIZE, TEXT_SIZE } from '../constants';
+import {
+  HTML_LABEL_SIZE,
+  HTML_TEXT_SIZE,
+  i18nLocalize,
+  LABEL_SIZE,
+  TEXT_SIZE,
+} from '../constants';
 import { AbstractElement } from './abstract-element';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class LabelledText extends Text {
  public label: string;
  public labelOptions?: TextOptionsLight;

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    label: string,
    text: string,
    textOptions?: TextOptionsLight,
-    labelOptions?: TextOptionsLight
+    labelOptions?: TextOptionsLight,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, text, textOptions);
+    super(globalType, x, y, text, textOptions, context);
    this.label = label;
    this.labelOptions = labelOptions;
    const textMaxWidth = this.textOptions?.maxWidth ?? 0;
@@ -40,6 +50,40 @@ export class LabelledText extends Text {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    div.classList.add(`column`);
+    div.classList.add(`labelled-text`);
+    div.classList.add(this.context.name);
+    const label = doc.createElement('p');
+    const text = doc.createElement('p');
+    const labelCss = `label-${LABEL_SIZE}`;
+    const textCss = `text-${TEXT_SIZE}`;
+    label.classList.add(labelCss);
+    text.classList.add(textCss);
+    if (!cssRules.includes(labelCss)) {
+      cssRules.push(labelCss);
+      sheet.innerHTML += ` .${labelCss} { font-size: ${HTML_LABEL_SIZE}rem; margin: 0; }`;
+    }
+    if (!cssRules.includes(textCss)) {
+      cssRules.push(textCss);
+      sheet.innerHTML += ` .${textCss} { font-size: ${HTML_TEXT_SIZE}rem; margin-top: 0.5rem; margin-bottom: 0.5rem; }`;
+      sheet.innerHTML += ` .labelled-text { margin-top: 0.5rem; margin-bottom: 0.5rem; }`;
+      sheet.innerHTML += ` .labelled-text > .${textCss} { font-size: ${HTML_TEXT_SIZE}rem; margin: 0; }`;
+    }
+    label.innerHTML = i18nLocalize(this.label);
+    text.innerHTML = i18nLocalize(this.text);
+    div.append(label);
+    div.append(text);
+    parent.append(div);
+    return doc;
+  }
+
  protected updateMaxWidth(maxWidth?: number) {
    if (maxWidth != null && maxWidth > 0) {
      this.maxWidth = maxWidth;
--- a/src/elements/labelled-value.ts
+++ b/src/elements/labelled-value.ts
@@ -1,32 +1,52 @@
 import { Row } from './row';
 import { Text } from './text';
 import { MultilineText } from './multiline-text';
+import { IContext } from './context';
+import { AbstractElement } from './abstract-element';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class LabelledValue extends Row {
  public label: string;
  public value: number;

  constructor(
+    globalType: GenerateTypeEnum,
    label: string,
    value: number,
    widthPercents?: number[],
    multiline = false,
-    maxWidth?: number
+    maxWidth?: number,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
    super(
+      globalType,
      0,
      0,
      [
-        multiline ? new MultilineText(0, 0, label) : new Text(0, 0, label),
-        new Text(0, 0, value.toString(), {
+        multiline
+          ? new MultilineText(globalType, 0, 0, label)
+          : new Text(globalType, 0, 0, label),
+        new Text(globalType, 0, 0, value.toString(), {
          align: 'right',
        }),
      ],
      maxWidth,
      widthPercents,
-      []
+      [],
+      context
    );
    this.label = label;
    this.value = value;
  }
+
+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const resultDoc = super.renderHtml(doc, parent, cssRules, sheet);
+    parent.lastElementChild?.classList?.add('labelled-value');
+    return resultDoc;
+  }
 }
--- a/src/elements/labelled-values.ts
+++ b/src/elements/labelled-values.ts
@@ -3,19 +3,24 @@ import { Column } from './column';
 import { LabelledValue } from './labelled-value';
 import jsPDF from 'jspdf';
 import { MARGINS } from '../constants';
+import { IContext } from './context';
+import { AbstractElement } from './abstract-element';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class LabelledValues extends Row {
  public labelledValues: { label: string; value: number }[];
  public nbrOfCol: number;

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    labelledValues: { label: string; value: number }[],
    nbrOfCol?: number,
-    multiline = false
+    multiline = false,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, []);
+    super(globalType, x, y, [], undefined, undefined, undefined, context);
    this.labelledValues = labelledValues;
    this.nbrOfCol = nbrOfCol ?? 3;
    if (this.nbrOfCol > 3) {
@@ -35,7 +40,9 @@ export class LabelledValues extends Row {
          rest > 2 ? nbrPerCol + 1 : nbrPerCol,
        ];
        for (let i = 0; i < this.nbrOfCol; i++) {
-          this.elements[i] = new Column(0, 0, []);
+          this.contextElements[i] = new Column(globalType, 0, 0, [], {
+            name: `${this.context.name}-column`,
+          });
        }
        for (let i = 0; i < labelledValues.length; i++) {
          if (i < nbrPerCols[0]) {
@@ -45,8 +52,9 @@ export class LabelledValues extends Row {
          } else {
            currentIndex = 2;
          }
-          (<Column>this.elements[currentIndex]).elements.push(
+          (<Column>this.contextElements[currentIndex]).contextElements.push(
            new LabelledValue(
+              globalType,
              labelledValues[i].label,
              labelledValues[i].value,
              widthPercent,
@@ -55,19 +63,24 @@ export class LabelledValues extends Row {
          );
        }
      } else {
-        this.elements.push(
+        this.contextElements.push(
          new Column(
+            globalType,
            0,
            0,
            labelledValues.map(
              (libelledValue) =>
                new LabelledValue(
+                  globalType,
                  libelledValue.label,
                  libelledValue.value,
                  widthPercent,
                  multiline
                )
-            )
+            ),
+            {
+              name: `${this.context.name}-column`,
+            }
          )
        );
      }
@@ -77,8 +90,8 @@ export class LabelledValues extends Row {
  public prepareRender(doc: jsPDF, maxWidth?: number): jsPDF {
    const pageWidth = doc.internal.pageSize.width;
    const rowWidth = pageWidth - this.x - MARGINS.right;
-    for (const column of this.elements) {
-      for (const labelledValue of (<Column>column).elements) {
+    for (const column of this.pdfElements) {
+      for (const labelledValue of (<Column>column).pdfElements) {
        labelledValue.maxWidth = rowWidth / this.nbrOfCol;
      }
    }
--- a/src/elements/multiline-text.ts
+++ b/src/elements/multiline-text.ts
@@ -1,18 +1,22 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF, { TextOptionsLight } from 'jspdf';
-import { i18nLocalize, TEXT_SIZE } from '../constants';
+import { HTML_TEXT_SIZE, i18nLocalize, TEXT_SIZE } from '../constants';
 import { Text } from './text';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class MultilineText extends Text {
  private nbrLine = 1;

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    text: string,
-    textOptions?: TextOptionsLight
+    textOptions?: TextOptionsLight,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, text, textOptions);
+    super(globalType, x, y, text, textOptions, context);
  }

  public prepareRender(doc: jsPDF, maxWidth?: number): jsPDF {
@@ -32,6 +36,27 @@ export class MultilineText extends Text {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const text = doc.createElement('p');
+    const css = `text-${TEXT_SIZE}`;
+    text.classList.add(`multiline-text`);
+    text.classList.add(css);
+    text.classList.add(this.context.name);
+    if (!cssRules.includes(css)) {
+      cssRules.push(css);
+      sheet.innerHTML += ` .${css} { font-size: ${HTML_TEXT_SIZE}rem }`;
+      sheet.innerHTML += ` .labelled-text > .${css} { font-size: ${HTML_TEXT_SIZE}rem; margin: 0; }`;
+    }
+    text.innerHTML = i18nLocalize(this.text);
+    parent.append(text);
+    return doc;
+  }
+
  public getHeight(doc): number {
    return this.getHeightFromPx(doc, TEXT_SIZE) * this.nbrLine;
  }
--- a/src/elements/row.ts
+++ b/src/elements/row.ts
@@ -1,28 +1,31 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF from 'jspdf';
 import { MARGINS } from '../constants';
+import { IContext } from './context';
+import { AbstractContainerElement } from './abstract-container-element';
+import { GenerateTypeEnum } from './generate-type.enum';

-export class Row extends AbstractElement {
-  public elements: AbstractElement[] = [];
+export class Row extends AbstractContainerElement {
  public widthPercents?: number[];
  public maxWidths?: number[];

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    elements: AbstractElement[],
    maxWidth?: number | undefined,
    widthPercents?: number[],
-    maxWidths?: number[]
+    maxWidths?: number[],
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, maxWidth);
-    this.elements = elements ?? [];
+    super(globalType, x, y, maxWidth, elements, context);
    this.widthPercents = widthPercents ?? [];
    this.maxWidths = maxWidths ?? [];
  }

  public prepareRender(doc: jsPDF, maxWidth?: number): jsPDF {
-    const elements = this.elements ?? [];
+    const elements = this.pdfElements ?? [];
    let maxWidths = this.maxWidths ?? [];
    let widthPercents = this.widthPercents ?? [];

@@ -60,9 +63,27 @@ export class Row extends AbstractElement {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    div.classList.add(`row`);
+    div.classList.add(this.context.name);
+    const elements = this.htmlElements ?? [];
+    for (let i = 0; i < elements.length; i++) {
+      const element = elements[i];
+      element.renderHtml(doc, div, cssRules, sheet);
+    }
+    parent.append(div);
+    return doc;
+  }
+
  public getHeight(doc?: jsPDF): number {
    let maxHeight = 0;
-    for (const element of this.elements) {
+    for (const element of this.pdfElements) {
      maxHeight = Math.max(maxHeight, element.getHeight(doc));
    }
    return maxHeight;
@@ -70,21 +91,9 @@ export class Row extends AbstractElement {

  public getCheckNewPageHeight(doc?: jsPDF): number {
    let maxHeight = 0;
-    for (const element of this.elements) {
+    for (const element of this.pdfElements) {
      maxHeight = Math.max(maxHeight, element.getCheckNewPageHeight(doc));
    }
    return maxHeight;
  }
-
-  public getElements(): AbstractElement[] {
-    const elements: AbstractElement[] = [];
-    for (const element of this.elements) {
-      elements.push(...element.getElements());
-    }
-    return elements;
-  }
-
-  public isEmpty(): boolean {
-    return this.elements.length === 0;
-  }
 }
--- a/src/elements/separator.ts
+++ b/src/elements/separator.ts
@@ -1,10 +1,18 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF from 'jspdf';
 import { MARGINS } from '../constants';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Separator extends AbstractElement {
-  constructor(x: number, y: number, maxWidth?: number | undefined) {
-    super(x, y, maxWidth);
+  constructor(
+    globalType: GenerateTypeEnum,
+    x: number,
+    y: number,
+    maxWidth?: number | undefined,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
+  ) {
+    super(globalType, x, y, maxWidth, context);
  }

  public getHeight(_doc?: jsPDF): number {
@@ -33,6 +41,19 @@ export class Separator extends AbstractElement {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    _cssRules: string[],
+    _sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    div.classList.add(`separator`);
+    div.classList.add(this.context.name);
+    parent.append(div);
+    return doc;
+  }
+
  public getElements(): AbstractElement[] {
    return [this];
  }
--- a/src/elements/text.ts
+++ b/src/elements/text.ts
@@ -1,18 +1,22 @@
 import { AbstractElement } from './abstract-element';
 import jsPDF, { TextOptionsLight } from 'jspdf';
-import { i18nLocalize, TEXT_SIZE } from '../constants';
+import { HTML_TEXT_SIZE, i18nLocalize, TEXT_SIZE } from '../constants';
+import { IContext } from './context';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Text extends AbstractElement {
  public text: string;
  public textOptions?: TextOptionsLight;

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    text: string,
-    textOptions?: TextOptionsLight
+    textOptions?: TextOptionsLight,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, textOptions?.maxWidth);
+    super(globalType, x, y, textOptions?.maxWidth, context);
    this.text = text;
    this.textOptions = textOptions;
  }
@@ -36,6 +40,27 @@ export class Text extends AbstractElement {
    return doc;
  }

+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const text = doc.createElement('p');
+    const css = `text-${TEXT_SIZE}`;
+    text.classList.add(`ellipsis`);
+    text.classList.add(css);
+    text.classList.add(this.context.name);
+    text.innerHTML = i18nLocalize(i18nLocalize(this.text));
+    if (!cssRules.includes(css)) {
+      cssRules.push(css);
+      sheet.innerHTML += ` .${css} { font-size: ${HTML_TEXT_SIZE}rem }`;
+      sheet.innerHTML += ` .labelled-text > .${css} { font-size: ${HTML_TEXT_SIZE}rem; margin: 0; }`;
+    }
+    parent.append(text);
+    return doc;
+  }
+
  protected updateMaxWidth(maxWidth?: number) {
    if (maxWidth != null && maxWidth > 0) {
      this.maxWidth = maxWidth;
--- a/src/elements/texts.ts
+++ b/src/elements/texts.ts
@@ -4,19 +4,24 @@ import jsPDF from 'jspdf';
 import { MARGINS } from '../constants';
 import { Text } from './text';
 import { MultilineText } from './multiline-text';
+import { IContext } from './context';
+import { AbstractElement } from './abstract-element';
+import { GenerateTypeEnum } from './generate-type.enum';

 export class Texts extends Row {
  public texts: string[];
  public nbrOfCol: number;

  constructor(
+    globalType: GenerateTypeEnum,
    x: number,
    y: number,
    texts: string[],
    nbrOfCol?: number,
-    multiline = false
+    multiline = false,
+    context: Partial<IContext> = AbstractElement.DEFAULT_CONTEXT
  ) {
-    super(x, y, []);
+    super(globalType, x, y, [], undefined, undefined, undefined, context);
    this.texts = texts;
    this.nbrOfCol = nbrOfCol ?? 4;
    if (this.nbrOfCol > 4) {
@@ -34,7 +39,7 @@ export class Texts extends Row {
          rest > 3 ? nbrPerCol + 1 : nbrPerCol,
        ];
        for (let i = 0; i < this.nbrOfCol; i++) {
-          this.elements[i] = new Column(0, 0, []);
+          this.contextElements[i] = new Column(this.globalType, 0, 0, []);
        }
        for (let i = 0; i < texts.length; i++) {
          if (i < nbrPerCols[0]) {
@@ -46,25 +51,26 @@ export class Texts extends Row {
          } else {
            currentIndex = 3;
          }
-          (<Column>this.elements[currentIndex]).elements.push(
-            new Row(0, 0, [
+          (<Column>this.contextElements[currentIndex]).contextElements.push(
+            new Row(this.globalType, 0, 0, [
              multiline
-                ? new MultilineText(0, 0, texts[i])
-                : new Text(0, 0, texts[i]),
+                ? new MultilineText(this.globalType, 0, 0, texts[i])
+                : new Text(this.globalType, 0, 0, texts[i]),
            ])
          );
        }
      } else {
-        this.elements.push(
+        this.contextElements.push(
          new Column(
+            this.globalType,
            0,
            0,
            texts.map(
              (text) =>
-                new Row(0, 0, [
+                new Row(this.globalType, 0, 0, [
                  multiline
-                    ? new MultilineText(0, 0, text)
-                    : new Text(0, 0, text),
+                    ? new MultilineText(this.globalType, 0, 0, text)
+                    : new Text(this.globalType, 0, 0, text),
                ])
            )
          )
@@ -76,8 +82,8 @@ export class Texts extends Row {
  public prepareRender(doc: jsPDF, maxWidth?: number): jsPDF {
    const pageWidth = doc.internal.pageSize.width;
    const rowWidth = pageWidth - this.x - MARGINS.right;
-    for (const column of this.elements) {
-      for (const labelledValue of (<Column>column).elements) {
+    for (const column of this.pdfElements) {
+      for (const labelledValue of (<Column>column).pdfElements) {
        labelledValue.maxWidth = rowWidth / this.nbrOfCol;
      }
    }
--- a/src/html-builder.ts
+++ b/src/html-builder.ts
@@ -0,0 +1,94 @@
+import { AbstractElement } from './elements/abstract-element';
+import { AbstractBuilder } from './abstract-builder';
+import { saveAs } from 'file-saver';
+import {
+  HTML_LABEL_SIZE,
+  HTML_TEXT_SIZE,
+  i18n,
+  LABEL_SIZE,
+  TEXT_SIZE,
+} from './constants';
+import { GenerateTypeEnum } from './elements/generate-type.enum';
+
+export class HtmlBuilder extends AbstractBuilder {
+  public doc: Document;
+  public styleSheet: HTMLStyleElement;
+
+  constructor() {
+    super();
+    this.doc = document.implementation.createHTMLDocument();
+    const style = document.createElement('style');
+    style.innerHTML = '.column { display: flex; flex-direction: column; }';
+    style.innerHTML += ' .main-column { align-items: center; }';
+    style.innerHTML += ' .row { display: flex; flex-direction: row }';
+    style.innerHTML += ' .row:not(.labelled-value) { gap: 5em; }';
+    style.innerHTML +=
+      ' .row.labelled-value { gap: 10px; justify-content: space-between; }';
+    style.innerHTML +=
+      ' .separator { border: 1px solid; width: 100%; height: 0px }';
+    style.appendChild(document.createTextNode(''));
+    this.doc.head.appendChild(style);
+    this.styleSheet = style;
+    const meta1 = document.createElement('meta');
+    meta1.setAttribute('charset', 'UTF-8');
+    this.doc.head.appendChild(meta1);
+    const meta2 = document.createElement('meta');
+    meta2.setAttribute('name', 'viewport');
+    meta2.setAttribute(
+      'content',
+      'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=yes'
+    );
+    this.doc.head.appendChild(meta2);
+  }
+
+  public getLabelledRowHeight(): number {
+    return 0;
+  }
+
+  public save(name: string) {
+    this.doc.title = name;
+    const blob = new Blob(
+      [
+        `<html lang="${i18n().lang}">
+    ${this.doc.documentElement.innerHTML}
+    </html>`,
+      ],
+      { type: 'text/html;charset=utf-8' }
+    );
+    saveAs(blob, `${name}.html`);
+  }
+
+  public build(elements: AbstractElement[]) {
+    const cssList: string[] = [];
+    for (const element of elements.filter((el) => el.context.isHtml)) {
+      element.renderHtml(this.doc, this.doc.body, cssList, this.styleSheet);
+    }
+    // Mobile start
+    this.styleSheet.innerHTML += ' @media screen and (max-width: 959px) {';
+    this.styleSheet.innerHTML += ` .text-${TEXT_SIZE} { font-size: ${
+      2 * HTML_TEXT_SIZE
+    }rem; }`;
+    this.styleSheet.innerHTML += ` .labelled-text > .text-${TEXT_SIZE} { font-size: ${
+      2 * HTML_TEXT_SIZE
+    }rem; margin: 0; }`;
+    this.styleSheet.innerHTML += ` .label-${LABEL_SIZE} { font-size: ${
+      2 * HTML_LABEL_SIZE
+    }rem; }`;
+    this.styleSheet.innerHTML +=
+      ' .main-column { align-items: stretch; overflow-x: hidden; }';
+    this.styleSheet.innerHTML +=
+      ' .row:not(.labelled-value) { flex-wrap: wrap; gap: 0 5em; }';
+    this.styleSheet.innerHTML += ' .skills { width: 100%; }';
+    this.styleSheet.innerHTML += ' .skills-column { width: 100%; }';
+    this.styleSheet.innerHTML += ' }';
+    // Mobile end
+  }
+
+  public getImageScale(): number {
+    return 4;
+  }
+
+  public getGenerateType(): GenerateTypeEnum {
+    return GenerateTypeEnum.HTML;
+  }
+}
--- a/src/main.ts
+++ b/src/main.ts
--- a/src/pdf-builder.ts
+++ b/src/pdf-builder.ts
@@ -1,17 +1,29 @@
 import jsPDF, { jsPDFOptions } from 'jspdf';
 import { AbstractElement } from './elements/abstract-element';
-import { MARGINS } from './constants';
+import { LABEL_SIZE, MARGINS, TEXT_SIZE } from './constants';
+import { AbstractBuilder } from './abstract-builder';
+import { Util } from './util';
+import { GenerateTypeEnum } from './elements/generate-type.enum';

-export class PdfBuilder {
+export class PdfBuilder extends AbstractBuilder {
  public doc: jsPDF;

  constructor(options: jsPDFOptions) {
+    super();
    this.doc = new jsPDF(options);
  }

+  public getLabelledRowHeight(): number {
+    return Util.getHeightFromPx(this.doc, TEXT_SIZE + LABEL_SIZE) + 1;
+  }
+
+  public save(name: string) {
+    this.doc.save(`${name}.pdf`);
+  }
+
  public build(elements: AbstractElement[]) {
    const finalElements: AbstractElement[] = [];
-    for (const element of elements) {
+    for (const element of elements.filter((el) => el.context.isPdf)) {
      element.prepareRender(this.doc);
      finalElements.push(...element.getElements());
    }
@@ -58,4 +70,12 @@ export class PdfBuilder {
      }
    }
  }
+
+  public getImageScale(): number {
+    return 1;
+  }
+
+  public getGenerateType(): GenerateTypeEnum {
+    return GenerateTypeEnum.PDF;
+  }
 }
Author	SHA1	Message	Date
Gitlab CI	7279b93e4c	chore: Release 3.0.1	2024-02-16 14:33:49 +00:00
Matthieu CAILLEAUX	1d940892d7	update manifest	2024-02-16 15:32:22 +01:00
Gitlab CI	612ed7b631	chore: Release 3.0.0	2023-06-26 11:20:06 +00:00
Matthieu CAILLEAUX	fcd74152bb	update release version dep	2023-06-26 13:15:39 +02:00
Matthieu CAILLEAUX	3451c86b36	chore: V11 compat	2023-06-26 12:43:35 +02:00
Gitlab CI	fc49c91024	chore: Release 2.0.0	2022-10-07 12:55:26 +00:00
Matthieu CAILLEAUX	c3c4027511	chore: V10 compat	2022-10-07 14:53:03 +02:00
Matthieu CAILLEAUX	a0fffb6cf7	chore: V10 compat	2022-10-07 14:47:17 +02:00
Gitlab CI	f9c1045557	chore: Release 1.2.0	2022-04-29 11:47:01 +00:00
Matthieu CAILLEAUX	b759c032a8	chore: docs	2022-04-29 13:44:36 +02:00
Matthieu CAILLEAUX	851bc738e5	fix: regression generate pdf	2022-04-29 13:38:39 +02:00
Matthieu CAILLEAUX	049c77a004	feat: add mobile css	2022-04-27 23:36:15 +02:00
Matthieu CAILLEAUX	b16967c351	feat: base html sheet	2022-04-26 21:11:35 +02:00
Matthieu CAILLEAUX	986d50a5eb	feat: init export html button	2022-04-23 21:05:13 +02:00
Matthieu CAILLEAUX	a246f899f4	chore: release node update	2022-01-30 19:55:13 +01:00
Matthieu CAILLEAUX	b5c6b5510e	chore: sync package lock	2022-01-30 19:46:32 +01:00
Gitlab CI	1e61719838	chore: Release 1.1.0	2021-12-28 20:14:57 +00:00
Matthieu Cailleaux	227188b012	feat: add actor contextual menu to export	2021-12-28 21:12:51 +01:00
Matthieu CAILLEAUX	790c043c70	chore: maj package	2021-12-27 22:28:47 +01:00
Matthieu CAILLEAUX	02bba5fef0	chore: correct module json	2021-12-27 22:18:35 +01:00
Matthieu CAILLEAUX	c3a1b4566a	chore: update pipeline dep version	2021-12-27 22:12:59 +01:00
Matthieu CAILLEAUX	7e90096586	Merge branch 'master' of gitlab.com:greenskin-foundryvtt/wfrp4-actor-sheet-print	2021-12-27 12:38:07 +01:00
Matthieu CAILLEAUX	158653e726	chore: update pipeline dep version	2021-12-27 12:37:33 +01:00