mirror/wavelovers
1
0
Fork 0
mirror of https://github.com/eugene-serb/wavelovers.git synced 2023-09-09 23:41:16 +03:00
Code Issues Projects Releases Wiki Activity

- recoded MetaTagUpdater.

Browse Source 
- added metas array with metas.
- added interfaces IRouteMeta, IMeta, ITag.
- deleted metas from routes.
- modified metas by types.
- updated router index.
- up minor version.
This commit is contained in:
Eugene Serb 2022-09-10 20:48:33 +03:00
parent 6b94c95602
commit b368b359d8
22 changed files with 122 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/index.html
View File

@ -15,4 +15,4 @@
webvisor: true webvisor: true
});</script><style>[v-cloak] { });</script><style>[v-cloak] {
display: none; display: none;
}</style><script defer="defer" src="/js/chunk-vendors.34a275bd.js"></script><script defer="defer" src="/js/app.c1a049b3.js"></script><link href="/css/app.61999447.css" rel="stylesheet"></head><body><div id="app" class="app" v-cloak></div><noscript>You need to enable JavaScript to run this app.</noscript><noscript><div><img src="https://mc.yandex.ru/watch/89252711" style="position:absolute; left:-9999px;" alt=""/></div></noscript></body></html> }</style><script defer="defer" src="/js/chunk-vendors.34a275bd.js"></script><script defer="defer" src="/js/app.5845d133.js"></script><link href="/css/app.61999447.css" rel="stylesheet"></head><body><div id="app" class="app" v-cloak></div><noscript>You need to enable JavaScript to run this app.</noscript><noscript><div><img src="https://mc.yandex.ru/watch/89252711" style="position:absolute; left:-9999px;" alt=""/></div></noscript></body></html>

2
docs/js/app.5845d133.js Normal file
View File

File diff suppressed because one or more lines are too long

1
docs/js/app.5845d133.js.map Normal file
View File

File diff suppressed because one or more lines are too long

2
docs/js/app.c1a049b3.js
View File

File diff suppressed because one or more lines are too long

1
docs/js/app.c1a049b3.js.map
View File

File diff suppressed because one or more lines are too long

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "wavelovers", "name": "wavelovers",
"version": "1.0.19", "version": "1.1.0",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "wavelovers", "name": "wavelovers",
"version": "1.0.19", "version": "1.1.0",
"license": "GNU GPL v3", "license": "GNU GPL v3",
"dependencies": { "dependencies": {
"core-js": "^3.8.3", "core-js": "^3.8.3",

3
package.json
View File

@ -2,7 +2,7 @@
"name": "wavelovers", "name": "wavelovers",
"description": "Wavelovers. Use your device vibration correctly. Make a massager out of a gamepad.", "description": "Wavelovers. Use your device vibration correctly. Make a massager out of a gamepad.",
"keywords": [ "wavelovers", "gamepad-vibrator", "gamepad-test-tool", "gamepad-vibration-test-tool" ], "keywords": [ "wavelovers", "gamepad-vibrator", "gamepad-test-tool", "gamepad-vibration-test-tool" ],
"version": "1.0.19", "version": "1.1.0",
"license": "GNU GPL v3", "license": "GNU GPL v3",
"homepage": "https://wavelovers.ru/", "homepage": "https://wavelovers.ru/",
"author": { "author": {
@ -46,4 +46,3 @@
"typescript": "~4.5.5" "typescript": "~4.5.5"
} }
} }

46
src/router/assets/metas.ts Normal file
View File

@ -0,0 +1,46 @@
import IRouteMeta from '@/router/models/IRouteMeta';
import metaPatterns from '@/router/assets/metas/Patterns';
import metaCustom from '@/router/assets/metas/Custom';
import metaManual from '@/router/assets/metas/Manual';
import metaDiagnostic from '@/router/assets/metas/Diagnostic';
import metaFaq from '@/router/assets/metas/Faq';
import metaAbout from '@/router/assets/metas/About';
import metaDonate from '@/router/assets/metas/Donate';
import meta404 from '@/router/assets/metas/404';
const metas: Array<IRouteMeta> = [
{
route: '/',
meta: metaPatterns,
},
{
route: '/custom',
meta: metaCustom,
},
{
route: '/manual',
meta: metaManual,
},
{
route: '/diagnostic',
meta: metaDiagnostic,
},
{
route: '/faq',
meta: metaFaq,
},
{
route: '/about',
meta: metaAbout,
},
{
route: '/donate',
meta: metaDonate,
},
{
route: '/404',
meta: meta404,
},
];
export default metas;

4
src/router/assets/metas/404.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – Page not found', title: 'Wavelovers – Page not found',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/About.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – About', title: 'Wavelovers – About',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Custom.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – Custom', title: 'Wavelovers – Custom',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Diagnostic.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – Diagnostic', title: 'Wavelovers – Diagnostic',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Donate.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – Donate', title: 'Wavelovers – Donate',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Faq.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – FAQ', title: 'Wavelovers – FAQ',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Manual.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers – Manual', title: 'Wavelovers – Manual',
metaTags: [ metaTags: [
{ {

4
src/router/assets/metas/Patterns.ts
View File

@ -1,4 +1,6 @@
const meta = { import IMeta from '@/router/models/IMeta';
const meta: IMeta = {
title: 'Wavelovers', title: 'Wavelovers',
metaTags: [ metaTags: [
{ {

16
src/router/assets/routes.ts
View File

@ -1,61 +1,45 @@
import { RouteRecordRaw } from 'vue-router'; import { RouteRecordRaw } from 'vue-router';
import metaPatterns from '@/router/assets/metas/Patterns';
import metaCustom from '@/router/assets/metas/Custom';
import metaManual from '@/router/assets/metas/Manual';
import metaDiagnostic from '@/router/assets/metas/Diagnostic';
import metaFaq from '@/router/assets/metas/Faq';
import metaAbout from '@/router/assets/metas/About';
import metaDonate from '@/router/assets/metas/Donate';
import meta404 from '@/router/assets/metas/404';
const routes: Array<RouteRecordRaw> = [ const routes: Array<RouteRecordRaw> = [
{ {
path: '/', path: '/',
name: 'patterns-view', name: 'patterns-view',
component: () => import('@/views/PatternsView.vue'), component: () => import('@/views/PatternsView.vue'),
meta: metaPatterns,
}, },
{ {
path: '/custom', path: '/custom',
name: 'custom-view', name: 'custom-view',
component: () => import('@/views/CustomView.vue'), component: () => import('@/views/CustomView.vue'),
meta: metaCustom,
}, },
{ {
path: '/manual', path: '/manual',
name: 'manual-view', name: 'manual-view',
component: () => import('@/views/ManualView.vue'), component: () => import('@/views/ManualView.vue'),
meta: metaManual,
}, },
{ {
path: '/diagnostic', path: '/diagnostic',
name: 'diagnostic-view', name: 'diagnostic-view',
component: () => import('@/views/DiagnosticView.vue'), component: () => import('@/views/DiagnosticView.vue'),
meta: metaDiagnostic,
}, },
{ {
path: '/faq', path: '/faq',
name: 'faq-view', name: 'faq-view',
component: () => import('@/views/FaqView.vue'), component: () => import('@/views/FaqView.vue'),
meta: metaFaq,
}, },
{ {
path: '/about', path: '/about',
name: 'about-view', name: 'about-view',
component: () => import('@/views/AboutView.vue'), component: () => import('@/views/AboutView.vue'),
meta: metaAbout,
}, },
{ {
path: '/donate', path: '/donate',
name: 'donate-view', name: 'donate-view',
component: () => import('@/views/DonateView.vue'), component: () => import('@/views/DonateView.vue'),
meta: metaDonate,
}, },
{ {
path: '/404', path: '/404',
name: '404', name: '404',
component: () => import('@/views/NotFoundView.vue'), component: () => import('@/views/NotFoundView.vue'),
meta: meta404,
}, },
{ {
path: '/:catchAll(.*)*', path: '/:catchAll(.*)*',

3
src/router/index.ts
View File

@ -6,6 +6,7 @@ import QueryRouter from '@/router/modules/QueryRouter';
import MetaTagUpdater from '@/router/modules/MetaTagUpdater'; import MetaTagUpdater from '@/router/modules/MetaTagUpdater';
import routes from '@/router/assets/routes'; import routes from '@/router/assets/routes';
import queries from '@/router/assets/queries'; import queries from '@/router/assets/queries';
import metas from '@/router/assets/metas';
const router = createRouter({ const router = createRouter({
history: createWebHistory(process.env.BASE_URL), history: createWebHistory(process.env.BASE_URL),
@ -18,7 +19,7 @@ router.beforeEach((
next: NavigationGuardNext next: NavigationGuardNext
) => { ) => {
QueryRouter.update(to, from, next, router, queries); QueryRouter.update(to, from, next, router, queries);
MetaTagUpdater.update(to, from, next) MetaTagUpdater.update(to, from, next, metas)
}); });
export default router; export default router;

9
src/router/models/IMeta.ts Normal file
View File

@ -0,0 +1,9 @@
import ITag from '@/router/models/ITag';
interface IMeta {
title: string;
metaTags: Array<ITag>;
linkTags: Array<ITag>;
}
export default IMeta;

8
src/router/models/IRouteMeta.ts Normal file
View File

@ -0,0 +1,8 @@
import IMeta from '@/router/models/IMeta';
interface IRouteMeta {
route: string;
meta: IMeta;
}
export default IRouteMeta;

5
src/router/models/ITag.ts Normal file
View File

@ -0,0 +1,5 @@
interface ITag {
[key: string]: string;
}
export default ITag;

41
src/router/modules/MetaTagUpdater.ts
View File

@ -1,6 +1,6 @@
import { import { NavigationGuardNext, RouteLocationNormalized } from "vue-router";
NavigationGuardNext, RouteLocationNormalized, RouteRecordNormalized import IRouteMeta from "@/router/models/IRouteMeta";
} from "vue-router"; import ITag from '@/router/models/ITag';
function appendTags(tagsArray: object[], type: string) { function appendTags(tagsArray: object[], type: string) {
tagsArray.map( tagsArray.map(
@ -21,7 +21,8 @@ function appendTags(tagsArray: object[], type: string) {
function updateMetatag( function updateMetatag(
to: RouteLocationNormalized, to: RouteLocationNormalized,
from: RouteLocationNormalized, from: RouteLocationNormalized,
next: NavigationGuardNext next: NavigationGuardNext,
metas: Array<IRouteMeta>
) { ) {
Array.from(document.querySelectorAll('[data-vue-router-controlled]')) Array.from(document.querySelectorAll('[data-vue-router-controlled]'))
.map(el => { .map(el => {
@ -30,27 +31,23 @@ function updateMetatag(
} }
}); });
const hasTitle: RouteRecordNormalized = let title: string = '' as string;
to.matched.slice().reverse() let metaTags: Array<ITag> = [] as Array<ITag>;
.find(r => r.meta && r.meta.title) as RouteRecordNormalized; let linkTags: Array<ITag> = [] as Array<ITag>;
const hasMetas: RouteRecordNormalized =
to.matched.slice().reverse()
.find(r => r.meta && r.meta.metaTags) as RouteRecordNormalized;
const hasLinks: RouteRecordNormalized =
to.matched.slice().reverse()
.find(r => r.meta && r.meta.linkTags) as RouteRecordNormalized;
if (hasTitle) { metas.forEach((item) => {
document.title = hasTitle.meta.title as string; if (item.route === to.fullPath) {
if (item.meta) {
title = item.meta.title;
metaTags = item.meta.metaTags;
linkTags = item.meta.linkTags;
} }
if (hasMetas) {
const metaTags: object[] = hasMetas.meta.metaTags as object[];
appendTags(metaTags, 'meta');
}
if (hasLinks) {
const linkTags: object[] = hasLinks.meta.linkTags as object[];
appendTags(linkTags, 'link');
} }
});
if (title) document.title = title;
if (metaTags) appendTags(metaTags, 'meta');
if (linkTags) appendTags(linkTags, 'link');
return next(); return next();
} }