From c828a91381c1678c6d68c61137adba70cae500d9 Mon Sep 17 00:00:00 2001 From: Zsolt Tasnadi Date: Tue, 3 Mar 2026 11:42:45 +0100 Subject: [PATCH] countdowner to frontend --- .gitignore | 1 + apps/frontend/package-lock.json | 13 +- apps/frontend/package.json | 6 +- apps/frontend/src/events-example.yaml | 9 + apps/frontend/src/pages/index.astro | 230 +++++++++++++++++++++----- 5 files changed, 214 insertions(+), 45 deletions(-) create mode 100644 apps/frontend/src/events-example.yaml diff --git a/.gitignore b/.gitignore index eaf2280..7c88fd3 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,4 @@ teletype_softwares .env pma-config.user.inc.php data +apps/frontend/src/events.yaml diff --git a/apps/frontend/package-lock.json b/apps/frontend/package-lock.json index a62bea7..47d2f5a 100644 --- a/apps/frontend/package-lock.json +++ b/apps/frontend/package-lock.json @@ -9,7 +9,11 @@ "version": "0.0.1", "dependencies": { "@astrojs/tailwind": "^6.0.2", - "astro": "^5.17.1" + "astro": "^5.17.1", + "js-yaml": "^4.1.1" + }, + "devDependencies": { + "@types/js-yaml": "^4.0.9" } }, "node_modules/@alloc/quick-lru": { @@ -1587,6 +1591,13 @@ "@types/unist": "*" } }, + "node_modules/@types/js-yaml": { + "version": "4.0.9", + "resolved": "https://registry.npmjs.org/@types/js-yaml/-/js-yaml-4.0.9.tgz", + "integrity": "sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/mdast": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-4.0.4.tgz", diff --git a/apps/frontend/package.json b/apps/frontend/package.json index 82a1454..cbe7caa 100644 --- a/apps/frontend/package.json +++ b/apps/frontend/package.json @@ -10,6 +10,10 @@ }, "dependencies": { "@astrojs/tailwind": "^6.0.2", - "astro": "^5.17.1" + "astro": "^5.17.1", + "js-yaml": "^4.1.1" + }, + "devDependencies": { + "@types/js-yaml": "^4.0.9" } } diff --git a/apps/frontend/src/events-example.yaml b/apps/frontend/src/events-example.yaml new file mode 100644 index 0000000..5eb1dd0 --- /dev/null +++ b/apps/frontend/src/events-example.yaml @@ -0,0 +1,9 @@ +events: + - name: "Projekt deadline" + date: "2026-03-15T10:00:00Z" + - name: "Summer Vacation" + date: "2026-06-20T16:00:00Z" + - name: "Christmas Party" + date: "2026-12-22T19:00:00Z" + - name: "Tech Conference" + date: "2027-02-01T09:00:00Z" diff --git a/apps/frontend/src/pages/index.astro b/apps/frontend/src/pages/index.astro index 4e9df27..bbb6c34 100644 --- a/apps/frontend/src/pages/index.astro +++ b/apps/frontend/src/pages/index.astro @@ -1,54 +1,198 @@ --- import Layout from '../layouts/Layout.astro'; +import fs from 'node:fs'; +import path from 'node:path'; +import yaml from 'js-yaml'; + +interface Event { + name: string; + date: string; +} + +interface EventData { + events: Event[]; +} + +let nextEvent: (Event & { dateISO: string; dateText: string }) | null = null; +let followingEvents: (Event & { dateText: string })[] = []; + +try { + const rootDir = process.cwd(); + let eventsPath = path.join(rootDir, 'src', 'events.yaml'); + if (!fs.existsSync(eventsPath)) { + eventsPath = path.join(rootDir, 'src', 'events-example.yaml'); + } + + if (fs.existsSync(eventsPath)) { + const fileContents = fs.readFileSync(eventsPath, 'utf8'); + const data = yaml.load(fileContents) as EventData; + + if (data && data.events) { + const now = new Date(); + const futureEvents = data.events + .map(e => ({ + ...e, + dateObj: new Date(e.date) + })) + .filter(e => e.dateObj > now) + .sort((a, b) => a.dateObj.getTime() - b.dateObj.getTime()); + + if (futureEvents.length > 0) { + const first = futureEvents[0]; + nextEvent = { + name: first.name, + date: first.date, + dateISO: first.dateObj.toISOString(), + dateText: first.dateObj.toLocaleString('en-US', { + year: 'numeric', month: 'short', day: 'numeric', + hour: '2-digit', minute: '2-digit' + }) + }; + + followingEvents = futureEvents.slice(1).map(e => ({ + name: e.name, + date: e.date, + dateText: e.dateObj.toLocaleString('en-US', { + year: 'numeric', month: 'short', day: 'numeric', + hour: '2-digit', minute: '2-digit' + }) + })); + } + } + } +} catch (e) { + console.error('Failed to load events:', e); +} --- -
- -
-

Teletype Games

-

- Teletype Games is an independent game development community built on creative freedom, equality, and an open-source mindset. Our goal is to create experimental and full-fledged games with short development cycles. -

-
- - -
- -
-

Catalog

-

Here you can find our games. Discover our creations for TIC-80 and other platforms, many of which you can try directly in your browser.

- - Browse Games - +
+ +
+
+
+
- - -
-

Wiki

-

We gather our public interest development knowledge here. Read through technical descriptions and development logs.

- - Knowledge Base - -
- - -
-

Git Repos

-

All our projects are open source. Browse our code, study our solutions, or even participate in the development.

- - Gitea - + +
+
+ Welcome to +
+

+ Teletype Games +

+

+ Teletype Games is an independent game development community built on creative freedom, equality, and an open-source mindset. Our goal is to create experimental and full-fledged games with short development cycles. +

+
+
-
-

Countdown

-

Stay up to date with our next game release. The countdown shows how much time is left until the next premiere.

- - Countdown - -
-
+ {nextEvent && ( +
+
+

{nextEvent.name}

+
+ -- : -- : -- : -- +
+

Starts on: {nextEvent.dateText}

+ + {followingEvents.length > 0 && ( +
+

Upcoming Events

+
+ {followingEvents.map(event => ( +
+ {event.name} + {event.dateText} +
+ ))} +
+
+ )} +
+
+ )} + + +
+ +
+
+ 🎮 +
+

Catalog

+

Here you can find our games. Discover our creations for TIC-80 and other platforms, many of which you can try directly in your browser.

+ + Browse Games + +
+ + +
+
+ 📚 +
+

Wiki

+

We gather our public interest development knowledge here. Read through technical descriptions and development logs.

+ + Knowledge Base + +
+ + +
+
+ 💻 +
+

Git Repos

+

All our projects are open source. Browse our code, study our solutions, or even participate in the development.

+ + Gitea + +
+
+
+ +