cleanup for the docker setup

Signed-off-by: ngn <ngn@ngn.tf>
This commit is contained in:
ngn
2025-01-18 03:31:37 +03:00
parent ecaa6fb68f
commit fa2f3acb35
34 changed files with 433 additions and 319 deletions

View File

@ -1,37 +1,6 @@
import { default_language, language, set_lang } from "$lib/util.js";
import { api_get_services, api_get_projects } from "$lib/api.js";
import { doc_get_list } from "$lib/doc.js";
import languages from "$lib/lang.js";
import { locale_setup, locale_wait } from "$lib/locale.js";
import { init, register, waitLocale } from "svelte-i18n";
import { get } from "svelte/store";
// setup the locale
for (let i = 0; i < languages.length; i++)
register(languages[i].code, () => import(/* @vite-ignore */ languages[i].path));
// set the language
set_lang();
init({
fallbackLocale: default_language,
initialLocale: get(language),
});
// load locales & load data from the API
export async function load({ fetch }) {
await waitLocale();
try {
return {
services: await api_get_services(fetch),
projects: await api_get_projects(fetch),
docs: await doc_get_list(fetch),
error: null,
};
} catch (err) {
return {
error: err.toString(),
};
}
export async function load() {
locale_setup();
await locale_wait();
}

View File

@ -1,25 +1,27 @@
<script>
import Navbar from "$lib/navbar.svelte";
import Footer from "$lib/footer.svelte";
import Error from "$lib/error.svelte";
let { data, children } = $props();
import { locale_select } from "$lib/locale.js";
import { onMount } from "svelte";
let { children } = $props();
onMount(() => {
locale_select();
});
</script>
<main>
{#if data.error === null}
<Navbar />
<div class="content">
{@render children()}
</div>
<Footer />
{:else}
<Error error={data.error} />>
{/if}
<Navbar />
<div class="content">
{@render children()}
</div>
<Footer />
</main>
<style>
@import "../../static/global.css";
@import "/global.css";
main {
display: flex;

14
app/src/routes/+page.js Normal file
View File

@ -0,0 +1,14 @@
import { api_get_projects } from "$lib/api.js";
export async function load({ fetch }) {
try {
let projects = await api_get_projects(fetch)
return {
projects: null === projects ? [] : projects,
};
} catch (err) {
return {
error: err.toString(),
};
}
}

View File

@ -1,97 +1,106 @@
<script>
import Header from "$lib/header.svelte";
import Error from "$lib/error.svelte";
import Head from "$lib/head.svelte";
import Card from "$lib/card.svelte";
import Link from "$lib/link.svelte";
import { color, language } from "$lib/util.js";
import { _ } from "svelte-i18n";
import { _, locale } from "svelte-i18n";
import { color } from "$lib/util.js";
const { data } = $props();
let projects = $state(data.projects);
let { data } = $props();
</script>
<Head title="home" desc="home page of my personal website" />
<Header picture="tired" title={$_("home.title")} />
<main>
<Card title={$_("home.welcome.title")}>
<span> 👋 {$_("home.welcome.desc")}</span>
<ul>
<li>🇹🇷 {$_("home.welcome.whoami")}</li>
<li>🖥️ {$_("home.welcome.interest")}</li>
<li>❤️ {$_("home.welcome.support")}</li>
</ul>
</Card>
<Card title={$_("home.work.title")}>
<span>{$_("home.work.desc")}</span>
<ul>
<li>⌨️ {$_("home.work.build")}</li>
<li>🤦 {$_("home.work.fix")}</li>
<li>🚩 {$_("home.work.ctf")}</li>
<li>👥 {$_("home.work.contribute")}</li>
<li>📑 {$_("home.work.wiki")}</li>
</ul>
</Card>
<Card title={$_("home.links.title")}>
<span>{$_("home.links.desc")}:</span>
<ul>
<li>
<Link icon="nf-fa-key" link="https://keyoxide.org/F9E70878C2FB389AEC2BA34CA3654DF5AD9F641D">
PGP
</Link>
</li>
<li>
<Link icon="nf-md-email" link="mailto:ngn@ngn.tf">Email</Link>
</li>
<li>
<Link icon="nf-md-mastodon" link="https://defcon.social/@ngn">Mastodon</Link>
</li>
</ul>
<span>
{$_("home.links.prefer")}
</span>
</Card>
<Card title={$_("home.services.title")}>
<span>
{$_("home.services.desc")}:
</span>
<ul>
<li>
<i style="color: var(--{color()});" class="nf nf-md-speedometer_slow"></i>
{$_("home.services.speed")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-fa-lock"></i>
{$_("home.services.security")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-fa-network_wired"></i>
{$_("home.services.privacy")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-md-eye_off"></i>
{$_("home.services.bullshit")}
</li>
</ul>
<Link linK="/services">{$_("home.services.link")}</Link>
</Card>
<Card title={$_("home.projects.title")}>
<span>
{$_("home.projects.desc")}:
</span>
<ul>
{#each projects.filter((p) => {
return p.desc[$language] !== "" && p.desc[$language] !== null && p.desc[$language] !== undefined;
}) as project}
{#if data.error !== undefined}
<Error error={data.error} />
{:else}
<main>
<Card title={$_("home.welcome.title")}>
<span> 👋 {$_("home.welcome.desc")}</span>
<ul>
<li>🇹🇷 {$_("home.welcome.whoami")}</li>
<li>🖥️ {$_("home.welcome.interest")}</li>
<li>❤️ {$_("home.welcome.support")}</li>
</ul>
</Card>
<Card title={$_("home.work.title")}>
<span>{$_("home.work.desc")}</span>
<ul>
<li>⌨️ {$_("home.work.build")}</li>
<li>🤦 {$_("home.work.fix")}</li>
<li>🚩 {$_("home.work.ctf")}</li>
<li>👥 {$_("home.work.contribute")}</li>
<li>📑 {$_("home.work.wiki")}</li>
</ul>
</Card>
<Card title={$_("home.links.title")}>
<span>{$_("home.links.desc")}:</span>
<ul>
<li>
<Link active={true} link={project.url}>{project.name}</Link>:
{project.desc[$language]}
<Link
icon="nf-fa-key"
link="https://keyoxide.org/F9E70878C2FB389AEC2BA34CA3654DF5AD9F641D"
>
PGP
</Link>
</li>
{/each}
</ul>
</Card>
</main>
<li>
<Link icon="nf-md-email" link="mailto:ngn@ngn.tf">Email</Link>
</li>
<li>
<Link icon="nf-md-mastodon" link="https://defcon.social/@ngn">Mastodon</Link>
</li>
</ul>
<span>
{$_("home.links.prefer")}
</span>
</Card>
<Card title={$_("home.services.title")}>
<span>
{$_("home.services.desc")}:
</span>
<ul>
<li>
<i style="color: var(--{color()});" class="nf nf-md-speedometer_slow"></i>
{$_("home.services.speed")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-fa-lock"></i>
{$_("home.services.security")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-fa-network_wired"></i>
{$_("home.services.privacy")}
</li>
<li>
<i style="color: var(--{color()});" class="nf nf-md-eye_off"></i>
{$_("home.services.bullshit")}
</li>
</ul>
<Link link="/services">{$_("home.services.link")}</Link>
</Card>
<Card title={$_("home.projects.title")}>
<span>
{$_("home.projects.desc")}:
</span>
{#if data.error === undefined}
<ul>
{#each data.projects.filter((p) => {
return p.desc[$locale] !== "" && p.desc[$locale] !== null && p.desc[$locale] !== undefined;
}) as project}
<li>
<Link active={true} link={project.url}>{project.name}</Link>:
{project.desc[$locale]}
</li>
{/each}
</ul>
{/if}
</Card>
</main>
{/if}
<style>
main {

View File

@ -1,8 +1,11 @@
import { doc_get } from "$lib/doc";
import { doc_get_list, doc_get } from "$lib/doc";
export async function load({ fetch, params }) {
try {
return { doc: await doc_get(fetch, params.name) };
return {
docs: await doc_get_list(fetch),
doc: await doc_get(fetch, params.name),
};
} catch (err) {
return { error: err.toString() };
}

View File

@ -1,20 +1,18 @@
<script>
import Header from "$lib/header.svelte";
import Error from "$lib/error.svelte";
import Head from "$lib/head.svelte";
import { language, color } from "$lib/util.js";
import { goto } from "$app/navigation";
import { locale, _ } from "svelte-i18n";
import { color } from "$lib/util.js";
import DOMPurify from "dompurify";
import { onMount } from "svelte";
import { marked } from "marked";
import { _ } from "svelte-i18n";
let { data } = $props();
marked.use({ breaks: true });
onMount(async () => {
if (data.error !== null) return await goto("/");
for (let key in data.doc)
data.doc[key]["content"] = DOMPurify.sanitize(data.doc[key]["content"]);
});
@ -23,28 +21,32 @@
<Head title="documentation" desc="website and API documentation" />
<Header picture="reader" title={$_("doc.title")} />
<main>
{#if data.doc !== undefined}
<div class="markdown-body" style="--link-color: var(--{color()})">
{@html marked.parse(data.doc[$language].content)}
</div>
<div class="docs">
{#each data.docs[$language] as doc}
{#if doc.title == data.doc[$language].title}
<a href="/doc/{doc.name}" style="border-color: var(--{color()})">
<h1>{doc.title}</h1>
<h3>{doc.desc}</h3>
</a>
{:else}
<a href="/doc/{doc.name}" style="border-color: var(--white-3)">
<h1>{doc.title}</h1>
<h3>{doc.desc}</h3>
</a>
{/if}
{/each}
</div>
{/if}
</main>
{#if data.error !== undefined}
<Error error={data.error} />
{:else}
<main>
{#if data.doc !== undefined}
<div class="markdown-body" style="--link-color: var(--{color()})">
{@html marked.parse(data.doc[$locale].content)}
</div>
<div class="docs">
{#each data.docs[$locale] as doc}
{#if doc.title == data.doc[$locale].title}
<a href="/doc/{doc.name}" style="border-color: var(--{color()})">
<h1>{doc.title}</h1>
<h3>{doc.desc}</h3>
</a>
{:else}
<a href="/doc/{doc.name}" style="border-color: var(--white-3)">
<h1>{doc.title}</h1>
<h3>{doc.desc}</h3>
</a>
{/if}
{/each}
</div>
{/if}
</main>
{/if}
<style>
@import "/markdown.css";

View File

@ -0,0 +1,14 @@
import { api_get_services } from "$lib/api.js";
export async function load({ fetch }) {
try {
let services = await api_get_services(fetch)
return {
services: null === services ? [] : services,
};
} catch (err) {
return {
error: err.toString(),
};
}
}

View File

@ -1,12 +1,12 @@
<script>
import Service from "$lib/service.svelte";
import Header from "$lib/header.svelte";
import Error from "$lib/error.svelte";
import Link from "$lib/link.svelte";
import Head from "$lib/head.svelte";
import { api_urljoin } from "$lib/api.js";
import { language } from "$lib/util.js";
import { _ } from "svelte-i18n";
import { locale, _ } from "svelte-i18n";
let { data } = $props();
let services = $state(data.services);
@ -22,15 +22,13 @@
data.services.forEach((s) => {
if (s.name.toLowerCase().includes(value)) services.push(s);
else if (s.desc[$language].toLowerCase().includes(value)) services.push(s);
else if (s.desc[$locale].toLowerCase().includes(value)) services.push(s);
});
}
function get_services() {
return services.filter((s) => {
return (
s.desc[$language] !== "" && s.desc[$language] !== null && s.desc[$language] !== undefined
);
return s.desc[$locale] !== "" && s.desc[$locale] !== null && s.desc[$locale] !== undefined;
});
}
</script>
@ -38,23 +36,27 @@
<Head title="services" desc="my self-hosted services and projects" />
<Header picture="cool" title={$_("services.title")} />
<main>
<div class="title">
<input oninput={change} type="text" placeholder={$_("services.search")} />
<div>
<Link icon="nf-fa-feed" link={api_urljoin("/news/" + $language)}>{$_("services.feed")}</Link>
{#if data.error !== undefined}
<Error error={data.error} />
{:else}
<main>
<div class="title">
<input oninput={change} type="text" placeholder={$_("services.search")} />
<div>
<Link icon="nf-fa-feed" link={api_urljoin("/news/" + $locale)}>{$_("services.feed")}</Link>
</div>
</div>
</div>
<div class="services">
{#if get_services().length == 0}
<h3 class="none">{$_("services.none")}</h3>
{:else}
{#each get_services() as service}
<Service {service} />
{/each}
{/if}
</div>
</main>
<div class="services">
{#if get_services().length == 0}
<h3 class="none">{$_("services.none")}</h3>
{:else}
{#each get_services() as service}
<Service {service} />
{/each}
{/if}
</div>
</main>
{/if}
<style>
main {