SteamWar/Website
13
0
Fork 0
Code Issues 5 Pull-Requests Pakete Projekte 1 Releases Wiki Aktivität

Add EsLint

Quellcode durchsuchen
Dieser Commit ist enthalten in:
Chaoscaot 2023-12-23 15:36:22 +01:00
Ursprung 5a5cce199b
Commit 8fcab610fb
22 geänderte Dateien mit 2215 neuen und 468 gelöschten Zeilen
Statistiken anzeigen Patch-Datei herunterladen Vergleichs-Datei herunterladen Alle Dateien ausklappen Alle Dateien einklappen

53
.eslintrc.json Normale Datei
Datei anzeigen

@ -0,0 +1,53 @@
{
"env": {
"browser": true,
"es2021": true
},
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"plugin:astro/recommended",
"plugin:svelte/recommended"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
},
"plugins": [
"@typescript-eslint"
],
"overrides": [
{
"files": ["*.astro"],
"parser": "astro-eslint-parser",
"parserOptions": {
"sourceType": "module"
},
"rules": {
"astro/no-conflict-set-directives": "error",
"astro/no-unused-define-vars-in-style": "error"
}
}
],
"rules": {
"comma-spacing": ["error", { "before": false, "after": true }],
"no-multiple-empty-lines": ["error", { "max": 1, "maxEOF": 1 }],
"indent": [
"error",
4
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"double"
],
"semi": [
"error",
"always"
]
}
}

24
package.json
Datei anzeigen

@ -18,28 +18,34 @@
"ci": "pnpm run clean:dist && pnpm install && pnpm run i18n:sync && pnpm run build && pnpm run package"
},
"devDependencies": {
"@astrojs/svelte": "^5.0.1",
"@astrojs/tailwind": "^5.0.3",
"@astrojs/svelte": "^5.0.2",
"@astrojs/tailwind": "^5.0.4",
"@astropub/icons": "^0.2.0",
"@types/color": "^3.0.6",
"@types/crypto-js": "^4.2.1",
"@types/node": "^20.10.4",
"@types/node": "^20.10.5",
"@typescript-eslint/eslint-plugin": "^6.15.0",
"@typescript-eslint/parser": "^6.15.0",
"autoprefixer": "^10.4.16",
"cssnano": "^6.0.2",
"esbuild": "^0.19.9",
"esbuild": "^0.19.10",
"eslint": "^8.56.0",
"eslint-plugin-astro": "^0.31.0",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-svelte": "^2.35.1",
"postcss-nesting": "^12.0.2",
"sass": "^1.69.5",
"svelte": "^4.2.8",
"tailwind-merge": "^2.1.0",
"tailwindcss": "^3.3.6",
"tailwind-merge": "^2.2.0",
"tailwindcss": "^3.4.0",
"typescript": "^5.3.3"
},
"dependencies": {
"@astrojs/sitemap": "^3.0.3",
"@codemirror/lang-json": "^6.0.1",
"@ddietr/codemirror-themes": "^1.4.2",
"astro": "^4.0.6",
"astro-i18n": "^2.1.18",
"astro": "^4.0.7",
"astro-i18n": "^2.2.0",
"astro-robots-txt": "^1.0.0",
"astro-seo": "^0.8.0",
"chart.js": "^4.4.1",
@ -50,7 +56,7 @@
"dayjs": "^1.11.10",
"easymde": "^2.18.0",
"flowbite": "^1.8.1",
"flowbite-svelte": "^0.44.20",
"flowbite-svelte": "^0.44.21",
"flowbite-svelte-icons": "^0.4.5",
"sharp": "^0.32.6",
"svelte-awesome": "^3.3.0",

2091
pnpm-lock.yaml generiert
Datei anzeigen

Datei-Diff unterdrückt, da er zu groß ist Diff laden

2
src/components/admin/pages/Edit.svelte
Datei anzeigen

@ -38,8 +38,6 @@ $: availableBranches = $branches.map((branch) => ({
value: branch
}))
$: console.log(availableBranches)
async function createBranch() {
const name = prompt("Branch name:")
if (name) {

4
src/components/admin/pages/edit/MDEMarkdownEditor.svelte
Datei anzeigen

@ -26,11 +26,11 @@
let editor: HTMLTextAreaElement;
let mde: EasyMDE;
onMount(() => {
onMount(async () => {
mde = new EasyMDE({
element: editor,
initialValue: value,
spellChecker: false,
spellChecker: false
})
mde.codemirror.on("change", () => {
value = mde.value();

36
src/layouts/Basic.astro
Datei anzeigen

@ -1,30 +1,30 @@
---
import icon from '../images/logo.png';
import icon from "../images/logo.png";
import {getImage} from "astro:assets";
import {astroI18n} from "astro-i18n";
const { title, description } = Astro.props.frontmatter || Astro.props;
import { SEO } from "astro-seo";
const iconImage = await getImage({src: icon, height: 32, width: 32, format: 'png', quality: 100});
const iconImage = await getImage({src: icon, height: 32, width: 32, format: "png", quality: 100});
---
<html lang={astroI18n.locale} class="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=5, initial-scale=1.0, maximum-scale=5.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="icbm" content="52.370216;4.895168"/>
<link rel="icon" type="imgage/png" href={iconImage.src} />
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=5, initial-scale=1.0, maximum-scale=5.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="icbm" content="52.370216;4.895168"/>
<link rel="icon" type="imgage/png" href={iconImage.src} />
<SEO
title={title}
description={description}
/>
<SEO
title={title}
description={description}
/>
<slot name="head" />
</head>
<body class="dark:bg-zinc-800">
<slot />
</body>
<slot name="head" />
</head>
<body class="dark:bg-zinc-800">
<slot />
</body>
</html>

46
src/layouts/NavbarLayout.astro
Datei anzeigen

@ -1,11 +1,11 @@
---
import { Image } from "astro:assets";
import Basic from "./Basic.astro";
import '../styles/button.css';
import localLogo from "../images/logo.png"
import {YoutubeSolid, DiscordSolid, CaretDownOutline} from "flowbite-svelte-icons"
import "../styles/button.css";
import localLogo from "../images/logo.png";
import {YoutubeSolid, DiscordSolid, CaretDownOutline} from "flowbite-svelte-icons";
import {t} from "astro-i18n";
import {l} from "../util/util"
import {l} from "../util/util";
import ServerStatus from "../components/ServerStatus.svelte";
@ -83,26 +83,26 @@ const { title } = Astro.props;
</div>
</nav-bar>
<script>
class Navbar extends HTMLElement {
constructor() {
super();
if (window.scrollY != 0) {
this.classList.add("scrolled");
} else {
this.classList.remove("scrolled");
}
class Navbar extends HTMLElement {
constructor() {
super();
if (window.scrollY != 0) {
this.classList.add("scrolled");
} else {
this.classList.remove("scrolled");
}
window.onscroll = e => {
if (window.scrollY != 0) {
this.classList.add("scrolled");
} else {
this.classList.remove("scrolled");
}
}
}
}
;
customElements.define('nav-bar', Navbar);
window.onscroll = e => {
if (window.scrollY != 0) {
this.classList.add("scrolled");
} else {
this.classList.remove("scrolled");
}
};
}
}
customElements.define("nav-bar", Navbar);
</script>
<main class="flex-1">
<slot />

9
src/pages/[...slug].astro
Datei anzeigen

@ -1,6 +1,6 @@
---
import {getCollection} from 'astro:content'
import {astroI18n, createGetStaticPaths, t} from "astro-i18n";
import {getCollection} from "astro:content";
import {astroI18n, createGetStaticPaths} from "astro-i18n";
import PageLayout from "../layouts/PageLayout.astro";
import LanguageWarning from "../components/LanguageWarning.astro";
@ -22,14 +22,13 @@ export const getStaticPaths = createGetStaticPaths(async () => {
params: {
slug: fixLink(page.slug)
}
}) )
})
}));
});
const { page } = Astro.props;
const { Content } = await page.render();
---
<PageLayout title={page.data.title}>
<article>
{page.data.german && (

2
src/pages/admin/index.astro
Datei anzeigen

@ -1,5 +1,5 @@
---
import App from '../../components/admin/App.svelte'
import App from "../../components/admin/App.svelte";
import Basic from "../../layouts/Basic.astro";
---

70
src/pages/announcements/[...slug].astro
Datei anzeigen

@ -1,23 +1,23 @@
---
import {astroI18n, createGetStaticPaths, t} from "astro-i18n";
import {astroI18n, createGetStaticPaths} from "astro-i18n";
import {getCollection, CollectionEntry} from "astro:content";
import PageLayout from "../../layouts/PageLayout.astro";
import {TagSolid, CalendarMonthSolid} from "flowbite-svelte-icons"
import {TagSolid, CalendarMonthSolid} from "flowbite-svelte-icons";
import TagComponent from "../../components/TagComponent.astro";
import LanguageWarning from "../../components/LanguageWarning.astro";
export const getStaticPaths = createGetStaticPaths(async () => {
const posts = await getCollection('announcements', entry => entry.id.split('/')[0] === astroI18n.locale);
const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);
const germanPosts = await getCollection('announcements', entry => entry.id.split('/')[0] === 'de');
const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === "de");
germanPosts.forEach(value => {
if (posts.find(post => post.data.key === value.data.key)) {
return
return;
} else {
posts.push(value)
posts.push(value);
}
})
});
return posts.map(value => ({
params: {
@ -25,13 +25,13 @@ export const getStaticPaths = createGetStaticPaths(async () => {
},
props: {
post: value,
german: value.id.split('/')[0] != astroI18n.locale
german: value.id.split("/")[0] != astroI18n.locale
}
}))
})
}));
});
interface Props {
post: CollectionEntry<'announcements'>,
post: CollectionEntry<"announcements">,
german: boolean
}
@ -43,14 +43,14 @@ const { Content } = await post.render();
<article>
<h1 class="text-4xl mb-0">{post.data.title}</h1>
<h5 class="flex items-center mt-2 text-neutral-300"><TagSolid class="w-4 h-4 mr-2" /> {post.data.tags.map(tag => (
<TagComponent tag={tag} />
<TagComponent tag={tag} />
))} <CalendarMonthSolid class="w-4 h-4 mr-2" /> {Intl.DateTimeFormat(astroI18n.locale, {
day: 'numeric',
month: 'short',
year: 'numeric'
day: "numeric",
month: "short",
year: "numeric"
}).format(post.data.created)} </h5>
{german && (
<LanguageWarning />
<LanguageWarning />
)}
<Content />
<script>
@ -64,56 +64,56 @@ const { Content } = await post.render();
class FightTableElement extends HTMLElement {
connectedCallback(): void {
if (!eventMounts.has(this.dataset['event'])) {
eventMounts.set(this.dataset['event'], [])
if (!eventMounts.has(this.dataset["event"])) {
eventMounts.set(this.dataset["event"], []);
}
const rows = Number.parseInt(this.dataset['rows']);
eventMounts.get(this.dataset['event']).push(ev => {
const rows = Number.parseInt(this.dataset["rows"]);
eventMounts.get(this.dataset["event"]).push(ev => {
new FightTable({
target: this,
props: {
event: ev,
group: this.dataset['group'],
group: this.dataset["group"],
rows: !isNaN(rows) ? rows : 1,
}
})
})
});
});
}
}
class GroupTableElement extends HTMLElement {
connectedCallback(): void {
if (!eventMounts.has(this.dataset['event'])) {
eventMounts.set(this.dataset['event'], [])
if (!eventMounts.has(this.dataset["event"])) {
eventMounts.set(this.dataset["event"], []);
}
const rows = Number.parseInt(this.dataset['rows']);
eventMounts.get(this.dataset['event']).push(ev => {
const rows = Number.parseInt(this.dataset["rows"]);
eventMounts.get(this.dataset["event"]).push(ev => {
new GroupTable({
target: this,
props: {
event: ev,
group: this.dataset['group'],
group: this.dataset["group"],
rows: !isNaN(rows) ? rows : 1,
}
})
})
});
});
}
}
customElements.define('fight-table', FightTableElement);
customElements.define('group-table', GroupTableElement);
customElements.define("fight-table", FightTableElement);
customElements.define("group-table", GroupTableElement);
function mountEvent() {
for (const key of eventMounts.keys()) {
get(eventRepo).getEvent(key).then(ev => {
for (const mount of eventMounts.get(key)) {
mount(ev)
mount(ev);
}
})
});
}
}
mountEvent()
mountEvent();
</script>
</article>
</PageLayout>

12
src/pages/announcements/index.astro
Datei anzeigen

@ -1,22 +1,22 @@
---
import { getCollection } from "astro:content"
import { getCollection } from "astro:content";
import PageLayout from "../../layouts/PageLayout.astro";
import {astroI18n, t} from "astro-i18n";
import PostComponent from "../../components/PostComponent.astro";
import dayjs from "dayjs";
async function getPosts() {
const posts = await getCollection('announcements', entry => entry.id.split('/')[0] === astroI18n.locale);
const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);
const germanPosts = await getCollection('announcements', entry => entry.id.split('/')[0] === 'de');
const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === "de");
germanPosts.forEach(value => {
if (posts.find(post => post.data.key === value.data.key)) {
return
return;
} else {
posts.push(value)
posts.push(value);
}
})
});
return posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix()).filter((value, index) => index < 20);
}

28
src/pages/announcements/tags/[tag].astro
Datei anzeigen

@ -8,31 +8,31 @@ import PostComponent from "../../../components/PostComponent.astro";
import dayjs from "dayjs";
export const getStaticPaths = createGetStaticPaths(async () => {
let posts = (await getCollection('announcements', entry => entry.id.split("/")[0] === astroI18n.locale));
let posts = (await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale));
const germanPosts = await getCollection('announcements', entry => entry.id.split('/')[0] === 'de');
const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === "de");
posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix());
germanPosts.forEach(value => {
if (posts.find(post => post.data.key === value.data.key)) {
return
return;
} else {
posts.push(value)
posts.push(value);
}
})
});
posts = posts.filter((value, index) => index < 20)
posts = posts.filter((value, index) => index < 20);
let groupedByTags: Record<string, CollectionEntry<'announcements'>[]> = {}
let groupedByTags: Record<string, CollectionEntry<"announcements">[]> = {};
posts.forEach(post => {
post.data.tags.forEach(tag => {
if (!groupedByTags[tag]) {
groupedByTags[tag] = []
groupedByTags[tag] = [];
}
groupedByTags[tag].push(post)
})
})
groupedByTags[tag].push(post);
});
});
return Object.keys(groupedByTags).map(tag => ({
params: {
@ -42,11 +42,11 @@ export const getStaticPaths = createGetStaticPaths(async () => {
posts: groupedByTags[tag],
tag: tag
}
}))
})
}));
});
interface Props {
posts: CollectionEntry<'announcements'>[]
posts: CollectionEntry<"announcements">[]
tag: string
}

2
src/pages/dashboard.astro
Datei anzeigen

@ -1,7 +1,5 @@
---
import Dashboard from "../components/Dashboard.svelte";
import {AES} from "crypto-js";
import {l} from "../util/util";
import PageLayout from "../layouts/PageLayout.astro";
import {t} from "astro-i18n";
---

6
src/pages/downloads.astro
Datei anzeigen

@ -14,11 +14,11 @@ const downloads = await getCollection("downloads");
<div class="py-4">{t(e.data.description)}</div>
<div class="flex flex-col">
{typeof e.data.url === 'object' ?
{typeof e.data.url === "object" ?
Object.entries(e.data.url).map(value => (
<a href={value[1].startsWith("/") ? l(value[1]) : value[1]} class="text-blue-500 hover:underline w-fit">{t(value[0])}</a>
<a href={value[1].startsWith("/") ? l(value[1]) : value[1]} class="text-blue-500 hover:underline w-fit">{t(value[0])}</a>
))
:
:
<a href={e.data.url} class="text-blue-500 hover:underline w-fit">{t("Download")}</a>
}
{e.data.sourceUrl ? <a class="text-blue-500 hover:underline w-fit" href={e.data.sourceUrl}>Quelle</a> : null}

7
src/pages/help/[...slug].astro
Datei anzeigen

@ -1,5 +1,5 @@
---
import { getCollection } from 'astro:content'
import { getCollection } from "astro:content";
import NavbarLayout from "../../layouts/NavbarLayout.astro";
import {astroI18n, createGetStaticPaths} from "astro-i18n";
@ -8,14 +8,13 @@ export const getStaticPaths = createGetStaticPaths(async () => {
return posts.filter(value => value.id.split("/")[0] === astroI18n.locale).map((page) => ({
props: { page }, params: { slug: page.slug }
}) )
})
}) );
});
const { page } = Astro.props;
const { Content } = await page.render();
---
<NavbarLayout title={page.data.title}>
<article>
<h1 class="text-left">{page.data.title}</h1>

7
src/pages/help/index.astro
Datei anzeigen

@ -2,7 +2,6 @@
import {getCollection} from "astro:content";
import {astroI18n} from "astro-i18n";
import NavbarLayout from "../../layouts/NavbarLayout.astro";
import {l} from "../../util/util";
import PageLayout from "../../layouts/PageLayout.astro";
let posts = await getCollection("help", entry => entry.id.split("/")[0] === astroI18n.locale);
@ -13,9 +12,9 @@ let posts = await getCollection("help", entry => entry.id.split("/")[0] === astr
<h1>Helpcenter</h1>
<h1 class="text-red-700 text-4xl">WIP!</h1>
{posts.map(value => (
<a href={l("/help/" + value.slug)}>
<h2>{value.data.title}</h2>
</a>
<a href={l("/help/" + value.slug)}>
<h2>{value.data.title}</h2>
</a>
))}
</div>
</PageLayout>

221
src/pages/index.astro
Datei anzeigen

@ -3,146 +3,147 @@ import NavbarLayout from "../layouts/NavbarLayout.astro";
import { Image } from "astro:assets";
import localBau from "../images/2023-10-08_20.43.43.png";
import {CaretRight, Archive, Rocket, Bell} from "@astropub/icons"
import {CaretRight, Archive, Rocket, Bell} from "@astropub/icons";
import {t} from "astro-i18n";
import {l} from "../util/util"
import {l} from "../util/util";
import PlayerCount from "../components/PlayerCount.svelte";
import "../../public/fonts/barlow-condensed/barlow-condensed.css"
import "../../public/fonts/barlow-condensed/barlow-condensed.css";
import type {Player} from "../components/types/data";
const teamMember = await fetch("http://localhost:1337/data/team").then(value => value.json())
const teamMember = await fetch("http://localhost:1337/data/team").then(value => value.json());
function groupByGroup(array) {
const groups = new Map<string, any>();
const groups = new Map<string, Player[]>();
for (let user of array) {
if (groups.has(user.prefix)) {
groups.get(user.prefix).push(user)
} else {
groups.set(user.prefix, [user])
}
}
for (let user of array) {
if (groups.has(user.prefix)) {
groups.get(user.prefix).push(user);
} else {
groups.set(user.prefix, [user]);
}
}
return groups
return groups;
}
const groupedTeamMember = groupByGroup(teamMember)
const groupedTeamMember = groupByGroup(teamMember);
function mapMap<T, K, J>(i: Map<T, K>, fn: (key: T, value: K) => J): J[] {
const arr = []
for (let [key, value] of i) {
arr.push(fn(key, value))
}
return arr
const arr = [];
for (let [key, value] of i) {
arr.push(fn(key, value));
}
return arr;
}
---
<NavbarLayout title={t("home.page")} description="SteamWar.de Homepage">
<div class="w-full h-screen relative mb-4">
<Image src={localBau} alt="Bau" width="1920" height="1080" densities={[1.5, 2, 3, 4]} class="w-full object-cover rounded-b-2xl shadow-2xl dark:brightness-75" style="height: calc(100vh + 1rem)" draggable="false" />
<drop-in class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex flex-col items-center">
<h1 class="text-4xl sm:text-6xl md:text-8xl font-extrabold text-white -translate-y-16 opacity-0 barlow" style="transition: transform .7s ease-out, opacity .7s linear; text-shadow: 2px 2px 5px black;">
<span class="text-yellow-400">{t("home.title.first")}</span><span class="text-neutral-600">{t("home.title.second")}</span>
</h1>
<text-carousel class="h-20 w-full relative select-none">
<h2 class="-translate-y-16">{t("home.subtitle.1")}</h2>
<h2>{t("home.subtitle.2")}<PlayerCount client:only="svelte" /></h2>
<h2>{t("home.subtitle.3")}</h2>
</text-carousel>
<a href={l("join")} class="btn mt-32 px-8 flex opacity-0 -translate-y-16" style="transition: transform .3s ease-out, opacity .3s linear">{t("home.join")} <CaretRight width="24" heigth="24" /></a>
<script>
<div class="w-full h-screen relative mb-4">
<Image src={localBau} alt="Bau" width="1920" height="1080" densities={[1.5, 2, 3, 4]} class="w-full object-cover rounded-b-2xl shadow-2xl dark:brightness-75" style="height: calc(100vh + 1rem)" draggable="false" />
<drop-in class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex flex-col items-center">
<h1 class="text-4xl sm:text-6xl md:text-8xl font-extrabold text-white -translate-y-16 opacity-0 barlow" style="transition: transform .7s ease-out, opacity .7s linear; text-shadow: 2px 2px 5px black;">
<span class="text-yellow-400">{t("home.title.first")}</span><span class="text-neutral-600">{t("home.title.second")}</span>
</h1>
<text-carousel class="h-20 w-full relative select-none">
<h2 class="-translate-y-16">{t("home.subtitle.1")}</h2>
<h2>{t("home.subtitle.2")}<PlayerCount client:only="svelte" /></h2>
<h2>{t("home.subtitle.3")}</h2>
</text-carousel>
<a href={l("join")} class="btn mt-32 px-8 flex opacity-0 -translate-y-16" style="transition: transform .3s ease-out, opacity .3s linear">{t("home.join")} <CaretRight width="24" heigth="24" /></a>
<script>
class TextCarousel extends HTMLElement {
current = 0;
current = 0;
connectedCallback() {
this._current.classList.add("!opacity-100")
connectedCallback() {
this._current.classList.add("!opacity-100");
for (let i = 0; i < this.children.length; i++) {
if (i !== this.current) {
this.children[i].classList.add("translate-y-8")
}
}
for (let i = 0; i < this.children.length; i++) {
if (i !== this.current) {
this.children[i].classList.add("translate-y-8");
}
}
setInterval(() => {
this.next()
}, 5000)
}
setInterval(() => {
this.next();
}, 5000);
}
get _current() {
return this.children[this.current]
}
get _current() {
return this.children[this.current];
}
next() {
this._current.classList.remove("!opacity-100")
this._current.classList.add("translate-y-8")
this._current.classList.remove("!delay-500")
this.current = (this.current + 1) % this.children.length
this._current.classList.add("!opacity-100")
this._current.classList.remove("translate-y-8")
this._current.classList.add("!delay-500")
}
next() {
this._current.classList.remove("!opacity-100");
this._current.classList.add("translate-y-8");
this._current.classList.remove("!delay-500");
this.current = (this.current + 1) % this.children.length;
this._current.classList.add("!opacity-100");
this._current.classList.remove("translate-y-8");
this._current.classList.add("!delay-500");
}
}
class DropIn extends HTMLElement {
connectedCallback() {
for (let child of this.children) {
if(child.classList.contains("opacity-0")) {
child.classList.remove("opacity-0")
child.classList.remove("-translate-y-16")
} else {
child.children[0].classList.remove("opacity-0")
child.children[0].classList.remove("-translate-y-16")
}
}
}
}
connectedCallback() {
for (let child of this.children) {
if(child.classList.contains("opacity-0")) {
child.classList.remove("opacity-0");
child.classList.remove("-translate-y-16");
} else {
child.children[0].classList.remove("opacity-0");
child.children[0].classList.remove("-translate-y-16");
}
}
}
}
customElements.define("text-carousel", TextCarousel);
customElements.define("drop-in", DropIn);
</script>
</drop-in>
</div>
<section class="w-full flex flex-col items-center justify-center shadow-2xl rounded-b-2xl pb-8">
<div class="py-10 flex flex-col lg:flex-row">
<div class="card">
<Archive heigth="64" width="64" />
<h1>{t("home.benefits.historic.title")}</h1>
<p>{t("home.benefits.historic.description.1")}</p>
<p>{t("home.benefits.historic.description.2")}</p>
</div>
<div class="card">
<Rocket heigth="64" width="64" />
<h1>{t("home.benefits.server.title")}</h1>
<p>{t("home.benefits.server.description")}</p>
</div>
<div class="card">
<Bell heigth="64" width="64" />
<h1>{t("home.benefits.events.title")}</h1>
<p>{t("home.benefits.events.description.1")}</p>
<p>{t("home.benefits.events.description.2")}</p>
</div>
</div>
<a class="btn px-8 flex" href={l("/about")}>{t("home.benefits.read")}<CaretRight width="24" heigth="24" /></a>
</section>
<section class="w-full py-12">
{mapMap(groupedTeamMember, (key, value) => (
<div class="flex items-center flex-col">
<h2 class="dark:text-white text-4xl font-bold">{t("home.prefix." + key)}</h2>
<div class="flex my-4 md:flex-row flex-col flex-wrap justify-center">
{value.map(v => (
<div class="bg-zinc-50 border-gray-100 py-24 px-12 border-2 m-2 transition duration-300 ease-in-out rounded-xl shadow-lg
</script>
</drop-in>
</div>
<section class="w-full flex flex-col items-center justify-center shadow-2xl rounded-b-2xl pb-8">
<div class="py-10 flex flex-col lg:flex-row">
<div class="card">
<Archive heigth="64" width="64" />
<h1>{t("home.benefits.historic.title")}</h1>
<p>{t("home.benefits.historic.description.1")}</p>
<p>{t("home.benefits.historic.description.2")}</p>
</div>
<div class="card">
<Rocket heigth="64" width="64" />
<h1>{t("home.benefits.server.title")}</h1>
<p>{t("home.benefits.server.description")}</p>
</div>
<div class="card">
<Bell heigth="64" width="64" />
<h1>{t("home.benefits.events.title")}</h1>
<p>{t("home.benefits.events.description.1")}</p>
<p>{t("home.benefits.events.description.2")}</p>
</div>
</div>
<a class="btn px-8 flex" href={l("/about")}>{t("home.benefits.read")}<CaretRight width="24" heigth="24" /></a>
</section>
<section class="w-full py-12">
{mapMap(groupedTeamMember, (key, value) => (
<div class="flex items-center flex-col">
<h2 class="dark:text-white text-4xl font-bold">{t("home.prefix." + key)}</h2>
<div class="flex my-4 md:flex-row flex-col flex-wrap justify-center">
{value.map(v => (
<div class="bg-zinc-50 border-gray-100 py-24 px-12 border-2 m-2 transition duration-300 ease-in-out rounded-xl shadow-lg
hover:scale-105 hover:shadow-2xl
dark:bg-neutral-900 dark:border-gray-800 dark:text-white">
<figure class="flex flex-col items-center">
<figcaption class="text-center mb-4 text-2xl">{v.name}</figcaption>
<Image src={`https://visage.surgeplay.com/bust/150/${v.uuid}`} class="transition duration-300 ease-in-out hover:scale-110 hover:drop-shadow-2xl" alt={v.name + "s bust"} width="150" height="150" />
</figure>
</div>
))}
</div>
</div>
))}
</section>
<figure class="flex flex-col items-center">
<figcaption class="text-center mb-4 text-2xl">{v.name}</figcaption>
<Image src={`https://visage.surgeplay.com/bust/150/${v.uuid}`} class="transition duration-300 ease-in-out hover:scale-110 hover:drop-shadow-2xl" alt={v.name + "s bust"} width="150" height="150" />
</figure>
</div>
))}
</div>
</div>
))}
</section>
</NavbarLayout>
<style>

1
src/pages/login.astro
Datei anzeigen

@ -1,5 +1,4 @@
---
import {l} from "../util/util";
import Login from "../components/Login.svelte";
import NavbarLayout from "../layouts/NavbarLayout.astro";
import {t} from "astro-i18n";

3
src/pages/ranked/[...gamemode].astro
Datei anzeigen

@ -14,7 +14,7 @@ export const getStaticPaths = createGetStaticPaths(async () => {
params: {
gamemode: value.id
}
}))
}));
});
interface Props {
@ -24,7 +24,6 @@ interface Props {
const { mode } = Astro.props;
---
<PageLayout title={t("elo.title", {mode: t(`${mode.data.translationKey}.title`)})}>
<h1 class="text-2xl mb-2">{t("ranking.heading", { mode: t(`${mode.data.translationKey}.title`) })}</h1>
<EloTable gamemode={mode.id} client:only="svelte" />

15
src/pages/rules/[mode].astro
Datei anzeigen

@ -1,5 +1,5 @@
---
import {getCollection, CollectionEntry} from 'astro:content'
import {getCollection, CollectionEntry} from "astro:content";
import {astroI18n, createGetStaticPaths, t} from "astro-i18n";
import PageLayout from "../../layouts/PageLayout.astro";
import LanguageWarning from "../../components/LanguageWarning.astro";
@ -7,20 +7,20 @@ import LanguageWarning from "../../components/LanguageWarning.astro";
export const getStaticPaths = createGetStaticPaths(async () => {
let posts = await getCollection("rules", value => value.id.split("/")[0] === astroI18n.locale);
const germanPosts = await getCollection('rules', entry => entry.id.split('/')[0] === 'de');
const germanPosts = await getCollection("rules", entry => entry.id.split("/")[0] === "de");
germanPosts.forEach(value => {
if (posts.find(post => post.id.split("/")[1] === value.id.split("/")[1])) {
return
return;
} else {
posts.push(value)
posts.push(value);
}
})
});
return posts.map((page) => ({
props: { page, german: page.id.split("/")[0] != astroI18n.locale }, params: { mode: page.slug.split("/")[1] }
}))
})
}));
});
interface Props {
page: CollectionEntry<"rules">,
@ -31,7 +31,6 @@ const { page, german } = Astro.props;
const { Content } = await page.render();
---
<PageLayout title={t("title", {mode: t(`${page.data.translationKey}.title`, {}, {route: "/rules"})}, {route: "/rules"})}>
<article>
{german && (

35
src/pages/rules/index.astro
Datei anzeigen

@ -1,9 +1,8 @@
---
import wg from "../../images/WarGears.png"
import mwg from "../../images/MiniWarGears.png"
import as from "../../images/AirShips.png"
import ws from "../../images/WarShips.png"
import wg from "../../images/WarGears.png";
import mwg from "../../images/MiniWarGears.png";
import as from "../../images/AirShips.png";
import ws from "../../images/WarShips.png";
import {t} from "astro-i18n";
import {getCollection} from "astro:content";
import PageLayout from "../../layouts/PageLayout.astro";
@ -16,24 +15,24 @@ const imageMap = {
"as": as,
"ws": ws,
"qg": mwg
}
};
const modes = await getCollection("modes", entry => entry.data.main)
const modes = await getCollection("modes", entry => entry.data.main);
---
<PageLayout title={t("page")}>
{modes.map(value => (
<div class="dark:bg-neutral-800 rounded-md p-4 border border-neutral-400 shadow-md my-4 flex flex-col
<div class="dark:bg-neutral-800 rounded-md p-4 border border-neutral-400 shadow-md my-4 flex flex-col
md:flex-row">
<Image height="300" width="300" src={imageMap[value.data.translationKey]} alt={t(value.data.translationKey + ".title")} class="dark:invert"></Image>
<div class="ml-4">
<h1 class="text-2xl font-bold">{t(value.data.translationKey + ".title")}</h1>
<div>{t(value.data.translationKey + ".description")}</div>
<div class="mt-2 flex flex-col">
<a href={l(`/rules/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("rules")}</a>
<a href={l(`/announcements/tags/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("announcements")}</a>
{value.data.ranked ? <a href={l(`/ranked/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t(`ranking`)}</a> : null}
</div>
<Image height="300" width="300" src={imageMap[value.data.translationKey]} alt={t(value.data.translationKey + ".title")} class="dark:invert"></Image>
<div class="ml-4">
<h1 class="text-2xl font-bold">{t(value.data.translationKey + ".title")}</h1>
<div>{t(value.data.translationKey + ".description")}</div>
<div class="mt-2 flex flex-col">
<a href={l(`/rules/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("rules")}</a>
<a href={l(`/announcements/tags/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("announcements")}</a>
{value.data.ranked ? <a href={l(`/ranked/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("ranking")}</a> : null}
</div>
</div>))}
</div>
</div>))}
</PageLayout>

9
src/util/util.ts
Datei anzeigen

@ -17,21 +17,22 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import { l as proxyL, t as proxyT } from 'astro-i18n'
import { l as proxyL } from "astro-i18n";
const locales = ["de"];
export const l = (route: string) => {
const transPath = proxyL(route)
const transPath = proxyL(route);
if(import.meta.env.DEV) {
return transPath;
}
let [empty, locale, ...rest] = transPath.split("/");
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const [_, locale, ...rest] = transPath.split("/");
if (locales.includes(locale)) {
return "/" + rest.join("/");
}
return transPath;
}
};