Added matomo tracking

README.md

@@ -8,8 +8,18 @@
 * Measure distances between two points
 * Custom client-side markers
 
+## Documentation
+### Making usable map assets
+Since we're not using earth maps, we need to build one compatible with Leaflet. I used Zoomify to generate usable tile data from my SVG maps. I don't know if this will fit your use case ; if you use something else, you can contact me !
+
+> [!IMPORTANT]
+> As of writing this, it appears Zoomify Unlimited Converter (which is what I used) is not available on Linux or for download anymore
+
+### Enabling features
+Some features are able to be toggled on and off. If you don't use multiple languages, or if you don't want the custom markers, you can disable them in the .env file. By default, all of them are true.
+
 ## Contributing
 I'm not currently accepting pull-requests for this project, but if you have a suggestion, feel free to contact me !
 
 ## Notes
-As someone with some degree of with [aphantasia](https://en.wikipedia.org/wiki/Aphantasia), I struggle with visualization and immersion, and DMing in general. If you find yourself in the same situation, I hope my little thing made your life easier !
+As someone with some degree of [aphantasia](https://en.wikipedia.org/wiki/Aphantasia), I struggle with visualization and immersion, and DMing in general. If you find yourself in the same situation, I hope my little thing made your life easier !

astro.config.mjs

@@ -17,5 +17,14 @@ export default defineConfig({
             ENABLE_BREADCRUMB: envField.boolean({ context: "server", access: "secret", default: true }),
             ENABLE_I18N: envField.boolean({ context: "server", access: "secret", default: true }),
         }
+    },
+    vite: {
+        server: {
+            watch: {
+                ignored: [
+                    '**/dist/**', // dist shouldn't be watched
+                ],
+            },
+        },
     }
 });

package.json

@@ -1,7 +1,7 @@
 {
   "name": "leim-maps",
   "type": "module",
-  "version": "1.4.12",
+  "version": "1.4.14",
   "scripts": {
     "dev": "astro dev",
     "start": "astro dev",
@@ -10,18 +10,18 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/sitemap": "^3.4.1",
-    "@astrojs/vue": "^5.1.0",
-    "@nanostores/persistent": "1.0.0",
-    "@nanostores/vue": "^1.0.1",
-    "@types/leaflet": "^1.9.20",
-    "@vueuse/core": "^13.5.0",
-    "astro": "^5.12.0",
-    "nanostores": "^1.0.1",
+    "@astrojs/sitemap": "^3.7.3",
+    "@astrojs/vue": "^7.0.1",
+    "@nanostores/persistent": "1.3.4",
+    "@nanostores/vue": "^1.1.0",
+    "@types/leaflet": "^1.9.21",
+    "@vueuse/core": "^14.3.0",
+    "astro": "^7.0.7",
+    "nanostores": "^1.4.0",
     "radix-vue": "^1.9.17",
-    "vue": "^3.5.17"
+    "vue": "^3.5.39"
   },
   "devDependencies": {
-    "sass": "^1.89.2"
+    "sass": "^1.101.0"
   }
 }

pnpm-workspace.yaml

@@ -1,3 +1,8 @@
+allowBuilds:
+  '@parcel/watcher': true
+  esbuild: true
+  sharp: true
+  vue-demi: true
 onlyBuiltDependencies:
   - '@parcel/watcher'
   - esbuild

src/i18n/ui.ts

@@ -45,8 +45,8 @@ export const translations: LanguageDict = {
             <h3>Données personnelles</h3>
             <p>Je ne collecte aucune donnée sur votre activité dans cette application. Les marqueurs personnalisés que vous pouvez placer n'existent que sur votre navigateur en tant que données de <a href="https://developer.mozilla.org/fr/docs/Web/API/Window/localStorage" target="_blank">local storage</a>.</p>
             <p>Mon hébergeur collecte des données de trafic pour des raisons de sécurité ; comme les adresses IP et leur emplacement approximatif, les types de navigateurs, les agents utilisateurs (si vous êtes un robot ou un humain) et l'état de la demande. </p>
-            <p>Ce site n'utilise pas de pixels de suivi ou d'analyse, et je n'utilise aucune autre application tierce qui pourrait collecter des données sur vous (comme Youtube ou autre).</p>
-            <p>Malgré cela, <strong>aucune de vos données n'est vendue ou transmise à un tiers quel qu'il soit</strong>.</p>
+            <p>J'utilise une instance Matomo pour mesurer l'audience du site, mais les données sont anonymisées et je ne construis aucun profil à partir de ces dernières.</p>
+            <p><strong>Aucune de vos données n'est vendue ou transmise à un tiers quel qu'il soit</strong>.</p>
             <p>Si vous avez des questions, vous pouvez me contacter à <a href="mailto:contact@alexcreates.fr">contact@alexcreates.fr</a>.</p>
         `
     },
@@ -90,9 +90,11 @@ export const translations: LanguageDict = {
             <h3>Privacy</h3>
             <p>I don't collect any data of your activity with this app. The custom markers that you may place only exist on your browser as <a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage" target="_blank">local storage</a> data.</p>
             <p>My hosting provider collects traffic data for security reasons ; like IP addresses and their approximate location, browsers types, user agents (if you're a robot or a human) and the request status.</p>
-            <p>This website doesn't use any tracking pixels or analytics, and I don't use any other third-party app that might collect stuff from you (like Youtube or anything else)</p>
-            <p>Regardless, <strong>none of your data is sold or passed to any third-party whatsoever</strong>.</p>
+            <p>This website doesn't use any other third-party app that might collect stuff from you (like Youtube or anything else)</p>
+            <p>I do use a self-hosted Matomo Instance to measure website audience, but data is anonymised and I don't build profiles with it.</p>
+            <p><strong>None of your data is sold or passed to any third-party whatsoever</strong>.</p>
             <p>If you have any questions, you can contact me at <a href="mailto:contact@alexcreates.fr">contact@alexcreates.fr</a>.</p>
         `
     }
 } as const;
+ 

src/layouts/Layout.astro

@@ -69,6 +69,21 @@ const lang = getLangFromUrl(Astro.url) || defaultLang;
             <meta name="twitter:image" content={`${Astro.site?.origin}${head.image}`} />
             <meta name="twitter:card" content="summary_large_image" />
         )}
+        <!-- Matomo -->
+        <script is:inline>
+            var _paq = window._paq = window._paq || [];
+            /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+            _paq.push(['trackPageView']);
+            _paq.push(['enableLinkTracking']);
+            (function() {
+                var u="//stats.alexcreates.fr/";
+                _paq.push(['setTrackerUrl', u+'matomo.php']);
+                _paq.push(['setSiteId', '3']);
+                var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+                g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+            })();
+        </script>
+        <!-- End Matomo Code -->
 	</head>
 	<body>
         <script is:inline>