Martin Dvorak
3ea2cea100
Next.js 15 app that turns photos, PDFs, DOCX/PPTX and text into a swipeable feed of AI-generated activities (flashcards, multiple choice, true/false, fill-in-the-blank, matching, ordering, short answer) using the user's own Ollama models. Highlights: - All AI calls run in server route handlers; the browser never talks to Ollama. - Bring-your-own-key mode (default): the key lives only in the browser and is sent per-request; server, local-daemon and shared-key modes also supported. - Client-side document extraction (pdf.js, mammoth, jszip) with scanned-PDF page rendering for the vision model; notes stay in their original language. - ChatGPT-style shell: collapsible sidebar / mobile drawer, neutral token-based light + dark themes, folder organisation, PWA (manifest, SW, offline page). - Strict JSON validation with zod + auto-repair, rate limiting, and request guards (cross-origin, body-size, API-key sanitising). - setup.sh bootstraps deps, .env.local and a production build. Gitignore excludes .env*, the generated pdf.js worker and local scratch files.
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
/** Confetti helper that respects prefers-reduced-motion. */
|
|
|
|
export function prefersReducedMotion(): boolean {
|
|
if (typeof window === "undefined" || !window.matchMedia) return false;
|
|
return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
}
|
|
|
|
export async function celebrate(intensity: "normal" | "big" = "normal"): Promise<void> {
|
|
if (prefersReducedMotion()) return;
|
|
try {
|
|
const confetti = (await import("canvas-confetti")).default;
|
|
// Muted, low-saturation palette to match the calmer design.
|
|
const colors = ["#aac6da", "#7ea6c2", "#5c88a8", "#e4e9f0", "#ffffff", "#cfd8e3"];
|
|
const count = intensity === "big" ? 130 : 60;
|
|
|
|
confetti({
|
|
particleCount: count,
|
|
spread: intensity === "big" ? 110 : 75,
|
|
startVelocity: intensity === "big" ? 48 : 38,
|
|
origin: { y: 0.65 },
|
|
colors,
|
|
scalar: 0.95,
|
|
disableForReducedMotion: true,
|
|
});
|
|
|
|
if (intensity === "big") {
|
|
setTimeout(() => {
|
|
confetti({ particleCount: 45, angle: 60, spread: 55, origin: { x: 0, y: 0.75 }, colors });
|
|
confetti({ particleCount: 45, angle: 120, spread: 55, origin: { x: 1, y: 0.75 }, colors });
|
|
}, 180);
|
|
}
|
|
} catch {
|
|
/* confetti is a nice-to-have */
|
|
}
|
|
}
|
|
|
|
export function burstAt(x: number, y: number): void {
|
|
if (prefersReducedMotion()) return;
|
|
void (async () => {
|
|
try {
|
|
const confetti = (await import("canvas-confetti")).default;
|
|
confetti({
|
|
particleCount: 40,
|
|
spread: 55,
|
|
startVelocity: 26,
|
|
origin: { x: x / window.innerWidth, y: y / window.innerHeight },
|
|
colors: ["#7ea6c2", "#aac6da", "#cfd8e3", "#ffffff"],
|
|
disableForReducedMotion: true,
|
|
});
|
|
} catch {
|
|
/* ignore */
|
|
}
|
|
})();
|
|
}
|