diff --git a/README.md b/README.md index 5318f06..260d796 100644 --- a/README.md +++ b/README.md @@ -9,6 +9,8 @@ and every call is a door. ![Inside main(): the call room, with the if/else lanes ahead behind their tinted door frames](docs/media/hero.jpg) +![Walking a codebase: the world map of this repository, then into main(), its if fork and a call door](docs/media/walkthrough.webp) + Paste the URL of any public JavaScript or TypeScript repository on GitHub, or walk a local folder. The code is parsed in your browser tab, and a folder is never uploaded. Once a repository is open, the address bar is its share link, diff --git a/apps/web/src/hud.test.tsx b/apps/web/src/hud.test.tsx index 13257d6..4c9cb46 100644 --- a/apps/web/src/hud.test.tsx +++ b/apps/web/src/hud.test.tsx @@ -39,4 +39,10 @@ describe("Hud", () => { expect(render(false)).toContain('href="/"'); expect(render(true)).not.toContain('href="/"'); }); + + it("links the GitHub repository only while the pointer is free", () => { + const github = 'href="https://github.com/valuecodes/code-backrooms"'; + expect(render(false)).toContain(github); + expect(render(true)).not.toContain(github); + }); }); diff --git a/apps/web/src/hud.tsx b/apps/web/src/hud.tsx index b6e02f5..f47fe75 100644 --- a/apps/web/src/hud.tsx +++ b/apps/web/src/hud.tsx @@ -1,5 +1,6 @@ import type { Quality } from "@repo/renderer/effects"; +import { SourceLink } from "~/source-link"; import type { ZoneProgress } from "~/use-area-world"; type HudProps = { @@ -179,6 +180,7 @@ const Hud = ({ ))} + ); }; diff --git a/apps/web/src/landing.test.tsx b/apps/web/src/landing.test.tsx index ffc8bc4..6658a11 100644 --- a/apps/web/src/landing.test.tsx +++ b/apps/web/src/landing.test.tsx @@ -45,6 +45,15 @@ describe("LandingView", () => { const GITHUB = { url: "", valid: false, ready: false }; + it("links this project's GitHub repository in a new tab", () => { + // Still a live link while a read runs: it leaves the app. + const html = render({ reading: "reading…" }); + expect(html).toContain( + 'href="https://github.com/valuecodes/code-backrooms" target="_blank" rel="noreferrer"' + ); + expect(html).toContain('aria-label="Code Backrooms on GitHub"'); + }); + it("offers no zip picker, and one folder picker either way", () => { for (const html of [render(), render({ github: GITHUB })]) { expect(html).not.toContain(".zip"); @@ -68,7 +77,7 @@ describe("LandingView", () => { const html = render({ reading: "reading my-repo…" }); expect(html).toContain("reading my-repo…"); expect(html.match(/]*disabled=""/g)).toHaveLength(1); - expect(html).not.toContain("href="); + expect(html).not.toContain('href="?'); }); it("darkens the backdrop while reading instead of dropping it", () => { @@ -80,7 +89,7 @@ describe("LandingView", () => { }); it("draws a backdrop behind the page, hidden from screen readers", () => { - expect(render()).not.toContain("aria-hidden"); + expect(render()).not.toContain("-z-10"); const html = render({ backdrop: }); expect(html).toMatch( /

{HINTS}

+ ); }; diff --git a/apps/web/src/source-link.tsx b/apps/web/src/source-link.tsx new file mode 100644 index 0000000..5d2b5f5 --- /dev/null +++ b/apps/web/src/source-link.tsx @@ -0,0 +1,28 @@ +import type { MouseEvent } from "react"; + +const SOURCE_URL = "https://github.com/valuecodes/code-backrooms"; + +// PointerLockControls locks the pointer on any click that reaches the +// document: opening the repository must not also start walking. +const keepClick = (event: MouseEvent) => { + event.stopPropagation(); +}; + +/** This project on GitHub, as a button under a page's key list. */ +const SourceLink = () => ( + + + + + GitHub + +); + +export { SourceLink }; diff --git a/docs/media/walkthrough.webp b/docs/media/walkthrough.webp new file mode 100644 index 0000000..410508e Binary files /dev/null and b/docs/media/walkthrough.webp differ