feat: initial commit
This commit is contained in:
gosangam
@@ -0,0 +1,207 @@
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import Link from "next/link";
|
||||
import { notFound } from "next/navigation";
|
||||
import { VerseIndex } from "./verse-index";
|
||||
|
||||
type Synonym = {
|
||||
word: string;
|
||||
meanings: string[];
|
||||
};
|
||||
|
||||
type Verse = {
|
||||
book_title: string;
|
||||
canto: number;
|
||||
chapter: number;
|
||||
verse: number;
|
||||
verse_end?: number | null;
|
||||
reference: string;
|
||||
devanagari: string;
|
||||
transliteration: string;
|
||||
synonyms: Synonym[];
|
||||
translation: string;
|
||||
purport: string[];
|
||||
};
|
||||
|
||||
type ChapterInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalVerses: number;
|
||||
};
|
||||
|
||||
type CantoInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalChapters: number;
|
||||
chapters: ChapterInfo[];
|
||||
};
|
||||
|
||||
type Intro = {
|
||||
book: string;
|
||||
title: string;
|
||||
author: string;
|
||||
totalCantos: number;
|
||||
cantos: CantoInfo[];
|
||||
};
|
||||
|
||||
function getChapterVerses(canto: string, chapter: string): Verse[] {
|
||||
const dir = path.join(
|
||||
process.cwd(),
|
||||
"app/lib/books/sb/cantos",
|
||||
canto.padStart(2, "0"),
|
||||
"chapters",
|
||||
chapter.padStart(2, "0"),
|
||||
"verses",
|
||||
);
|
||||
if (!fs.existsSync(dir)) return [];
|
||||
|
||||
return fs
|
||||
.readdirSync(dir)
|
||||
.filter((f) => f.endsWith(".json"))
|
||||
.sort((a, b) => {
|
||||
const na = parseInt(a);
|
||||
const nb = parseInt(b);
|
||||
return na - nb;
|
||||
})
|
||||
.map((f) => JSON.parse(fs.readFileSync(path.join(dir, f), "utf-8")));
|
||||
}
|
||||
|
||||
function getCantoAndChapterInfo(
|
||||
canto: string,
|
||||
chapter: string,
|
||||
): { cantoInfo: CantoInfo; chapterInfo: ChapterInfo } | null {
|
||||
const introPath = path.join(process.cwd(), "app/lib/books/sb/intro.json");
|
||||
const intro: Intro = JSON.parse(fs.readFileSync(introPath, "utf-8"));
|
||||
const cantoInfo = intro.cantos.find(
|
||||
(c) => c.number === parseInt(canto),
|
||||
);
|
||||
if (!cantoInfo) return null;
|
||||
const chapterInfo = cantoInfo.chapters.find(
|
||||
(ch) => ch.number === parseInt(chapter),
|
||||
);
|
||||
if (!chapterInfo) return null;
|
||||
return { cantoInfo, chapterInfo };
|
||||
}
|
||||
|
||||
export default async function SbChapterPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ canto: string; chapter: string }>;
|
||||
}) {
|
||||
const { canto, chapter } = await params;
|
||||
const info = getCantoAndChapterInfo(canto, chapter);
|
||||
if (!info) notFound();
|
||||
|
||||
const { cantoInfo, chapterInfo } = info;
|
||||
|
||||
const verses = getChapterVerses(canto, chapter);
|
||||
if (verses.length === 0) notFound();
|
||||
|
||||
const verseList = verses.map((v) => ({
|
||||
verse: v.verse,
|
||||
verse_end: v.verse_end ?? undefined,
|
||||
reference: v.reference,
|
||||
}));
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-amber-50 dark:bg-zinc-950">
|
||||
<header className="border-b border-amber-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 px-6 py-6 sticky top-0 z-20">
|
||||
<div className="max-w-5xl mx-auto">
|
||||
<Link
|
||||
href={`/books/sb/${canto}`}
|
||||
className="text-sm text-amber-600 hover:text-amber-800 dark:text-zinc-400 dark:hover:text-zinc-100"
|
||||
>
|
||||
← Canto {cantoInfo.number}: {cantoInfo.title}
|
||||
</Link>
|
||||
<h1 className="mt-2 text-2xl font-bold text-zinc-900 dark:text-zinc-100">
|
||||
Chapter {chapter}: {chapterInfo.title}
|
||||
</h1>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div className="w-full md:max-w-5xl mx-auto flex">
|
||||
{/* Left sidebar — verse index */}
|
||||
<VerseIndex verses={verseList} chapter={chapter} />
|
||||
|
||||
{/* Main content */}
|
||||
<main className="flex-1 min-w-0 px-6 py-8 space-y-12">
|
||||
{verses.map((verse) => (
|
||||
<article
|
||||
key={verse.reference}
|
||||
id={`verse-${verse.verse}`}
|
||||
className="bg-white dark:bg-zinc-900 rounded-lg border border-amber-200 dark:border-zinc-800 overflow-hidden scroll-mt-24"
|
||||
>
|
||||
{/* Header */}
|
||||
<div className="px-6 py-3 bg-amber-100 dark:bg-zinc-800 border-b border-amber-200 dark:border-zinc-700">
|
||||
<span className="text-sm font-semibold text-amber-700 dark:text-amber-400">
|
||||
{verse.reference}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="px-6 py-5 space-y-5">
|
||||
{/* Devanagari */}
|
||||
<div className="text-center">
|
||||
<p className="text-xl leading-relaxed text-red-800 dark:text-red-400 whitespace-pre-line font-serif">
|
||||
{verse.devanagari}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Transliteration */}
|
||||
<div className="text-center">
|
||||
<p className="text-base italic text-zinc-700 dark:text-zinc-300 whitespace-pre-line">
|
||||
{verse.transliteration}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Synonyms */}
|
||||
{verse.synonyms.length > 0 && (
|
||||
<div>
|
||||
<h3 className="text-xs font-bold uppercase tracking-wider text-amber-600 dark:text-amber-500 mb-2">
|
||||
Synonyms
|
||||
</h3>
|
||||
<p className="text-sm text-zinc-600 dark:text-zinc-400 leading-relaxed">
|
||||
{verse.synonyms.map((s, i) => (
|
||||
<span key={i}>
|
||||
<span className="italic text-zinc-800 dark:text-zinc-200">
|
||||
{s.word}
|
||||
</span>
|
||||
—{s.meanings.join(", ")}
|
||||
{i < verse.synonyms.length - 1 ? "; " : "."}
|
||||
</span>
|
||||
))}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Translation */}
|
||||
<div>
|
||||
<h3 className="text-xs font-bold uppercase tracking-wider text-amber-600 dark:text-amber-500 mb-2">
|
||||
Translation
|
||||
</h3>
|
||||
<p
|
||||
className="text-base text-zinc-900 dark:text-zinc-100 leading-relaxed font-medium"
|
||||
dangerouslySetInnerHTML={{ __html: verse.translation }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Purport */}
|
||||
{verse.purport.length > 0 && (
|
||||
<div>
|
||||
<h3 className="text-xs font-bold uppercase tracking-wider text-amber-600 dark:text-amber-500 mb-2">
|
||||
Purport
|
||||
</h3>
|
||||
<div className="text-sm text-zinc-700 dark:text-zinc-300 leading-relaxed space-y-3">
|
||||
{verse.purport.map((p, i) => (
|
||||
<p key={i} dangerouslySetInnerHTML={{ __html: p }} />
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,62 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
type VerseEntry = {
|
||||
verse: number;
|
||||
verse_end?: number;
|
||||
reference: string;
|
||||
};
|
||||
|
||||
export function VerseIndex({
|
||||
verses,
|
||||
chapter,
|
||||
}: {
|
||||
verses: VerseEntry[];
|
||||
chapter: string;
|
||||
}) {
|
||||
const [activeVerse, setActiveVerse] = useState<number | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
for (const entry of entries) {
|
||||
if (entry.isIntersecting) {
|
||||
const id = entry.target.id;
|
||||
const num = parseInt(id.replace("verse-", ""));
|
||||
if (!isNaN(num)) setActiveVerse(num);
|
||||
}
|
||||
}
|
||||
},
|
||||
{ rootMargin: "-20% 0px -60% 0px" },
|
||||
);
|
||||
|
||||
const articles = document.querySelectorAll("article[id^='verse-']");
|
||||
articles.forEach((el) => observer.observe(el));
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<aside className="hidden lg:block w-48 shrink-0 sticky top-[89px] self-start max-h-[calc(100vh-89px)] overflow-y-auto py-8 pr-4">
|
||||
<h2 className="text-xs font-bold uppercase tracking-wider text-amber-600 dark:text-amber-500 mb-3 px-2">
|
||||
Verses
|
||||
</h2>
|
||||
<nav className="grid grid-cols-3 gap-0.5">
|
||||
{verses.map((v) => (
|
||||
<a
|
||||
key={v.verse}
|
||||
href={`#verse-${v.verse}`}
|
||||
className={`px-2 py-1 rounded text-sm text-center transition-colors ${
|
||||
activeVerse === v.verse
|
||||
? "bg-amber-200 dark:bg-amber-900/40 text-amber-900 dark:text-amber-300 font-medium"
|
||||
: "text-zinc-600 dark:text-zinc-400 hover:bg-amber-100 dark:hover:bg-zinc-800 hover:text-zinc-900 dark:hover:text-zinc-200"
|
||||
}`}
|
||||
>
|
||||
{v.verse_end ? `${v.verse}–${v.verse_end}` : v.verse}
|
||||
</a>
|
||||
))}
|
||||
</nav>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,95 @@
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import Link from "next/link";
|
||||
import { notFound } from "next/navigation";
|
||||
import { ExtractedVerseCount } from "../../extracted-verse-count";
|
||||
|
||||
type ChapterInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalVerses: number;
|
||||
};
|
||||
|
||||
type CantoInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalChapters: number;
|
||||
chapters: ChapterInfo[];
|
||||
};
|
||||
|
||||
type Intro = {
|
||||
book: string;
|
||||
title: string;
|
||||
author: string;
|
||||
totalCantos: number;
|
||||
cantos: CantoInfo[];
|
||||
};
|
||||
|
||||
function getIntro(): Intro {
|
||||
const introPath = path.join(process.cwd(), "app/lib/books/sb/intro.json");
|
||||
return JSON.parse(fs.readFileSync(introPath, "utf-8"));
|
||||
}
|
||||
|
||||
export default async function CantoPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ canto: string }>;
|
||||
}) {
|
||||
const { canto } = await params;
|
||||
const cantoNum = parseInt(canto);
|
||||
const intro = getIntro();
|
||||
|
||||
const cantoInfo = intro.cantos.find((c) => c.number === cantoNum);
|
||||
if (!cantoInfo) notFound();
|
||||
|
||||
const totalVerses = cantoInfo.chapters.reduce(
|
||||
(sum, ch) => sum + ch.totalVerses,
|
||||
0,
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-amber-50 dark:bg-zinc-950">
|
||||
<header className="border-b border-amber-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 px-6 py-8">
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<Link
|
||||
href="/books/sb"
|
||||
className="text-sm text-amber-600 hover:text-amber-800 dark:text-zinc-400 dark:hover:text-zinc-100"
|
||||
>
|
||||
← Śrīmad-Bhāgavatam
|
||||
</Link>
|
||||
<h1 className="mt-3 text-3xl font-bold text-zinc-900 dark:text-zinc-100">
|
||||
Canto {cantoInfo.number}: {cantoInfo.title}
|
||||
</h1>
|
||||
<p className="mt-1 text-zinc-500 dark:text-zinc-400">
|
||||
{cantoInfo.totalChapters} chapters ·{" "}
|
||||
<ExtractedVerseCount count={totalVerses} label="extracted verses" />
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
<main className="max-w-3xl mx-auto px-6 py-8">
|
||||
<ul className="divide-y divide-amber-200 dark:divide-zinc-800 bg-white dark:bg-zinc-900 rounded-lg border border-amber-200 dark:border-zinc-800 overflow-hidden">
|
||||
{cantoInfo.chapters.map((ch) => (
|
||||
<li key={ch.number}>
|
||||
<Link
|
||||
href={`/books/sb/${cantoNum}/${ch.number}`}
|
||||
className="flex items-center justify-between px-5 py-4 hover:bg-amber-50 dark:hover:bg-zinc-800 transition-colors"
|
||||
>
|
||||
<div>
|
||||
<span className="text-sm text-amber-600 dark:text-amber-500 font-medium">
|
||||
Chapter {ch.number}
|
||||
</span>
|
||||
<p className="font-medium text-zinc-900 dark:text-zinc-100">
|
||||
{ch.title}
|
||||
</p>
|
||||
</div>
|
||||
<span className="text-sm text-zinc-400 shrink-0 ml-4">
|
||||
<ExtractedVerseCount count={ch.totalVerses} />
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,85 @@
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import Link from "next/link";
|
||||
import { ExtractedVerseCount } from "../extracted-verse-count";
|
||||
|
||||
type ChapterInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalVerses: number;
|
||||
};
|
||||
|
||||
type CantoInfo = {
|
||||
number: number;
|
||||
title: string;
|
||||
totalChapters: number;
|
||||
chapters: ChapterInfo[];
|
||||
};
|
||||
|
||||
type Intro = {
|
||||
book: string;
|
||||
title: string;
|
||||
author: string;
|
||||
totalCantos: number;
|
||||
cantos: CantoInfo[];
|
||||
};
|
||||
|
||||
export default function SbPage() {
|
||||
const introPath = path.join(process.cwd(), "app/lib/books/sb/intro.json");
|
||||
const intro: Intro = JSON.parse(fs.readFileSync(introPath, "utf-8"));
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-amber-50 dark:bg-zinc-950">
|
||||
<header className="border-b border-amber-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 px-6 py-8">
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<Link
|
||||
href="/books"
|
||||
className="text-sm text-amber-600 hover:text-amber-800 dark:text-zinc-400 dark:hover:text-zinc-100"
|
||||
>
|
||||
← Books
|
||||
</Link>
|
||||
<h1 className="mt-3 text-3xl font-bold text-zinc-900 dark:text-zinc-100">
|
||||
{intro.title}
|
||||
</h1>
|
||||
<p className="mt-1 text-zinc-500 dark:text-zinc-400">
|
||||
{intro.author}
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
<main className="max-w-3xl mx-auto px-6 py-8">
|
||||
<ul className="divide-y divide-amber-200 dark:divide-zinc-800 bg-white dark:bg-zinc-900 rounded-lg border border-amber-200 dark:border-zinc-800 overflow-hidden">
|
||||
{intro.cantos.map((canto) => {
|
||||
const totalVerses = canto.chapters.reduce(
|
||||
(sum, ch) => sum + ch.totalVerses,
|
||||
0,
|
||||
);
|
||||
return (
|
||||
<li key={canto.number}>
|
||||
<Link
|
||||
href={`/books/sb/${canto.number}`}
|
||||
className="flex items-center justify-between px-5 py-4 hover:bg-amber-50 dark:hover:bg-zinc-800 transition-colors"
|
||||
>
|
||||
<div>
|
||||
<span className="text-sm text-amber-600 dark:text-amber-500 font-medium">
|
||||
Canto {canto.number}
|
||||
</span>
|
||||
<p className="font-medium text-zinc-900 dark:text-zinc-100">
|
||||
{canto.title}
|
||||
</p>
|
||||
</div>
|
||||
<span className="text-sm text-zinc-400 shrink-0 ml-4">
|
||||
{canto.totalChapters} chapters ·{" "}
|
||||
<ExtractedVerseCount
|
||||
count={totalVerses}
|
||||
label="extracted verses"
|
||||
/>
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user