steven/gpx.studio
1
0
Fork 0
mirror of https://github.com/gpxstudio/gpx.studio.git synced 2025-08-31 23:53:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

unique title for each docs page

Browse Source
This commit is contained in:
vcoppe
2024-09-21 10:18:01 +02:00
parent f77793b7fe
commit 1a10ecc44b
4 changed files with 82 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
website/src/hooks.server.js
View File

@@ -3,16 +3,24 @@ import { languages } from '$lib/languages';
import { getURLForLanguage } from '$lib/utils'; import { getURLForLanguage } from '$lib/utils';
export async function handle({ event, resolve }) { export async function handle({ event, resolve }) {
let language = event.params.language ?? 'en'; const language = event.params.language ?? 'en';
const strings = await import(`./locales/${language}.json`); const strings = await import(`./locales/${language}.json`);
let path = event.url.pathname; const path = event.url.pathname;
let page = event.route.id?.replace('/[[language]]', '').split('/')[1] ?? 'home'; const page = event.route.id?.replace('/[[language]]', '').split('/')[1] ?? 'home';
let title = strings.metadata[`${page}_title`]; let title = strings.metadata[`${page}_title`];
let description = strings.metadata[`description`]; const description = strings.metadata[`description`];
let htmlTag = `<html lang="${language}" translate="no">`; if (page === 'help' && event.params.guide) {
const [guide, subguide] = event.params.guide.split('/');
const guideModule = subguide
? await import(`./lib/docs/${language}/${guide}/${subguide}.mdx`)
: await import(`./lib/docs/${language}/${guide}.mdx`);
title = `${title} | ${guideModule.metadata.title}`;
}
const htmlTag = `<html lang="${language}" translate="no">`;
let headTag = `<head> let headTag = `<head>
<title>gpx.studio — ${title}</title> <title>gpx.studio — ${title}</title>
@@ -37,7 +45,7 @@ export async function handle({ event, resolve }) {
`; `;
} }
let stringsHTML = page === 'app' ? stringsToHTML(strings) : ''; const stringsHTML = page === 'app' ? stringsToHTML(strings) : '';
const response = await resolve(event, { const response = await resolve(event, {
transformPageChunk: ({ html }) => html.replace('<html>', htmlTag).replace('<head>', headTag).replace('<body data-sveltekit-preload-data="hover">', `<body data-sveltekit-preload-data="hover"><div class="hidden">${stringsHTML}</div>`) transformPageChunk: ({ html }) => html.replace('<html>', htmlTag).replace('<head>', headTag).replace('<body data-sveltekit-preload-data="hover">', `<body data-sveltekit-preload-data="hover"><div class="hidden">${stringsHTML}</div>`)

114
website/src/routes/+layout.svelte
View File

@@ -1,63 +1,73 @@
<script lang="ts"> <script lang="ts">
import '../app.pcss'; import '../app.pcss';
import { ModeWatcher } from 'mode-watcher'; import { ModeWatcher } from 'mode-watcher';
import { isLoading, _, locale } from 'svelte-i18n'; import { isLoading, _, locale } from 'svelte-i18n';
import { page } from '$app/stores'; import { page } from '$app/stores';
import Nav from '$lib/components/Nav.svelte'; import Nav from '$lib/components/Nav.svelte';
import Footer from '$lib/components/Footer.svelte'; import Footer from '$lib/components/Footer.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { convertOldEmbeddingOptions } from '$lib/components/embedding/Embedding'; import { convertOldEmbeddingOptions } from '$lib/components/embedding/Embedding';
import { base } from '$app/paths'; import { base } from '$app/paths';
import { languages } from '$lib/languages'; import { languages } from '$lib/languages';
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { getURLForLanguage } from '$lib/utils'; import { getURLForLanguage } from '$lib/utils';
const appRoutes = ['/[[language]]/app', '/[[language]]/embed']; const appRoutes = ['/[[language]]/app', '/[[language]]/embed'];
onMount(() => { onMount(() => {
if ($page.url.searchParams.has('embed')) { if ($page.url.searchParams.has('embed')) {
// convert old embedding options to new format and redirect to new embed page // convert old embedding options to new format and redirect to new embed page
let folders = $page.url.pathname.split('/'); let folders = $page.url.pathname.split('/');
let locale = let locale = folders.indexOf('l') >= 0 ? folders[folders.indexOf('l') + 1] ?? 'en' : 'en';
folders.indexOf('l') >= 0 ? folders[folders.indexOf('l') + 1] ?? 'en' : 'en'; window.location.href = `${getURLForLanguage(locale, '/embed')}?options=${encodeURIComponent(JSON.stringify(convertOldEmbeddingOptions($page.url.searchParams)))}`;
window.location.href = `${getURLForLanguage(locale, '/embed')}?options=${encodeURIComponent(JSON.stringify(convertOldEmbeddingOptions($page.url.searchParams)))}`; }
} });
});
$: if ($page.route.id.includes('[[language]]')) { $: if ($page.route.id?.includes('[[language]]')) {
if ($page.params.language) { if ($page.params.language) {
let lang = $page.params.language.replace('/', ''); let lang = $page.params.language.replace('/', '');
if ($locale !== lang) { if ($locale !== lang) {
if (languages.hasOwnProperty(lang)) { if (languages.hasOwnProperty(lang)) {
locale.set(lang); locale.set(lang);
} else if (browser) { } else if (browser) {
goto(`${base}/404`); goto(`${base}/404`);
} }
} }
} else if ($locale !== 'en') { } else if ($locale !== 'en') {
locale.set('en'); locale.set('en');
} }
} }
$: if (browser && !$isLoading && $_) { $: if (browser && !$isLoading && $locale) {
document.title = `gpx.studio — ${$_(`metadata.${$page.route.id?.replace('/[[language]]', '').split('/')[1] ?? 'home'}_title`)}`; let title = `gpx.studio — ${$_(`metadata.${$page.route.id?.replace('/[[language]]', '').split('/')[1] ?? 'home'}_title`)}`;
} if ($page.params.guide) {
$: showNavAndFooter = $page.route.id === null || !appRoutes.includes($page.route.id); const [guide, subguide] = $page.params.guide.split('/');
const promise = subguide
? import(`../lib/docs/${$locale ?? 'en'}/${guide}/${subguide}.mdx`)
: import(`../lib/docs/${$locale ?? 'en'}/${guide}.mdx`);
promise.then((module) => {
document.title = `${title} | ${module.metadata.title}`;
});
} else {
document.title = title;
}
}
$: showNavAndFooter = $page.route.id === null || !appRoutes.includes($page.route.id);
</script> </script>
<ModeWatcher /> <ModeWatcher />
<div class="flex flex-col min-h-screen"> <div class="flex flex-col min-h-screen">
{#if !$isLoading} {#if !$isLoading}
{#if showNavAndFooter} {#if showNavAndFooter}
<Nav /> <Nav />
{/if} {/if}
<main class="grow flex flex-col"> <main class="grow flex flex-col">
<slot /> <slot />
</main> </main>
{#if showNavAndFooter} {#if showNavAndFooter}
<Footer /> <Footer />
{/if} {/if}
{/if} {/if}
</div> </div>

6
website/src/routes/[[language]]/help/+layout.ts
View File

@@ -2,9 +2,9 @@ import { guides } from '$lib/components/docs/docs.js';
function getModule(language: string | undefined, guide: string) { function getModule(language: string | undefined, guide: string) {
language = language ?? 'en'; language = language ?? 'en';
let subguide = guide.includes('/') ? guide.split('/').pop() : undefined; let subguide = undefined;
if (subguide) { if (guide.includes('/')) {
guide = guide.replace(`/${subguide}`, ''); [guide, subguide] = guide.split('/');
} }
return subguide return subguide
? import(`./../../../lib/docs/${language}/${guide}/${subguide}.mdx`) ? import(`./../../../lib/docs/${language}/${guide}/${subguide}.mdx`)

6
website/src/routes/[[language]]/help/[...guide]/+page.ts
View File

@@ -2,9 +2,9 @@ import { getNextGuide, getPreviousGuide } from "$lib/components/docs/docs";
function getModule(language: string | undefined, guide: string) { function getModule(language: string | undefined, guide: string) {
language = language ?? 'en'; language = language ?? 'en';
let subguide = guide.includes('/') ? guide.split('/').pop() : undefined; let subguide = undefined;
if (subguide) { if (guide.includes('/')) {
guide = guide.replace(`/${subguide}`, ''); [guide, subguide] = guide.split('/');
} }
return subguide return subguide
? import(`./../../../../lib/docs/${language}/${guide}/${subguide}.mdx`) ? import(`./../../../../lib/docs/${language}/${guide}/${subguide}.mdx`)