chore: Upgrade dependencies

.drone.yml

@@ -0,0 +1,61 @@
+---
+# drone encrypt Weko/pdf-editor $AWS_ACCESS_KEY_ID
+kind: secret
+name: AWS_ACCESS_KEY_ID
+data: /saVhwaoFWeXGk4lOiqngq+bF0G+zOiER1SJTP1LNfqddb3wyX/NXW+U380RIXOLr0UFuwCF
+
+---
+# drone encrypt Weko/pdf-editor $AWS_SECRET_ACCESS_KEY
+kind: secret
+name: AWS_SECRET_ACCESS_KEY
+data: Wkomm6zPGKFdmBkihm+2up253pBGUOIHueqDlanMD/yyOekI1ss1VYCn4+/7LZ+BC24wQnAtS8n7yDI14zNlbtkINSmbWX087ziBPXKbJ3ovs49TDkCsYwkFp6Y=
+
+---
+kind: pipeline
+type: docker
+name: production
+
+steps:
+- name: install npm
+  image: node:current-alpine
+  volumes:
+  - name: assets
+    path: /drone/src/node_modules
+  commands:
+  - npm install --ignore-scripts
+  - npm run test
+
+- name: build website
+  image: jakejarvis/hugo-extended
+  environment:
+    AWS_ACCESS_KEY_ID:
+      from_secret: AWS_ACCESS_KEY_ID
+    AWS_SECRET_ACCESS_KEY:
+      from_secret: AWS_SECRET_ACCESS_KEY
+  volumes:
+  - name: assets
+    path: /drone/src/node_modules
+  - name: hugo-resources
+    path: /drone/src/resources
+  commands:
+  - hugo --gc --minify
+  - hugo deploy
+
+- name: notify
+  image: plugins/matrix@sha256:f1affb31b0c86963c97c6f976fa0dcb3cc84272057fd8558d609d28b3064bd7f
+  settings:
+    homeserver: https://converser.eu
+    roomid: "QwOITmkKxRJJyCSDOZ:converser.eu"
+    userid: "resilien:converser.eu"
+    accesstoken:
+      from_secret: MATRIX_ACCESSTOKEN
+  when:
+    status: [ failure ]
+
+volumes:
+- name: assets
+  host:
+    path: /tmp/drone/cache/weko/pdf-editor/node_modules
+- name: hugo-resources
+  host:
+    path: /tmp/drone/cache/weko/pdf-editor/resources

.editorconfig

@@ -0,0 +1,11 @@
+# editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

.eslintignore

@@ -0,0 +1 @@
+node_modules

.eslintrc.json

@@ -0,0 +1,30 @@
+{
+    "env": {
+      "browser": true,
+      "commonjs": true,
+      "es6": true,
+      "node": true
+    },
+    "extends": "eslint:recommended",
+    "globals": {
+      "bootstrap": "readonly"
+    },
+    "parserOptions": {
+      "ecmaVersion": 2018,
+      "sourceType": "module"
+    },
+    "rules": {
+      "no-console": 0,
+      "quotes": ["error", "single"],
+      "comma-dangle": [
+        "error",
+        {
+          "arrays": "always-multiline",
+          "objects": "always-multiline",
+          "imports": "always-multiline",
+          "exports": "always-multiline",
+          "functions": "ignore"
+        }
+      ]
+    }
+  }

.stylelintignore

@@ -0,0 +1 @@
+node_modules

.stylelintrc.json

@@ -0,0 +1,47 @@
+{
+    "extends": "stylelint-config-standard-scss",
+    "rules": {
+      "no-empty-source": null,
+      "scss/comment-no-empty": null,
+      "scss/at-extend-no-missing-placeholder": null,
+      "scss/dollar-variable-colon-space-after": null,
+      "scss/dollar-variable-empty-line-before": null,
+      "media-feature-range-notation": null,
+      "color-function-notation": null,
+      "alpha-value-notation": null,
+      "selector-id-pattern": null,
+      "selector-class-pattern": null,
+      "scss/no-global-function-names": null,
+      "number-max-precision": null,
+      "hue-degree-notation": null,
+      "value-no-vendor-prefix": null,
+      "property-no-vendor-prefix": null,
+      "at-rule-no-unknown": [
+        true,
+        {
+          "ignoreAtRules": [
+            "extend",
+            "at-root",
+            "debug",
+            "warn",
+            "error",
+            "if",
+            "else",
+            "for",
+            "each",
+            "while",
+            "mixin",
+            "include",
+            "content",
+            "return",
+            "function",
+            "tailwind",
+            "apply",
+            "responsive",
+            "variants",
+            "screen"
+          ]
+        }
+      ]
+    }
+  }

README.md

@@ -25,7 +25,8 @@ Le logiciel est en version alpha et donc ne fonctionne pas actuellement. Le but
     - [ ] Pouvoir ajouter/supprimer/déplacer un dessin
 - [ ] Pouvoir télécharger le fichier
 - [ ] Rendre le site léger coté Javascript (minification, suppression du code non utilisé)
-- [ ] Rendre le site multi-langue
+- [x] Déployer automatiquement sur https://pdf.weko.io
+- [x] Rendre le site multi-langue
 - [x] Afficher le fichier PDF dans une _modal_
 - [x] Rendre le site léger coté CSS (minification, suppression du code non utilisé)
 - [x] Ajout une interface pour sélectionner un fichier
@@ -37,10 +38,20 @@ Le logiciel est grandement inspiré de l'outil [signaturepdf](https://github.com
 ## Technologies
 
 Le projet utilise :
+- [Node](https://nodejs.org/fr) pour le téléchargement des dépendances avec [NPM](https://www.npmjs.com/)
 - [Hugo](https://gohugo.io/) pour la génération du site statique ainsi que son déploiement
 - [Bootstrap](https://getbootstrap.com/) pour le design du site (MIT)
 - [PDF.js](https://mozilla.github.io/pdf.js/) pour le rendu des PDFs (Apache-2.0)
 
+## Commandes
+
+Il faut avoir Node.js (dernière LTS) d'installé sur son ordinateur pour importer les dépendances et lancer la construction du site.
+
+- Installation des dépendances : `npm install`
+- Lancement du site en mode développement : `npm run start`
+- Lancement des tests : `npm run test`
+- Construction du site : `npm run build`
+
 ## License
 
 Logiciel libre sous license AGPL V3

assets/scripts/main.js

@@ -1,7 +1,7 @@
-const pdfFileField = document.getElementById("pdfFile")
+const pdfFileField = document.getElementById('pdfFile')
-const pdfModal = document.getElementById("pdfModal")
+const pdfModal = document.getElementById('pdfModal')
-const pdfModalLabel = document.getElementById("pdfModalLabel")
+const pdfModalLabel = document.getElementById('pdfModalLabel')
-const pdfModalContent = document.getElementById("pdfModalContent")
+const pdfModalContent = document.getElementById('pdfModalContent')
 
 // FILE
 
@@ -10,11 +10,11 @@ function pdfFileGetName() {
 }
 
 function pdfFileClear() {
-    pdfFileField.value = ""
+    pdfFileField.value = ''
 }
 
 async function pdfFileToBlob() {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
         const fr = new FileReader()
         const file = pdfFileField.files[0]
         fr.readAsArrayBuffer(file)
@@ -30,12 +30,12 @@ async function pdfFileToBlob() {
 function pdfModalShow() {
     pdfModalLabelUpdate();
     pdfModalContentclear()
-    new bootstrap.Modal("#pdfModal").show()
+    new bootstrap.Modal('#pdfModal').show()
     pdfModalContentLoad()
 }
 
 function pdfModalContentclear() {
-    pdfModalContent.innerHTML = ""
+    pdfModalContent.innerHTML = ''
 }
 
 async function pdfModalContentLoad() {
@@ -69,7 +69,7 @@ async function pdfModalContentLoad() {
                 // Render PDF page into canvas context
                 var renderContext = {
                     canvasContext: context,
-                    viewport: viewport
+                    viewport: viewport,
                 };
                 var renderTask = page.render(renderContext);
                 renderTask.promise.then(function () {
@@ -92,11 +92,11 @@ function pdfModalLabelUpdate() {
 // START
 
 async function start() {
-    pdfFileField.addEventListener('change', async function(event) {
+    pdfFileField.addEventListener('change', async function() {
         pdfModalShow()
     })
 
-    pdfModal.addEventListener('hidden.bs.modal', event => {
+    pdfModal.addEventListener('hidden.bs.modal', () => {
         pdfFileClear()
     })
 

assets/styles/styles.scss

@@ -48,6 +48,7 @@ body {
   color: #fff;
   border-bottom-color: #fff;
 }
+
 .bd-placeholder-img {
     font-size: 1.125rem;
     text-anchor: middle;
@@ -78,7 +79,7 @@ body {
 
   .bi {
     vertical-align: -.125em;
-    fill: currentColor;
+    fill: currentcolor;
   }
 
   .nav-scroller {

config.yml

@@ -1,5 +1,27 @@
-baseURL: http://example.org/
+baseURL: https://pdf.weko.io/
-defaultContentLanguage: fr
+defaultContentLanguage: en
+defaultContentLanguageInSubdir: true
+disableKinds: ["taxonomy", "term"]
+
+deployment:
+  targets:
+    - name: production
+      URL: s3://pdf.weko.io?endpoint=https://s3.garage.resilien.cloud&disableSSL=true&s3ForcePathStyle=true&region=garage
+
+params:
+  brand: PDF-Editor
+
+languages:
+  en:
+    languageName: English
+    weight: 10
+    # params:
+    #   icon: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="32" height="32"><path fill="#00247D" d="M0 9.059V13h5.628zM4.664 31H13v-5.837zM23 25.164V31h8.335zM0 23v3.941L5.63 23zM31.337 5H23v5.837zM36 26.942V23h-5.631zM36 13V9.059L30.371 13zM13 5H4.664L13 10.837z"/><path fill="#CF1B2B" d="M25.14 23l9.712 6.801c.471-.479.808-1.082.99-1.749L28.627 23H25.14zM13 23h-2.141l-9.711 6.8c.521.53 1.189.909 1.938 1.085L13 23.943V23zm10-10h2.141l9.711-6.8c-.521-.53-1.188-.909-1.937-1.085L23 12.057V13zm-12.141 0L1.148 6.2C.677 6.68.34 7.282.157 7.949L7.372 13h3.487z"/><path fill="#EEE" d="M36 21H21v10h2v-5.836L31.335 31H32c1.117 0 2.126-.461 2.852-1.199L25.14 23h3.487l7.215 5.052c.093-.337.158-.686.158-1.052v-.058L30.369 23H36v-2zM0 21v2h5.63L0 26.941V27c0 1.091.439 2.078 1.148 2.8l9.711-6.8H13v.943l-9.914 6.941c.294.07.598.116.914.116h.664L13 25.163V31h2V21H0zM36 9c0-1.091-.439-2.078-1.148-2.8L25.141 13H23v-.943l9.915-6.942C32.62 5.046 32.316 5 32 5h-.663L23 10.837V5h-2v10h15v-2h-5.629L36 9.059V9zM13 5v5.837L4.664 5H4c-1.118 0-2.126.461-2.852 1.2l9.711 6.8H7.372L.157 7.949C.065 8.286 0 8.634 0 9v.059L5.628 13H0v2h15V5h-2z"/><path fill="#CF1B2B" d="M21 15V5h-6v10H0v6h15v10h6V21h15v-6z"/></svg>
+  fr:
+    languageName: Français
+    weight: 20
+    # params:
+    #   icon: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="32" height="32"><path fill="#ED2939" d="M36 27c0 2.209-1.791 4-4 4h-8V5h8c2.209 0 4 1.791 4 4v18z"/><path fill="#002495" d="M4 5C1.791 5 0 6.791 0 9v18c0 2.209 1.791 4 4 4h8V5H4z"/><path fill="#EEE" d="M12 5h12v26H12z"/></svg>
 
 build:
   writeStats: true

i18n/en.yml

@@ -1,2 +1,14 @@
-title: "PDF file editor"
+title: 
-description: "Logiciel WEB libre permettant de modifier un fichier PDF"
+  other: PDF file editor
+description: 
+  other: Free WEB software allowing to modify a PDF file, reorder the pages and modify its metadata.
+selectText:
+  other: "Choose PDF File :"
+privacyInfo:
+  other: No file is sent to the server, data is processed locally in your browser.
+footerText:
+  other: Made with ❤️ by <a href="https://weko.io/">Weko</a> and hosted by <a href="https://resilien.fr/">RésiLien</a> 🐱
+buttonDownload:
+  other: Download
+buttonClose:
+  other: Close

i18n/fr.yml

@@ -1,6 +1,14 @@
 title: 
   other: Editeur de fichier PDF
 description: 
-  other: "Logiciel WEB libre permettant de modifier un fichier PDF, réordonner les pages et modifier ses métadonnées."
+  other: Logiciel WEB libre permettant de modifier un fichier PDF, réordonner les pages et modifier ses métadonnées.
-button:
+selectText:
-  other: "Choisir un fichier"
+  other: "Choisir un fichier PDF :"
+privacyInfo:
+  other: Aucun fichier n'est envoyé au serveur, les données sont traités localement dans votre navigateur.
+footerText:
+  other: Réalisé avec ❤️ par <a href="https://weko.io/">Weko</a> et hébergé par <a href="https://resilien.fr/">RésiLien</a> 🐱
+buttonDownload:
+  other: Télécharger
+buttonClose:
+  other: Fermer

layouts/alias.html

@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+{{ $defaultLanguage := (index (first 1 (where site.Home.AllTranslations "Permalink" .Permalink)) 0).Language.Lang }}
+<html lang="{{ $defaultLanguage }}">
+<head>
+    <title>{{ i18n "title" }}</title>
+    <meta name="description" content="{{ i18n "description" }}">
+    <link rel="canonical" href="{{ .Permalink }}"/>
+    <meta name="robots" content="noindex">
+    <meta charset="utf-8"/>
+    <noscript>
+        <meta http-equiv="refresh" content="0; url={{ .Permalink }}"/>
+    </noscript>
+    <script>
+      ;(function () {
+        // Only do i18n at root, 
+        // otherwise, redirect immediately
+        if (window.location.pathname !== '/') {
+          window.location.replace('{{ .Permalink }}')
+          return
+        }
+
+        var getFirstBrowserLanguage = function () {
+          var nav = window.navigator,
+          browserLanguagePropertyKeys = ['language', 'browserLanguage', 'systemLanguage', 'userLanguage'],
+          i,
+          language
+
+          if (Array.isArray(nav.languages)) {
+            for (i = 0; i < nav.languages.length; i++) {
+              language = nav.languages[i]
+              if (language && language.length) {
+                return language
+              }
+            }
+          }
+
+          // support for other well known properties in browsers
+          for (i = 0; i < browserLanguagePropertyKeys.length; i++) {
+            language = nav[browserLanguagePropertyKeys[i]]
+            if (language && language.length) {
+              return language
+            }
+          }
+
+          return '{{ $defaultLanguage }}'
+        }
+
+        var preferLang = getFirstBrowserLanguage()
+        {{ range $index, $elem := site.Home.AllTranslations }}
+        {{ if ne $index 0 }}else {{end}}if (preferLang.indexOf('{{ $elem.Lang }}') !== -1) {
+            window.location.replace('{{ $elem.Permalink }}')
+        }
+        {{ end }}
+        else {
+        {{- range site.Home.AllTranslations -}}
+        {{- if eq $defaultLanguage .Lang }}
+            window.location.replace('{{ .Permalink }}')
+        {{ end -}}
+        {{ end -}}
+        }
+      })()
+    </script>
+</head>
+<body>
+<h1>{{ i18n "title" }}</h1>
+<p>You should be rerouted in a jiff, if not, <a href="{{ .Permalink }}">click here</a>.</p>
+</body>
+</html>

layouts/index.html

@@ -3,7 +3,7 @@
     <h1>{{ i18n "title" }}</h1>
     <p class="lead">{{ i18n "description" | safeHTML }}</p>
     <p class="lead">
-      Sélectionne un PDF :
+      {{ i18n "selectText" }}
     </p>
     <p class="lead container text-center">
       <div class="row">
@@ -13,7 +13,7 @@
       </div>
     </p>
     <p class="lead">
-      Aucun fichier n'est envoyé au serveur, les données sont traités localement dans votre navigateur.
+      {{ i18n "privacyInfo" }}
     </p>
     
     <!-- Modal -->
@@ -60,13 +60,13 @@
                   <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"></path>
                   <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"></path>
                 </svg>
-                <span class="d-none d-sm-inline">Télécharger</span>
+                <span class="d-none d-sm-inline">{{ i18n "buttonDownload" }}</span>
               </button>
               <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" aria-label="Close">
                 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
                   <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"></path>
                 </svg>
-                <span class="d-none d-sm-inline">Fermer</span>
+                <span class="d-none d-sm-inline">{{ i18n "buttonClose" }}</span>
               </button>
             </div>
           </div>

layouts/partials/footer.html

@@ -1,5 +1,5 @@
 <footer class="mt-auto text-white-50">
     <p>
-        Réalisé avec ❤️ par <a href="https://weko.io/">Weko</a> et hébergé par <a href="https://resilien.fr/">RésiLien</a> 🐱 de façon éco‑responsable 🍃
+        {{ i18n "footerText" | safeHTML }}
     </p>
 </footer>

layouts/partials/header.html

@@ -1,12 +1,15 @@
 <header class="mb-auto">
     <div>
-        <h3 class="float-md-start mb-0">PDF-Editor</h3>
+        <h3 class="float-md-start mb-0">{{ .Site.Params.brand }}</h3>
-        {{/*
+        {{ if .Site.IsMultiLingual }}
+        {{ $currentLanguage := .Language }}</p>
         <nav class="nav nav-masthead justify-content-center float-md-end">
-            <a class="nav-link fw-bold py-1 px-0 active" aria-current="page" href="#">Home</a>
+            {{ range $.Site.Home.AllTranslations }}
-            <a class="nav-link fw-bold py-1 px-0" href="#">Features</a>
+            <a title="{{ .Language.LanguageName }}" href="{{ .Permalink }}" class="nav-link fw-bold py-1 px-0{{ if eq $currentLanguage.Lang .Lang }} active{{ end }}" aria-current="page" href="#">
-            <a class="nav-link fw-bold py-1 px-0" href="#">Contact</a>
+                {{ or (.Language.Params.icon | safeHTML) .Lang }}
+            </a>
+            {{ end }}
         </nav>
-        */}}
+        {{ end }}
     </div>
 </header>

package.json

@@ -5,19 +5,34 @@
   "author": "Weko",
   "version": "1.0.0",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "prebuild": "npm run clean",
+    "build": "node_modules/.bin/hugo/hugo --gc --minify",
+    "prestart": "npm run clean",
+    "start": "node_modules/.bin/hugo/hugo server --bind=0.0.0.0 --disableFastRender",
+    "clean": "rm -rf public resources",
+    "lint": "npm run -s lint:scripts && npm run -s lint:styles",
+    "lint:scripts": "eslint assets/scripts",
+    "lint:styles": "stylelint \"assets/styles/**/*.{css,sass,scss,sss,less}\"",
+    "test": "npm run -s lint",
+    "postinstall": "hugo-installer --version otherDependencies.hugo --extended --destination node_modules/.bin/hugo"
   },
-  "dependencies": {
+  "devDependencies": {
     "@fullhuman/postcss-purgecss": "^5.0.0",
     "autoprefixer": "^10.4.14",
     "bootstrap": "^5.2.3",
-    "bootstrap-icons": "^1.10.5",
     "cssnano": "^6.0.1",
     "cssnano-preset-advanced": "^6.0.1",
-    "esbuild": "^0.17.19",
+    "esbuild": "^0.19.9",
-    "pdfjs-dist": "^3.6.172",
+    "eslint": "^8.40.0",
+    "hugo-installer": "^4.0.1",
+    "pdfjs-dist": "^4.0.269",
     "postcss": "^8.4.23",
-    "postcss-cli": "^10.1.0"
+    "postcss-cli": "^11.0.0",
+    "stylelint": "^16.0.2",
+    "stylelint-config-standard-scss": "^12.0.0"
+  },
+  "otherDependencies": {
+    "hugo": "0.121.1"
   },
   "comments": {
     "dependencies": {