Release 2.5.0

Merge branch 'update_geovisio_2_5' into 'develop'
Update geovisio to 2.5 See merge request geovisio/website!128
2024-03-11 11:42:26 +01:00 · 2024-03-11 08:47:03 +00:00 · 2024-03-11 08:47:03 +00:00 · 2024-03-05 13:30:13 +01:00 · 2024-03-05 13:30:13 +01:00 · 2024-03-05 12:27:47 +00:00
14 changed files with 4044 additions and 1711 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

 Before _0.1.0_, website development was on rolling release, meaning there are no version tags.

+## [2.5.0] - 2024-03-11
+
+### Changed
+
+- GeoVisio web viewer updated to [2.5.0](https://gitlab.com/geovisio/web-viewer/-/compare/2.4.0...2.5.0) to reduce tiles size.
+
+## [2.4.1] - 2024-02-01
+
+### Fixed
+
+- Fix geovisio version yarn.lock
+
 ## [2.4.0] - 2024-01-31

 ### Added
@@ -180,7 +192,9 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 - Header have now a new entry `Mes photos` when the user is logged to access to the sequence list
 - The router guard for logged pages has been changed to not call the api to check the token

-[unreleased]: https://gitlab.com/geovisio/website/-/compare/2.4.0...develop
+[unreleased]: https://gitlab.com/geovisio/website/-/compare/2.5.0...develop
+[2.5.0]: https://gitlab.com/geovisio/website/-/compare/2.4.1...2.5.0
+[2.4.1]: https://gitlab.com/geovisio/website/-/compare/2.4.0...2.4.1
 [2.4.0]: https://gitlab.com/geovisio/website/-/compare/2.3.1...2.4.0
 [2.3.1]: https://gitlab.com/geovisio/website/-/compare/2.3.0...2.3.1
 [2.3.0]: https://gitlab.com/geovisio/website/-/compare/2.2.3...2.3.0
--- a/index.html
+++ b/index.html
@@ -4,6 +4,31 @@
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" href="/static/favicon.ico" />
+    <title>
+      Panoramax <%- instanceName %> : photo-cartographier les territoires
+    </title>
+    <meta
+      name="description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta
+      name="twitter:title"
+      content="Panoramax <%- instanceName %> : photo-cartographier les territoires"
+    />
+    <meta
+      name="og:title"
+      content="Panoramax <%- instanceName %> : photo-cartographier les territoires"
+    />
+    <meta
+      name="twitter:description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta
+      name="og:description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta name="og:image" content="<%- frontUrl %>/static/meta-img.jpg" />
+    <meta name="twitter:image" content="<%- frontUrl %>/static/meta-img.jpg" />
  </head>
  <body>
    <div id="app"></div>
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "geovisio-website",
-  "version": "2.3.1",
+  "version": "2.5.0",
  "engines": {
    "node": "18.16.1"
  },
@@ -25,7 +25,7 @@
    "axios": "^1.2.3",
    "bootstrap": "^5.2.3",
    "bootstrap-icons": "^1.10.3",
-    "geovisio": "2.4.0",
+    "geovisio": "2.5.0",
    "moment": "^2.29.4",
    "pako": "^2.1.0",
    "pinia": "^2.1.4",
@@ -35,7 +35,7 @@
    "vue-draggable-resizable-vue3": "^2.3.1-beta.13",
    "vue-eslint-parser": "^9.1.0",
    "vue-i18n": "9.2.2",
-    "vue-meta": "^3.0.0-alpha.10",
+    "vue-matomo": "^4.2.0",
    "vue-router": "^4.1.6",
    "vue3-cookies": "^1.0.6",
    "vue3-smooth-scroll": "^0.8.1"
@@ -70,6 +70,7 @@
    "typescript": "~4.7.4",
    "vite": "^3.2.4",
    "vite-plugin-eslint": "^1.8.1",
+    "vite-plugin-html": "^3.2.2",
    "vitest": "^0.25.3",
    "vue-tsc": "^1.0.9"
  },
--- a/src/App.vue
+++ b/src/App.vue
@@ -3,28 +3,14 @@ import { ref, computed } from 'vue'
 import Header from '@/components/Header.vue'
 import Footer from '@/components/Footer.vue'
 import { RouterView } from 'vue-router'
-import { useMeta } from 'vue-meta'
 import { useI18n } from 'vue-i18n'
 import { hasASessionCookieDecoded } from '@/utils/auth'
-import { title } from '@/utils/index'
 import authConfig from './composables/auth'
 const { authConf } = authConfig()
 const { t } = useI18n()

 let focusMap = ref<string>('focus-map')

-useMeta({
-  title: title(t('general.title')),
-  og: {
-    title: title(t('general.meta.title')),
-    description: title(t('general.meta.description'))
-  },
-  twitter: {
-    title: title(t('general.meta.title')),
-    description: title(t('general.meta.description'))
-  }
-})
-
 function setFocusMap(value: string) {
  focusMap.value = value
 }
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -1,6 +1,7 @@
 {
  "general": {
-    "title": "Instance Panoramax",
+    "title": "DESC Panoramax {instanceName}: photo-cartographier les territoires",
+    "description": "DESC L'instance Panoramax {instanceName} permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages.",
    "meta": {
      "title": "Instance Panoramax",
      "description": "Panoramax, l’alternative libre pour photo-cartographier les territoires"
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,10 +1,10 @@
 import { createApp } from 'vue'
 import { createI18n } from 'vue-i18n'
+import VueMatomo from 'vue-matomo'
 import App from './App.vue'
 import router from './router'
 import axios from 'axios'
 import VueAxios from 'vue-axios'
-import { createMetaManager } from 'vue-meta'
 import { VueDraggableResizable } from 'vue-draggable-resizable-vue3'
 import VCalendar from 'v-calendar'
 import 'v-calendar/style.css'
@@ -17,8 +17,17 @@ import 'bootstrap/dist/css/bootstrap.css'
 import 'bootstrap-icons/font/bootstrap-icons.css'
 import 'geovisio/build/index.css'

+declare global {
+  interface Window {
+    _paq: any[]
+  }
+}
+
 axios.defaults.baseURL = import.meta.env.VITE_API_URL
 axios.defaults.withCredentials = true
+const matomoHost = import.meta.env.VITE_MATOMO_HOST
+const matomoSiteId = import.meta.env.VITE_MATOMO_SITE_ID
+const matomoExist = matomoHost && matomoSiteId

 const i18n = createI18n({
  locale: navigator.language.split('-')[0],
@@ -34,13 +43,20 @@ const i18n = createI18n({
 })

 const app = createApp(App)
-
 app.use(pinia)
 app.use(i18n)
 app.use(router)
 app.use(VueAxios, axios)
 app.provide('axios', app.config.globalProperties.axios)
-app.use(createMetaManager())
 app.use(VueDraggableResizable)
 app.use(VCalendar)
+if (matomoExist) {
+  app.use(VueMatomo, {
+    host: matomoHost,
+    siteId: matomoExist
+  })
+}
 app.mount('#app')
+if (matomoExist) {
+  window._paq.push(['trackPageView']) // Pour suivre les visites sur vos pages
+}
--- a/src/tests/unit/utils.spec.js
+++ b/src/tests/unit/utils.spec.js
@@ -12,7 +12,6 @@ import {
  hasASessionCookieDecoded
 } from '../../utils/auth'
 import { img } from '../../utils/image'
-import { title } from '../../utils/index'
 import { useCookies } from 'vue3-cookies'
 vi.mock('vue3-cookies', () => {
  const mockCookies = {
@@ -185,19 +184,6 @@ describe('img', () => {
  })
 })

-describe('title', () => {
-  it('should return the formated title with instance name', () => {
-    import.meta.env.VITE_INSTANCE_NAME = 'my instance'
-    const myTitle = 'my title'
-    expect(title(myTitle)).toEqual('my title my instance')
-  })
-  it('should return the formated title without instance name', () => {
-    import.meta.env.VITE_INSTANCE_NAME = ''
-    const myTitle = 'my title'
-    expect(title(myTitle)).toEqual('my title')
-  })
-})
-
 describe('sortByName', () => {
  it('should return the the list sorted by name', () => {
    const list1 = [
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,9 +1,3 @@
-export function title(title: string): string {
-  const instanceName = import.meta.env.VITE_INSTANCE_NAME
-  if (instanceName) return `${title} ${instanceName}`
-  return title
-}
-
 export function createUrlLink(picId: string): string {
  return encodeURIComponent(`${window.location.origin}/#focus=pic&pic=${picId}`)
 }
--- a/src/utils/mapAndViewer.ts
+++ b/src/utils/mapAndViewer.ts
@@ -1,21 +1,29 @@
 import axios from 'axios'

-async function getIgnTiles(): Promise<object> {
-  const { data } = await axios.get(
-    'https://wxs.ign.fr/essentiels/static/vectorTiles/styles/PLAN.IGN/attenue.json'
-  )
-  data.sources.plan_ign.scheme = 'xyz'
-  data.sources.plan_ign.attribution = 'Données cartographiques : © IGN'
-  const objIndex = data.layers.findIndex(
-    (el: { id: string }) => el.id === 'toponyme - parcellaire - adresse'
-  )
-  data.layers[objIndex].layout = {
-    ...data.layers[objIndex].layout,
-    'text-field': ['concat', ['get', 'numero'], ['get', 'indice_de_repetition']]
+async function getIgnTiles(): Promise<object | string> {
+  try {
+    const { data } = await axios.get(
+      'https://wxs.ign.fr/essentiels/static/vectorTiles/styles/PLAN.IGN/attenue.json'
+    )
+    data.sources.plan_ign.scheme = 'xyz'
+    data.sources.plan_ign.attribution = 'Données cartographiques : © IGN'
+    const objIndex = data.layers.findIndex(
+      (el: { id: string }) => el.id === 'toponyme - parcellaire - adresse'
+    )
+    data.layers[objIndex].layout = {
+      ...data.layers[objIndex].layout,
+      'text-field': [
+        'concat',
+        ['get', 'numero'],
+        ['get', 'indice_de_repetition']
+      ]
+    }
+    // Patch tms scheme to xyz to make it compatible for Maplibre GL JS / Mapbox GL JS
+    // Patch num_repetition
+    return data
+  } catch (error) {
+    return 'https://tile-vect.openstreetmap.fr/styles/basic/style.json'
  }
-  // Patch tms scheme to xyz to make it compatible for Maplibre GL JS / Mapbox GL JS
-  // Patch num_repetition
-  return data
 }

 export { getIgnTiles }
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -8,10 +8,8 @@

 <script lang="ts" setup>
 import { ref } from 'vue'
-import { useI18n } from 'vue-i18n'
 import Viewer from '@/components/Viewer.vue'
 import type ViewerType from '@/components/Viewer.vue'
-const { t } = useI18n()
 const viewerRef = ref<InstanceType<typeof ViewerType>>()
 </script>
 <style scoped lang="scss">
--- a/static/meta-img.jpg
+++ b/static/meta-img.jpg
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,33 +1,62 @@
 import { fileURLToPath, URL } from 'node:url'
-import { defineConfig } from 'vite'
+import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import eslintPlugin from 'vite-plugin-eslint'
-
+import { createHtmlPlugin } from 'vite-plugin-html'
 // https://vitejs.dev/config/
-export default defineConfig({
-  server: {
-    host: true,
-    port: 5173,
-    strictPort: true,
-    hmr: {
-      clientPort: 5173,
-      overlay: false
-    }
-  },
-  base: '/',
-  plugins: [vue(), eslintPlugin()],
-  css: {
-    preprocessorOptions: {
-      scss: {
-        additionalData:
-          '@import "@/assets/font-size.scss"; @import "@/assets/rem-calc.scss";'
+export default ({ mode }) => {
+  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }
+  return defineConfig({
+    server: {
+      host: true,
+      port: 5173,
+      strictPort: true,
+      hmr: {
+        clientPort: 5173,
+        overlay: false
+      }
+    },
+    base: '/',
+    plugins: [
+      vue(),
+      eslintPlugin(),
+      createHtmlPlugin({
+        minify: true,
+        /**
+         * After writing entry here, you will not need to add script tags in `index.html`, the original tags need to be deleted
+         * @default src/main.ts
+         */
+        entry: 'src/main.ts',
+        /**
+         * If you want to store `index.html` in the specified folder, you can modify it, otherwise no configuration is required
+         * @default index.html
+         */
+        template: '/index.html',
+
+        /**
+         * Data that needs to be injected into the index.html ejs template
+         */
+        inject: {
+          data: {
+            instanceName: process.env.VITE_INSTANCE_NAME,
+            frontUrl: process.env.VITE_FRONT_URL
+          }
+        }
+      })
+    ],
+    css: {
+      preprocessorOptions: {
+        scss: {
+          additionalData:
+            '@import "@/assets/font-size.scss"; @import "@/assets/rem-calc.scss";'
+        }
+      }
+    },
+    resolve: {
+      alias: {
+        '@': fileURLToPath(new URL('./src', import.meta.url)),
+        'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js'
      }
    }
-  },
-  resolve: {
-    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url)),
-      'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js'
-    }
-  }
-})
+  })
+}
--- a/vue-matomo.d.ts
+++ b/vue-matomo.d.ts
@@ -0,0 +1 @@
+declare module 'vue-matomo'
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
antoine-de	518f06c846	Release 2.5.0	2024-03-11 11:42:26 +01:00
antoine-de	50f1f7b472	Merge branch 'update_geovisio_2_5' into 'develop' Update geovisio to 2.5 See merge request geovisio/website!128	2024-03-11 08:47:03 +00:00
antoine-de	2f4000291f	Update geovisio to 2.5	2024-03-11 08:47:03 +00:00
Jean Andreani	6ad1d85604	Feat/improve meta tag	2024-03-05 13:30:13 +01:00
Jean Andreani	707420c69e	Feat/add matomo analytics	2024-03-05 13:30:13 +01:00
Jean Andreani	1bd41002af	Merge branch 'fix/ign-tiles-fallback' into 'main' fix/ign-tiles-fallback See merge request geovisio/website!125	2024-03-05 12:27:47 +00:00
Jean Andreani	c30eeb020d	fix/ign-tiles-fallback	2024-03-05 12:27:47 +00:00
Andreani Jean	c37296066f	Release 2.4.1	2024-02-01 10:17:17 +01:00
Andreani Jean	19f5f5a320	maj geovisio	2024-02-01 10:15:00 +01:00