- Add debug logging to checkActiveScanStatus() for better tracing
- Update status indicator before showing overlay for faster feedback
- Add warning logs when DOM elements are not found
- Ensure idle state is explicitly set when no scan is running
- Add debug logging to AnimeService.get_scan_status()
- Added defensive check for rescan-status element before adding event listener
- Added e.stopPropagation() to prevent click event bubbling issues
- Added console logging for debugging click events
- Call checkActiveScanStatus() directly in init() method, not just on socket connect
This ensures scan status is checked immediately on page load even if WebSocket
connection is delayed
- Show overlay immediately when rescan is clicked (before API response)
- Add click-outside-to-close on overlay background
- Add click on rescan-status indicator to reopen overlay
- Add cursor pointer to rescan-status for clickability feedback
- All 1024 tests passing
- Add is_scanning state tracking in AnimeService
- Add get_scan_status method to AnimeService
- Add /api/anime/scan/status endpoint to check scan state
- Add checkActiveScanStatus in JS to restore overlay on reconnect
- All 1024 tests passing
- Add total_items parameter to broadcast_scan_started and broadcast_scan_progress
- Pass total from SeriesApp to WebSocket broadcasts in AnimeService
- Update JS overlay to show progress bar and current/total count
- Add CSS for progress bar styling
- Add unit tests for new total_items parameter
- All 1024 tests passing
- Add broadcast_scan_started, broadcast_scan_progress, broadcast_scan_completed to WebSocketService
- Inject WebSocketService into AnimeService for real-time scan progress broadcasts
- Add CSS styles for scan progress overlay with spinner, stats, and completion state
- Update app.js to handle scan events and display progress overlay
- Add unit tests for new WebSocket broadcast methods
- All 1022 tests passing
- Fixed room name mismatch: ProgressService was broadcasting to
'download_progress' but JS clients join 'downloads' room
- Added _get_room_for_progress_type() mapping function
- Updated all progress methods to use correct room names
- Added 13 new tests for room name mapping and broadcast verification
- Updated existing tests to expect correct room names
- Fixed JS clients to join valid rooms (downloads, queue, scan)
- Updated app.js to use 'key' as primary series identifier
- selectedSeries Set now uses key instead of folder
- createSerieCard() uses data-key attribute for identification
- toggleSerieSelection() uses key for lookups
- downloadSelected() iterates with key values
- updateSelectionUI() and toggleSelectAll() use key
- Updated WebSocket service tests
- Tests now include key and folder in broadcast data
- Verified both fields are included in messages
- No changes needed for queue.js and other JS files
- They use download item IDs correctly, not series identifiers
- No template changes needed
- Series cards rendered dynamically in app.js
All 996 tests passing
- Split search endpoint into separate GET and POST handlers
- Add SearchAnimeRequest Pydantic model for POST body validation
- Add 'link' field to AnimeSummary model for frontend compatibility
- Update frontend to handle both array and wrapped response formats
- Extract search logic into shared _perform_search() function
Fixes issue where POST requests with JSON body were failing with 422
Unprocessable Content error because the endpoint expected query params
instead of request body.
Also fixes frontend 'undefined' error by handling direct array responses
in addition to legacy wrapped format.
- Load anime_directory and master_password_hash from config.json on startup
- Sync configuration from config.json to settings object in fastapi_app.py
- Update dependencies.py to load config from JSON if not in environment
- Fix app.js to use makeAuthenticatedRequest() for all authenticated API calls
- Fix API endpoint paths from /api/v1/anime to /api/anime
- Update auth_service.py to load master_password_hash from config.json
- Update auth.py setup endpoint to save master_password_hash to config
- Fix rate limiting code to satisfy type checker
- Update config.json with test master password hash
Fixes:
- 401 Unauthorized errors on /api/anime endpoint
- 503 Service Unavailable errors on /api/anime/process/locks
- Configuration not being loaded from config.json file
- Authentication flow now works end-to-end with JWT tokens
- Created 4 new API endpoints in anime.py:
* /api/v1/anime/status - Get library status
* /api/v1/anime/add - Add new series
* /api/v1/anime/download - Download folders
* /api/v1/anime/process/locks - Check process locks
- Updated frontend API calls in app.js to use correct endpoints
- Cleaned up instructions.md by removing completed tasks
- Added comprehensive integration documentation
All tests passing. Core user workflows (list, search, add, download) now fully functional.
Implemented full JWT-based authentication integration between frontend and backend:
Frontend Changes:
- Updated login.html to store JWT tokens in localStorage after successful login
- Updated setup.html to use correct API payload format (master_password)
- Modified app.js and queue.js to include Bearer tokens in all authenticated requests
- Updated makeAuthenticatedRequest() to add Authorization header with JWT token
- Enhanced checkAuthentication() to verify token and redirect on 401 responses
- Updated logout() to clear tokens from localStorage
API Endpoint Updates:
- Mapped queue API endpoints to new backend structure
- /api/queue/clear → /api/queue/completed (DELETE) for clearing completed
- /api/queue/remove → /api/queue/{item_id} (DELETE) for single removal
- /api/queue/retry payload changed to {item_ids: []} array format
- /api/download/pause|resume|cancel → /api/queue/pause|resume|stop
Testing:
- Created test_frontend_integration_smoke.py with JWT token validation tests
- Verified login returns access_token, token_type, and expires_at
- Tested Bearer token authentication on protected endpoints
- Smoke tests passing for authentication flow
Documentation:
- Updated infrastructure.md with JWT authentication implementation details
- Documented token storage, API endpoint changes, and response formats
- Marked Frontend Integration task as completed in instructions.md
- Added frontend integration testing section
WebSocket:
- Verified WebSocket integration with new backend (already functional)
- Dual event handlers support both old and new message types
- Room-based subscriptions working correctly
This completes Task 7: Frontend Integration from the development instructions.
- Created websocket_client.js: Native WebSocket wrapper with Socket.IO-compatible interface
- Automatic reconnection with exponential backoff
- Room-based subscriptions for targeted updates
- Message queueing during disconnection
- Updated HTML templates (index.html, queue.html):
- Replaced Socket.IO CDN with native websocket_client.js
- No external dependencies needed
- Updated JavaScript files (app.js, queue.js):
- Added room subscriptions on WebSocket connect (scan_progress, download_progress, downloads)
- Added dual event handlers for backward compatibility
- Support both old (scan_completed) and new (scan_complete) message types
- Support both old (download_error) and new (download_failed) message types
- Support both old (queue_updated) and new (queue_status) message types
- Registered anime router in fastapi_app.py:
- Added anime_router import and registration
- All API routers now properly included
- Documentation:
- Created FRONTEND_INTEGRATION.md with comprehensive integration guide
- Updated infrastructure.md with frontend integration section
- Updated instructions.md to mark task as completed
- Testing:
- Verified anime endpoint tests pass (pytest)
- API endpoint mapping documented
- WebSocket message format changes documented
Benefits:
- Native WebSocket API (faster, smaller footprint)
- No external CDN dependencies
- Full backward compatibility with existing code
- Proper integration with backend services
- Real-time updates via room-based messaging
- Replace Flask url_for() with direct /static/ paths in all HTML templates
- Update CSS and JavaScript file references to use FastAPI static mount
- Convert Flask-specific template patterns to FastAPI-compatible syntax
- Update JavaScript API endpoints to match new FastAPI route structure:
* /api/series -> /api/v1/anime
* /api/search -> /api/v1/anime/search
* /api/rescan -> /api/v1/anime/rescan
- Add web interface routes for serving HTML templates
- Add template response endpoints for /app, /login, /setup, /queue
- Mark HTML template and JavaScript migration tasks as completed
- Maintain Jinja2 template compatibility with FastAPI
