Merge branch 'develop' of https://github.com/Kareadita/Kavita into feature/comic-parser-enhancements
This commit is contained in:
Joseph Milazzo
commit
cf6195722a
60 changed files with 414 additions and 561 deletions
150
UI/Web/package-lock.json
generated
150
UI/Web/package-lock.json
generated
|
|
@ -2679,135 +2679,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"@sentry/angular": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/angular/-/angular-6.10.0.tgz",
|
||||
"integrity": "sha512-SSnsz4sVu9LJh7RM+z9FopWytl2yYNZQ2nK/zv/6iQKIBOqvnCqUIPjVjq1rFYXOe0jOJKsn0QlQLKp4MajYMg==",
|
||||
"requires": {
|
||||
"@sentry/browser": "6.10.0",
|
||||
"@sentry/types": "6.10.0",
|
||||
"@sentry/utils": "6.10.0",
|
||||
"rxjs": "^6.6.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/browser": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.10.0.tgz",
|
||||
"integrity": "sha512-H0Blgp8f8bomebkkGWIgxHVjabtQAlsKJDiFXBg7gIc75YcarRxwH0R3hMog1/h8mmv4CGGUsy5ljYW6jsNnvA==",
|
||||
"requires": {
|
||||
"@sentry/core": "6.10.0",
|
||||
"@sentry/types": "6.10.0",
|
||||
"@sentry/utils": "6.10.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/core": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.10.0.tgz",
|
||||
"integrity": "sha512-5KlxHJlbD7AMo+b9pMGkjxUOfMILtsqCtGgI7DMvZNfEkdohO8QgUY+hPqr540kmwArFS91ipQYWhqzGaOhM3Q==",
|
||||
"requires": {
|
||||
"@sentry/hub": "6.10.0",
|
||||
"@sentry/minimal": "6.10.0",
|
||||
"@sentry/types": "6.10.0",
|
||||
"@sentry/utils": "6.10.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/hub": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.10.0.tgz",
|
||||
"integrity": "sha512-MV8wjhWiFAXZAhmj7Ef5QdBr2IF93u8xXiIo2J+dRZ7eVa4/ZszoUiDbhUcl/TPxczaw4oW2a6tINBNFLzXiig==",
|
||||
"requires": {
|
||||
"@sentry/types": "6.10.0",
|
||||
"@sentry/utils": "6.10.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/integrations": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/integrations/-/integrations-6.10.0.tgz",
|
||||
"integrity": "sha512-NMtB0jjFYFZRxyjYu2dWLThk9YPIwqhi4hYywmWkbv4/ILzi5Rwnh+aqNW6yrj8qG4b9itNMh3YvEzmf0aqauw==",
|
||||
"requires": {
|
||||
"@sentry/types": "6.10.0",
|
||||
"@sentry/utils": "6.10.0",
|
||||
"localforage": "^1.8.1",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/minimal": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.10.0.tgz",
|
||||
"integrity": "sha512-yarm046UgUFIBoxqnBan2+BEgaO9KZCrLzsIsmALiQvpfW92K1lHurSawl5W6SR7wCYBnNn7CPvPE/BHFdy4YA==",
|
||||
"requires": {
|
||||
"@sentry/hub": "6.10.0",
|
||||
"@sentry/types": "6.10.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sentry/types": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.10.0.tgz",
|
||||
"integrity": "sha512-M7s0JFgG7/6/yNVYoPUbxzaXDhnzyIQYRRJJKRaTD77YO4MHvi4Ke8alBWqD5fer0cPIfcSkBqa9BLdqRqcMWw=="
|
||||
},
|
||||
"@sentry/utils": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.10.0.tgz",
|
||||
"integrity": "sha512-F9OczOcZMFtazYVZ6LfRIe65/eOfQbiAedIKS0li4npuMz0jKYRbxrjd/U7oLiNQkPAp4/BujU4m1ZIwq6a+tg==",
|
||||
"requires": {
|
||||
"@sentry/types": "6.10.0",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@sinonjs/commons": {
|
||||
"version": "1.8.2",
|
||||
"resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-1.8.2.tgz",
|
||||
|
|
@ -7521,7 +7392,8 @@
|
|||
"immediate": {
|
||||
"version": "3.0.6",
|
||||
"resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
|
||||
"integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
|
||||
"integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=",
|
||||
"dev": true
|
||||
},
|
||||
"import-fresh": {
|
||||
"version": "2.0.0",
|
||||
|
|
@ -10032,24 +9904,6 @@
|
|||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"localforage": {
|
||||
"version": "1.9.0",
|
||||
"resolved": "https://registry.npmjs.org/localforage/-/localforage-1.9.0.tgz",
|
||||
"integrity": "sha512-rR1oyNrKulpe+VM9cYmcFn6tsHuokyVHFaCM3+osEmxaHTbEk8oQu6eGDfS6DQLWi/N67XRmB8ECG37OES368g==",
|
||||
"requires": {
|
||||
"lie": "3.1.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"lie": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz",
|
||||
"integrity": "sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=",
|
||||
"requires": {
|
||||
"immediate": "~3.0.5"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"locate-path": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
|
||||
|
|
|
|||
|
|
@ -31,8 +31,6 @@
|
|||
"@ng-bootstrap/ng-bootstrap": "^9.1.0",
|
||||
"@ngx-lite/nav-drawer": "^0.4.6",
|
||||
"@ngx-lite/util": "0.0.0",
|
||||
"@sentry/angular": "^6.10.0",
|
||||
"@sentry/integrations": "^6.10.0",
|
||||
"@types/file-saver": "^2.0.1",
|
||||
"angular-ng-autocomplete": "^2.0.5",
|
||||
"bootstrap": "^4.5.0",
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import { map, takeUntil } from 'rxjs/operators';
|
|||
import { environment } from 'src/environments/environment';
|
||||
import { Preferences } from '../_models/preferences/preferences';
|
||||
import { User } from '../_models/user';
|
||||
import * as Sentry from "@sentry/angular";
|
||||
import { Router } from '@angular/router';
|
||||
import { MessageHubService } from './message-hub.service';
|
||||
|
||||
|
|
@ -63,12 +62,6 @@ export class AccountService implements OnDestroy {
|
|||
user.roles = [];
|
||||
const roles = this.getDecodedToken(user.token).role;
|
||||
Array.isArray(roles) ? user.roles = roles : user.roles.push(roles);
|
||||
Sentry.setContext('admin', {'admin': this.hasAdminRole(user)});
|
||||
Sentry.configureScope(scope => {
|
||||
scope.setUser({
|
||||
username: user.username
|
||||
});
|
||||
});
|
||||
|
||||
localStorage.setItem(this.userKey, JSON.stringify(user));
|
||||
localStorage.setItem(this.lastLoginKey, user.username);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import { EventEmitter, Injectable } from '@angular/core';
|
||||
import { HubConnection, HubConnectionBuilder } from '@microsoft/signalr';
|
||||
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { User } from '@sentry/angular';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { BehaviorSubject, ReplaySubject } from 'rxjs';
|
||||
import { environment } from 'src/environments/environment';
|
||||
|
|
@ -10,6 +9,7 @@ import { RefreshMetadataEvent } from '../_models/events/refresh-metadata-event';
|
|||
import { ScanLibraryProgressEvent } from '../_models/events/scan-library-progress-event';
|
||||
import { ScanSeriesEvent } from '../_models/events/scan-series-event';
|
||||
import { SeriesAddedEvent } from '../_models/events/series-added-event';
|
||||
import { User } from '../_models/user';
|
||||
|
||||
export enum EVENTS {
|
||||
UpdateAvailable = 'UpdateAvailable',
|
||||
|
|
|
|||
|
|
@ -7,4 +7,5 @@ export interface ServerSettings {
|
|||
allowStatCollection: boolean;
|
||||
enableOpds: boolean;
|
||||
enableAuthentication: boolean;
|
||||
baseUrl: string;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import { Component, OnDestroy, OnInit } from '@angular/core';
|
|||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { Subject } from 'rxjs';
|
||||
import { take, takeUntil, takeWhile } from 'rxjs/operators';
|
||||
import { take, takeUntil } from 'rxjs/operators';
|
||||
import { ConfirmService } from 'src/app/shared/confirm.service';
|
||||
import { ScanLibraryProgressEvent } from 'src/app/_models/events/scan-library-progress-event';
|
||||
import { Library, LibraryType } from 'src/app/_models/library';
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<div class="container-fluid">
|
||||
<form [formGroup]="settingsForm" *ngIf="serverSettings !== undefined">
|
||||
<p class="text-warning pt-2">Port and Logging Level require a manual restart of Kavita to take effect.</p>
|
||||
<p class="text-warning pt-2">Port, Base Url, and Logging Level require a manual restart of Kavita to take effect.</p>
|
||||
<div class="form-group">
|
||||
<label for="settings-cachedir">Cache Directory</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="cacheDirectoryTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #cacheDirectoryTooltip>Where the server place temporary files when reading. This will be cleaned up on a regular basis.</ng-template>
|
||||
|
|
@ -8,6 +8,13 @@
|
|||
<input readonly id="settings-cachedir" aria-describedby="settings-cachedir-help" class="form-control" formControlName="cacheDirectory" type="text">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="settings-baseurl">Base Url</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="baseUrlTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #baseUrlTooltip>Use this if you want to host Kavita on a base url ie) yourdomain.com/kavita</ng-template>
|
||||
<span class="sr-only" id="settings-baseurl-help">Use this if you want to host Kavita on a base url ie) yourdomain.com/kavita</span>
|
||||
<input id="settings-baseurl" aria-describedby="settings-baseurl-help" class="form-control" formControlName="baseUrl" type="text">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="settings-port">Port</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="portTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #portTooltip>Port the server listens on. This is fixed if you are running on Docker. Requires restart to take effect.</ng-template>
|
||||
|
|
|
|||
|
|
@ -37,6 +37,7 @@ export class ManageSettingsComponent implements OnInit {
|
|||
this.settingsForm.addControl('allowStatCollection', new FormControl(this.serverSettings.allowStatCollection, [Validators.required]));
|
||||
this.settingsForm.addControl('enableOpds', new FormControl(this.serverSettings.enableOpds, [Validators.required]));
|
||||
this.settingsForm.addControl('enableAuthentication', new FormControl(this.serverSettings.enableAuthentication, [Validators.required]));
|
||||
this.settingsForm.addControl('baseUrl', new FormControl(this.serverSettings.baseUrl, [Validators.required]));
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -49,6 +50,7 @@ export class ManageSettingsComponent implements OnInit {
|
|||
this.settingsForm.get('allowStatCollection')?.setValue(this.serverSettings.allowStatCollection);
|
||||
this.settingsForm.get('enableOpds')?.setValue(this.serverSettings.enableOpds);
|
||||
this.settingsForm.get('enableAuthentication')?.setValue(this.serverSettings.enableAuthentication);
|
||||
this.settingsForm.get('baseUrl')?.setValue(this.serverSettings.baseUrl);
|
||||
}
|
||||
|
||||
async saveSettings() {
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
import { BrowserModule, Title } from '@angular/platform-browser';
|
||||
import { APP_INITIALIZER, ErrorHandler, NgModule } from '@angular/core';
|
||||
import { APP_BASE_HREF } from '@angular/common';
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
|
||||
import { HttpClient, HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
|
||||
import { NgbCollapseModule, NgbDropdownModule, NgbNavModule, NgbPaginationModule, NgbRatingModule } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { NavHeaderComponent } from './nav-header/nav-header.component';
|
||||
import { JwtInterceptor } from './_interceptors/jwt.interceptor';
|
||||
|
|
@ -21,67 +22,15 @@ import { AutocompleteLibModule } from 'angular-ng-autocomplete';
|
|||
import { ReviewSeriesModalComponent } from './_modals/review-series-modal/review-series-modal.component';
|
||||
import { CarouselModule } from './carousel/carousel.module';
|
||||
|
||||
|
||||
import * as Sentry from '@sentry/angular';
|
||||
import { environment } from 'src/environments/environment';
|
||||
import { version } from 'package.json';
|
||||
import { Router } from '@angular/router';
|
||||
import { RewriteFrames as RewriteFramesIntegration } from '@sentry/integrations';
|
||||
import { Dedupe as DedupeIntegration } from '@sentry/integrations';
|
||||
import { PersonBadgeComponent } from './person-badge/person-badge.component';
|
||||
import { TypeaheadModule } from './typeahead/typeahead.module';
|
||||
import { RecentlyAddedComponent } from './recently-added/recently-added.component';
|
||||
import { InProgressComponent } from './in-progress/in-progress.component';
|
||||
import { DashboardComponent } from './dashboard/dashboard.component';
|
||||
import { CardsModule } from './cards/cards.module';
|
||||
import { CollectionsModule } from './collections/collections.module';
|
||||
import { InProgressComponent } from './in-progress/in-progress.component';
|
||||
import { SAVER, getSaver } from './shared/_providers/saver.provider';
|
||||
import { ReadingListModule } from './reading-list/reading-list.module';
|
||||
import { DashboardComponent } from './dashboard/dashboard.component';
|
||||
|
||||
let sentryProviders: any[] = [];
|
||||
|
||||
if (environment.production) {
|
||||
Sentry.init({
|
||||
dsn: 'https://db1a1f6445994b13a6f479512aecdd48@o641015.ingest.sentry.io/5757426',
|
||||
environment: environment.production ? 'prod' : 'dev',
|
||||
release: version,
|
||||
integrations: [
|
||||
new Sentry.Integrations.GlobalHandlers({
|
||||
onunhandledrejection: true,
|
||||
onerror: true
|
||||
}),
|
||||
new DedupeIntegration(),
|
||||
new RewriteFramesIntegration(),
|
||||
],
|
||||
ignoreErrors: [new RegExp(/\/api\/admin/)],
|
||||
tracesSampleRate: 0,
|
||||
});
|
||||
|
||||
Sentry.configureScope(scope => {
|
||||
scope.setUser({
|
||||
username: 'Not authorized'
|
||||
});
|
||||
scope.setTag('production', environment.production);
|
||||
scope.setTag('version', version);
|
||||
});
|
||||
|
||||
sentryProviders = [{
|
||||
provide: ErrorHandler,
|
||||
useValue: Sentry.createErrorHandler({
|
||||
showDialog: false,
|
||||
}),
|
||||
},
|
||||
{
|
||||
provide: Sentry.TraceService,
|
||||
deps: [Router],
|
||||
},
|
||||
{
|
||||
provide: APP_INITIALIZER,
|
||||
useFactory: () => () => {},
|
||||
deps: [Sentry.TraceService],
|
||||
multi: true,
|
||||
}];
|
||||
}
|
||||
import { SAVER, getSaver } from './shared/_providers/saver.provider';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
|
@ -134,7 +83,7 @@ if (environment.production) {
|
|||
{provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true},
|
||||
Title,
|
||||
{provide: SAVER, useFactory: getSaver},
|
||||
...sentryProviders,
|
||||
{ provide: APP_BASE_HREF, useValue: window['_app_base' as keyof Window] || '/' },
|
||||
],
|
||||
entryComponents: [],
|
||||
bootstrap: [AppComponent]
|
||||
|
|
|
|||
|
|
@ -58,17 +58,16 @@
|
|||
<button (click)="toggleClickToPaginate()" class="btn btn-icon" aria-labelledby="tap-pagination"><i class="fa fa-arrows-alt-h {{clickToPaginate ? 'icon-primary-color' : ''}}" aria-hidden="true"></i><span *ngIf="darkMode"> {{clickToPaginate ? 'On' : 'Off'}}</span></button>
|
||||
</div>
|
||||
<div class="row no-gutters justify-content-between">
|
||||
<button (click)="resetSettings()" class="btn btn-secondary col">Reset</button>
|
||||
<button (click)="saveSettings()" class="btn btn-primary col" style="margin-left:10px;">Save</button>
|
||||
<button (click)="resetSettings()" class="btn btn-secondary col">Reset to Defaults</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-gutters">
|
||||
<button class="btn btn-small btn-icon col-1" [disabled]="prevChapterDisabled" (click)="loadPrevChapter()" title="Prev Chapter/Volume"><i class="fa fa-fast-backward" aria-hidden="true"></i></button>
|
||||
<div class="col-1" style="margin-top: 6px">{{pageNum}}</div>
|
||||
<div class="col-8" style="margin-top: 15px">
|
||||
<div class="col-1 page-stub">{{pageNum}}</div>
|
||||
<div class="col-8" style="margin-top: 15px;padding-right:10px">
|
||||
<ngb-progressbar style="cursor: pointer" title="Go to page" (click)="goToPage()" type="primary" height="5px" [value]="pageNum" [max]="maxPages - 1"></ngb-progressbar>
|
||||
</div>
|
||||
<div class="col-1 btn-icon" style="margin-top: 6px" (click)="goToPage(maxPages - 1)" title="Go to last page">{{maxPages - 1}}</div>
|
||||
<div class="col-1 btn-icon page-stub" (click)="goToPage(maxPages - 1)" title="Go to last page">{{maxPages - 1}}</div>
|
||||
<button class="btn btn-small btn-icon col-1" [disabled]="nextChapterDisabled" (click)="loadNextChapter()" title="Next Chapter/Volume"><i class="fa fa-fast-forward" aria-hidden="true"></i></button>
|
||||
</div>
|
||||
<div class="table-of-contents">
|
||||
|
|
@ -100,15 +99,6 @@
|
|||
</app-drawer>
|
||||
</div>
|
||||
|
||||
<!-- This pushes down the page. Need to overlay
|
||||
<ng-container *ngIf="isLoading">
|
||||
<div class="d-flex justify-content-center m-5">
|
||||
<div class="spinner-border text-secondary loading" role="status">
|
||||
<span class="invisible">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container> -->
|
||||
|
||||
<div #readingSection class="reading-section" [ngStyle]="{'padding-top': topOffset + 20 + 'px'}" [@isLoading]="isLoading ? true : false" (click)="handleReaderClick($event)">
|
||||
<div #readingHtml [innerHtml]="page" *ngIf="page !== undefined"></div>
|
||||
|
||||
|
|
@ -138,7 +128,7 @@
|
|||
[disabled]="IsNextDisabled"
|
||||
(click)="nextPage()" title="{{readingDirection === ReadingDirection.LeftToRight ? 'Next' : 'Previous'}} Page">
|
||||
<span class="phone-hidden">{{readingDirection === ReadingDirection.LeftToRight ? 'Next' : 'Previous'}} </span>
|
||||
<i class="fa {{(readingDirection === ReadingDirection.LeftToRight ? pageNum + 1 >= maxPages - 1 : pageNum === 0) ? 'fa-angle-double-right' : 'fa-angle-right'}}" aria-hidden="true"></i>
|
||||
<i class="fa {{(readingDirection === ReadingDirection.LeftToRight ? pageNum + 1 > maxPages - 1 : pageNum === 0) ? 'fa-angle-double-right' : 'fa-angle-right'}}" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@
|
|||
src: url(../../../assets/fonts/RocknRoll_One/RocknRollOne-Regular.ttf) format("truetype");
|
||||
}
|
||||
|
||||
$dark-form-background-no-opacity: rgb(1, 4, 9);
|
||||
$primary-color: #0062cc;
|
||||
|
||||
.control-container {
|
||||
|
|
@ -42,6 +43,11 @@ $primary-color: #0062cc;
|
|||
}
|
||||
}
|
||||
|
||||
.page-stub {
|
||||
margin-top: 6px;
|
||||
padding-left: 2px;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
|
||||
|
|
@ -73,60 +79,12 @@ $primary-color: #0062cc;
|
|||
color: #8db2e5 !important;
|
||||
}
|
||||
|
||||
// Coppied
|
||||
// html, body {
|
||||
// color: #dcdcdc !important;
|
||||
// background-image: none !important;
|
||||
// background-color: #292929 !important;
|
||||
// }
|
||||
|
||||
// html::before, body::before {
|
||||
// background-image: none !important;
|
||||
// }
|
||||
|
||||
// html *:not(input) {color: #dcdcdc !important}
|
||||
// html * {background-color: rgb(41, 41, 41, 0.90) !important}
|
||||
|
||||
// html *, html *[id], html *[class] {
|
||||
// box-shadow: none !important;
|
||||
// text-shadow: none !important;
|
||||
// border-radius: unset !important;
|
||||
// border-color: #555555 !important;
|
||||
// outline-color: #555555 !important;
|
||||
// }
|
||||
|
||||
img, img[src] {
|
||||
img, img[src] {
|
||||
z-index: 1;
|
||||
filter: brightness(0.85) !important;
|
||||
background-color: initial !important;
|
||||
}
|
||||
}
|
||||
|
||||
// video, video[src] {
|
||||
// z-index: 1;
|
||||
// background-color: transparent !important;
|
||||
// }
|
||||
|
||||
// input:not([type='button']):not([type='submit']) {
|
||||
// color: #dcdcdc !important;
|
||||
// background-image: none !important;
|
||||
// background-color: #333333 !important;
|
||||
// }
|
||||
|
||||
// textarea, textarea[class], input[type='text'], input[type='text'][class] {
|
||||
// color: #dcdcdc !important;
|
||||
// background-color: #555555 !important;
|
||||
// }
|
||||
|
||||
// svg:not([fill]) {fill: #7d7d7d !important}
|
||||
// li, select {background-image: none !important}
|
||||
// input[type='text'], input[type='search'] {text-indent: 10px}
|
||||
// a {background-color: rgba(255, 255, 255, 0.01) !important}
|
||||
// html cite, html cite *, html cite *[class] {color: #029833 !important}
|
||||
// svg[fill], button, input[type='button'], input[type='submit'] {opacity: 0.85 !important}
|
||||
|
||||
// :before {color: #dcdcdc !important}
|
||||
// :link:not(cite), :link *:not(cite) {color: #8db2e5 !important}
|
||||
// :visited, :visited *, :visited *[class] {color: rgb(211, 138, 138) !important}
|
||||
:visited, :visited *, :visited *[class] {color: rgb(211, 138, 138) !important}
|
||||
:link:not(cite), :link *:not(cite) {color: #8db2e5 !important}
|
||||
}
|
||||
|
|
@ -136,6 +94,21 @@ $primary-color: #0062cc;
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
.reading-bar, .book-title, .drawer-body, .drawer-container {
|
||||
background-color: $dark-form-background-no-opacity;
|
||||
}
|
||||
button {
|
||||
background-color: $dark-form-background-no-opacity;
|
||||
}
|
||||
}
|
||||
|
||||
::ng-deep .dark-mode .drawer-container {
|
||||
.header, body, *:not(.progress-bar) {
|
||||
background-color: $dark-form-background-no-opacity !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 875px) {
|
||||
.book-title {
|
||||
display: none;
|
||||
|
|
|
|||
|
|
@ -14,11 +14,10 @@ import { SeriesService } from 'src/app/_services/series.service';
|
|||
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
|
||||
|
||||
import { BookService } from '../book.service';
|
||||
import { KEY_CODES } from 'src/app/shared/_services/utility.service';
|
||||
import { KEY_CODES, UtilityService } from 'src/app/shared/_services/utility.service';
|
||||
import { BookChapterItem } from '../_models/book-chapter-item';
|
||||
import { animate, state, style, transition, trigger } from '@angular/animations';
|
||||
import { Stack } from 'src/app/shared/data-structures/stack';
|
||||
import { Preferences } from 'src/app/_models/preferences/preferences';
|
||||
import { MemberService } from 'src/app/_services/member.service';
|
||||
import { ReadingDirection } from 'src/app/_models/preferences/reading-direction';
|
||||
import { ScrollService } from 'src/app/scroll.service';
|
||||
|
|
@ -166,7 +165,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
|
||||
pageAnchors: {[n: string]: number } = {};
|
||||
currentPageAnchor: string = '';
|
||||
intersectionObserver: IntersectionObserver = new IntersectionObserver((entries) => this.handleIntersection(entries), { threshold: [1] });
|
||||
/**
|
||||
* Last seen progress part path
|
||||
*/
|
||||
|
|
@ -186,10 +184,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
color: #e83e8c !important;
|
||||
}
|
||||
|
||||
// .btn-icon {
|
||||
// background-color: transparent;
|
||||
// }
|
||||
|
||||
:link, a {
|
||||
color: #8db2e5 !important;
|
||||
}
|
||||
|
|
@ -205,25 +199,31 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
return ReadingDirection;
|
||||
}
|
||||
|
||||
get IsPrevDisabled() {
|
||||
get IsPrevDisabled(): boolean {
|
||||
if (this.readingDirection === ReadingDirection.LeftToRight) {
|
||||
// Acting as Previous button
|
||||
return this.prevPageDisabled && this.pageNum === 0;
|
||||
}
|
||||
return this.nextPageDisabled && this.pageNum + 1 >= this.maxPages - 1;
|
||||
} else {
|
||||
// Acting as a Next button
|
||||
return this.nextPageDisabled && this.pageNum + 1 > this.maxPages - 1;
|
||||
}
|
||||
}
|
||||
|
||||
get IsNextDisabled() {
|
||||
get IsNextDisabled(): boolean {
|
||||
if (this.readingDirection === ReadingDirection.LeftToRight) {
|
||||
this.nextPageDisabled && this.pageNum + 1 >= this.maxPages - 1;
|
||||
// Acting as Next button
|
||||
return this.nextPageDisabled && this.pageNum + 1 > this.maxPages - 1;
|
||||
} else {
|
||||
// Acting as Previous button
|
||||
return this.prevPageDisabled && this.pageNum === 0;
|
||||
}
|
||||
return this.prevPageDisabled && this.pageNum === 0;
|
||||
}
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router, private accountService: AccountService,
|
||||
private seriesService: SeriesService, private readerService: ReaderService, private location: Location,
|
||||
private renderer: Renderer2, private navService: NavService, private toastr: ToastrService,
|
||||
private domSanitizer: DomSanitizer, private bookService: BookService, private memberService: MemberService,
|
||||
private scrollService: ScrollService) {
|
||||
private scrollService: ScrollService, private utilityService: UtilityService) {
|
||||
this.navService.hideNavBar();
|
||||
|
||||
this.darkModeStyleElem = this.renderer.createElement('style');
|
||||
|
|
@ -296,6 +296,36 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// Find the element that is on screen to bookmark against
|
||||
const intersectingEntries = Array.from(this.readingSectionElemRef.nativeElement.querySelectorAll('div,o,p,ul,li,a,img,h1,h2,h3,h4,h5,h6,span'))
|
||||
.filter(element => !element.classList.contains('no-observe'))
|
||||
.filter(entry => {
|
||||
return this.utilityService.isInViewport(entry, this.topOffset);
|
||||
});
|
||||
|
||||
intersectingEntries.sort((a: Element, b: Element) => {
|
||||
const aTop = a.getBoundingClientRect().top;
|
||||
const bTop = b.getBoundingClientRect().top;
|
||||
if (aTop < bTop) {
|
||||
return -1;
|
||||
}
|
||||
if (aTop > bTop) {
|
||||
return 1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
});
|
||||
|
||||
if (intersectingEntries.length > 0) {
|
||||
let path = this.getXPathTo(intersectingEntries[0]);
|
||||
if (path === '') { return; }
|
||||
if (!path.startsWith('id')) {
|
||||
path = '//html[1]/' + path;
|
||||
}
|
||||
this.lastSeenScrollPartPath = path;
|
||||
}
|
||||
|
||||
if (this.lastSeenScrollPartPath !== '' && !this.incognitoMode) {
|
||||
this.readerService.saveProgress(this.seriesId, this.volumeId, this.chapterId, this.pageNum, this.lastSeenScrollPartPath).pipe(take(1)).subscribe(() => {/* No operation */});
|
||||
}
|
||||
|
|
@ -326,7 +356,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
|
||||
this.onDestroy.next();
|
||||
this.onDestroy.complete();
|
||||
this.intersectionObserver.disconnect();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
|
@ -443,12 +472,8 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
}
|
||||
|
||||
handleIntersection(entries: IntersectionObserverEntry[]) {
|
||||
let intersectingEntries = Array.from(entries)
|
||||
.filter(entry => entry.isIntersecting)
|
||||
.map(entry => entry.target)
|
||||
intersectingEntries.sort((a: Element, b: Element) => {
|
||||
const aTop = a.getBoundingClientRect().top;
|
||||
sortElements(a: Element, b: Element) {
|
||||
const aTop = a.getBoundingClientRect().top;
|
||||
const bTop = b.getBoundingClientRect().top;
|
||||
if (aTop < bTop) {
|
||||
return -1;
|
||||
|
|
@ -458,17 +483,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
return 0;
|
||||
});
|
||||
|
||||
|
||||
if (intersectingEntries.length > 0) {
|
||||
let path = this.getXPathTo(intersectingEntries[0]);
|
||||
if (path === '') { return; }
|
||||
if (!path.startsWith('id')) {
|
||||
path = '//html[1]/' + path;
|
||||
}
|
||||
this.lastSeenScrollPartPath = path;
|
||||
}
|
||||
}
|
||||
|
||||
loadNextChapter() {
|
||||
|
|
@ -541,16 +555,13 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
}
|
||||
|
||||
resetSettings(afterSave: boolean = false) {
|
||||
resetSettings() {
|
||||
const windowWidth = window.innerWidth
|
||||
|| document.documentElement.clientWidth
|
||||
|| document.body.clientWidth;
|
||||
|
||||
let margin = '15%';
|
||||
if (windowWidth <= 700) {
|
||||
if (afterSave && this.user.preferences.bookReaderMargin !== 0) {
|
||||
this.toastr.info('Margin will be reset to 0% on mobile. You do not have to save for settings to take effect.');
|
||||
}
|
||||
margin = '0%';
|
||||
}
|
||||
if (this.user) {
|
||||
|
|
@ -558,11 +569,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
margin = this.user.preferences.bookReaderMargin + '%';
|
||||
}
|
||||
this.pageStyles = {'font-family': this.user.preferences.bookReaderFontFamily, 'font-size': this.user.preferences.bookReaderFontSize + '%', 'margin-left': margin, 'margin-right': margin, 'line-height': this.user.preferences.bookReaderLineSpacing + '%'};
|
||||
if (!afterSave) {
|
||||
if (this.user.preferences.siteDarkMode && !this.user.preferences.bookReaderDarkMode) {
|
||||
this.user.preferences.bookReaderDarkMode = true;
|
||||
}
|
||||
}
|
||||
|
||||
this.toggleDarkMode(this.user.preferences.bookReaderDarkMode);
|
||||
} else {
|
||||
|
|
@ -657,12 +663,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
setupPageAnchors() {
|
||||
this.readingSectionElemRef.nativeElement.querySelectorAll('div,o,p,ul,li,a,img,h1,h2,h3,h4,h5,h6,span').forEach(elem => {
|
||||
if (!elem.classList.contains('no-observe')) {
|
||||
this.intersectionObserver.observe(elem);
|
||||
}
|
||||
});
|
||||
|
||||
this.pageAnchors = {};
|
||||
this.currentPageAnchor = '';
|
||||
const ids = this.chapters.map(item => item.children).flat().filter(item => item.page === this.pageNum).map(item => item.part).filter(item => item.length > 0);
|
||||
|
|
@ -875,7 +875,7 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
getDarkModeBackgroundColor() {
|
||||
return this.darkMode ? '#292929' : '#fff';
|
||||
return this.darkMode ? '#010409' : '#fff';
|
||||
}
|
||||
|
||||
setOverrideStyles() {
|
||||
|
|
@ -896,33 +896,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
}
|
||||
|
||||
saveSettings() {
|
||||
if (this.user === undefined) return;
|
||||
const modelSettings = this.settingsForm.value;
|
||||
const data: Preferences = {
|
||||
readingDirection: this.user.preferences.readingDirection,
|
||||
scalingOption: this.user.preferences.scalingOption,
|
||||
pageSplitOption: this.user.preferences.pageSplitOption,
|
||||
autoCloseMenu: this.user.preferences.autoCloseMenu,
|
||||
readerMode: this.user.preferences.readerMode,
|
||||
bookReaderDarkMode: this.darkMode,
|
||||
bookReaderFontFamily: modelSettings.bookReaderFontFamily,
|
||||
bookReaderFontSize: parseInt(this.pageStyles['font-size'].substr(0, this.pageStyles['font-size'].length - 1), 10),
|
||||
bookReaderLineSpacing: parseInt(this.pageStyles['line-height'].replace('!important', '').trim(), 10),
|
||||
bookReaderMargin: parseInt(this.pageStyles['margin-left'].replace('%', '').replace('!important', '').trim(), 10),
|
||||
bookReaderTapToPaginate: this.clickToPaginate,
|
||||
bookReaderReadingDirection: this.readingDirection,
|
||||
siteDarkMode: this.user.preferences.siteDarkMode,
|
||||
};
|
||||
this.accountService.updatePreferences(data).pipe(take(1)).subscribe((updatedPrefs) => {
|
||||
this.toastr.success('User settings updated');
|
||||
if (this.user) {
|
||||
this.user.preferences = updatedPrefs;
|
||||
}
|
||||
this.resetSettings(true);
|
||||
});
|
||||
}
|
||||
|
||||
toggleDrawer() {
|
||||
this.topOffset = this.stickyTopElemRef.nativeElement?.offsetHeight;
|
||||
this.drawerOpen = !this.drawerOpen;
|
||||
|
|
|
|||
|
|
@ -205,7 +205,7 @@ export class InfiniteScrollerComponent implements OnInit, OnChanges, OnDestroy {
|
|||
return document.documentElement.offsetHeight + document.documentElement.scrollTop;
|
||||
}
|
||||
getScrollTop() {
|
||||
return document.documentElement.scrollTop
|
||||
return document.documentElement.scrollTop;
|
||||
}
|
||||
|
||||
checkIfShouldTriggerContinuousReader() {
|
||||
|
|
|
|||
|
|
@ -127,4 +127,14 @@ export class UtilityService {
|
|||
return Breakpoint.Desktop;
|
||||
}
|
||||
|
||||
isInViewport(element: Element, additionalTopOffset: number = 0) {
|
||||
const rect = element.getBoundingClientRect();
|
||||
return (
|
||||
rect.top >= additionalTopOffset &&
|
||||
rect.left >= 0 &&
|
||||
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
|
||||
rect.right <= (window.innerWidth || document.documentElement.clientWidth)
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,4 +40,9 @@
|
|||
<app-root></app-root>
|
||||
<noscript>Please enable JavaScript to continue using this application.</noscript>
|
||||
</body>
|
||||
<script>
|
||||
(function() {
|
||||
window['_app_base'] = '/' + window.location.pathname.split('/')[1];
|
||||
})();
|
||||
</script>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue