Hotfix Prep (#1211)

* Patched cover image change that somehow got missed

* Fixed a bug where clicking bottom action bar buttons on book reader wouldn't work correctly (would close drawer when trying to open)
This commit is contained in:
Joseph Milazzo 2022-04-08 07:52:23 -05:00 committed by GitHub
parent 932c3fe979
commit 0f678f7922
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 10 deletions

View File

@ -116,7 +116,7 @@
<div class="left {{clickOverlayClass('left')}} no-observe" (click)="prevPage()" *ngIf="clickToPaginate" tabindex="-1"></div>
<div class="{{scrollbarNeeded ? 'right-with-scrollbar' : 'right'}} {{clickOverlayClass('right')}} no-observe" (click)="nextPage()" *ngIf="clickToPaginate" tabindex="-1"></div>
<div *ngIf="page !== undefined && scrollbarNeeded">
<div *ngIf="page !== undefined && scrollbarNeeded" (click)="$event.stopPropagation();">
<ng-container [ngTemplateOutlet]="actionBar"></ng-container>
</div>
</div>
@ -130,7 +130,7 @@
<span class="d-none d-sm-block">&nbsp;{{readingDirection === ReadingDirection.LeftToRight ? 'Previous' : 'Next'}}</span>
</button>
<button *ngIf="!this.adhocPageHistory.isEmpty()" class="btn btn-outline-secondary btn-icon col-2 col-xs-1" (click)="goBack()" title="Go Back"><i class="fa fa-reply" aria-hidden="true"></i><span class="d-none d-sm-block">&nbsp;Go Back</span></button>
<button class="btn btn-secondary col-2 col-xs-1" (click)="toggleDrawer()"><i class="fa fa-bars" aria-hidden="true"></i><span class="d-none d-sm-block">Settings</span></button>
<button class="btn btn-secondary col-2 col-xs-1" (click)="toggleDrawer()"><i class="fa fa-bars" aria-hidden="true"></i><span class="d-none d-sm-block">Settings {{drawerOpen}}</span></button>
<div class="book-title col-2 d-none d-sm-block">
<ng-container *ngIf="isLoading; else showTitle">
<div class="spinner-border spinner-border-sm text-primary" style="border-radius: 50%;" role="status">
@ -138,7 +138,7 @@
</div>
</ng-container>
<ng-template #showTitle>
{{bookTitle}}
<span class="book-title-text">{{bookTitle}}</span>
<span *ngIf="incognitoMode" (click)="turnOffIncognito()" role="button" aria-label="Incognito mode is on. Toggle to turn off.">(<i class="fa fa-glasses" aria-hidden="true"></i><span class="visually-hidden">Incognito Mode</span>)</span>
</ng-template>
</div>

View File

@ -1,4 +1,4 @@
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { Component, EventEmitter, Inject, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { NgxFileDropEntry, FileSystemFileEntry } from 'ngx-file-drop';
import { fromEvent, Subject } from 'rxjs';
@ -7,6 +7,7 @@ import { ToastrService } from 'ngx-toastr';
import { ImageService } from 'src/app/_services/image.service';
import { KEY_CODES } from 'src/app/shared/_services/utility.service';
import { UploadService } from 'src/app/_services/upload.service';
import { DOCUMENT } from '@angular/common';
@Component({
selector: 'app-cover-image-chooser',
@ -42,7 +43,8 @@ export class CoverImageChooserComponent implements OnInit, OnDestroy {
mode: 'file' | 'url' | 'all' = 'all';
private readonly onDestroy = new Subject<void>();
constructor(public imageService: ImageService, private fb: FormBuilder, private toastr: ToastrService, private uploadService: UploadService) { }
constructor(public imageService: ImageService, private fb: FormBuilder, private toastr: ToastrService, private uploadService: UploadService,
@Inject(DOCUMENT) private document: Document) { }
ngOnInit(): void {
this.form = this.fb.group({
@ -84,7 +86,7 @@ export class CoverImageChooserComponent implements OnInit, OnDestroy {
const img = new Image();
img.crossOrigin = 'Anonymous';
img.src = this.imageService.getCoverUploadImage(filename);
img.onload = (e) => this.handleUrlImageAdd(e);
img.onload = (e) => this.handleUrlImageAdd(img);
img.onerror = (e) => {
this.toastr.error('The image could not be fetched due to server refusing request. Please download and upload from file instead.');
this.form.get('coverImageUrl')?.setValue('');
@ -97,6 +99,8 @@ export class CoverImageChooserComponent implements OnInit, OnDestroy {
changeMode(mode: 'url') {
this.mode = mode;
this.setupEnterHandler();
setTimeout(() => (this.document.querySelector('#load-image') as HTMLInputElement)?.focus(), 10);
}
public dropped(files: NgxFileDropEntry[]) {
@ -125,10 +129,8 @@ export class CoverImageChooserComponent implements OnInit, OnDestroy {
this.selectedBase64Url.emit(e.target.result);
}
handleUrlImageAdd(e: any) {
if (e.path === null || e.path.length === 0) return;
const url = this.getBase64Image(e.path[0]);
handleUrlImageAdd(img: HTMLImageElement) {
const url = this.getBase64Image(img);
this.imageUrls.push(url);
this.imageUrlsChange.emit(this.imageUrls);