How ckda5699/motionid-team_21joints works
Bundesliga Motion ID is a mobile-first player-identification quiz, with supporting Bundesliga news, match, statistics, and leaderboard views. The main path is a fan entering a challenge, watching staged motion playback, locking a player guess, and seeing a scored reveal and results; local progress is persisted by the app. The README describes five progressive reveal stages and additional training modes. Source excerpts show the app’s screen orchestration, scoring, and local data wiring; unsampled views and integrations are represented only where documented or directly referenced.
Main entry points: Screens.jsx App Screens · App.jsx App Orchestrator · appData.js Challenge Data · scoring.js Scoring Rules
Components 21
Challenge Flow
- App Orchestrator
app/src/App.jsx - Progress Store
app/src/lib/progressStore.js
Quiz Mechanics
- Answer Input
app/src/components/AnswerBar.jsx - Replay Viewport
app/src/components/ReplayViewport.jsx - Stage Timeline
app/src/components/StageTimeline.jsx - Scoring Rules
app/src/lib/scoring.js - Challenge Data
app/src/data/appData.js
Bundesliga Content
- Manifest Client
app/src/services/contentClient.js - Runtime URLs
app/src/config/runtime.js - News And Goals
app/src/data/newsGoalsData.js - League Statistics
app/src/data/tableStatsData.js - Local Media
app/public/media - Fixture Data
app/src/data/bundesligaFixtures.generated.js
App Presentation
- App Screens
app/src/components/Screens.jsx - Phone Frame
app/src/components/PhoneFrame.jsx - League Top Bar
app/src/components/BundesligaTopBar.jsx - Bottom Navigation
app/src/components/BottomNav.jsx - Motion ID Logo
app/src/components/MotionIdLogo.jsx - Icon Set
app/src/components/Icon.jsx - Dev Overlay
app/src/components/AgentationDevTool.jsx
Other components
- Fan
Connections 25
- Fan → App Orchestrator: plays
README.md - App Orchestrator → App Screens: routes screens
app/src/App.jsx - App Orchestrator → Challenge Data: selects challenges
app/src/App.jsx - App Orchestrator → Progress Store: saves progress
app/src/App.jsx - App Orchestrator → Phone Frame: renders in
app/src/App.jsx - App Orchestrator → Dev Overlay: renders
app/src/App.jsx - Phone Frame → League Top Bar: renders
app/src/components/PhoneFrame.jsx - Phone Frame → Bottom Navigation: renders
app/src/components/PhoneFrame.jsx - App Screens → Challenge Data: reads challenge data
app/src/components/Screens.jsx - App Screens → News And Goals: reads news and goals
app/src/components/Screens.jsx - App Screens → League Statistics: reads statistics
app/src/components/Screens.jsx - App Screens → Scoring Rules: uses scoring
app/src/components/Screens.jsx - App Screens → Answer Input: renders answer input
app/src/components/Screens.jsx - App Screens → Replay Viewport: renders replay
app/src/components/Screens.jsx - App Screens → Stage Timeline: renders stages
app/src/components/Screens.jsx - App Screens → Motion ID Logo: renders
app/src/components/Screens.jsx - App Screens → Icon Set: renders
app/src/components/Screens.jsx - Answer Input → Scoring Rules: normalizes names
app/src/components/AnswerBar.jsx - Scoring Rules → Challenge Data: reads quiz players
app/src/lib/scoring.js - Scoring Rules → League Statistics: searches player data
app/src/lib/scoring.js - Challenge Data → Runtime URLs: resolves media URLs
app/src/data/appData.js - Challenge Data → Fixture Data: imports fixtures
app/src/data/appData.js - Manifest Client → Runtime URLs: resolves data URL
app/src/services/contentClient.js - Manifest Client → Challenge Data: uses fallback data
app/src/services/contentClient.js - App Orchestrator → Challenge Data: builds session queue
app/src/App.jsx