TitleCardMaker
TitleCardMaker copied to clipboard
Create a Web Interface
This will be a pretty huge endeavor, but ideally TCM should move away from YAML files and command-line scripts and be interacted with via a web UI/interface, like all the -arr apps. It's derivative, but I think the Sonarr interface is good inspiration for a general layout.
I think the server-side API should using FastAPI to handle the requests and HTML content delivery.
Outstanding Tasks
- [x] Implement light/dark mode
- [x] Implement Syncing
- [x] Run these on automatic schedule
- [x] Allow user to adjust Sync frequency
- [x] From the API
- [x] From the UI
- [x] Implement Templates
- [x] Allow creation/edit/deletion from API
- [x] Allow creation/edit/deletion from UI
- [x] ~~Add image source priority to Templates~~ (decided this is not necessary and adds needless complication)
- [x] Add Filters to Templates (#212)
- [x] Allow Series and Episodes to have multiple Templates
- [x] Implement Custom Fonts
- [x] Implement per-Episode toggles/overrides
- [x] Allow user to create/edit/add font and other card-based customization options from the API and UI
- [x] Allow user to create/edit/add extras from the API
- [x] Allow user to create/edit/add extras from the UI
- [x] Implement translations
- [x] Add Translations to Templates and Series models
- [x] Utilize translated titles when indicated as
preferred_title - [x] Allow Translations to be added/edited via the API
- [x] Allow Translations to be added/edited via the UI
- [x] Implement Tautulli integration
- [x] Utilize "Webhook" API triggers rather than file monitoring
- [x] Add automatic setup to Connections page
- [x] Periodically schedule major tasks
- [x] Episode data refreshing (new episodes, updated titles, etc.)
- [x] Download source images
- [x] Card creation
- [x] Media server loading
- [x] Title translation
- [x] Series logo downloading
- [x] Sync syncing
- [x] Refresh remote (user) card-types
- [x] Check for new version of TCM
- [x] Implement YAML importing functionality
- [x] Import Fonts
- [x] Import Templates
- [x] Import Series
- [x] Parse Template variables in Series imports
- [x] Import settings / preferences
- [x] Import Syncs
- [x] ~~Maybe import Episode data, although this would be really niche~~ Too niche
- [x] Create import page within the UI
- [x] Create missing asset page / report
- [x] Allow series to be "unmonitored" in which they are skipped when executing scheduled all-series functions
- [x] Add remote card type dropdown toggles to Settings page
- [x] Make all card type selectors searchable
- [ ] Update user card types to work with UI
- [x] Create JSON file on the repository that can be queried to populate the UI
- [x] Ask all user card creators to submit updated descriptions for their types to add to the JSON file. Give them an opportunity to rename the cards as well
- [ ] Merge some of Wdvh's cards, as there are multiple that are nearly identical and can easily by combined
- [x] Allow them to be used within TCM
- [x] Create Pydantic models for all card types
- [x] Add toggle for enabling/disabling TMDb logo downloading
- [x] Add page to showcase the different card types and their supported customization options (extras)
- [ ] Add local-storage filter for series on shown main page
- [x] ~~Create alternate views (table view?) for series on main page~~ Putting on hold until I can think of a good layout
- [x] Implement SQLAlchemy database migrations with Alembic
- [x] Add source file display to Series HTML page
- [x] Show present/missing source images (including dimensions, file size, etc.)
- [x] Allow users to manually query for source images on a per-Episode basic (via UI)
- [x] Implement builtin source image selection/overwriting
- [x] Via manual file upload
- [x] Via manual URL specification
- [x] Via TMDb browser
- [x] Add change log page/section (currently only showing "new release is available" message)
- [x] Add functionality to import existing cards for a Series
- [x] Create Pydantic models for all Card types to perform validation
- [x] Add translated cardinal/ordinal number functionality
Low Priority Tasks
- [ ] Add functionality to reset / unload title cards
- [x] Add authentication
- [ ] Implement mini maker functionality (not high priority)
- [x] Write creation as EXIF tag? https://stackoverflow.com/questions/10833928/custom-exif-tags
- [x] Double check that /api URL’s are acceptable in Sonarr API forms
- [x] Fix background of main page not covering entire viewport
- [ ] Implement API keys ref
- [ ] Rewrite front end to use React + NextUI
- [ ] https://nextui.org/docs/guide/installation
- [ ] https://www.kirupa.com/react/creating_single_page_app_react_using_react_router.htm
Documentation tasks should be tracked in #339
I think a toggleable dark/light mode could probably be accomplished like so:
$('.ui').toggleClass('inverted', true); // Dark mode
$('.ui').toggleClass('inverted', false); // Light mode
Although any CSS selectors using the class might need to be revised, along with any hard-coded class name assignment in JS (e.g. elem.className = "...")
Task scheduling might be doable with BackgroundTasks objects, but this is limited in terms of periodic scheduling and task monitoring.
The APScheduler module looks like a good solution; here is a good example of the basic object utilization with scheduling API endpoints.
Looks like APScheduler will not be able to write to the database at all, which is problematic. The problem is that SQL Alchemy is not multi thread/process safe; leading to a ton of issues when scheduling writes in separate processes.
Might change the SQL backend, or find a different solution, but for now starlette BackgroundTasks will have to do for background DB writes.
Created the https://github.com/CollinHeist/TitleCardMaker-CardTypes/tree/web-ui branch on the TitleCardMaker-CardTypes repository; and added a JSON file in 563e0d1e4e80e0d9fda34daf32352b1aaed6a6d2 which defines a JSON file containing card details for all user-created cards. This should be parsed on the webpage.
I'll need to reach out to the card creators and get their feedback on the card/extra descriptions, as well as the example images they want used.
I think users should be able to toggle which card types they do/do not want shown in card type dropdowns. This should be added to the Settings page. Card type dropdowns should also be searchable.
I think users should also be able to turn off logo downloading within the TMDb settings
https://github.com/CollinHeist/TitleCardMaker/assets/17693271/1b39ea68-bfd3-41bc-99ce-bd7d6af01415