erudit 3.0.0-dev.2 → 3.0.0-dev.21

package/app/pages/summary/[...summaryId].vue

@@ -1,3 +1,3 @@
-<template>
-    <MainTopic />
-</template>
+<template>
+    <MainTopic />
+</template>

package/app/plugins/analytics.ts

@@ -0,0 +1,95 @@
+import eruditConfig from '#erudit/config';
+
+export default defineNuxtPlugin({
+    name: 'erudit-analytics',
+    hooks: {
+        'app:rendered': (context) => {
+            if (!context.ssrContext || !eruditConfig.analytics) {
+                return;
+            }
+
+            if (typeof eruditConfig?.debug?.analytics === 'undefined') {
+                if (import.meta.dev) {
+                    return;
+                }
+            } else if (!Boolean(eruditConfig?.debug?.analytics)) {
+                return;
+            }
+
+            if (eruditConfig.analytics.yandex) {
+                const yandex = eruditConfig.analytics.yandex;
+
+                if (yandex.verification) {
+                    context.ssrContext.head.push({
+                        meta: [
+                            {
+                                name: 'yandex-verification',
+                                content: yandex.verification,
+                            },
+                        ],
+                    });
+                }
+
+                if (yandex.metricsId) {
+                    context.ssrContext.head.push({
+                        script: [
+                            {
+                                innerHTML: `
+                                    (function(m,e,t,r,i,k,a){
+                                        m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
+                                        m[i].l=1*new Date();
+                                        k=e.createElement(t),a=e.getElementsByTagName(t)[0],
+                                        k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
+                                    })(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
+
+                                    ym(${yandex.metricsId}, "init", {
+                                            clickmap:true,
+                                            trackLinks:true,
+                                            accurateTrackBounce:true,
+                                            webvisor:true
+                                    });
+                            `,
+                            },
+                        ],
+                    });
+                }
+            }
+
+            if (eruditConfig.analytics.google) {
+                const google = eruditConfig.analytics.google;
+
+                if (google.verification) {
+                    context.ssrContext.head.push({
+                        meta: [
+                            {
+                                name: 'google-site-verification',
+                                content: google.verification,
+                            },
+                        ],
+                    });
+                }
+
+                if (google.gtag) {
+                    context.ssrContext.head.push({
+                        script: [
+                            {
+                                src:
+                                    'https://www.googletagmanager.com/gtag/js?id=' +
+                                    google.gtag,
+                                async: true,
+                            },
+                            {
+                                innerHTML: `
+                                    window.dataLayer = window.dataLayer || [];
+                                    function gtag(){window.dataLayer.push(arguments);}
+                                    gtag('js', new Date());
+                                    gtag('config', '${google.gtag}');
+                            `,
+                            },
+                        ],
+                    });
+                }
+            }
+        },
+    },
+});

package/app/plugins/prerender.server.ts

@@ -0,0 +1,34 @@
+let alreadyPrerendered = false;
+let isPrerendering = false;
+
+export default defineNuxtPlugin({
+    name: 'erudit-prerender',
+    async setup(_nuxt) {
+        if (import.meta.dev) {
+            return; // Server is available so no need to prerender in dev mode
+        }
+
+        if (alreadyPrerendered || isPrerendering) {
+            return;
+        }
+
+        isPrerendering = true;
+
+        const routeProviders = [
+            '/api/prerender/language',
+            '/api/prerender/cameos',
+
+            // Assets
+            '/api/prerender/assets/cameo',
+            '/api/prerender/assets/contributor',
+            '/api/prerender/assets/sponsor',
+        ];
+
+        for (const provider of routeProviders) {
+            const routes = await $fetch<string[]>(provider);
+            _nuxt.runWithContext(() => prerenderRoutes(routes));
+        }
+
+        alreadyPrerendered = true;
+    },
+});

package/app/public/favicon/article.svg

@@ -1,10 +1,10 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
   <defs>
-    <linearGradient id="gradient" x1="74.98" y1="423.02" x2="437.02" y2="60.98" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#6fa552"/>
-      <stop offset="1" stop-color="#4475bc"/>
+    <linearGradient id="gradient" x1="75" y1="423" x2="437" y2="61" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#4aa44c"/>
+      <stop offset="1" stop-color="#1278b9"/>
     </linearGradient>
   </defs>
-  <circle cx="256" cy="256" r="256" fill="url(#gradient)"/>
-  <path d="M124.13,354.9c-4.67,0-8.59-1.58-11.74-4.74-3.16-3.16-4.74-7.07-4.74-11.74s1.58-8.59,4.74-11.74c3.16-3.16,7.07-4.74,11.74-4.74h164.84c4.67,0,8.59,1.58,11.74,4.74,3.16,3.16,4.74,7.07,4.74,11.74s-1.58,8.59-4.74,11.74c-3.16,3.16-7.07,4.74-11.74,4.74H124.13ZM124.13,272.48c-4.67,0-8.59-1.58-11.74-4.74-3.16-3.16-4.74-7.07-4.74-11.74s1.58-8.59,4.74-11.74c3.16-3.16,7.07-4.74,11.74-4.74h263.74c4.67,0,8.59,1.58,11.74,4.74,3.16,3.16,4.74,7.07,4.74,11.74s-1.58,8.59-4.74,11.74c-3.16,3.16-7.07,4.74-11.74,4.74H124.13ZM124.13,190.07c-4.67,0-8.59-1.58-11.74-4.74-3.16-3.16-4.74-7.07-4.74-11.74s1.58-8.59,4.74-11.74c3.16-3.16,7.07-4.74,11.74-4.74h263.74c4.67,0,8.59,1.58,11.74,4.74,3.16,3.16,4.74,7.07,4.74,11.74s-1.58,8.59-4.74,11.74c-3.16,3.16-7.07,4.74-11.74,4.74H124.13Z" fill="#fff"/>
+  <circle fill="url(#gradient)" cx="256" cy="256" r="256"/>
+  <path fill="white" d="M372.4,179.3h-232.8c-6.6,0-12-5.4-12-12v-26.3c0-6.6,5.4-12,12-12h232.8c6.6,0,12,5.4,12,12v26.3c0,6.6-5.4,12-12,12ZM384.4,269.2v-26.3c0-6.6-5.4-12-12-12h-232.8c-6.6,0-12,5.4-12,12v26.3c0,6.6,5.4,12,12,12h232.8c6.6,0,12-5.4,12-12ZM384.4,371v-26.3c0-6.6-5.4-12-12-12h-232.8c-6.6,0-12,5.4-12,12v26.3c0,6.6,5.4,12,12,12h232.8c6.6,0,12-5.4,12-12Z"/>
 </svg>

package/app/public/favicon/default.svg

@@ -1,10 +1,10 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
   <defs>
     <linearGradient id="gradient" x1="75" y1="423" x2="437" y2="61" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#6fa552"/>
-      <stop offset="1" stop-color="#4475bc"/>
+      <stop offset="0" stop-color="#4aa44c"/>
+      <stop offset="1" stop-color="#1278b9"/>
     </linearGradient>
   </defs>
-  <circle fill="url(#gradient)" class="cls-2" cx="256" cy="256" r="256"/>
+  <circle fill="url(#gradient)" cx="256" cy="256" r="256"/>
   <path fill="white" d="M385.2,317.4v-91.1l-122.9,61.9c-5.5,2.8-11.4,4.3-17.5,4.3s-12-1.4-17.4-4.3l-126.5-63.9c-3.3-1.7-5.9-4.1-7.9-7s-2.9-6.1-2.9-9.6,1-6.6,2.9-9.6c2-3,4.6-5.4,7.9-7.2l126.5-63.9c2.8-1.5,5.7-2.6,8.6-3.3,2.9-.7,5.9-1,8.9-1s5.9.4,8.9,1c2.9.7,5.8,1.8,8.6,3.3l149.2,75.2c3.1,1.7,5.6,4,7.6,6.9,1.9,2.9,2.9,6.1,2.9,9.8v98.7c0,5-1.8,9.3-5.4,12.9-3.6,3.6-7.8,5.4-12.9,5.4s-9.3-1.8-13-5.4c-3.6-3.6-5.5-7.9-5.5-13h0ZM235.8,388.5c3,.5,5.9.8,8.9.8s5.9-.3,8.9-.8c2.9-.5,5.9-1.6,8.6-3.1l67.9-34.1c6.2-3.1,11.2-7.7,14.9-13.7,3.8-6.1,5.6-12.6,5.6-19.6v-37.9l-88.4,44.6c-5.4,2.9-11.3,4.3-17.4,4.3s-12-1.5-17.5-4.3l-88.4-44.6v37.9c0,7,1.9,13.6,5.6,19.6,3.8,6,8.7,10.6,14.9,13.7l67.9,34.1h0c2.8,1.5,5.7,2.6,8.6,3.1Z"/>
 </svg>

package/app/public/favicon/practice.svg

@@ -1,10 +1,10 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
   <defs>
     <linearGradient id="gradient" x1="74.98" y1="423.02" x2="437.02" y2="60.98" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#6fa552"/>
-      <stop offset="1" stop-color="#4475bc"/>
+      <stop offset="0" stop-color="#4aa44c"/>
+      <stop offset="1" stop-color="#1278b9"/>
     </linearGradient>
   </defs>
   <circle cx="256" cy="256" r="256" fill="url(#gradient)"/>
-  <path d="M216.29,267.91l129.71-129.71,52.94,52.94-182.66,182.66-103.24-103.24,52.94-52.94,50.3,50.3Z" fill="#fff"/>
+  <path fill="white" d="M216.29,267.91l129.71-129.71,52.94,52.94-182.66,182.66-103.24-103.24,52.94-52.94,50.3,50.3Z" />
 </svg>

package/app/public/favicon/summary.svg

@@ -1,10 +1,10 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
   <defs>
     <linearGradient id="gradient" x1="74.98" y1="423.02" x2="437.02" y2="60.98" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#6fa552"/>
-      <stop offset="1" stop-color="#4475bc"/>
+      <stop offset="0" stop-color="#4aa44c"/>
+      <stop offset="1" stop-color="#1278b9"/>
     </linearGradient>
   </defs>
-  <circle cx="256" cy="256" r="256" fill="url(#gradient)"/>
-  <path d="M271.03,131.48c-2.77-5.75-8.63-9.42-15.07-9.42s-12.24,3.66-15.07,9.42l-33.64,69.21-75.12,11.09c-6.28.94-11.51,5.34-13.44,11.35s-.37,12.66,4.13,17.11l54.51,53.93-12.87,76.22c-1.05,6.28,1.57,12.66,6.75,16.37,5.18,3.71,12.03,4.18,17.68,1.2l67.12-35.83,67.12,35.83c5.65,2.98,12.5,2.56,17.68-1.2,5.18-3.77,7.79-10.1,6.75-16.37l-12.92-76.22,54.51-53.93c4.5-4.45,6.12-11.09,4.13-17.11-1.99-6.02-7.17-10.41-13.44-11.35l-75.17-11.09-33.64-69.21Z" fill="#fff"/>
+  <circle fill="url(#gradient)" cx="256" cy="256" r="256" />
+  <path fill="white" d="M271.03,131.48c-2.77-5.75-8.63-9.42-15.07-9.42s-12.24,3.66-15.07,9.42l-33.64,69.21-75.12,11.09c-6.28.94-11.51,5.34-13.44,11.35s-.37,12.66,4.13,17.11l54.51,53.93-12.87,76.22c-1.05,6.28,1.57,12.66,6.75,16.37,5.18,3.71,12.03,4.18,17.68,1.2l67.12-35.83,67.12,35.83c5.65,2.98,12.5,2.56,17.68-1.2,5.18-3.77,7.79-10.1,6.75-16.37l-12.92-76.22,54.51-53.93c4.5-4.45,6.12-11.09,4.13-17.11-1.99-6.02-7.17-10.41-13.44-11.35l-75.17-11.09-33.64-69.21Z" />
 </svg>

package/app/public/logotype.svg

@@ -1,8 +1,8 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135 135">
   <defs>
     <linearGradient id="gradient" x1="19.77" y1="115.23" x2="115.23" y2="19.77" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#4475bc"/>
-      <stop offset="1" stop-color="#6fa552"/>
+      <stop offset="0" stop-color="#4aa44c"/>
+      <stop offset="1" stop-color="#1278b9"/>
       <animateTransform
         attributeName="gradientTransform"
         type="rotate"

package/app/scripts/_immediate.js

@@ -1,9 +1,9 @@
-// Instant color theme setup
-const theme = localStorage.getItem('theme') ?? 'auto';
-const binaryTheme =
-    theme === 'auto'
-        ? window.matchMedia('(prefers-color-scheme: dark)').matches
-            ? 'dark'
-            : 'light'
-        : theme;
-document.documentElement.setAttribute('data-theme', binaryTheme);
+// Instant color theme setup
+const theme = localStorage.getItem('theme') ?? 'auto';
+const binaryTheme =
+    theme === 'auto'
+        ? window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : 'light'
+        : theme;
+document.documentElement.setAttribute('data-theme', binaryTheme);

package/app/scripts/aside/index.ts

@@ -1,59 +1,59 @@
-// TODO: Push this shit into <SiteAside /> or make composable or make something...
-
-export enum AsideType {
-    Major = 'major',
-    Minor = 'minor',
-}
-
-export const switchVisible = ref<boolean>(true);
-export const forcedAside = ref<AsideType>();
-
-export const clickTargets: {
-    major: HTMLElement[];
-    minor: HTMLElement[];
-} = {
-    major: [],
-    minor: [],
-};
-
-if (import.meta.client) {
-    //
-    // Switch visibility logic
-    //
-
-    let lastY = window.scrollY;
-    let sumDelta = 0;
-    let scrollTimeout: any;
-
-    window.addEventListener('scroll', () => {
-        const currentY = window.scrollY;
-        const delta = currentY - lastY;
-
-        sumDelta += delta;
-
-        switchVisible.value = sumDelta <= -1;
-
-        lastY = currentY;
-
-        clearTimeout(scrollTimeout);
-        scrollTimeout = setTimeout(() => {
-            sumDelta = 0;
-        }, 200);
-    });
-
-    //
-    // Unpin forced asides when click outside logic
-    //
-
-    window.addEventListener('click', (e) => {
-        if (forcedAside.value) {
-            const toIgnoreTargets = clickTargets[forcedAside.value]; // Ignore currently pinned aside elements
-
-            for (const target of toIgnoreTargets)
-                if (target.contains(e.target as Element)) return;
-
-            forcedAside.value = undefined;
-            switchVisible.value = true;
-        }
-    });
-}
+// TODO: Push this shit into <SiteAside /> or make composable or make something...
+
+export enum AsideType {
+    Major = 'major',
+    Minor = 'minor',
+}
+
+export const switchVisible = ref<boolean>(true);
+export const forcedAside = ref<AsideType>();
+
+export const clickTargets: {
+    major: HTMLElement[];
+    minor: HTMLElement[];
+} = {
+    major: [],
+    minor: [],
+};
+
+if (import.meta.client) {
+    //
+    // Switch visibility logic
+    //
+
+    let lastY = window.scrollY;
+    let sumDelta = 0;
+    let scrollTimeout: any;
+
+    window.addEventListener('scroll', () => {
+        const currentY = window.scrollY;
+        const delta = currentY - lastY;
+
+        sumDelta += delta;
+
+        switchVisible.value = sumDelta <= -1;
+
+        lastY = currentY;
+
+        clearTimeout(scrollTimeout);
+        scrollTimeout = setTimeout(() => {
+            sumDelta = 0;
+        }, 200);
+    });
+
+    //
+    // Unpin forced asides when click outside logic
+    //
+
+    window.addEventListener('click', (e) => {
+        if (forcedAside.value) {
+            const toIgnoreTargets = clickTargets[forcedAside.value]; // Ignore currently pinned aside elements
+
+            for (const target of toIgnoreTargets)
+                if (target.contains(e.target as Element)) return;
+
+            forcedAside.value = undefined;
+            switchVisible.value = true;
+        }
+    });
+}

package/app/scripts/aside/major/nav.ts

@@ -1,26 +1,26 @@
-import type { InjectionKey, ShallowRef } from 'vue';
-import type { FrontNav } from '@shared/frontNav';
-
-export const insideNavBook = ref(false);
-export const navBookId = ref<string>();
-
-export const navBookVisible = computed(() => {
-    return insideNavBook.value && navBookId.value;
-});
-
-type AsideMajorNav = {
-    booksIds: string[];
-    globalNav: FrontNav;
-};
-
-export function getAsideMajorNavPayload() {
-    const key = 'aside-major-nav';
-    const nuxtApp = useNuxtApp();
-    return (nuxtApp.static.data[key] ||= nuxtApp.payload.data[key] ||=
-        {}) as AsideMajorNav;
-}
-
-export type NavStateValue = ShallowRef<null | 'active' | 'activePart'>;
-export type NavState = { [contentId: string]: NavStateValue };
-
-export const navStateKey = Symbol() as InjectionKey<ShallowRef<NavState>>;
+import type { InjectionKey, ShallowRef } from 'vue';
+import type { FrontNav } from '@shared/frontNav';
+
+export const insideNavBook = ref(false);
+export const navBookId = ref<string>();
+
+export const navBookVisible = computed(() => {
+    return insideNavBook.value && navBookId.value;
+});
+
+type AsideMajorNav = {
+    booksIds: string[];
+    globalNav: FrontNav;
+};
+
+export function getAsideMajorNavPayload() {
+    const key = 'aside-major-nav';
+    const nuxtApp = useNuxtApp();
+    return (nuxtApp.static.data[key] ||= nuxtApp.payload.data[key] ||=
+        {}) as AsideMajorNav;
+}
+
+export type NavStateValue = ShallowRef<null | 'active' | 'activePart'>;
+export type NavState = { [contentId: string]: NavStateValue };
+
+export const navStateKey = Symbol() as InjectionKey<ShallowRef<NavState>>;

package/app/scripts/aside/minor/state.ts

@@ -1,37 +1,37 @@
-import type { InjectionKey, ShallowRef } from 'vue';
-import type {
-    AsideMinorData,
-    AsideMinorNews,
-    AsideMinorTopic,
-    AsideMinorType,
-} from '@shared/asideMinor';
-
-export const asideMinorKey = Symbol() as InjectionKey<
-    ShallowRef<AsideMinorData>
->;
-
-export function injectAsideData<T extends AsideMinorData>() {
-    return inject(asideMinorKey) as ShallowRef<T>;
-}
-
-// export function injectTopicData(): Ref<AsideMinorTopic>
-// {
-//     const dataRef = inject(asideMinorKey);
-//     return createTypeSafeDataComputed(dataRef, 'topic') as any;
-// }
-
-// export function injectNewsData(): Ref<AsideMinorNews>
-// {
-//     const dataRef = inject(asideMinorKey);
-//     return createTypeSafeDataComputed(dataRef, 'news') as any;
-// }
-
-// function createTypeSafeDataComputed(dataRef: Ref<AsideMinorData>, targetType: AsideMinorType)
-// {
-//     return computed(() => {
-//         if (dataRef.value.type !== targetType)
-//             throw new Error(`Aside minor data type mismatch! Expected "${targetType}", got "${dataRef.value.type}"!`);
-
-//         return dataRef.value;
-//     });
-// }
+import type { InjectionKey, ShallowRef } from 'vue';
+import type {
+    AsideMinorData,
+    AsideMinorNews,
+    AsideMinorTopic,
+    AsideMinorType,
+} from '@shared/asideMinor';
+
+export const asideMinorKey = Symbol() as InjectionKey<
+    ShallowRef<AsideMinorData>
+>;
+
+export function injectAsideData<T extends AsideMinorData>() {
+    return inject(asideMinorKey) as ShallowRef<T>;
+}
+
+// export function injectTopicData(): Ref<AsideMinorTopic>
+// {
+//     const dataRef = inject(asideMinorKey);
+//     return createTypeSafeDataComputed(dataRef, 'topic') as any;
+// }
+
+// export function injectNewsData(): Ref<AsideMinorNews>
+// {
+//     const dataRef = inject(asideMinorKey);
+//     return createTypeSafeDataComputed(dataRef, 'news') as any;
+// }
+
+// function createTypeSafeDataComputed(dataRef: Ref<AsideMinorData>, targetType: AsideMinorType)
+// {
+//     return computed(() => {
+//         if (dataRef.value.type !== targetType)
+//             throw new Error(`Aside minor data type mismatch! Expected "${targetType}", got "${dataRef.value.type}"!`);
+
+//         return dataRef.value;
+//     });
+// }

package/app/scripts/flag.ts

@@ -1,28 +1,28 @@
-import type { MyIconName } from '#my-icons';
-import type { ContentFlag } from 'erudit-cog/schema';
-
-interface FlagData {
-    icon: MyIconName;
-    title: EruditPhraseId;
-}
-
-export const flagsData: Record<ContentFlag, FlagData> = {
-    //
-    // Global Content Flags
-    //
-
-    dev: {
-        icon: 'construction',
-        title: 'flag_dev',
-    },
-
-    advanced: {
-        icon: 'asterisk',
-        title: 'flag_advanced',
-    },
-
-    secondary: {
-        icon: 'puzzle',
-        title: 'flag_secondary',
-    },
-};
+import type { MyIconName } from '#my-icons';
+import type { ContentFlag } from '@erudit-js/cog/schema';
+
+interface FlagData {
+    icon: MyIconName;
+    title: EruditPhraseId;
+}
+
+export const flagsData: Record<ContentFlag, FlagData> = {
+    //
+    // Global Content Flags
+    //
+
+    dev: {
+        icon: 'construction',
+        title: 'flag_dev',
+    },
+
+    advanced: {
+        icon: 'asterisk',
+        title: 'flag_advanced',
+    },
+
+    secondary: {
+        icon: 'puzzle',
+        title: 'flag_secondary',
+    },
+};

package/app/scripts/og.ts

@@ -1,27 +1,28 @@
-import eruditConfig from '#erudit/config';
-import type { ImageData } from '@erudit/shared/image';
-
-export const defaultOgImage = eruditConfig.seo?.defaultOgImage || {
-    src: eruditAsset('og-default.png'),
-    width: 300,
-    height: 300,
-};
-
-export function createOgImageTags(siteUrl: string, data: ImageData | string) {
-    const tags = [];
-    const isImage = typeof data !== 'string';
-
-    tags.push({
-        name: 'og:image',
-        content: siteUrl + (isImage ? data.src : data),
-    });
-
-    if (isImage) {
-        tags.push(
-            { name: 'og:image:width', content: data.width },
-            { name: 'og:image:height', content: data.height },
-        );
-    }
-
-    return tags;
-}
+import eruditConfig from '#erudit/config';
+import type { ImageData } from '@erudit/shared/image';
+import { normalizeUrl } from '@erudit/utils/url';
+
+export const defaultOgImage = eruditConfig.seo?.defaultOgImage || {
+    src: eruditAsset('og-default.png'),
+    width: 300,
+    height: 300,
+};
+
+export function createOgImageTags(siteUrl: string, data: ImageData | string) {
+    const tags = [];
+    const isImage = typeof data !== 'string';
+
+    tags.push({
+        name: 'og:image',
+        content: normalizeUrl(siteUrl + (isImage ? data.src : data)),
+    });
+
+    if (isImage) {
+        tags.push(
+            { name: 'og:image:width', content: data.width },
+            { name: 'og:image:height', content: data.height },
+        );
+    }
+
+    return tags;
+}