SW/geovisio-website
2
0
Fork 0
forked from Ivasoft/geovisio-website
Code Pull Requests Packages Releases Activity

Feat/improve meta tag

Browse Source
This commit is contained in:
Jean Andreani
2024-02-07 13:31:51 +00:00
committed by Andreani Jean
parent 707420c69e
commit 6ad1d85604
10 changed files with 495 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
index.html
View File

@@ -4,6 +4,31 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="/static/favicon.ico" /> <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> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

2
package.json
View File

@@ -36,7 +36,6 @@
"vue-eslint-parser": "^9.1.0", "vue-eslint-parser": "^9.1.0",
"vue-i18n": "9.2.2", "vue-i18n": "9.2.2",
"vue-matomo": "^4.2.0", "vue-matomo": "^4.2.0",
"vue-meta": "^3.0.0-alpha.10",
"vue-router": "^4.1.6", "vue-router": "^4.1.6",
"vue3-cookies": "^1.0.6", "vue3-cookies": "^1.0.6",
"vue3-smooth-scroll": "^0.8.1" "vue3-smooth-scroll": "^0.8.1"
@@ -71,6 +70,7 @@
"typescript": "~4.7.4", "typescript": "~4.7.4",
"vite": "^3.2.4", "vite": "^3.2.4",
"vite-plugin-eslint": "^1.8.1", "vite-plugin-eslint": "^1.8.1",
"vite-plugin-html": "^3.2.2",
"vitest": "^0.25.3", "vitest": "^0.25.3",
"vue-tsc": "^1.0.9" "vue-tsc": "^1.0.9"
}, },

14
src/App.vue
View File

@@ -3,28 +3,14 @@ import { ref, computed } from 'vue'
import Header from '@/components/Header.vue' import Header from '@/components/Header.vue'
import Footer from '@/components/Footer.vue' import Footer from '@/components/Footer.vue'
import { RouterView } from 'vue-router' import { RouterView } from 'vue-router'
import { useMeta } from 'vue-meta'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { hasASessionCookieDecoded } from '@/utils/auth' import { hasASessionCookieDecoded } from '@/utils/auth'
import { title } from '@/utils/index'
import authConfig from './composables/auth' import authConfig from './composables/auth'
const { authConf } = authConfig() const { authConf } = authConfig()
const { t } = useI18n() const { t } = useI18n()
let focusMap = ref<string>('focus-map') 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) { function setFocusMap(value: string) {
focusMap.value = value focusMap.value = value
} }

3
src/locales/fr.json
View File

@@ -1,6 +1,7 @@
{ {
"general": { "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": { "meta": {
"title": "Instance Panoramax", "title": "Instance Panoramax",
"description": "Panoramax, l’alternative libre pour photo-cartographier les territoires" "description": "Panoramax, l’alternative libre pour photo-cartographier les territoires"

2
src/main.ts
View File

@@ -5,7 +5,6 @@ import App from './App.vue'
import router from './router' import router from './router'
import axios from 'axios' import axios from 'axios'
import VueAxios from 'vue-axios' import VueAxios from 'vue-axios'
import { createMetaManager } from 'vue-meta'
import { VueDraggableResizable } from 'vue-draggable-resizable-vue3' import { VueDraggableResizable } from 'vue-draggable-resizable-vue3'
import VCalendar from 'v-calendar' import VCalendar from 'v-calendar'
import 'v-calendar/style.css' import 'v-calendar/style.css'
@@ -49,7 +48,6 @@ app.use(i18n)
app.use(router) app.use(router)
app.use(VueAxios, axios) app.use(VueAxios, axios)
app.provide('axios', app.config.globalProperties.axios) app.provide('axios', app.config.globalProperties.axios)
app.use(createMetaManager())
app.use(VueDraggableResizable) app.use(VueDraggableResizable)
app.use(VCalendar) app.use(VCalendar)
if (matomoExist) { if (matomoExist) {

14
src/tests/unit/utils.spec.js
View File

@@ -12,7 +12,6 @@ import {
hasASessionCookieDecoded hasASessionCookieDecoded
} from '../../utils/auth' } from '../../utils/auth'
import { img } from '../../utils/image' import { img } from '../../utils/image'
import { title } from '../../utils/index'
import { useCookies } from 'vue3-cookies' import { useCookies } from 'vue3-cookies'
vi.mock('vue3-cookies', () => { vi.mock('vue3-cookies', () => {
const mockCookies = { 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', () => { describe('sortByName', () => {
it('should return the the list sorted by name', () => { it('should return the the list sorted by name', () => {
const list1 = [ const list1 = [

6
src/utils/index.ts
View File

@@ -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 { export function createUrlLink(picId: string): string {
return encodeURIComponent(`${window.location.origin}/#focus=pic&pic=${picId}`) return encodeURIComponent(`${window.location.origin}/#focus=pic&pic=${picId}`)
} }

BIN
static/meta-img.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 59 KiB

83
vite.config.js
View File

@@ -1,33 +1,62 @@
import { fileURLToPath, URL } from 'node:url' import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite' import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
import eslintPlugin from 'vite-plugin-eslint' import eslintPlugin from 'vite-plugin-eslint'
import { createHtmlPlugin } from 'vite-plugin-html'
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default ({ mode }) => {
server: { process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }
host: true, return defineConfig({
port: 5173, server: {
strictPort: true, host: true,
hmr: { port: 5173,
clientPort: 5173, strictPort: true,
overlay: false hmr: {
} clientPort: 5173,
}, overlay: false
base: '/', }
plugins: [vue(), eslintPlugin()], },
css: { base: '/',
preprocessorOptions: { plugins: [
scss: { vue(),
additionalData: eslintPlugin(),
'@import "@/assets/font-size.scss"; @import "@/assets/rem-calc.scss";' 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'
}
}
})

588
yarn.lock
View File

File diff suppressed because it is too large Load Diff