badmanners/gallery.badmanners.xyz
badmanners/gallery.badmanners.xyz
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix typo and add latest uploads to index

Browse source
This commit is contained in:
Bad Manners 2024-03-25 15:35:24 -03:00
parent 41c2f92927
commit 00fa1fb164
7 changed files with 101 additions and 31 deletions

2
scripts/export-story.ts
View file

@ -48,7 +48,7 @@ async function exportStory(slug: string, options: { outputDir: string }) {
} catch {
/* Spawn Astro dev server */
console.log("Starting Astro development server...");
devServerProcess = exec("npm run dev");
devServerProcess = exec("./node_modules/.bin/astro dev");
await setTimeout(2000);
try {
await fetchRetry(healthcheckURL, { retries: 5, retryDelay: 2000 });

2
src/content/stories/tiny-accident.md
View file

@ -69,7 +69,7 @@ With all of his attention on the micro shifting against his palm, the rat slowly
The rodent was quickly losing his patience. "You didn't mean to...what? Be a creepy pervert and sneak your way to my fucking dick?!"
Too nervous to lie his way out of this, the wolf simply looked away from the giant face and closed his lies. "I didn't think you'd feel o-or notice me..."
Too nervous to lie his way out of this, the wolf simply looked away from the giant face and closed his eyes. "I didn't think you'd feel o-or notice me..."
Kolo's face turned red with anger.

8
src/pages/feed.xml.ts
View file

@ -7,9 +7,11 @@ type FeedItem = RSSFeedItem & {
pubDate: Date;
};
const MAX_ITEMS = 10;
export const GET: APIRoute = async ({ site }) => {
const stories = await getCollection("stories", (story) => !story.data.isDraft);
const games = await getCollection("games", (game) => !game.data.isDraft);
const stories = (await getCollection("stories", (story) => !story.data.isDraft)).sort((a, b) => getUnixTime(b.data.pubDate) - getUnixTime(a.data.pubDate)).slice(0, MAX_ITEMS);
const games = (await getCollection("games", (game) => !game.data.isDraft)).sort((a, b) => getUnixTime(b.data.pubDate) - getUnixTime(a.data.pubDate)).slice(0, MAX_ITEMS);
return rss({
title: "Gallery | Bad Manners",
description: "Stories, games, and (possibly) more by Bad Manners",
@ -37,6 +39,6 @@ export const GET: APIRoute = async ({ site }) => {
]
.flat()
.sort((a, b) => getUnixTime(b.pubDate) - getUnixTime(a.pubDate))
.slice(0, 10),
.slice(0, MAX_ITEMS),
});
};

16
src/pages/games.astro
View file

@ -14,18 +14,20 @@ const games = (await getCollection("games", (game) => !game.data.isDraft)).sort(
<meta slot="head-description" content="Bad Manners || A game that I've gone and done." property="og:description" />
<h1 class="m-2 text-2xl font-semibold text-stone-800 dark:text-stone-100">Games</h1>
<p class="my-4">A game that I've gone and done.</p>
<ul class="my-6 flex flex-wrap justify-center gap-4 text-center md:justify-normal">
<ul class="my-6 flex flex-wrap justify-center gap-4 text-center md:justify-normal items-start">
{
games.map((game) => (
<li>
<a class="text-link hover:underline focus:underline" href={`/games/${game.slug}`}>
{game.data.thumbnail ? (
<Image
class="max-w-[288px]"
src={game.data.thumbnail}
alt={`Thumbnail for ${game.data.title}`}
width={288}
/>
<div class="max-w-[288px] aspect-[630/500] flex justify-center">
<Image
class="m-auto"
src={game.data.thumbnail}
alt={`Thumbnail for ${game.data.title}`}
width={288}
/>
</div>
) : null}
<div class="max-w-[288px] text-sm">
<>

62
src/pages/index.astro
View file

@ -1,5 +1,39 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import { Image } from "astro:assets";
import { getUnixTime, format as formatDate } from "date-fns";
import { enUS as enUSLocale } from "date-fns/locale/en-US";
import GalleryLayout from "../layouts/GalleryLayout.astro";
const MAX_ITEMS = 5;
interface LatestItemsEntry {
type: string;
thumbnail: CollectionEntry<"stories">["data"]["thumbnail"];
href: string;
title: string;
pubDate: Date;
}
const stories = (await getCollection("stories", (story) => !story.data.isDraft)).sort((a, b) => getUnixTime(b.data.pubDate) - getUnixTime(a.data.pubDate)).slice(0, MAX_ITEMS);
const games = (await getCollection("games", (game) => !game.data.isDraft)).sort((a, b) => getUnixTime(b.data.pubDate) - getUnixTime(a.data.pubDate)).slice(0, MAX_ITEMS);
const latestItems: LatestItemsEntry[] = [
stories.map<LatestItemsEntry>(story => ({
type: "Story",
thumbnail: story.data.thumbnail,
href: `/stories/${story.slug}`,
title: story.data.title,
pubDate: story.data.pubDate,
})),
games.map<LatestItemsEntry>(game => ({
type: "Game",
thumbnail: game.data.thumbnail,
href: `/games/${game.slug}`,
title: game.data.title,
pubDate: game.data.pubDate,
})),
].flat().sort((a, b) => getUnixTime(b.pubDate) - getUnixTime(a.pubDate)).slice(0, MAX_ITEMS);
---
<GalleryLayout pageTitle="Gallery">
@ -18,4 +52,32 @@ import GalleryLayout from "../layouts/GalleryLayout.astro";
target="_blank">my main website</a
>.
</p>
<section class="my-2" aria-labelledby="latest-uploads">
<h2 id="latest-uploads" class="p-2 text-xl font-semibold text-stone-800 dark:text-stone-100">Latest uploads</h2>
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal items-start">
{
latestItems.map((entry) => (
<li class="break-inside-avoid">
<a class="text-link hover:underline focus:underline" href={entry.href}>
{entry.thumbnail ? (
<div class="max-w-[192px] aspect-square flex justify-center">
<Image
class="m-auto"
src={entry.thumbnail}
alt={`Thumbnail for ${entry.title}`}
width={192}
/>
</div>
) : null}
<div class="max-w-[192px] text-sm">
<span>{entry.title}</span>
<br />
<span class="italic">{entry.type} &ndash; {formatDate(entry.pubDate, "MMM d, yyyy", { locale: enUSLocale })}</span>
</div>
</a>
</li>
))
}
</ul>
</section>
</GalleryLayout>

16
src/pages/stories/[page].astro
View file

@ -62,18 +62,20 @@ const totalPages = Math.ceil(page.total / page.size);
)
}
</div>
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal">
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal items-start">
{
page.data.map((story) => (
<li class="break-inside-avoid">
<a class="text-link hover:underline focus:underline" href={`/stories/${story.slug}`}>
{story.data.thumbnail ? (
<Image
class="max-w-[192px]"
src={story.data.thumbnail}
alt={`Thumbnail for ${story.data.title}`}
width={192}
/>
<div class="max-w-[192px] aspect-square flex justify-center">
<Image
class="m-auto"
src={story.data.thumbnail}
alt={`Thumbnail for ${story.data.title}`}
width={192}
/>
</div>
) : null}
<div class="max-w-[192px] text-sm">
<span>{story.data.title}</span>

26
src/pages/tags/[slug].astro
View file

@ -69,18 +69,19 @@ if (count == 1) {
<h2 id="content-stories" class="p-2 text-xl font-semibold text-stone-800 dark:text-stone-100">
Stories
</h2>
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal">
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal items-start">
{stories.map((story) => (
<li class="break-inside-avoid">
<a class="text-link hover:underline focus:underline" href={`/stories/${story.slug}`}>
{story.data.thumbnail ? (
<Image
class="w-48"
src={story.data.thumbnail}
alt={`Thumbnail for ${story.data.title}`}
width={story.data.thumbnailWidth}
height={story.data.thumbnailHeight}
/>
<div class="max-w-[192px] aspect-square flex justify-center">
<Image
class="m-auto"
src={story.data.thumbnail}
alt={`Thumbnail for ${story.data.title}`}
width={192}
/>
</div>
) : null}
<div class="max-w-48 text-sm">{story.data.title}</div>
</a>
@ -96,18 +97,19 @@ if (count == 1) {
<h2 id="content-games" class="p-2 text-xl font-semibold text-stone-800 dark:text-stone-100">
Games
</h2>
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal">
<ul class="flex flex-wrap justify-center gap-4 text-center md:justify-normal items-start">
{games.map((game) => (
<li class="break-inside-avoid">
<a class="text-link hover:underline focus:underline" href={`/games/${game.slug}`}>
{game.data.thumbnail ? (
<div class="max-w-[192px] aspect-[630/500] flex justify-center">
<Image
class="w-48"
class="m-auto"
src={game.data.thumbnail}
alt={`Thumbnail for ${game.data.title}`}
width={game.data.thumbnailWidth}
height={game.data.thumbnailHeight}
width={192}
/>
</div>
) : null}
<div class="max-w-48 text-sm">{game.data.title}</div>
</a>