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

Jump Bar Testing (#1302)

Browse source 
* Implemented a basic jump bar for the library view. This currently just interacts with existing pagination controls and is not inlined with infinite scroll yet. This is a first pass implementation.

* Refactored time estimates into the reading service.

* Cleaned up when the jump bar is shown to mimic pagination controls

* Cleanup up code in reader service.

* Scroll to card when selecting a jump key that is shown on the current page.

* Ensure estimated times always has the smaller number on left hand side.

* Fixed a bug with a missing vertical rule

* Fixed an off by 1 pixel for search overlay
This commit is contained in:
Joseph Milazzo 2022-05-30 16:50:12 -05:00 • committed by GitHub
parent 64c0b5a71e
commit 742cfd3293
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 319 additions and 120 deletions
Download patch file Download diff file Expand all files Collapse all files

1
UI/Web/src/app/library-detail/library-detail.component.html
View file

@ -24,6 +24,7 @@
[pagination]="pagination"
[filterSettings]="filterSettings"
[filterOpen]="filterOpen"
[jumpBarKeys]="jumpKeys"
(applyFilter)="updateFilter($event)"
(pageChange)="onPageChange($event)"
>

8
UI/Web/src/app/library-detail/library-detail.component.ts
View file

@ -18,6 +18,7 @@ import { SeriesService } from '../_services/series.service';
import { NavService } from '../_services/nav.service';
import { FilterUtilitiesService } from '../shared/_services/filter-utilities.service';
import { FilterSettings } from '../metadata-filter/filter-settings';
import { JumpKey } from '../_models/jumpbar/jump-key';
@Component({
selector: 'app-library-detail',
@ -39,6 +40,8 @@ export class LibraryDetailComponent implements OnInit, OnDestroy {
filterActive: boolean = false;
filterActiveCheck!: SeriesFilter;
jumpKeys: Array<JumpKey> = [];
tabs: Array<{title: string, fragment: string, icon: string}> = [
{title: 'Library', fragment: '', icon: 'fa-landmark'},
{title: 'Recommended', fragment: 'recomended', icon: 'fa-award'},
@ -100,6 +103,11 @@ export class LibraryDetailComponent implements OnInit, OnDestroy {
this.libraryName = names[this.libraryId];
this.titleService.setTitle('Kavita - ' + this.libraryName);
});
this.libraryService.getJumpBar(this.libraryId).subscribe(barDetails => {
console.log('JumpBar: ', barDetails);
this.jumpKeys = barDetails;
});
this.actions = this.actionFactoryService.getLibraryActions(this.handleAction.bind(this));
this.pagination = this.filterUtilityService.pagination(this.route.snapshot);