lambda/www
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

dep ver bump; clean-up; minor updates

Browse Source 
Signed-off-by: Paul W. <lambdapaul@protonmail.com>
This commit is contained in:
Paul W. 2024-12-28 12:23:50 -05:00
parent ff03bd50ff
commit 82ed74229b
Signed by: lambda
GPG Key ID: 0D207B4EBC14B1BD
28 changed files with 424 additions and 410 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
bun.lockb
View File

Binary file not shown.

4
components/container.tsx
View File

@ -1,4 +1,6 @@
export type ChildrenType = JSX.Element | Array<ChildrenType>;
import { JSX } from "react";
export type ChildrenType = JSX.Element| Array<ChildrenType>;
function Container(props: { children?: ChildrenType, ignore?: boolean }) {
if (props.ignore)

16
components/title.tsx
View File

@ -1,20 +1,21 @@
import Link from 'next/link';
import { useRouter } from 'next/router';
import { Fragment } from 'react';
import style from '../styles/title.module.css';
import SiteMap from '../public/sitemap.json';
import Head from 'next/head';
import { SiteSubPages } from '../lib/site';
import { Sites } from '../lib/site';
function createPathElements(ancestors: Array<{ name: string, path: string }>) {
let currentPath = '';
return ancestors.map((ancestor, id) => {
currentPath += `/${ancestor.path}`
return (
<>
<Link key={currentPath} href={currentPath}>{ancestor.name}</Link>
<Fragment key={currentPath} >
<Link href={currentPath}>{ancestor.name}</Link>
<> / </>
</>
</Fragment>
);
});
}
@ -25,7 +26,8 @@ function Title() {
const pagePath = router.asPath;
const splitPath: Array<{ name: string, path: string }> = [];
let currRoot: SiteSubPages = SiteMap.subpages;
// TODO(Paul): clean this up
let currRoot: Sites = SiteMap.pages;
let title: string | null = null;
if (pagePath !== '/') {
const subPaths = pagePath.split('?')[0].split('#')[0].split('/');
@ -36,9 +38,9 @@ function Title() {
if (currRoot === undefined
|| currRoot[p] === undefined
|| currRoot[p].subpages === undefined)
|| currRoot[p].pages === undefined)
break;
currRoot = currRoot[p].subpages!;
currRoot = currRoot[p].pages!;
}
if (splitPath !== undefined && splitPath.length > 0)
title = splitPath.pop()!.name;

4
lib/site.ts
View File

@ -1,11 +1,11 @@
export interface Site {
title: string;
subpages?: SiteSubPages;
pages?: Sites;
mtime?: string;
otime?: string;
}
export interface SiteSubPages {
export interface Sites {
[slug: string]: Site;
}

2
next-env.d.ts vendored
View File

@ -2,4 +2,4 @@
/// <reference types="next/image-types/global" />
// NOTE: This file should not be edited
// see https://nextjs.org/docs/basic-features/typescript for more information.
// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.

27
next.config.js → next.config.ts
View File

@ -1,14 +1,18 @@
const config = {
import type {NextConfig } from 'next';
import NextBundleAnalyzer from '@next/bundle-analyzer';
let config: NextConfig = {
reactStrictMode: true,
i18n: {
locales: ['en-US'],
defaultLocale: 'en-US'
},
// not sure why this breaks prod build in the latest version
// aah it's so frustrating to deal with an warning log that
// shows up regardless of the config but its presence halts
// the entire thing.
webpack: (config, _options) => {
config.module.rules.push(
{
test: /\.ya?ml$/,
use: 'js-yaml-loader',
},
{
test: /\.svg$/,
use: [{ loader: '@svgr/webpack' }],
@ -25,10 +29,6 @@ const config = {
test: /\.txt$/,
type: 'asset/source',
},
{
resourceQuery: /raw/,
type: 'asset/source',
},
);
return config;
@ -36,10 +36,9 @@ const config = {
};
if (process.env.ANALYZE) {
const bundleAnalyzer = require('@next/bundle-analyzer')({
config = NextBundleAnalyzer({
enabled: true
});
module.exports = bundleAnalyzer(config);
} else {
module.exports = config;
})(config);
}
export default config;

6
notes/lua.md
View File

@ -1,15 +1,11 @@
# Lua Programming Language
## Lua 5.4 C API
<!-- TODO ## Lua 5.4 C API-->
## Lua 5.4 Bytecode
> [!note]
> These are **unstable** and may differ in different versions of the language.
> They are not part of the language specification but an implementation detail, which in this case is the reference implementation.
> [!note]
> The reference implementation used to have a stack based but now uses a register based VM similar to how modern real computer architectures.
The instructions are 32 bits wide; every instruction has an opcode that takes up 7 bits, which leaves out 25 bits for the addresses and values.

4
notes/os.md
View File

@ -33,8 +33,8 @@ Open it by exceuting the following command or saving it as a shortcut: `explorer
### Video Players
- IINA
- [IINA](https://iina.io/)
- video player based on mpv with native macOS UI
- mpv
- [mpv](https://mpv.io/)
- mpv doesn't have a brew cask for Apple silicon; stolen-mpv exists but it is x86 only
- mpv brew formula is the cli tool which works pretty well but it is not as nice as packaged applications

5
notes/programming-resources.md
View File

@ -61,3 +61,8 @@ Semi-paywalled
## UTF-8 Everywhere
- http://utf8everywhere.org
## Parsing Gigabytes of JSON per Second
- https://arxiv.org/abs/1902.08318 [[PDF](https://arxiv.org/pdf/1902.08318)]

5
notes/steam-deck.md
View File

@ -17,7 +17,7 @@
following XDG Desktop Configuration, for example, can be used and added as a
non-Steam game while in Desktop mode for access in gaming mode
```cfg
```ini
#!/usr/bin/env xdg-open
[Desktop]
Version=1.0
@ -27,7 +27,8 @@ GenericName=Online Video Platform
Comment=An online video-sharing, social media platform
Exec=/usr/bin/flatpak run --branch=master --arch=x86_64 --file-forwarding org.chromium.Chrome @@ %F @@ --user-agent='Mozilla/5.0 (Windows NT 10.0; Win64; x64; Xbox; Xbox Series X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.82 Safari/537.36 Edge/20.02' --kiosk 'https://www.youtube.com/tv'
Terminal=false
MimeType=text/plain; # $XDG_PATH contains the paths used to fetch icons, extensions for supported formats are optional Icon=com.youtube.tv
MimeType=text/plain;
# $XDG_PATH contains the paths used to fetch icons, extensions for supported formats are optional Icon=com.youtube.tv
```
- Firefox can also be used however the supported command-line options are

11
notes/steam.md
View File

@ -14,11 +14,11 @@
- Alternatively, SteamCMD, a command-line only version of the Steam client, can
be used
- [Windows
Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd.zip)
Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd.zip)
- [Linux
Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_linux.tar.gz)
Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_linux.tar.gz)
- [macOS
Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_osx.tar.gz)
Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_osx.tar.gz)
## Downloading Older Depots
@ -51,4 +51,7 @@ values.
- useful bot written in C# to farm trading cards for owned games that can be
sold
- [SteamGridDB](https://steamgriddb.com/)
- custom video game assets for games available and not available on steam
- custom video game assets for games available and not available on Steam
- [ProtonDB](https://www.protondb.com/)
- community-sourced Linux compatibility tracker

37
package.json
View File

@ -1,4 +1,5 @@
{
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
@ -7,28 +8,32 @@
},
"dependencies": {
"dotenv": "^16.3.1",
"js-yaml-loader": "^1.2.2",
"next": "^13.5.1",
"highlight.js": "^11.10.0",
"next": "^15.0.4",
"normalize.css": "^8.0.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-markdown": "^9.0.0",
"react-syntax-highlighter": "^15.5.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-markdown": "^9.0.1",
"rehype-autolink-headings": "^7.1.0",
"rehype-highlight": "^7.0.0",
"rehype-highlight-code-lines": "^1.0.4",
"rehype-katex": "^7.0.1",
"rehype-raw": "^7.0.0",
"remark-directive": "^3.0.0",
"rehype-slug": "^6.0.0",
"remark-gfm": "^4.0.0",
"remark-github-admonitions-to-directives": "^2.0.0",
"remark-loader": "^6.0.0",
"remark-math": "^6.0.0",
"uri-js": "^4.4.1"
},
"devDependencies": {
"@next/bundle-analyzer": "^14.0.1",
"@svgr/webpack": "^6.5.1",
"@types/node": "^18.17.17",
"@types/react": "^18.2.22",
"@types/react-dom": "^18.2.7",
"@next/bundle-analyzer": "^15.0.4",
"@svgr/webpack": "^8.1.0",
"@types/node": "^22.7.4",
"@types/react": "^19.0.1",
"@types/react-dom": "^19.0.1",
"@types/react-syntax-highlighter": "^15.5.7",
"eslint": "^8.49.0",
"eslint-config-next": "^13.5.1",
"typescript": "^4.9.5"
"eslint": "^9.11.1",
"eslint-config-next": "^15.0.4",
"typescript": "^5.6.2"
}
}

54
pages/404.tsx
View File

@ -4,34 +4,34 @@ import Link from 'next/link';
import style from '../styles/title.module.css';
function NotFoundPage() {
// clean this page up
return (
<>
<Head>
<title>404: Not Found | PaulW.XYZ</title>
</Head>
<div className={style.container}>
<h1 className={style.title}>
Page Not Found
</h1>
</div>
<div className={`${style.nav} h1`}>
<Link href='/'>PaulW.XYZ</Link> / ... ??? / 404: Not Found </div>
<div className='container'>
<section className='block text center'>
<h1>Error 404</h1>
<p>
<strong>Uh oh! The page you are looking for does not exist...</strong><br />
</p>
<Link href='/' className='button green back link'>Go Home</Link>
<a className='button blue link extern' href='https://en.wikipedia.org/wiki/List_of_HTTP_status_codes'>
More on HTTP status codes
</a>
</section>
</div>
</>
// clean this page up
return (
<>
<Head>
<title>404: Not Found | PaulW.XYZ</title>
</Head>
<div className={style.container}>
<h1 className={style.title}>
Page Not Found
</h1>
</div>
<div className={`${style.nav} h1`}>
<Link href='/'>PaulW.XYZ</Link> / ... ??? / 404: Not Found </div>
<div className='container'>
<section className='block text center'>
<h1>Error 404</h1>
<p>
<strong>Uh oh! The page you are looking for does not exist...</strong><br />
</p>
<Link href='/' className='button green back link'>Go Home</Link>
<a className='button blue link extern' href='https://en.wikipedia.org/wiki/List_of_HTTP_status_codes'>
More on HTTP status codes
</a>
</section>
</div>
</>
);
);
}
export default NotFoundPage;

13
pages/_document.tsx Normal file
View File

@ -0,0 +1,13 @@
import { Html, Head, Main, NextScript } from "next/document";
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
);
}

56
pages/about.tsx
View File

@ -5,35 +5,35 @@ import License from '../LICENSE.txt';
import Layout from '../components/layout';
function AboutPage() {
return (
<Layout >
<section className='block'>
<p>Paul&apos;s Personal Website. I go by <a href='https://github.com/LambdaPaul'>@LambdaPaul</a> on GitHub and <a href='https://x.com/lambda_paul'>@lambda_paul</a> on X/Twitter.</p>
<p>I also have a Gitea server at <a href='https://git.paulw.xyz'>git.paulw.xyz</a> and a Pleroma (ActivityPub/Mastodon-compatible) server at <a href='https://social.paulw.xyz'>social.paulw.xyz</a> as back-ups for my GitHub and X/Twitter.</p>
<p>Why did I create this? Why do I have the back-ups?</p>
<p>
The original motivation was to just play with Next.js as it pretty much did the things I wanted web pages to do. But it came at the cost of needless complexity. As I use the JavaScript/ECMAScript/Whatever-you-want-to-call-it-script more and more, I am convinced that it is not a platform worth pursuing because the more complex it gets, the less control I have over what it does and this platform and its users seems to be okay with that sort of loss. I have been instead pivoting toward things that impressed and got me interested in working with computers.</p>
<p>Most services/products are keen on going against what Steph Ango calls <a href='https://stephango.com/file-over-app'>File over app</a>, a philosophy in which you prioritize data over software, and anticipate and embrace the eventual death of software. People instead want subscription services that barely support open formats and sometimes do not support exporting data to commonly used formats. The goal here is to avoid storing artifacts under locations that are easily not accessible, not under my control, and does not lock me out of using it with other software. The only reason I have not completely abandoned this is thanks to my decision to rely on Markdown files alone. Had it been reliant on any cloud software, I would have started over.</p>
return (
<Layout >
<section className='block'>
<p>Paul&apos;s Personal Website. I go by <a href='https://github.com/LambdaPaul'>@LambdaPaul</a> on GitHub and <a href='https://x.com/lambda_paul'>@lambda_paul</a> on X/Twitter.</p>
<p>I also have a Gitea server at <a href='https://git.paulw.xyz'>git.paulw.xyz</a> and a Pleroma (ActivityPub/Mastodon-compatible) server at <a href='https://social.paulw.xyz'>social.paulw.xyz</a> as back-ups for my GitHub and X/Twitter.</p>
<p>Why did I create this? Why do I have the back-ups?</p>
<p>
The original motivation was to just play with Next.js as it pretty much did the things I wanted web pages to do. But it came at the cost of needless complexity. As I use the JavaScript/ECMAScript/Whatever-you-want-to-call-it-script more and more, I am convinced that it is not a platform worth pursuing because the more complex it gets, the less control I have over what it does and this platform and its users seems to be okay with that sort of loss. I have been instead pivoting toward things that impressed and got me interested in working with computers.</p>
<p>Most services/products are keen on going against what Steph Ango calls <a href='https://stephango.com/file-over-app'>File over app</a>, a philosophy in which you prioritize data over software, and anticipate and embrace the eventual death of software. People instead want subscription services that barely support open formats and sometimes do not support exporting data to commonly used formats. The goal here is to avoid storing artifacts under locations that are easily not accessible, not under my control, and does not lock me out of using it with other software. The only reason I have not completely abandoned this is thanks to my decision to rely on Markdown files alone. Had it been reliant on any cloud software, I would have started over.</p>
<p>Got any questions, concerns, or issues? Contact me via email: <code>contact [at] paulw [dot] xyz</code>.</p>
</section>
<hr />
<section className='block'>
<p>Source for this site is available on GitHub: <a href='https://github.com/LambdaPaul/www'>github.com/LambdaPaul/www</a> and <a href='https://git.paulw.xyz/LambdaPaul/www'>git.paulw.xyz/LambdaPaul/www</a></p>
<p>Relevant information regarding the source is available on the repo and is also provided below.</p>
</section>
<section className='block'>
<h2>README</h2>
<ReactMarkdown>
{ReadmeMd.replace(/^#{1,5} /g, (s: string) => { return `#${s}` })}
</ReactMarkdown>
</section>
<section className='block'>
<h2>LICENSE</h2>
<pre className='license'>{License}</pre>
</section>
</Layout>
);
<p>Got any questions, concerns, or issues? Contact me via email: <code>contact [at] paulw [dot] xyz</code>.</p>
</section>
<hr />
<section className='block'>
<p>Source for this site is available on GitHub: <a href='https://github.com/LambdaPaul/www'>github.com/LambdaPaul/www</a> and <a href='https://git.paulw.xyz/LambdaPaul/www'>git.paulw.xyz/LambdaPaul/www</a></p>
<p>Relevant information regarding the source is available on the repo and is also provided below.</p>
</section>
<section className='block'>
<h2>README</h2>
<ReactMarkdown>
{ReadmeMd.replace(/^#{1,5} /g, (s: string) => { return `#${s}` })}
</ReactMarkdown>
</section>
<section className='block'>
<h2>LICENSE</h2>
<pre className='license'>{License}</pre>
</section>
</Layout>
);
}
export default AboutPage;

129
pages/notes/[note].tsx
View File

@ -1,10 +1,15 @@
import ReactMarkdown from 'react-markdown';
import SyntaxHighlighter from 'react-syntax-highlighter';
import { monokaiSublime as hlTheme } from 'react-syntax-highlighter/dist/cjs/styles/hljs';
import { PluggableList } from 'unified';
import remarkGfm from 'remark-gfm';
import remarkMath from 'remark-math';
import rehypeKatex from 'rehype-katex';
import rehypeRaw from 'rehype-raw';
import remarkDirective from 'remark-directive';
import remarkGithubAdmonitionsToDirectives from 'remark-github-admonitions-to-directives';
import rehypeSlug from 'rehype-slug';
import rehypeAutolinkHeadings from 'rehype-autolink-headings';
import rehypeHighlight from 'rehype-highlight';
import rehypeHighlightCodeLines, { type HighlightLinesOptions } from 'rehype-highlight-code-lines';
import Layout from '../../components/layout';
import readMarkdown from '../../lib/read-markdown';
@ -12,86 +17,76 @@ import { toLocaleString } from '../../lib/date';
import NotesInfo from '../../public/notes.json';
import style from '../../styles/note.module.css';
import 'highlight.js/styles/monokai-sublime.css';
import 'katex/dist/katex.min.css';
interface Note {
title: string,
mtime: string,
content?: string,
title: string,
mtime: string,
content?: string,
}
interface Notes {
[slug: string]: Note;
[slug: string]: Note;
}
function Markdown({ content }: any) {
return <ReactMarkdown
remarkPlugins={[remarkGithubAdmonitionsToDirectives, remarkDirective, remarkGfm]}
rehypePlugins={[rehypeRaw]}
components={{
code({ node, className, children, ...props }) {
const match = /language-(\w+)/.exec(className || '')
return match
? (
<SyntaxHighlighter
showLineNumbers={true}
language={match[1]}
//@ts-ignore
style={hlTheme}
PreTag='div'
codeTagProps={{ style: { display: 'block' } }}
customStyle={{ padding: '0', borderRadius: '1rem' }}
{...props}
>{String(children).replace(/\n$/, '')}</SyntaxHighlighter>
)
: <code className={className} {...props}>
{children}
</code>
}
}}
>{content}</ReactMarkdown>
const remarkPlugins: PluggableList = [
remarkGfm,
remarkMath,
];
const rehypePlugins: PluggableList = [
rehypeSlug,
rehypeAutolinkHeadings,
rehypeRaw,
rehypeHighlight,
rehypeKatex,
];
return <ReactMarkdown remarkPlugins={remarkPlugins} rehypePlugins={rehypePlugins}>
{content}
</ReactMarkdown>
}
function Note({ note }: { note: Note } ) {
return (<>
<Layout >
<span className={style['last-updated']}>
Last updated: {toLocaleString(note.mtime)}
</span>
<section className='block'>
<Markdown content={note.content} />
</section>
</Layout>
</>
);
function Note({ note }: { note: Note }) {
return (<>
<Layout >
<span className={style['last-updated']}>
Last updated: {toLocaleString(note.mtime)}
</span>
<section className='block'>
<Markdown content={note.content} />
</section>
</Layout>
</>
);
}
export async function getStaticProps({ params }: { params: { note: string } }) {
const note: string = params.note;
const notesInfo: Notes = NotesInfo;
const noteInfo: Note = notesInfo[note];
const note: string = params.note;
const notesInfo: Notes = NotesInfo;
const noteInfo: Note = notesInfo[note];
return {
props: {
note: {
...noteInfo,
content: await readMarkdown('notes', note, true)
}
}
}
return {
props: {
note: {
...noteInfo,
content: await readMarkdown('notes', note, true)
}
}
}
}
export async function getStaticPaths() {
return {
paths: Object.keys(NotesInfo).map((note: string) => {
return {
params: {
note
}
}
}),
fallback: false
};
return {
paths: Object.keys(NotesInfo).map((note: string) => {
return {
params: {
note
}
}
}),
fallback: false
};
}
export default Note;

84
pages/notes/index.tsx
View File

@ -6,52 +6,52 @@ import { toRelativeDate } from '../../lib/date';
import NotesInfo from '../../public/notes.json';
function NoteEntry({ note }: { note: { title: string, mtime: string, slug: string } }) {
return (
<tr>
<td style={{ flex: '1 0 50%' }}>
<Link href={`/notes/${note.slug}`}>
{note.title}
</Link>
</td>
<td style={{ fontStyle: 'italic' }}>
{note.mtime && toRelativeDate(note.mtime)}
</td>
</tr>
);
return (
<tr>
<td style={{ flex: '1 0 50%' }}>
<Link href={`/notes/${note.slug}`}>
{note.title}
</Link>
</td>
<td style={{ fontStyle: 'italic' }}>
{note.mtime && toRelativeDate(note.mtime)}
</td>
</tr>
);
}
function NotesPage() {
const notes = Object.entries(NotesInfo)
.map(([slug, note]) => {
return {
slug,
title: note.title,
mtime: new Date(note.mtime)
}
})
.sort(
(a, b) => {
return b.mtime.getTime() - a.mtime.getTime();
}
);
const notes = Object.entries(NotesInfo)
.map(([slug, note]) => {
return {
slug,
title: note.title,
mtime: new Date(note.mtime)
}
})
.sort(
(a, b) => {
return b.mtime.getTime() - a.mtime.getTime();
}
);
return (
<Layout>
{
!notes || notes.length === 0
&& <>No notes found</>
|| <table>
<tbody>
{notes.map(
(note: any) => {
return (<NoteEntry note={note} key={note.slug} />);
}
)}
</tbody>
</table>
}
</Layout>
)
return (
<Layout>
{
!notes || notes.length === 0
&& <>No notes found</>
|| <table>
<tbody>
{notes.map(
(note: any) => {
return (<NoteEntry note={note} key={note.slug} />);
}
)}
</tbody>
</table>
}
</Layout>
)
}

165
pages/posts/[post].tsx
View File

@ -3,102 +3,113 @@ import ReactMarkdown from 'react-markdown';
import style from '../../styles/post.module.css';
import PostsInfo from '../../public/posts.json';
import readMarkdown from '../../lib/read-markdown';
import DateTool from '../../lib/date';
import DateTool, { toLocaleString } from '../../lib/date';
interface Post {
title: string;
mtime: string;
otime?: string;
interface IPost {
title: string;
mtime: string;
otime?: string;
}
interface Posts {
[slug: string]: Post
interface IPosts {
[slug: string]: IPost
}
function TimeBlock({ mtime, otime }: { mtime: string, otime: string }) {
const ampm = (h: number) => { if (h >= 12) return 'p.m.'; return 'a.m.'; };
const ampm = (h: number) => { if (h >= 12) return 'p.m.'; return 'a.m.'; };
const mdate = new Date(mtime);
const odate = new Date(otime);
const mdate = new Date(mtime);
const odate = new Date(otime);
const format = (date: Date) => {
const day = date.getDay();
const ord = <sup>{DateTool.getOrdinalDaySuffix(date.getDay())}</sup>;
const month = DateTool.getFullMonth(date.getMonth());
const year = date.getFullYear();
const hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
const minPrefix = date.getMinutes() < 10 ? '0' : '';
const minutes = date.getMinutes();
const twelveSfx = ampm(date.getHours());
return <>{day}{ord} {month} {year} at {hours}:{minPrefix}{minutes} {twelveSfx}</>
};
const format = (date: Date) => {
const day = date.getDay();
const ord = <sup>{DateTool.getOrdinalDaySuffix(date.getDay())}</sup>;
const month = DateTool.getFullMonth(date.getMonth());
const year = date.getFullYear();
const hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
const minPrefix = date.getMinutes() < 10 ? '0' : '';
const minutes = date.getMinutes();
const twelveSfx = ampm(date.getHours());
return <>{day}{ord} {month} {year} at {hours}:{minPrefix}{minutes} {twelveSfx}</>
};
return (
<div style={{ textAlign: 'right', fontSize: '16px', fontFamily: 'Cantarell', fontStyle: 'italic' }}>
{
mtime ?
<div className='mtime' data-text={mdate.toISOString()}>
Last updated: {format(mdate)}
</div>
:
<></>
}
<div className='otime'>
{format(odate)}
</div>
</div>
);
return (
<div style={{ textAlign: 'right', fontSize: '16px', fontFamily: 'Cantarell', fontStyle: 'italic' }}>
{
mtime ?
<div className='mtime' data-text={mdate.toISOString()}>
Last updated: {format(mdate)}
</div>
:
<></>
}
<div className='otime'>
{format(odate)}
</div>
</div>
);
}
function Post({ post }: { post: Post & { content: string, cover?: string, otime: string, mtime?: string } }) {
return (<>
<Layout removeContainer={true} >
{<div className={style.imageBlock}
style={{
backgroundImage:
post.cover ?
`url(/assets/images/${post.cover})` :
'linear-gradient(to bottom right, rgb(5, 51, 11), rgb(5, 45, 13) 15%, rgb(5, 39,15) 40%, rgb(0, 30, 16) 80%)'
}}></div>}
<div className={`${style.spacer} ${post.cover ? style.background : ''}`}></div>
<section className={`${style.block} block`}>
<div className='container'>
<TimeBlock mtime={post.mtime} otime={post.otime} />
<ReactMarkdown>{post.content}</ReactMarkdown>
</div>
</section>
<div className={style.spacer}></div>
</Layout>
function Post({ post }: { post: IPost & { content: string, cover?: string, otime: string, mtime?: string } }) {
if (!post)
return <></>;
return (<>
<Layout removeContainer={true} >
<div className='container'>
{ post.otime !== post.mtime &&
<span className={style.time}>
Last updated: {toLocaleString(post.mtime)}
</span>
}
<span className={style.time}>
{toLocaleString(post.otime)}
</span>
</div>
{<div className={style.imageBlock}
style={{
backgroundImage:
post.cover ?
`url(/assets/images/${post.cover})` :
'linear-gradient(to bottom right, rgb(5, 51, 11), rgb(5, 45, 13) 15%, rgb(5, 39,15) 40%, rgb(0, 30, 16) 80%)'
}}></div>}
<div className={`${style.spacer} ${post.cover ? style.background : ''}`}></div>
<section className={`${style.block} block`}>
<div className='container'>
<ReactMarkdown>{post.content}</ReactMarkdown>
</div>
</section>
<div className={style.spacer}></div>
</Layout>
</>
);
</>
);
}
export async function getStaticProps({ params }: any) {
const postsInfo: Posts = PostsInfo;
const post: Post = postsInfo[params.post];
return {
props: {
post: {
...post,
content: await readMarkdown('posts', params.post, true)
}
}
}
const postsInfo: IPosts = PostsInfo;
const post: IPost = postsInfo[params.post];
return {
props: {
post: {
...post,
content: await readMarkdown('posts', params.post, true)
}
}
}
}
export async function getStaticPaths() {
return {
paths: Object.keys(PostsInfo).map((post: string) => {
return {
params: {
post
}
}
}),
fallback: false
};
return {
paths: Object.keys(PostsInfo).map((post: string) => {
return {
params: {
post
}
}
}),
fallback: false
};
}

72
pages/posts/index.tsx
View File

@ -4,49 +4,47 @@ import date from '../../lib/date';
import PostsInfo from '../../public/posts.json';
function PostsPage() {
return (
<Layout>
{Object.keys(PostsInfo).length && <Posts /> || <NoPosts />}
</Layout>
)
return (
<Layout>
{Object.keys(PostsInfo).length && <Posts /> || <NoPosts />}
</Layout>
)
}
function NoPosts() {
return (<><div className='text center'>
<div>**crickets**</div>
<div>No posts found...</div>
<div><Link href='/' className='link button green back'>Go Home</Link></div>
</div></>);
return (<div className='text center'>
<div>**crickets**</div>
<div>No posts found...</div>
<div><Link href='/' className='link button green back'>Go Home</Link></div>
</div>);
}
function Posts() {
const posts = Object.entries(PostsInfo);
return (
<>
<table>
<tbody>
{
posts.map(([slug, post]: [string, any]) => {
return <tr key={slug} style={{ alignItems: 'center' }}>
<td style={{ display: 'inline-block', textAlign: 'right', fontSize: '0.9rem' }}>
<div style={{ fontStyle: 'italics', fontSize: '.8rem' }}>{
post.mtime && (post.mtime != post.otime) && `Updated ${date.toRelativeDate(new Date(post.mtime))}`
}</div>
<div>{date.toRelativeDate(new Date(post.otime))}</div>
</td>
<td style={{
flex: '1 1 60%',
alignItems: 'center',
fontFamily: `'EB Garamond', 'Garamond', 'Times New Roman', Times, serif`
}}>
<Link href={`/posts/${slug}`} style={{ textDecoration: 'none' }}>{post.title}</Link>
</td>
</tr>
})}
</tbody>
</table>
</>
)
const posts = Object.entries(PostsInfo);
return (
<table>
<tbody>
{
posts.map(([slug, post]: [string, any]) => {
return (<tr key={slug} style={{ alignItems: 'center' }}>
<td style={{ display: 'inline-block', textAlign: 'right', fontSize: '0.9rem' }}>
<div style={{ fontStyle: 'italics', fontSize: '.8rem' }}>{
post.mtime && (post.mtime != post.otime) && `Updated ${date.toRelativeDate(new Date(post.mtime))}`
}</div>
<div>{date.toRelativeDate(new Date(post.otime))}</div>
</td>
<td style={{
fontFamily: `'EB Garamond', 'Garamond', 'Times New Roman', Times, serif`
, fontSize: '1.25rem'
}}>
<Link href={`/posts/${slug}`} style={{ textDecoration: 'none' }}>{post.title}</Link>
</td>
</tr>)
})
}
</tbody>
</table>
)
}

67
pages/sitemap.tsx
View File

@ -1,46 +1,41 @@
import Link from 'next/link';
import Layout from '../components/layout';
import { Site } from '../lib/site';
import { Sites } from '../lib/site';
import SiteMap from '../public/sitemap.json';
function traverseMap(head: Site, cwd = '', depth = 0) {
if (head.subpages === undefined)
return [];
let elements = [];
for (const [slug, info] of Object.entries(head.subpages)) {
if (slug === 'sitemap')
continue;
if (slug.startsWith('http://')) {
elements.push(<>
<dt>{info.title}</dt>
<dd><Link href={slug}>{slug.substring(7)}</Link></dd>
</>);
}
else if (slug.startsWith('https://')) {
elements.push(<>
<dt>{info.title}</dt>
<dd><Link href={slug}>{slug.substring(8)}</Link></dd>
</>);
}
else {
const path = `${cwd}/${slug}`;
const children = (<><dl style={{marginLeft: '3rem'}}> {traverseMap(info, path, depth + 1)}</dl></>);
elements.push(<>
<dt>{info.title}</dt>
<dd><Link href={path}>paulw.xyz{path}</Link></dd>
{children}
</>);
}
}
return elements;
function Desc(props: any) {
return (
<dl style={props.style}>
<dt>{props.term}</dt>
<dd>{props.details}</dd>
{props.children}
</dl>
);
}
function traverseMap(head?: Sites, cwd = '', depth = 0) {
if (!head) return [];
let elements = [];
for (const [slug, site] of Object.entries(head)) {
if (slug === 'sitemap')
continue;
let details;
let list;
const path = `${cwd}/${slug}`;
details = <Link href={path}>paulw.xyz{path}</Link>;
list = traverseMap(site.pages, path, depth + 1);
elements.push(<Desc style={{marginLeft: '3rem'}} key={site.title} term={site.title} details={details}>{list}</Desc>)
}
return elements;
}
function SiteMapPage() {
return <Layout>
<dl>{traverseMap(SiteMap)}</dl>
</Layout>;
return <Layout>
{traverseMap(SiteMap.pages)}
</Layout>;
}
export default SiteMapPage;

30
public/home.json
View File

@ -1,20 +1,14 @@
{
"posts": {
"title": "Posts"
},
"notes": {
"title": "Notes"
},
"about": {
"title": "About"
},
"sitemap": {
"title": "Site Map"
},
"https://git.paulw.xyz": {
"title": "Git.PaulW.XYZ"
},
"https://social.paulw.xyz": {
"title": "Social.PaulW.XYZ"
}
"posts": {
"title": "Posts"
},
"notes": {
"title": "Notes"
},
"about": {
"title": "About"
},
"sitemap": {
"title": "Site Map"
}
}

2
public/notes.json
View File

@ -1 +1 @@
{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"steam":{"title":"Steam Client","mtime":"2024-10-10T04:56:04.393Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-10-10T05:04:27.709Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-10-10T05:19:16.140Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-09-13T08:45:18.515Z"},"os":{"title":"Operating Systems","mtime":"2024-05-10T16:07:32.581Z"}}
{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"steam":{"title":"Steam Client","mtime":"2024-12-28T17:07:10.689Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-12-28T17:00:55.719Z"},"os":{"title":"Operating Systems","mtime":"2024-12-06T18:53:52.620Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-12-28T17:10:01.709Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-12-06T19:02:37.710Z"}}

2
public/sitemap.json
View File

@ -1 +1 @@
{"title":"PaulW.XYZ","subpages":{"posts":{"title":"Posts","subpages":{}},"notes":{"title":"Notes","subpages":{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"steam":{"title":"Steam Client","mtime":"2024-10-10T04:56:04.393Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-10-10T05:04:27.709Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-10-10T05:19:16.140Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-09-13T08:45:18.515Z"},"os":{"title":"Operating Systems","mtime":"2024-05-10T16:07:32.581Z"}}},"about":{"title":"About"},"sitemap":{"title":"Site Map"},"https://git.paulw.xyz":{"title":"Git.PaulW.XYZ"},"https://social.paulw.xyz":{"title":"Social.PaulW.XYZ"}}}
{"title":"PaulW.XYZ","pages":{"posts":{"title":"Posts","pages":{}},"notes":{"title":"Notes","pages":{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"steam":{"title":"Steam Client","mtime":"2024-12-28T17:07:10.689Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-12-28T17:00:55.719Z"},"os":{"title":"Operating Systems","mtime":"2024-12-06T18:53:52.620Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-12-28T17:10:01.709Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-12-06T19:02:37.710Z"}}},"about":{"title":"About"},"sitemap":{"title":"Site Map"}}}

4
scripts/generate-metadata.js
View File

@ -122,12 +122,12 @@ async function generateSiteMap() {
const sitemap = {
title: 'PaulW.XYZ',
subpages: await readFilesMetadata('home')
pages: await readFilesMetadata('home')
};
const pages = ['posts', 'notes'];
for (const page of pages) {
sitemap.subpages[page].subpages = await readFilesMetadata(page);
sitemap.pages[page].pages = await readFilesMetadata(page);
}
await writeFilesMetadata(jsonFilePath('sitemap'), sitemap);

5
shims.d.ts vendored
View File

@ -1,8 +1,3 @@
declare module '*.yaml' {
const record: Record<string, any>;
export default record;
}
declare module '*.md' {
const rawmd: string;
export default rawmd;

14
styles/global.css
View File

@ -235,9 +235,8 @@ code {
}
table {
display: flex;
flex-direction: column;
margin: 1rem 0;
margin: 1rem auto;
width:100%;
overflow: hidden;
border-radius: 0.5rem;
}
@ -258,11 +257,6 @@ table tr:last-of-type
border-bottom-right-radius: 0.5rem;
}
table thead tr,
table tbody tr {
display: flex;
}
table tbody tr:nth-of-type(2n) {
background-color: var(--table-even-color);
}
@ -273,12 +267,10 @@ table tbody tr:nth-of-type(2n+1) {
table thead tr th,
table tbody tr td {
display: flex;
flex: 1;
padding: .25rem 0.75rem;
}
li {
ul li {
list-style-type: square;
}

8
styles/post.module.css
View File

@ -31,3 +31,11 @@
.background.spacer {
height: 25rem;
}
.time {
text-align: center;
display: block;
font-style: italic;
font-size: 1rem;
margin: 0.5rem 0.75rem;
}

4
tsconfig.json
View File

@ -1,6 +1,6 @@
{
"compilerOptions": {
"target": "es2017",
"target": "es2023",
"lib": [
"dom",
"dom.iterable",
@ -13,7 +13,7 @@
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",