diff --git a/src/app/page.tsx b/src/app/page.tsx index 286c7e5..24a4558 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,7 +1,7 @@ import { HomeContent } from '@/components/HomeContent'; import { SettingsModal } from '@/components/SettingsModal'; -// Home page redesigned for fullscreen layout: hero + document area. +const isDev = process.env.NEXT_PUBLIC_NODE_ENV !== 'production' || process.env.NODE_ENV == null; export default function Home() { return ( @@ -10,9 +10,9 @@ export default function Home() {

OpenReader WebUI

-

- Bring your own text-to-speech API. - Read & listen to PDF, EPUB & HTML documents with high quality voices. +

+ Open source document reader web app {isDev ? 'self-hosted server' : 'demo'}. + Read & listen to PDF, EPUB, MD, and TXT documents with high quality text to speech voices.

diff --git a/src/components/CodeBlock.tsx b/src/components/CodeBlock.tsx new file mode 100644 index 0000000..a887c96 --- /dev/null +++ b/src/components/CodeBlock.tsx @@ -0,0 +1,32 @@ +'use client'; + +import { useState } from 'react'; +import { CopyIcon, CheckIcon } from '@/components/icons/Icons'; + +export function CodeBlock({ children }: { children: string }) { + const [copied, setCopied] = useState(false); + + const handleCopy = async () => { + await navigator.clipboard.writeText(children); + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }; + + return ( +
+ 
+        {children}
+
+ +
+ ); +} diff --git a/src/components/DocumentSettings.tsx b/src/components/DocumentSettings.tsx index f78d482..515d300 100644 --- a/src/components/DocumentSettings.tsx +++ b/src/components/DocumentSettings.tsx @@ -141,16 +141,18 @@ export function DocumentSettings({ isOpen, setIsOpen, epub, html }: { leaveTo="opacity-0 scale-95" > - {isDev && !html &&
+ {!html &&
} @@ -352,18 +354,18 @@ export function DocumentSettings({ isOpen, setIsOpen, epub, html }: { updateConfigKey('pdfWordHighlightEnabled', e.target.checked) } - className="form-checkbox h-4 w-4 text-accent rounded border-muted disabled:opacity-50" + className="form-checkbox h-4 w-4 text-accent rounded border-muted disabled:opacity-50 disabled:cursor-not-allowed" /> Word-by-word

- Highlight individual words using audio timestamps generated by whisper.cpp + Highlight individual words using audio timestamps generated by whisper.cpp {!isDev && '(requires self-hosted)'}

@@ -389,18 +391,18 @@ export function DocumentSettings({ isOpen, setIsOpen, epub, html }: { updateConfigKey('epubWordHighlightEnabled', e.target.checked) } - className="form-checkbox h-4 w-4 text-accent rounded border-muted disabled:opacity-50" + className="form-checkbox h-4 w-4 text-accent rounded border-muted disabled:opacity-50 disabled:cursor-not-allowed" /> Word-by-word

- Highlight individual words using audio timestamps generated by whisper.cpp + Highlight individual words using audio timestamps generated by whisper.cpp {!isDev && '(requires self-hosted)'}

diff --git a/src/components/EPUBViewer.tsx b/src/components/EPUBViewer.tsx index 7289538..3c38034 100644 --- a/src/components/EPUBViewer.tsx +++ b/src/components/EPUBViewer.tsx @@ -156,18 +156,21 @@ export function EPUBViewer({ className = '' }: EPUBViewerProps) { {isTocOpen && tocRef.current && tocRef.current.length > 0 && (
Skip to chapters
-
+
{tocRef.current.map((item, index) => ( diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index b81abaa..8b0182b 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -1,10 +1,14 @@ import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react' import { GithubIcon } from '@/components/icons/Icons' +import { CodeBlock } from '@/components/CodeBlock' + +const isDev = process.env.NEXT_PUBLIC_NODE_ENV !== 'production' || process.env.NODE_ENV == null; + export function Footer() { return ( -