Tootaio/dinner.tootaio.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(presentation): add multi-page event presentation with navigation

Browse Source 
This commit introduces a complete multi-page presentation system for the 20251012 event.

Key features include:
- **Page Structure:** Establishes the page flow with an entry point, a main cover scene, a committee list, and
individual speech video pages.
- **Real-time Chroma Key:** Implements a canvas-based green screen effect to composite a video onto a background image.
A control panel allows for real-time adjustment of keying parameters, position, and scale.
- **Unified Navigation:** A new `nav.js` script enables seamless navigation between pages using keyboard (arrow keys,
Enter), touch swipes, and on-screen buttons. The navigation logic follows a predefined sequence (entry -> main ->
committee -> speeches).
- **Dynamic Content:** The committee list page dynamically generates its content from a JavaScript data source.
This commit is contained in:
xiaomai
2025-10-13 08:00:15 +08:00
parent ea4ccec42d
commit eb4ca98763
12 changed files with 1166 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
20251012/speech/1.html Normal file
View File

@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>筹委会主席</title>
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<script src="../scripts/nav.js"></script>
</head>
<body>
<video src="../assets/筹委会主席.mp4" class="w-full" autoplay loop muted></video>
</body>
</html>