AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Better Themes, Stats, and bugfixes (#1740)

Browse source 
* Fixed a bug where when clicking on a series rating for first time, the rating wasn't populating in the modal.

* Fixed a bug on Scroll mode with immersive mode, the bottom bar could clip with the book body.

* Cleanup some uses of var

* Refactored text as json into a type so I don't have to copy/paste everywhere

* Theme styles now override the defaults and theme owners no longer need to maintain all the variables themselves.

Themes can now override the color of the header on mobile devices via --theme-color and Kavita will now update both theme color as well as color scheme.

* Fixed a bug where last active on user stats wasn't for the particular user.

* Added a more accurate word count calculation and the ability to see the word counts year over year.

* Added a new table for long term statistics, like number of files over the years. No views are present for this data, I will add them later.
This commit is contained in:
Joe Milazzo 2023-01-11 08:12:31 -06:00 • committed by GitHub
parent 84b7978587
commit 5613d1a954
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
39 changed files with 2234 additions and 103 deletions
Download patch file Download diff file Expand all files Collapse all files

18
UI/Web/src/app/_services/account.service.ts
View file

@ -13,6 +13,7 @@ import { UserUpdateEvent } from '../_models/events/user-update-event';
import { UpdateEmailResponse } from '../_models/auth/update-email-response';
import { AgeRating } from '../_models/metadata/age-rating';
import { AgeRestriction } from '../_models/metadata/age-restriction';
import { TextResonse } from '../_types/text-response';
export enum Role {
Admin = 'Admin',
@ -151,7 +152,7 @@ export class AccountService implements OnDestroy {
}
migrateUser(model: {email: string, username: string, password: string, sendEmail: boolean}) {
return this.httpClient.post<string>(this.baseUrl + 'account/migrate-email', model, {responseType: 'text' as 'json'});
return this.httpClient.post<string>(this.baseUrl + 'account/migrate-email', model, TextResonse);
}
confirmMigrationEmail(model: {email: string, token: string}) {
@ -159,7 +160,7 @@ export class AccountService implements OnDestroy {
}
resendConfirmationEmail(userId: number) {
return this.httpClient.post<string>(this.baseUrl + 'account/resend-confirmation-email?userId=' + userId, {}, {responseType: 'text' as 'json'});
return this.httpClient.post<string>(this.baseUrl + 'account/resend-confirmation-email?userId=' + userId, {}, TextResonse);
}
inviteUser(model: {email: string, roles: Array<string>, libraries: Array<number>, ageRestriction: AgeRestriction}) {
@ -180,7 +181,7 @@ export class AccountService implements OnDestroy {
* @returns
*/
getInviteUrl(userId: number, withBaseUrl: boolean = true) {
return this.httpClient.get<string>(this.baseUrl + 'account/invite-url?userId=' + userId + '&withBaseUrl=' + withBaseUrl, {responseType: 'text' as 'json'});
return this.httpClient.get<string>(this.baseUrl + 'account/invite-url?userId=' + userId + '&withBaseUrl=' + withBaseUrl, TextResonse);
}
getDecodedToken(token: string) {
@ -188,15 +189,15 @@ export class AccountService implements OnDestroy {
}
requestResetPasswordEmail(email: string) {
return this.httpClient.post<string>(this.baseUrl + 'account/forgot-password?email=' + encodeURIComponent(email), {}, {responseType: 'text' as 'json'});
return this.httpClient.post<string>(this.baseUrl + 'account/forgot-password?email=' + encodeURIComponent(email), {}, TextResonse);
}
confirmResetPasswordEmail(model: {email: string, token: string, password: string}) {
return this.httpClient.post<string>(this.baseUrl + 'account/confirm-password-reset', model, {responseType: 'text' as 'json'});
return this.httpClient.post<string>(this.baseUrl + 'account/confirm-password-reset', model, TextResonse);
}
resetPassword(username: string, password: string, oldPassword: string) {
return this.httpClient.post(this.baseUrl + 'account/reset-password', {username, password, oldPassword}, {responseType: 'json' as 'text'});
return this.httpClient.post(this.baseUrl + 'account/reset-password', {username, password, oldPassword}, TextResonse);
}
update(model: {email: string, roles: Array<string>, libraries: Array<number>, userId: number, ageRestriction: AgeRestriction}) {
@ -247,7 +248,7 @@ export class AccountService implements OnDestroy {
}
resetApiKey() {
return this.httpClient.post<string>(this.baseUrl + 'account/reset-api-key', {}, {responseType: 'text' as 'json'}).pipe(map(key => {
return this.httpClient.post<string>(this.baseUrl + 'account/reset-api-key', {}, TextResonse).pipe(map(key => {
const user = this.getUserFromLocalStorage();
if (user) {
user.apiKey = key;
@ -264,7 +265,8 @@ export class AccountService implements OnDestroy {
private refreshToken() {
if (this.currentUser === null || this.currentUser === undefined) return of();
return this.httpClient.post<{token: string, refreshToken: string}>(this.baseUrl + 'account/refresh-token', {token: this.currentUser.token, refreshToken: this.currentUser.refreshToken}).pipe(map(user => {
return this.httpClient.post<{token: string, refreshToken: string}>(this.baseUrl + 'account/refresh-token',
{token: this.currentUser.token, refreshToken: this.currentUser.refreshToken}).pipe(map(user => {
if (this.currentUser) {
this.currentUser.token = user.token;
this.currentUser.refreshToken = user.refreshToken;

7
UI/Web/src/app/_services/collection-tag.service.ts
View file

@ -3,6 +3,7 @@ import { Injectable } from '@angular/core';
import { map } from 'rxjs/operators';
import { environment } from 'src/environments/environment';
import { CollectionTag } from '../_models/collection-tag';
import { TextResonse } from '../_types/text-response';
import { ImageService } from './image.service';
@Injectable({
@ -26,15 +27,15 @@ export class CollectionTagService {
}
updateTag(tag: CollectionTag) {
return this.httpClient.post(this.baseUrl + 'collection/update', tag, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'collection/update', tag, TextResonse);
}
updateSeriesForTag(tag: CollectionTag, seriesIdsToRemove: Array<number>) {
return this.httpClient.post(this.baseUrl + 'collection/update-series', {tag, seriesIdsToRemove}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'collection/update-series', {tag, seriesIdsToRemove}, TextResonse);
}
addByMultiple(tagId: number, seriesIds: Array<number>, tagTitle: string = '') {
return this.httpClient.post(this.baseUrl + 'collection/update-for-series', {collectionTagId: tagId, collectionTagTitle: tagTitle, seriesIds}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'collection/update-for-series', {collectionTagId: tagId, collectionTagTitle: tagTitle, seriesIds}, TextResonse);
}
tagNameExists(name: string) {

7
UI/Web/src/app/_services/device.service.ts
View file

@ -4,6 +4,7 @@ import { ReplaySubject, shareReplay, tap } from 'rxjs';
import { environment } from 'src/environments/environment';
import { Device } from '../_models/device/device';
import { DevicePlatform } from '../_models/device/device-platform';
import { TextResonse } from '../_types/text-response';
import { AccountService } from './account.service';
@Injectable({
@ -32,11 +33,11 @@ export class DeviceService {
}
createDevice(name: string, platform: DevicePlatform, emailAddress: string) {
return this.httpClient.post(this.baseUrl + 'device/create', {name, platform, emailAddress}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'device/create', {name, platform, emailAddress}, TextResonse);
}
updateDevice(id: number, name: string, platform: DevicePlatform, emailAddress: string) {
return this.httpClient.post(this.baseUrl + 'device/update', {id, name, platform, emailAddress}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'device/update', {id, name, platform, emailAddress}, TextResonse);
}
deleteDevice(id: number) {
@ -50,7 +51,7 @@ export class DeviceService {
}
sendTo(chapterIds: Array<number>, deviceId: number) {
return this.httpClient.post(this.baseUrl + 'device/send-to', {deviceId, chapterIds}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'device/send-to', {deviceId, chapterIds}, TextResonse);
}

5
UI/Web/src/app/_services/metadata.service.ts
View file

@ -11,6 +11,7 @@ import { Language } from '../_models/metadata/language';
import { PublicationStatusDto } from '../_models/metadata/publication-status-dto';
import { Person } from '../_models/metadata/person';
import { Tag } from '../_models/tag';
import { TextResonse } from '../_types/text-response';
@Injectable({
providedIn: 'root'
@ -28,7 +29,7 @@ export class MetadataService {
if (this.ageRatingTypes != undefined && this.ageRatingTypes.hasOwnProperty(ageRating)) {
return of(this.ageRatingTypes[ageRating]);
}
return this.httpClient.get<string>(this.baseUrl + 'series/age-rating?ageRating=' + ageRating, {responseType: 'text' as 'json'}).pipe(map(ratingString => {
return this.httpClient.get<string>(this.baseUrl + 'series/age-rating?ageRating=' + ageRating, TextResonse).pipe(map(ratingString => {
if (this.ageRatingTypes === undefined) {
this.ageRatingTypes = {};
}
@ -97,6 +98,6 @@ export class MetadataService {
}
getChapterSummary(chapterId: number) {
return this.httpClient.get<string>(this.baseUrl + 'metadata/chapter-summary?chapterId=' + chapterId, {responseType: 'text' as 'json'});
return this.httpClient.get<string>(this.baseUrl + 'metadata/chapter-summary?chapterId=' + chapterId, TextResonse);
}
}

5
UI/Web/src/app/_services/reader.service.ts
View file

@ -15,6 +15,7 @@ import { UtilityService } from '../shared/_services/utility.service';
import { FilterUtilitiesService } from '../shared/_services/filter-utilities.service';
import { FileDimension } from '../manga-reader/_models/file-dimension';
import screenfull from 'screenfull';
import { TextResonse } from '../_types/text-response';
export const CHAPTER_ID_DOESNT_EXIST = -1;
export const CHAPTER_ID_NOT_FETCHED = -2;
@ -78,10 +79,10 @@ export class ReaderService {
}
clearBookmarks(seriesId: number) {
return this.httpClient.post(this.baseUrl + 'reader/remove-bookmarks', {seriesId}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'reader/remove-bookmarks', {seriesId}, TextResonse);
}
clearMultipleBookmarks(seriesIds: Array<number>) {
return this.httpClient.post(this.baseUrl + 'reader/bulk-remove-bookmarks', {seriesIds}, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'reader/bulk-remove-bookmarks', {seriesIds}, TextResonse);
}
/**

21
UI/Web/src/app/_services/reading-list.service.ts
View file

@ -5,6 +5,7 @@ import { environment } from 'src/environments/environment';
import { UtilityService } from '../shared/_services/utility.service';
import { PaginatedResult } from '../_models/pagination';
import { ReadingList, ReadingListItem } from '../_models/reading-list';
import { TextResonse } from '../_types/text-response';
import { ActionItem } from './action-factory.service';
@Injectable({
@ -44,43 +45,43 @@ export class ReadingListService {
}
update(model: {readingListId: number, title?: string, summary?: string, promoted: boolean}) {
return this.httpClient.post(this.baseUrl + 'readinglist/update', model, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update', model, TextResonse);
}
updateByMultiple(readingListId: number, seriesId: number, volumeIds: Array<number>, chapterIds?: Array<number>) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-multiple', {readingListId, seriesId, volumeIds, chapterIds}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-multiple', {readingListId, seriesId, volumeIds, chapterIds}, TextResonse);
}
updateByMultipleSeries(readingListId: number, seriesIds: Array<number>) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-multiple-series', {readingListId, seriesIds}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-multiple-series', {readingListId, seriesIds}, TextResonse);
}
updateBySeries(readingListId: number, seriesId: number) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-series', {readingListId, seriesId}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-series', {readingListId, seriesId}, TextResonse);
}
updateByVolume(readingListId: number, seriesId: number, volumeId: number) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-volume', {readingListId, seriesId, volumeId}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-volume', {readingListId, seriesId, volumeId}, TextResonse);
}
updateByChapter(readingListId: number, seriesId: number, chapterId: number) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-chapter', {readingListId, seriesId, chapterId}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-by-chapter', {readingListId, seriesId, chapterId}, TextResonse);
}
delete(readingListId: number) {
return this.httpClient.delete(this.baseUrl + 'readinglist?readingListId=' + readingListId, { responseType: 'text' as 'json' });
return this.httpClient.delete(this.baseUrl + 'readinglist?readingListId=' + readingListId, TextResonse);
}
updatePosition(readingListId: number, readingListItemId: number, fromPosition: number, toPosition: number) {
return this.httpClient.post(this.baseUrl + 'readinglist/update-position', {readingListId, readingListItemId, fromPosition, toPosition}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/update-position', {readingListId, readingListItemId, fromPosition, toPosition}, TextResonse);
}
deleteItem(readingListId: number, readingListItemId: number) {
return this.httpClient.post(this.baseUrl + 'readinglist/delete-item', {readingListId, readingListItemId}, { responseType: 'text' as 'json' });
return this.httpClient.post(this.baseUrl + 'readinglist/delete-item', {readingListId, readingListItemId}, TextResonse);
}
removeRead(readingListId: number) {
return this.httpClient.post<string>(this.baseUrl + 'readinglist/remove-read?readingListId=' + readingListId, {}, { responseType: 'text' as 'json' });
return this.httpClient.post<string>(this.baseUrl + 'readinglist/remove-read?readingListId=' + readingListId, {}, TextResonse);
}
actionListFilter(action: ActionItem<ReadingList>, readingList: ReadingList, isAdmin: boolean) {

5
UI/Web/src/app/_services/series.service.ts
View file

@ -17,6 +17,7 @@ import { SeriesGroup } from '../_models/series-group';
import { SeriesMetadata } from '../_models/metadata/series-metadata';
import { Volume } from '../_models/volume';
import { ImageService } from './image.service';
import { TextResonse } from '../_types/text-response';
@Injectable({
providedIn: 'root'
@ -131,7 +132,7 @@ export class SeriesService {
}
isWantToRead(seriesId: number) {
return this.httpClient.get<string>(this.baseUrl + 'want-to-read?seriesId=' + seriesId, {responseType: 'text' as 'json'})
return this.httpClient.get<string>(this.baseUrl + 'want-to-read?seriesId=' + seriesId, TextResonse)
.pipe(map(val => {
return val === 'true';
}));
@ -174,7 +175,7 @@ export class SeriesService {
seriesMetadata,
collectionTags,
};
return this.httpClient.post(this.baseUrl + 'series/metadata', data, {responseType: 'text' as 'json'});
return this.httpClient.post(this.baseUrl + 'series/metadata', data, TextResonse);
}
getSeriesForTag(collectionTagId: number, pageNum?: number, itemsPerPage?: number) {

19
UI/Web/src/app/_services/statistics.service.ts
View file

@ -12,6 +12,7 @@ import { ServerStatistics } from '../statistics/_models/server-statistics';
import { StatCount } from '../statistics/_models/stat-count';
import { PublicationStatus } from '../_models/metadata/publication-status';
import { MangaFormat } from '../_models/manga-format';
import { TextResonse } from '../_types/text-response';
export enum DayOfWeek
{
@ -58,7 +59,21 @@ export class StatisticsService {
getTopYears() {
return this.httpClient.get<StatCount<number>[]>(this.baseUrl + 'stats/server/top/years').pipe(
map(spreads => spreads.map(spread => {
return {name: spread.value + '', value: spread.count};
return {name: spread.value + '', value: spread.count};
})));
}
getPagesPerYear(userId = 0) {
return this.httpClient.get<StatCount<number>[]>(this.baseUrl + 'stats/pages-per-year?userId=' + userId).pipe(
map(spreads => spreads.map(spread => {
return {name: spread.value + '', value: spread.count};
})));
}
getWordsPerYear(userId = 0) {
return this.httpClient.get<StatCount<number>[]>(this.baseUrl + 'stats/words-per-year?userId=' + userId).pipe(
map(spreads => spreads.map(spread => {
return {name: spread.value + '', value: spread.count};
})));
}
@ -85,7 +100,7 @@ export class StatisticsService {
}
getTotalSize() {
return this.httpClient.get<number>(this.baseUrl + 'stats/server/file-size', { responseType: 'text' as 'json'});
return this.httpClient.get<number>(this.baseUrl + 'stats/server/file-size', TextResonse);
}
getFileBreakdown() {

29
UI/Web/src/app/_services/theme.service.ts
View file

@ -3,12 +3,12 @@ import { HttpClient } from '@angular/common/http';
import { Inject, Injectable, OnDestroy, Renderer2, RendererFactory2, SecurityContext } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { ToastrService } from 'ngx-toastr';
import { map, ReplaySubject, Subject, takeUntil, take, distinctUntilChanged, Observable } from 'rxjs';
import { map, ReplaySubject, Subject, takeUntil, take } from 'rxjs';
import { environment } from 'src/environments/environment';
import { ConfirmService } from '../shared/confirm.service';
import { NotificationProgressEvent } from '../_models/events/notification-progress-event';
import { SiteTheme, ThemeProvider } from '../_models/preferences/site-theme';
import { AccountService } from './account.service';
import { TextResonse } from '../_types/text-response';
import { EVENTS, MessageHubService } from './message-hub.service';
@ -65,6 +65,14 @@ export class ThemeService implements OnDestroy {
return getComputedStyle(this.document.body).getPropertyValue('--color-scheme').trim();
}
/**
* --theme-color from theme. Updates the meta tag
* @returns
*/
getThemeColor() {
return getComputedStyle(this.document.body).getPropertyValue('--theme-color').trim();
}
getCssVariable(variable: string) {
return getComputedStyle(this.document.body).getPropertyValue(variable).trim();
}
@ -137,11 +145,23 @@ export class ThemeService implements OnDestroy {
this.setTheme('dark');
return;
}
const styleElem = document.createElement('style');
const styleElem = this.document.createElement('style');
styleElem.id = 'theme-' + theme.name;
styleElem.appendChild(this.document.createTextNode(content));
this.renderer.appendChild(this.document.head, styleElem);
// Check if the theme has --theme-color and apply it to meta tag
const themeColor = this.getThemeColor();
if (themeColor) {
this.document.querySelector('meta[name="theme-color"]')?.setAttribute('content', themeColor);
}
const colorScheme = this.getColorScheme();
if (themeColor) {
this.document.querySelector('body')?.setAttribute('theme', colorScheme);
}
this.currentThemeSource.next(theme);
});
} else {
@ -161,8 +181,7 @@ export class ThemeService implements OnDestroy {
}
private fetchThemeContent(themeId: number) {
// TODO: Refactor {responseType: 'text' as 'json'} into a type so i don't have to retype it
return this.httpClient.get<string>(this.baseUrl + 'theme/download-content?themeId=' + themeId, {responseType: 'text' as 'json'}).pipe(map(encodedCss => {
return this.httpClient.get<string>(this.baseUrl + 'theme/download-content?themeId=' + themeId, TextResonse).pipe(map(encodedCss => {
return this.domSantizer.sanitize(SecurityContext.STYLE, encodedCss);
}));
}

3
UI/Web/src/app/_services/upload.service.ts
View file

@ -1,6 +1,7 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { TextResonse } from '../_types/text-response';
@Injectable({
providedIn: 'root'
@ -13,7 +14,7 @@ export class UploadService {
uploadByUrl(url: string) {
return this.httpClient.post<string>(this.baseUrl + 'upload/upload-by-url', {url}, {responseType: 'text' as 'json'});
return this.httpClient.post<string>(this.baseUrl + 'upload/upload-by-url', {url}, TextResonse);
}
/**