Custom Theme Support (#1077)
* Started the migration to bootstrap 5. Introduced a breakpoint system that bootstrap reflects for our screens. * sr only migrated * mr/ml -> me/ms * pl/pr -> ps/pe * btn-block * removed input-group-append * Added form-label to all labels * Added some style overrides for inputs * Replaced form-group with mb-3 * Ignore journal files * Update media to d-flex/flex-grow-1 * Fixed reading list detail page * For develop builds, don't inline critical styles * Fixed some downstream security issues * Fixed a layout issue in series detail * Fixed issue with btn-light not having background color. Updated layout for series detail metadata * Cleaned up nav search * Laid out the organization for custom theme components. Update _inputs.scss with variable overrides and depending on theme, it will just work. * Lots of theming work * Added inputs to the theme page * Login and input placeholder changes - Fixed login screen centering issue on all devices - Changed the format of the login screen - Change the input placeholder color * Added checkbox styles * Refactored tagbadges and removed some ngdeep selectors * Added nav bar component and refactored some styles into event widget * Cleaned nav events again and made dedicated popover body * Finished pagination component * Fixed up some styles with buttons * refactored dropdown component * Update accordion component * Refactored breadcrumbs and rating star. Fixed a missing style for cards * Fixed some styling issues on person badge, added modal component, and some global styles * Finished moving everything within dark to component files * Fixed up filter buttons, move card styles into a component theme, fixed slider style * Refactored library card and grouped typeahead * Updated normal typeahead component and reduced amount of ngdeep selector * Refactored grid breakpoints to be available by css variable, but it's hardcoded into the app * Ensure breakpoints are defined per theme * Fixed up some styling overrides and customization for nav links and alt button * Removed some deep styles, moved css out of splash container and brough back labels for login page * Finished css variable refactor * Refactored all the theme variable definitions into files for each theme. * Added back bootstrap overrides * Added a note about bootstrap theme colors being not-possible to swap out at runtime * Cleaned up some dead code * Implemented the ability to set a custom theme on the site. Cleaned up misc code throughout. * Additional changes - Fixed nav where "kavita" was not hiding correctly on small viewports - Fixed search bar to make the behavior more consistent - Fixed accordion buttons - Changed accordion buttons to be more responsive - Added radio button colors - Fixed radios on theme test page - Changed login and reset password card layouts to be more consistent. - Added primary color shade for when darker shading is needed. * Built a basic site, allow the user to apply different themes, refactored nav service code out. * Implemented the ability update a user's theme * Added unit tests for Scan and Get Content in SiteThemeService. * Fixed a bug in the login code and Pref code which wasn't joining on SiteTheme table. Wrote Unit tests and the UI component to manage current theme. * Implemented scan so that it manages custom themes with unit tests * Component updates - Repositioning style ordering - Adding indicator override - Adding select styles * SignlaR integration, some fixes when creating custom entities, one single migration. Just login functionality left. * More ui updated - Added .no-hover to prevent hover on elements where not needed - Changed all selects I could find to appropriate class - Changed up nav tabs to work more like bootstrap tabs than pills - Added padding to top of some containers to make styles consistent - Added ability to change navbar fontawesome icon colors - removed some unecessary inline styling - Changed radio button to appropriate class - Toned down primate color, a bit too bright for dark theme. - Added ability to change button fontawesome icon color * nav-tab fix for series-detail * Added themes folder to gitignore * Adding card overlay * Fixing up light theme * Everything is done. Only bug is that color-scheme isn't being set properly from css variable. * Checkboxes have pointer by default. Confirm/Confirm email use default (dark) theme by default * Fixed an error where color-scheme wasn't reflecting correctly on themes on first load * Fixed user preferences not available on login * Changing dual radios to switches and color tweaks * disabled primary APCA fix * button APCA fixes * Fixed some timing issues with first load and image service * Fixed swiper issues from upgrade * Changed themes to be scss files again and adjusted Seed code * Migrated carousel to css variables. Fixed a broken animation for search. * Cleaned up some backend smells * Fixed white border outline on nav tabs, added some variables for header * Nav bar has been css variable-ified * Added some basic eink stuff to make the app useable Co-authored-by: Robbie Davis <robbie@therobbiedavis.com>
This commit is contained in:
parent
c776ca3b72
commit
568ea9fd3a
168 changed files with 4710 additions and 1666 deletions
|
@ -19,6 +19,7 @@ namespace API.Services
|
|||
string LogDirectory { get; }
|
||||
string TempDirectory { get; }
|
||||
string ConfigDirectory { get; }
|
||||
string SiteThemeDirectory { get; }
|
||||
/// <summary>
|
||||
/// Original BookmarkDirectory. Only used for resetting directory. Use <see cref="ServerSettingKey.BackupDirectory"/> for actual path.
|
||||
/// </summary>
|
||||
|
@ -64,6 +65,7 @@ namespace API.Services
|
|||
public string TempDirectory { get; }
|
||||
public string ConfigDirectory { get; }
|
||||
public string BookmarkDirectory { get; }
|
||||
public string SiteThemeDirectory { get; }
|
||||
private readonly ILogger<DirectoryService> _logger;
|
||||
|
||||
private static readonly Regex ExcludeDirectories = new Regex(
|
||||
|
@ -81,6 +83,7 @@ namespace API.Services
|
|||
TempDirectory = FileSystem.Path.Join(FileSystem.Directory.GetCurrentDirectory(), "config", "temp");
|
||||
ConfigDirectory = FileSystem.Path.Join(FileSystem.Directory.GetCurrentDirectory(), "config");
|
||||
BookmarkDirectory = FileSystem.Path.Join(FileSystem.Directory.GetCurrentDirectory(), "config", "bookmarks");
|
||||
SiteThemeDirectory = FileSystem.Path.Join(FileSystem.Directory.GetCurrentDirectory(), "config", "themes");
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
|
|
|
@ -22,6 +22,7 @@ public interface ITaskScheduler
|
|||
void ScanSeries(int libraryId, int seriesId, bool forceUpdate = false);
|
||||
void CancelStatsTasks();
|
||||
Task RunStatCollection();
|
||||
void ScanSiteThemes();
|
||||
}
|
||||
public class TaskScheduler : ITaskScheduler
|
||||
{
|
||||
|
@ -35,6 +36,7 @@ public class TaskScheduler : ITaskScheduler
|
|||
|
||||
private readonly IStatsService _statsService;
|
||||
private readonly IVersionUpdaterService _versionUpdaterService;
|
||||
private readonly ISiteThemeService _siteThemeService;
|
||||
|
||||
public static BackgroundJobServer Client => new BackgroundJobServer();
|
||||
private static readonly Random Rnd = new Random();
|
||||
|
@ -42,7 +44,8 @@ public class TaskScheduler : ITaskScheduler
|
|||
|
||||
public TaskScheduler(ICacheService cacheService, ILogger<TaskScheduler> logger, IScannerService scannerService,
|
||||
IUnitOfWork unitOfWork, IMetadataService metadataService, IBackupService backupService,
|
||||
ICleanupService cleanupService, IStatsService statsService, IVersionUpdaterService versionUpdaterService)
|
||||
ICleanupService cleanupService, IStatsService statsService, IVersionUpdaterService versionUpdaterService,
|
||||
ISiteThemeService siteThemeService)
|
||||
{
|
||||
_cacheService = cacheService;
|
||||
_logger = logger;
|
||||
|
@ -53,6 +56,7 @@ public class TaskScheduler : ITaskScheduler
|
|||
_cleanupService = cleanupService;
|
||||
_statsService = statsService;
|
||||
_versionUpdaterService = versionUpdaterService;
|
||||
_siteThemeService = siteThemeService;
|
||||
}
|
||||
|
||||
public async Task ScheduleTasks()
|
||||
|
@ -124,6 +128,12 @@ public class TaskScheduler : ITaskScheduler
|
|||
BackgroundJob.Enqueue(() => _statsService.Send());
|
||||
}
|
||||
|
||||
public void ScanSiteThemes()
|
||||
{
|
||||
_logger.LogInformation("Starting Site Theme scan");
|
||||
BackgroundJob.Enqueue(() => _siteThemeService.Scan());
|
||||
}
|
||||
|
||||
#endregion
|
||||
|
||||
#region UpdateTasks
|
||||
|
|
163
API/Services/Tasks/SiteThemeService.cs
Normal file
163
API/Services/Tasks/SiteThemeService.cs
Normal file
|
@ -0,0 +1,163 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using API.Data;
|
||||
using API.Entities;
|
||||
using API.Entities.Enums.Theme;
|
||||
using API.SignalR;
|
||||
using Kavita.Common;
|
||||
using Microsoft.AspNetCore.SignalR;
|
||||
|
||||
namespace API.Services.Tasks;
|
||||
|
||||
public interface ISiteThemeService
|
||||
{
|
||||
Task<string> GetContent(int themeId);
|
||||
Task Scan();
|
||||
Task UpdateDefault(int themeId);
|
||||
}
|
||||
|
||||
public class SiteThemeService : ISiteThemeService
|
||||
{
|
||||
private readonly IDirectoryService _directoryService;
|
||||
private readonly IUnitOfWork _unitOfWork;
|
||||
private readonly IHubContext<MessageHub> _messageHub;
|
||||
|
||||
public SiteThemeService(IDirectoryService directoryService, IUnitOfWork unitOfWork, IHubContext<MessageHub> messageHub)
|
||||
{
|
||||
_directoryService = directoryService;
|
||||
_unitOfWork = unitOfWork;
|
||||
_messageHub = messageHub;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Given a themeId, return the content inside that file
|
||||
/// </summary>
|
||||
/// <param name="themeId"></param>
|
||||
/// <returns></returns>
|
||||
/// <exception cref="KavitaException"></exception>
|
||||
public async Task<string> GetContent(int themeId)
|
||||
{
|
||||
var theme = await _unitOfWork.SiteThemeRepository.GetThemeDto(themeId);
|
||||
if (theme == null) throw new KavitaException("Theme file missing or invalid");
|
||||
var themeFile = _directoryService.FileSystem.Path.Join(_directoryService.SiteThemeDirectory, theme.FileName);
|
||||
if (string.IsNullOrEmpty(themeFile) || !_directoryService.FileSystem.File.Exists(themeFile))
|
||||
throw new KavitaException("Theme file missing or invalid");
|
||||
|
||||
return await _directoryService.FileSystem.File.ReadAllTextAsync(themeFile);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Scans the site theme directory for custom css files and updates what the system has on store
|
||||
/// </summary>
|
||||
public async Task Scan()
|
||||
{
|
||||
_directoryService.ExistOrCreate(_directoryService.SiteThemeDirectory);
|
||||
var reservedNames = Seed.DefaultThemes.Select(t => t.NormalizedName).ToList();
|
||||
var themeFiles = _directoryService.GetFilesWithExtension(Parser.Parser.NormalizePath(_directoryService.SiteThemeDirectory), @"\.css")
|
||||
.Where(name => !reservedNames.Contains(Parser.Parser.Normalize(name))).ToList();
|
||||
|
||||
var allThemes = (await _unitOfWork.SiteThemeRepository.GetThemes()).ToList();
|
||||
var totalThemesToIterate = themeFiles.Count;
|
||||
var themeIteratedCount = 0;
|
||||
|
||||
// First remove any files from allThemes that are User Defined and not on disk
|
||||
var userThemes = allThemes.Where(t => t.Provider == ThemeProvider.User).ToList();
|
||||
foreach (var userTheme in userThemes)
|
||||
{
|
||||
var filepath = Parser.Parser.NormalizePath(
|
||||
_directoryService.FileSystem.Path.Join(_directoryService.SiteThemeDirectory, userTheme.FileName));
|
||||
if (!_directoryService.FileSystem.File.Exists(filepath))
|
||||
{
|
||||
// I need to do the removal different. I need to update all userpreferences to use DefaultTheme
|
||||
allThemes.Remove(userTheme);
|
||||
await RemoveTheme(userTheme);
|
||||
|
||||
await _messageHub.Clients.All.SendAsync(SignalREvents.SiteThemeProgress,
|
||||
MessageFactory.SiteThemeProgressEvent(1, totalThemesToIterate, userTheme.FileName, 0F));
|
||||
}
|
||||
}
|
||||
|
||||
// Add new custom themes
|
||||
var allThemeNames = allThemes.Select(t => t.NormalizedName).ToList();
|
||||
foreach (var themeFile in themeFiles)
|
||||
{
|
||||
var themeName =
|
||||
Parser.Parser.Normalize(_directoryService.FileSystem.Path.GetFileNameWithoutExtension(themeFile));
|
||||
if (allThemeNames.Contains(themeName))
|
||||
{
|
||||
themeIteratedCount += 1;
|
||||
continue;
|
||||
}
|
||||
_unitOfWork.SiteThemeRepository.Add(new SiteTheme()
|
||||
{
|
||||
Name = _directoryService.FileSystem.Path.GetFileNameWithoutExtension(themeFile),
|
||||
NormalizedName = themeName,
|
||||
FileName = _directoryService.FileSystem.Path.GetFileName(themeFile),
|
||||
Provider = ThemeProvider.User,
|
||||
IsDefault = false,
|
||||
});
|
||||
await _messageHub.Clients.All.SendAsync(SignalREvents.SiteThemeProgress,
|
||||
MessageFactory.SiteThemeProgressEvent(themeIteratedCount, totalThemesToIterate, themeName, themeIteratedCount / (totalThemesToIterate * 1.0f)));
|
||||
themeIteratedCount += 1;
|
||||
}
|
||||
|
||||
|
||||
if (_unitOfWork.HasChanges())
|
||||
{
|
||||
await _unitOfWork.CommitAsync();
|
||||
}
|
||||
|
||||
await _messageHub.Clients.All.SendAsync(SignalREvents.SiteThemeProgress,
|
||||
MessageFactory.SiteThemeProgressEvent(totalThemesToIterate, totalThemesToIterate, "", 1F));
|
||||
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Removes the theme and any references to it from Pref and sets them to the default at the time.
|
||||
/// This commits to DB.
|
||||
/// </summary>
|
||||
/// <param name="theme"></param>
|
||||
private async Task RemoveTheme(SiteTheme theme)
|
||||
{
|
||||
var prefs = await _unitOfWork.UserRepository.GetAllPreferencesByThemeAsync(theme.Id);
|
||||
var defaultTheme = await _unitOfWork.SiteThemeRepository.GetDefaultTheme();
|
||||
foreach (var pref in prefs)
|
||||
{
|
||||
pref.Theme = defaultTheme;
|
||||
_unitOfWork.UserRepository.Update(pref);
|
||||
}
|
||||
_unitOfWork.SiteThemeRepository.Remove(theme);
|
||||
await _unitOfWork.CommitAsync();
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Updates the themeId to the default theme, all others are marked as non-default
|
||||
/// </summary>
|
||||
/// <param name="themeId"></param>
|
||||
/// <returns></returns>
|
||||
/// <exception cref="KavitaException">If theme does not exist</exception>
|
||||
public async Task UpdateDefault(int themeId)
|
||||
{
|
||||
try
|
||||
{
|
||||
var theme = await _unitOfWork.SiteThemeRepository.GetThemeDto(themeId);
|
||||
if (theme == null) throw new KavitaException("Theme file missing or invalid");
|
||||
|
||||
foreach (var siteTheme in await _unitOfWork.SiteThemeRepository.GetThemes())
|
||||
{
|
||||
siteTheme.IsDefault = (siteTheme.Id == themeId);
|
||||
_unitOfWork.SiteThemeRepository.Update(siteTheme);
|
||||
}
|
||||
|
||||
if (!_unitOfWork.HasChanges()) return;
|
||||
await _unitOfWork.CommitAsync();
|
||||
}
|
||||
catch (Exception)
|
||||
{
|
||||
await _unitOfWork.RollbackAsync();
|
||||
throw;
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue