Compare commits
2 Commits
Eventplan-
...
add-tutori
| Author | SHA1 | Date | |
|---|---|---|---|
| 4d100fcafc | |||
| 82f5ab48b8 |
8750
pnpm-lock.yaml
generated
8750
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -18,81 +18,133 @@
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import "../styles/button.css";
|
||||
import {CaretDownOutline, SearchOutline} from "flowbite-svelte-icons";
|
||||
import {t} from "astro-i18n";
|
||||
import {l} from "../util/util";
|
||||
import {onMount} from "svelte";
|
||||
import "../styles/button.css";
|
||||
import { CaretDownOutline, SearchOutline } from "flowbite-svelte-icons";
|
||||
import { t } from "astro-i18n";
|
||||
import { l } from "../util/util";
|
||||
import { onMount } from "svelte";
|
||||
import { loggedIn } from "@repo/authv2.ts";
|
||||
interface Props {
|
||||
logo?: import('svelte').Snippet;
|
||||
logo?: import("svelte").Snippet;
|
||||
}
|
||||
|
||||
let { logo }: Props = $props();
|
||||
|
||||
let navbar: HTMLDivElement = $state();
|
||||
let searchOpen = $state(false);
|
||||
let navbar = $state<HTMLDivElement>();
|
||||
let searchOpen = $state(false);
|
||||
|
||||
onMount(() => {
|
||||
handleScroll();
|
||||
})
|
||||
let accountBtn = $state<HTMLAnchorElement>();
|
||||
|
||||
function handleScroll() {
|
||||
if (window.scrollY > 0) {
|
||||
navbar.classList.add("before:scale-y-100");
|
||||
} else {
|
||||
navbar.classList.remove("before:scale-y-100");
|
||||
}
|
||||
$effect(() => {
|
||||
if ($loggedIn) {
|
||||
accountBtn!.href = l("/dashboard");
|
||||
} else {
|
||||
accountBtn!.href = l("/login");
|
||||
}
|
||||
});
|
||||
|
||||
onMount(() => {
|
||||
handleScroll();
|
||||
});
|
||||
|
||||
function handleScroll() {
|
||||
if (window.scrollY > 0) {
|
||||
navbar!.classList.add("before:scale-y-100");
|
||||
} else {
|
||||
navbar!.classList.remove("before:scale-y-100");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:window onscroll={handleScroll}/>
|
||||
<svelte:window onscroll={handleScroll} />
|
||||
|
||||
<nav data-pagefind-ignore class="fixed top-0 left-0 right-0 sm:px-4 py-1 transition-colors z-10 flex justify-center before:backdrop-blur before:shadow-2xl before:absolute before:top-0 before:left-0 before:bottom-0 before:right-0 before:-z-10 before:scale-y-0 before:transition-transform before:origin-top" bind:this={navbar}>
|
||||
<div class="flex flex-row items-center justify-evenly md:justify-between match">
|
||||
<a class="flex items-center" href={l("/")}>
|
||||
{@render logo?.()}
|
||||
<span class="text-2xl uppercase font-bold dark:text-white hidden md:inline-block">
|
||||
{t("navbar.title")}
|
||||
<span class="before:scale-y-100" style="display: none" aria-hidden="true"></span>
|
||||
</span>
|
||||
</a>
|
||||
<div class="flex justify-center flex-wrap">
|
||||
<div class="btn-dropdown">
|
||||
<button class="btn btn-gray">
|
||||
<a href={l("/")}>
|
||||
<span class="btn__text">{t("navbar.links.home.title")}</span>
|
||||
</a>
|
||||
<CaretDownOutline class="ml-2 mt-auto"/>
|
||||
</button>
|
||||
<div>
|
||||
<a class="btn btn-gray" href={l("/announcements")}>{t("navbar.links.home.announcements")}</a>
|
||||
<a class="btn btn-gray" href={l("/downloads")}>{t("navbar.links.home.downloads")}</a>
|
||||
<a class="btn btn-gray" href={l("/faq")}>{t("navbar.links.home.faq")}</a>
|
||||
<a class="btn btn-gray" href={l("/code-of-conduct")}>{t("navbar.links.rules.coc")}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-dropdown">
|
||||
<button class="btn btn-gray">
|
||||
<a rel="prefetch" href={l("/rules")}>
|
||||
<span class="btn__text">{t("navbar.links.rules.title")}</span>
|
||||
</a>
|
||||
<CaretDownOutline class="ml-2 mt-auto"/>
|
||||
</button>
|
||||
<div>
|
||||
<a href={l("/rules/wargear")} class="btn btn-gray">{t("navbar.links.rules.wg")}</a>
|
||||
<a href={l("/rules/miniwargear")} class="btn btn-gray">{t("navbar.links.rules.mwg")}</a>
|
||||
<a href={l("/rules/warship")} class="btn btn-gray">{t("navbar.links.rules.ws")}</a>
|
||||
<a href={l("/rules/airship")} class="btn btn-gray">{t("navbar.links.rules.as")}</a>
|
||||
<a href={l("/rules/quickgear")} class="btn btn-gray">{t("navbar.links.rules.qg")}</a>
|
||||
<h2 class="px-2 text-gray-300">{t("navbar.links.rules.rotating")}</h2>
|
||||
<a href={l("/rules/megawargear")}
|
||||
class="btn btn-gray">{t("navbar.links.rules.megawg")}</a>
|
||||
<a href={l("/rules/microwargear")}
|
||||
class="btn btn-gray">{t("navbar.links.rules.micro")}</a>
|
||||
<a href={l("/rules/streetfight")} class="btn btn-gray">{t("navbar.links.rules.sf")}</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- TODO: Add help center
|
||||
<nav
|
||||
data-pagefind-ignore
|
||||
class="fixed top-0 left-0 right-0 sm:px-4 py-1 transition-colors z-10 flex justify-center before:backdrop-blur before:shadow-2xl before:absolute before:top-0 before:left-0 before:bottom-0 before:right-0 before:-z-10 before:scale-y-0 before:transition-transform before:origin-top"
|
||||
bind:this={navbar}
|
||||
>
|
||||
<div
|
||||
class="flex flex-row items-center justify-evenly md:justify-between match"
|
||||
>
|
||||
<a class="flex items-center" href={l("/")}>
|
||||
{@render logo?.()}
|
||||
<span
|
||||
class="text-2xl uppercase font-bold dark:text-white hidden md:inline-block"
|
||||
>
|
||||
{t("navbar.title")}
|
||||
<span
|
||||
class="before:scale-y-100"
|
||||
style="display: none"
|
||||
aria-hidden="true"
|
||||
></span>
|
||||
</span>
|
||||
</a>
|
||||
<div class="flex justify-center flex-wrap">
|
||||
<div class="btn-dropdown">
|
||||
<button class="btn btn-gray">
|
||||
<a href={l("/")}>
|
||||
<span class="btn__text">{t("navbar.links.home.title")}</span>
|
||||
</a>
|
||||
<CaretDownOutline class="ml-2 mt-auto" />
|
||||
</button>
|
||||
<div>
|
||||
<a class="btn btn-gray" href={l("/announcements")}
|
||||
>{t("navbar.links.home.announcements")}</a
|
||||
>
|
||||
<a class="btn btn-gray" href={l("/downloads")}
|
||||
>{t("navbar.links.home.downloads")}</a
|
||||
>
|
||||
<a class="btn btn-gray" href={l("/tutorials")}
|
||||
>{t("navbar.links.home.tutorials")}</a
|
||||
>
|
||||
<a class="btn btn-gray" href={l("/faq")}
|
||||
>{t("navbar.links.home.faq")}</a
|
||||
>
|
||||
<a class="btn btn-gray" href={l("/code-of-conduct")}
|
||||
>{t("navbar.links.rules.coc")}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-dropdown">
|
||||
<button class="btn btn-gray">
|
||||
<a rel="prefetch" href={l("/rules")}>
|
||||
<span class="btn__text">{t("navbar.links.rules.title")}</span>
|
||||
</a>
|
||||
<CaretDownOutline class="ml-2 mt-auto" />
|
||||
</button>
|
||||
<div>
|
||||
<a href={l("/rules/wargear")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.wg")}</a
|
||||
>
|
||||
<a href={l("/rules/miniwargear")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.mwg")}</a
|
||||
>
|
||||
<a href={l("/rules/warship")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.ws")}</a
|
||||
>
|
||||
<a href={l("/rules/airship")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.as")}</a
|
||||
>
|
||||
<a href={l("/rules/quickgear")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.qg")}</a
|
||||
>
|
||||
<h2 class="px-2 text-gray-300">{t("navbar.links.rules.rotating")}</h2>
|
||||
<a href={l("/rules/megawargear")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.megawg")}</a
|
||||
>
|
||||
<a href={l("/rules/microwargear")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.micro")}</a
|
||||
>
|
||||
<a href={l("/rules/streetfight")} class="btn btn-gray"
|
||||
>{t("navbar.links.rules.sf")}</a
|
||||
>
|
||||
<h2 class="px-2 text-gray-300">{t("navbar.links.rules.ranked")}</h2>
|
||||
<a href={l("/rangliste/missilewars")} class="btn btn-gray"
|
||||
>{t("navbar.links.ranked.mw")}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- TODO: Add help center
|
||||
<div class="btn-dropdown my-1">
|
||||
<div class="btn btn-gray" tabindex="1">
|
||||
<a rel="prefetch">
|
||||
@ -106,26 +158,26 @@
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<a class="btn" href={l("/login")}>
|
||||
<span class="btn__text">{t("navbar.links.account")}</span>
|
||||
</a>
|
||||
<!--
|
||||
<a class="btn" href={l("/login")} bind:this={accountBtn}>
|
||||
<span class="btn__text">{t("navbar.links.account")}</span>
|
||||
</a>
|
||||
<!--
|
||||
<button class="btn my-1" onclick={() => searchOpen = true}>
|
||||
<SearchOutline ariaLabel="Site Search" class="inline-block h-6"/>
|
||||
</button>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{#if searchOpen}
|
||||
{#await import("./SearchComponent.svelte") then c}
|
||||
<c.default bind:open={searchOpen} />
|
||||
{/await}
|
||||
{#await import("./SearchComponent.svelte") then c}
|
||||
<c.default bind:open={searchOpen} />
|
||||
{/await}
|
||||
{/if}
|
||||
|
||||
<style lang="scss">
|
||||
.match {
|
||||
width: min(100vw, 70em);
|
||||
}
|
||||
</style>
|
||||
.match {
|
||||
width: min(100vw, 70em);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -104,6 +104,14 @@ export const publics = defineCollection({
|
||||
}),
|
||||
});
|
||||
|
||||
export const tutorials = defineCollection({
|
||||
type: "content",
|
||||
schema: z.object({
|
||||
title: z.string(),
|
||||
translationKey: z.string(),
|
||||
}),
|
||||
});
|
||||
|
||||
export const collections = {
|
||||
"pages": pages,
|
||||
"help": help,
|
||||
@ -112,4 +120,5 @@ export const collections = {
|
||||
"downloads": downloads,
|
||||
"announcements": announcements,
|
||||
"publics": publics,
|
||||
"tutorials": tutorials
|
||||
};
|
||||
|
||||
56
src/content/tutorials/Tracer.md
Normal file
56
src/content/tutorials/Tracer.md
Normal file
@ -0,0 +1,56 @@
|
||||
---
|
||||
title: Tracer
|
||||
translationKey: tracer
|
||||
slug: tracer
|
||||
---
|
||||
|
||||
# Der Tracer
|
||||
|
||||
|
||||
Der Tracer ist eines der Kern-Tools unseres BauSystems. Durch ihn kannst du
|
||||
dir komfortabel angucken wie sich die TNT deiner Kanonen Tick für Tick
|
||||
verhalten. Dies tut der Tracer, indem er alle Daten der auf einem Plot
|
||||
gezündeten TNTs aufnimmt und speichert. Du kannst dir dann verschiedene
|
||||
Darstellungsformen der aufgezeichneten TNTs angucken.
|
||||
|
||||
## Den Tracer starten
|
||||
Um die Schüsse deiner Kanone auf einem Plot aufzunehmen, musst du den Tracer
|
||||
für diese Plot einschalten. Nutze hierfür `/trace auto`.
|
||||
Nun da der Tracer an ist, wird für jeden Kanonenschuss ein Trace erstellt.
|
||||
|
||||
## Traces anzeigen und analysieren
|
||||
Jetzt da der Tracer an ist und du einen Schuss abgegeben hast, kannst du dir
|
||||
den Trace mit
|
||||
`/trace show` anzeigen (Falls du mehrere Schüsse abgegeben hast kannst du
|
||||
dir mit
|
||||
`/trace isolate [Schuss-Nummer]` den Trace eines einzelnen Schusses anzeigen).
|
||||
|
||||
|
||||
Zur Analyse eines Schusses stellen wir dir verschiedene **View-Flags** zur
|
||||
Verfügung. Diese aktivierst du, indem du sie an den Trace-show Command
|
||||
anhängst.
|
||||
|
||||
| Flag | Beschreibung |
|
||||
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `count` | Zeige dir die Zahl der TNTs an die an einem Trace-Punkt aufgenommen wurden |
|
||||
| `explosion` | Zeige dir nur die Trace-Punkte an, an denen TNT explodiert ist |
|
||||
| `fuse` | Zeige dir an wie weit die TNTs an einem Trace Punkt von der Explosion weg waren |
|
||||
| `ignite` | Ohne diese Flag zeigt der Tracer nur Trace-Punkte an, die nach der ersten Explosion entstanden sind. Mit dieser Flag werden alle Trace-Punkte angezeigt |
|
||||
| `micromotion` | Zeige nur TNT an, die sich zu einem beliebigen Zeitpunkt mir einer Geschwindigkeit von kleiner 0.001 bewegt haben |
|
||||
| `source` | Zeige dir nur Trace-Punkte an, bei denen TNT gezündet wurde |
|
||||
| `build-destroy-only` | Zeige dir nur TNT an, die im Bau-Bereich explodiert sind |
|
||||
| `testblock-destroy-only` | Zeige dir nur TNT an, die im Testblock-Bereich explodiert sind |
|
||||
| `advanced` | Zeige dir die TNT-Zwischenberechnungspunkte auf den einzelnen Achsen an |
|
||||
|
||||
\
|
||||
Du kannst dir auch nur einen Abschnitt des Traces mit
|
||||
`\trace show from [Start-Zeit] to [End-Zeit] with [View-Flags]` anzeigen. Du kann auch `from` oder `to` weglassen, um dir den Trace von bzw. bis zu einem gewissen Zeitpunkt angucken.
|
||||
|
||||
## Traces löschen
|
||||
Allgemein empfiehlt es sich Traces nicht ewig rumliegen zu lassen, da ein
|
||||
`/trace show` schnell den PC zum erliegen bringen kann. Nutze `/trace
|
||||
delete [Schuss-Nummer]` um einzelne Traces zu löschen und `/trace clear`
|
||||
um alle Traces auf einem Plot zu löschen.
|
||||
|
||||
## Traces gemeinsam betrachten
|
||||
Wenn man zusammen an einer Kanonen arbeitet kann es praktisch sein, die selben Traces, mit den selben View-Flags zu betrachten. Dies kannst du machen mit `/trace follow [Spieler]`. Den Follow kannst du mit `/trace unfollow` wieder aufheben. Zusätzlich kannst du alle Spieler auf einem Bau-Server mit `/trace broadcast` einladen deiner Trace-View zu folgen.
|
||||
50
src/content/tutorials/bausystem/tracer.md
Normal file
50
src/content/tutorials/bausystem/tracer.md
Normal file
@ -0,0 +1,50 @@
|
||||
# Der Tracer
|
||||
|
||||
|
||||
Der Tracer ist eines der Kern-Tools unseres BauSystems. Durch ihn kannst du
|
||||
dir komfortabel angucken wie sich die TNT deiner Kanonen Tick für Tick
|
||||
verhalten. Dies tut der Tracer, indem er alle Daten der auf einem Plot
|
||||
gezündeten TNTs aufnimmt und speichert. Du kannst dir dann verschiedene
|
||||
Darstellungsformen der aufgezeichneten TNTs angucken.
|
||||
|
||||
## Den Tracer starten
|
||||
Um die Schüsse deiner Kanone auf einem Plot aufzunehmen, musst du den Tracer
|
||||
für diese Plot einschalten. Nutze hierfür `/trace auto`.
|
||||
Nun da der Tracer an ist, wird für jeden Kanonenschuss ein Trace erstellt.
|
||||
|
||||
## Traces anzeigen und analysieren
|
||||
Jetzt da der Tracer an ist und du einen Schuss abgegeben hast, kannst du dir
|
||||
den Trace mit
|
||||
`/trace show` anzeigen (Falls du mehrere Schüsse abgegeben hast kannst du
|
||||
dir mit
|
||||
`/trace isolate [Schuss-Nummer]` den Trace eines einzelnen Schusses anzeigen).
|
||||
|
||||
|
||||
Zur Analyse eines Schusses stellen wir dir verschiedene **View-Flags** zur
|
||||
Verfügung. Diese aktivierst du, indem du sie an den Trace-show Command
|
||||
anhängst.
|
||||
|
||||
| Flag | Beschreibung |
|
||||
| - | - |
|
||||
| `count` | Zeige dir die Zahl der TNTs an die an einem Trace-Punkt aufgenommen wurden |
|
||||
| `explosion` | Zeige dir nur die Trace-Punkte an, an denen TNT explodiert ist |
|
||||
| `fuse` | Zeige dir an wie weit die TNTs an einem Trace Punkt von der Explosion weg waren |
|
||||
| `ignite` | Ohne diese Flag zeigt der Tracer nur Trace-Punkte an, die nach der ersten Explosion entstanden sind. Mit dieser Flag werden alle Trace-Punkte angezeigt |
|
||||
| `micromotion` | Zeige nur TNT an, die sich zu einem beliebigen Zeitpunkt mir einer Geschwindigkeit von kleiner 0.001 bewegt haben |
|
||||
| `source` | Zeige dir nur Trace-Punkte an, bei denen TNT gezündet wurde |
|
||||
| `build-destroy-only` | Zeige dir nur TNT an, die im Bau-Bereich explodiert sind |
|
||||
| `testblock-destroy-only` | Zeige dir nur TNT an, die im Testblock-Bereich explodiert sind |
|
||||
| `advanced` | Zeige dir die TNT-Zwischenberechnungspunkte auf den einzelnen Achsen an |
|
||||
|
||||
\
|
||||
Du kannst dir auch nur einen Abschnitt des Traces mit
|
||||
`\trace show from [Start-Zeit] to [End-Zeit] with [View-Flags]` anzeigen. Du kann auch `from` oder `to` weglassen, um dir den Trace von bzw. bis zu einem gewissen Zeitpunkt angucken.
|
||||
|
||||
## Traces löschen
|
||||
Allgemein empfiehlt es sich Traces nicht ewig rumliegen zu lassen, da ein
|
||||
`/trace show` schnell den PC zum erliegen bringen kann. Nutze `/trace
|
||||
delete [Schuss-Nummer]` um einzelne Traces zu löschen und `/trace clear`
|
||||
um alle Traces auf einem Plot zu löschen.
|
||||
|
||||
## Traces gemeinsam betrachten
|
||||
Wenn man zusammen an einer Kanonen arbeitet kann es praktisch sein, die selben Traces, mit den selben View-Flags zu betrachten. Dies kannst du machen mit `/trace follow [Spieler]`. Den Follow kannst du mit `/trace unfollow` wieder aufheben. Zusätzlich kannst du alle Spieler auf einem Bau-Server mit `/trace broadcast` einladen deiner Trace-View zu folgen.
|
||||
@ -63,6 +63,7 @@
|
||||
"announcements": "Ankündigungen",
|
||||
"about": "Über Uns",
|
||||
"downloads": "Downloads",
|
||||
"tutorials": "Tutorials",
|
||||
"faq": "FAQ"
|
||||
},
|
||||
"rules": {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
"announcements": "Announcements",
|
||||
"about": "About",
|
||||
"downloads": "Downloads",
|
||||
"tutorials": "Tutorials",
|
||||
"faq": "FAQ"
|
||||
},
|
||||
"rules": {
|
||||
|
||||
BIN
src/images/tutorials/bausystem/tracer/tracer-cover.png
Normal file
BIN
src/images/tutorials/bausystem/tracer/tracer-cover.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 MiB |
BIN
src/images/tutorials/tracer-cover.png
Normal file
BIN
src/images/tutorials/tracer-cover.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 MiB |
@ -15,7 +15,7 @@ import {type Player} from "../components/types/data";
|
||||
import PostComponent from "../components/PostComponent.astro";
|
||||
import BackgroundImage from "../components/BackgroundImage.astro";
|
||||
|
||||
const teamMember: { [key: string]: Player[]} = await fetch("http://127.0.0.1:1337/data/team")
|
||||
const teamMember: { [key: string]: Player[]} = await fetch("https://api.steamwar.de/data/team")
|
||||
.then(value => value.json());
|
||||
|
||||
const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);
|
||||
|
||||
19
src/pages/tutorials/[tutorial].astro
Normal file
19
src/pages/tutorials/[tutorial].astro
Normal file
@ -0,0 +1,19 @@
|
||||
---
|
||||
import { createGetStaticPaths } from "astro-i18n";
|
||||
import { getCollection } from "astro:content";
|
||||
|
||||
const { tutorial } = Astro.props;
|
||||
|
||||
export const getStaticPaths = createGetStaticPaths(async () => {
|
||||
const tutorials = await getCollection("tutorials");
|
||||
|
||||
return tutorials.map((entry) => ({
|
||||
props: {
|
||||
title: entry.data.title
|
||||
},
|
||||
params: {
|
||||
title: entry.slug,
|
||||
},
|
||||
}));
|
||||
});
|
||||
---
|
||||
0
src/pages/tutorials/index.astro
Normal file
0
src/pages/tutorials/index.astro
Normal file
Reference in New Issue
Block a user