pages/src/routes/projects/projectn5/devlog/+page.svelte

<script lang="ts">
    import Banner2 from "$lib/banner2.svelte";
    import Content from "$lib/viewport/content.svelte";
    // import type { DevlogPost } from "./devlog-posts";
    import { posts, type DevlogPost } from "./posts";
    import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";

    let entries: GalleryEntry[] = posts.entries().map(mapEntries).toArray();

    function mapEntries(m: [String, DevlogPost], index: number): GalleryEntry {
        return {
            title: `${m[1].title}`,
            subtitle: `#${posts.size - index} // ${m[1].date}`,
            img: `/projects/projectn5/devlog/${m[0]}/preview.webp`,
            link: `/projects/projectn5/devlog/${m[0]}/`,
            imgAlt: `Preview image for ${m[1].title}`,
        };
    }

    // Leftpads a single-digit number to two digits
    function leftpad(n: number): String {
        var result = n.toString();
        if (n < 10) {
            result = "0" + result
        }
        return result;
    }
</script>


<svelte:head>
    <title>Project N5 Devlog | denizk0461</title> 
</svelte:head>

<Content>
    <Banner2
        title="Project N5; Development Log"
        banner="/projects/projectn5/banner2.webp" />

    <p>This is the development log for my game <b>Project N5</b>! It's an action-adventure jump-and-run game inspired by games such as Ratchet & Clank. Development started on <b>2023-09-16</b> and rebooted on <b>2025-05-16</b>.</p>

    <p>2023 progress updates summarise an entire month's work, respectively. Progress updates thereafter denote noteworthy developments in a more collected format.</p>

    <Gallery entries={entries} reverseTextOrder />
</Content>