- 🆕 Introduce `selectedCategory` state with URL binding for category filtering
- 🪄 Add computed `filteredNews` property to handle filtered results efficiently
- 🎛️ Implement category toggle buttons and "Clear Filter" functionality in UI
- 🌟 Improve category display with badges and contextual feedback for empty states
- 🔄 Refactor repeated news loading into a single `loadNews` method
- ✅ Introduce `getSignedMediaUrl` in models for temporary signed URLs
- 🗂️ Migrate media collections to private disk for added security
- 🔧 Add `media:move-to-private` command to streamline migration
- ⚙️ Update views and components to use signed media URLs
- ✏️ Adjust route `media.signed` for signed file access handling
- 🕰️ Increase PortalOutroScene duration to 30 seconds for cinematic effect
- ✏️ Add LogoMatrix3DMobile component for a dynamic 3D logo display
- 🔄 Adjust animations, glow, and opacity for smoother transitions
- 🎵 Replace outdated audio timings, add precise frame-based sync for "logo-whoosh" and "final-chime"
- 💡 Update text and subtitle styles: larger fonts and adjusted colors for better readability
- 🔧 Update tests and configs for new scene duration and animations
- Update DashboardOverviewScene to use einundzwanzig-square-inverted.svg
instead of non-existent einundzwanzig-logo.png
- Fix MeetupShowcaseScene logo extensions: EinundzwanzigKempten.jpg and
EinundzwanzigMemmingen.jpg (were incorrectly .png)
- Fix TopMeetupsScene logo extensions: EinundzwanzigKempten.jpg and
EinundzwanzigTrier.jpg (were incorrectly .png)
- Update corresponding mobile scenes with same fixes
- Update test file expectations to match corrected extensions
These fixes enable successful full render of both PortalPresentation
(1920x1080) and PortalPresentationMobile (1080x1920) compositions.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Replace placeholder with actual CountryStatsScene (Scene 5) in
PortalPresentation, remove unused PlaceholderScene component,
add missing mock for CountryStatsScene in tests, and fix
PortalPresentationMobile tests to mock correct mobile scene
components.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive audio synchronization configuration and testing:
- Create AudioSyncConfig types for audio events, background music,
and scene audio configurations
- Define audio timing for all 9 scenes with frame-accurate sync points
- Add utilities for absolute frame calculation, volume interpolation,
and sync verification with tolerance support
- Include 94 tests covering timing calculations, overlap detection,
volume consistency, and frame-accurate sync point verification
The new audioSync.ts provides a centralized source of truth for all
audio-visual synchronization, enabling automated verification of
audio timing accuracy across the Portal Presentation composition.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for RemotionRoot component to verify:
- PortalPresentationMobile is registered in Portal folder
- Mobile composition has correct dimensions (1080x1920)
- All compositions have correct fps and duration settings
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create PortalPresentationMobile.tsx for portrait mobile resolution
- Register PortalPresentationMobile composition in Root.tsx
- Add comprehensive tests for the mobile composition
- Reuse existing portal scenes which adapt via useVideoConfig()
- Mobile version has same scene structure and timing as desktop
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add test suite for PortalPresentation main composition
- Verify PortalAudioManager renders with background music
- Test all 9 scene sequences are rendered in correct order
- Verify scene timing totals 90 seconds (2700 frames at 30fps)
- Test audio integration including loop and volume settings
- Confirm premountFor is set correctly for all scenes
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add PortalAudioManager.tsx with background music fade in/out
- 1 second fade-in at the beginning
- 3 second fade-out at the end
- Base volume at 0.25 (25%)
- Integrate PortalAudioManager into PortalPresentation
- Add PortalOutroScene to PortalPresentation (was using placeholder)
- Add comprehensive tests for PortalAudioManager (13 tests)
- Tests for volume at various frames
- Tests for fade-in/fade-out behavior
- Integration tests
Scene-specific SFX remain in individual scene components for
better timing accuracy and maintainability.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Implement 12-second outro scene with wallpaper background
- Add horizontal EINUNDZWANZIG logo with glow pulse effect
- Include BitcoinEffect particles throughout the scene
- Add "EINUNDZWANZIG" title and subtitle animations
- Include final-chime audio effect at logo appearance
- Add final 2-second fade out for smooth ending
- Include comprehensive test suite with 21 tests
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements Scene 8 of the Portal Presentation video:
- Dashboard blur and zoom out animation
- Glassmorphism overlay with spring entrance
- "Werde Teil der Community" title with bounce animation
- URL typing animation: portal.einundzwanzig.space
- Orange pulsing glow effect on URL after typing completes
- EINUNDZWANZIG logo with animated glow
- Audio: success-fanfare, typing, url-emphasis, logo-reveal
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements the Activity Feed scene for the Einundzwanzig Portal
presentation video. Features include:
- 3D perspective entrance animation with smooth transitions
- "Aktivitäten" header with pulsing LIVE indicator
- 4 activity items with staggered slide-in animations:
- EINUNDZWANZIG Kempten (vor 13 Stunden)
- EINUNDZWANZIG Darmstadt (vor 21 Stunden)
- EINUNDZWANZIG Vulkaneifel (vor 2 Tagen)
- BitcoinWalk Würzburg (vor 2 Tagen)
- "Neuer Termin" badge with bounce animation
- Audio: button-click.mp3 per item, slide-in.mp3 for entrance
- Uses existing ActivityItem component for consistent styling
- Comprehensive test suite with 24 tests
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements Scene 6 of the Portal presentation video, showcasing the top 5
most active Einundzwanzig meetups with animated rankings, sparkline charts,
and progress bars. Features 3D perspective entrance, staggered item animations,
and audio cues.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements the Country Statistics scene which visualizes the geographic
reach of the Bitcoin community across German-speaking countries with
animated country bars, sparkline charts, and user counts.
Features:
- 3D perspective entrance animation for smooth scene transition
- Sequential country reveals with staggered timing (12 frame delay)
- CountryBar components with animated progress bars and user counts
- SparklineChart components showing growth trends for each country
- Total users badge with globe icon
- Audio: success-chime per country, slide-in for section entrance
- Countries displayed: Germany, Austria, Switzerland, Luxembourg,
Bulgaria, and Spain
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements the meetup showcase scene with:
- Featured meetup card with 3D perspective and shadow effects
- Date/time display with calendar and clock icons
- Upcoming meetups list (Memmingen, Friedrichshafen)
- Action buttons for calendar integration
- Staggered animations with spring physics
- Audio cues for slide-in and badge appearances
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements the 12-second Dashboard Overview scene featuring:
- 3D perspective entrance animation (rotateX 30° → 0°, scale 0.85 → 1.0)
- DashboardSidebar with staggered navigation items
- Three StatsCounter cards (Meetups: 204, Users: 1247, Events: 89)
- SparklineCharts showing trend data for each metric
- Activity feed section with recent meetup activities
- Quick stats section with country and user metrics
- Audio: card-slide.mp3 and ui-appear.mp3 sound effects
- Vignette overlay and dark theme styling
Includes 23 comprehensive tests covering all components and animations.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implements the Title Card scene with:
- Typing animation for "EINUNDZWANZIG PORTAL" title
- Blinking cursor during typing effect
- Subtitle fade-in animation after title completes
- Audio integration with typing and ui-appear sounds
- Background glow and vignette effects
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implement the first scene of the Portal presentation video (6 seconds):
- AnimatedLogo scales from 0 to 100% with spring animation
- Wallpaper background with zoom effect (1.2 → 1.0 scale)
- Bitcoin particle effects in the background
- Pulsing glow effect around the logo
- Audio integration: logo-whoosh at start, logo-reveal when logo appears
- Title "EINUNDZWANZIG" and subtitle "Das Portal" with staggered entrance
- Vignette overlay for cinematic depth
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Adds a fully animated sidebar component for the portal dashboard with:
- Slide-in animation from left with spring physics
- Animated logo section with scale entrance
- Navigation items with staggered reveal animations
- Badge counters with bounce animation and glow effects
- Support for section headers and nested items with indentation
- Active state highlighting with accent color border
- SVG icons for all navigation types (dashboard, nostr, meetups, etc.)
- Customizable dimensions, accent color, and animation timing
Includes comprehensive test suite with 28 tests covering:
- Rendering and layout
- Navigation item display
- Badge count display
- Section headers and nested items
- Custom styling and accent colors
- Icon rendering for all icon types
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Implements animated activity item with slide-in from right animation
- Badge with bounce effect ("Neuer Termin" default)
- Event name with fade/slide animation
- Timestamp with clock icon and monospace font
- Configurable props: eventName, timestamp, badgeText, showBadge, delay, width, accentColor
- Follows established component patterns with spring animations and glow effects
- Includes comprehensive test suite with 21 tests
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add a new CountryBar component that displays:
- Country flag emoji with scale animation
- Country name with slide-in animation
- Animated user count with tabular numbers
- Progress bar that fills based on user count ratio
The component follows existing patterns from StatsCounter and
MeetupCard, using Remotion's spring animations and interpolation
for smooth entrance effects and a subtle glow pulse.
Includes comprehensive test suite with 30 tests covering:
- Basic rendering and props
- Custom styling and colors
- Bar rendering and animation
- Real-world country data scenarios
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Animated card component with logo, name, and location for showcasing
Bitcoin meetups. Features spring-based entrance animations, location
pin icon, and customizable styling with Bitcoin orange accent color.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implement SparklineChart for visualizing data trends with animated line
drawing using stroke-dasharray/dashoffset technique. Features include
configurable dimensions, spring animations, optional fill gradient,
glow effects, and support for delay/duration parameters.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Implement reusable animated statistics counter component for Remotion videos
that smoothly animates from 0 to a target number (default: 204).
Features:
- Spring-based or linear animation modes
- Configurable delay, duration, and decimal places
- Support for prefix/suffix (e.g., "$", "%", "+")
- Customizable colors and font sizes
- Glow effect that pulses with counting progress
- Optional label display below the number
Includes comprehensive test suite with 12 passing tests.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Set up testing infrastructure using Vitest and React Testing Library.
Add test verifying empty MyComposition renders without errors.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
♻️ Update authentication buttons: replace `flux:navbar.item` and `flux:sidebar.item` with `flux:button` for improved UX and consistency.
🗑️ Update `.gitignore`: include additional configuration files (`.opencode`, `.switch-omo-config*`).