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

Cleaned up file to use conditional labelling rather than conditional html fragments

Browse source
This commit is contained in:
Joseph Milazzo 2021-10-04 17:28:48 -05:00
parent 0c42714ab7
commit 0e6fc7eb48
1 changed files with 7 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

28
UI/Web/src/app/cards/_modals/card-details-modal/card-details-modal.component.html
View file

@ -3,7 +3,8 @@
<h4 *ngIf="libraryType !== LibraryType.Comic else comicHeader" class="modal-title" id="modal-basic-title"> <h4 *ngIf="libraryType !== LibraryType.Comic else comicHeader" class="modal-title" id="modal-basic-title">
{{parentName}} - {{data.number != 0 ? (isChapter ? 'Chapter ' : 'Volume ') + data.number : 'Special'}} Details</h4> {{parentName}} - {{data.number != 0 ? (isChapter ? 'Chapter ' : 'Volume ') + data.number : 'Special'}} Details</h4>
<ng-template #comicHeader><h4 class="modal-title" id="modal-basic-title"> <ng-template #comicHeader><h4 class="modal-title" id="modal-basic-title">
{{parentName}} - {{data.number != 0 ? (isChapter ? 'Issue #' : 'Volume ') + data.number : 'Special'}} Details</h4></ng-template> {{parentName}} - {{data.number != 0 ? (isChapter ? 'Issue #' : 'Volume ') + data.number : 'Special'}} Details</h4>
</ng-template>
<button type="button" class="close" aria-label="Close" (click)="close()"> <button type="button" class="close" aria-label="Close" (click)="close()">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
@ -29,34 +30,19 @@
</div> </div>
</ng-container> </ng-container>
<h4 *ngIf="!utilityService.isChapter(data)"> <h4 *ngIf="!utilityService.isChapter(data)">{{libraryType !== LibraryType.Comic ? 'Chapters' : 'Issues'}}</h4>
<span *ngIf="libraryType !== LibraryType.Comic; else comicName">Chapters</span>
<ng-template #comicName><span>Issues</span>
</ng-template>
</h4>
<ul class="list-unstyled"> <ul class="list-unstyled">
<li class="media my-4" *ngFor="let chapter of chapters"> <li class="media my-4" *ngFor="let chapter of chapters">
<a (click)="readChapter(chapter)" href="javascript:void(0);" *ngIf="libraryType !== LibraryType.Comic; else comicLink" title="Read Chapter {{chapter.number}}"> <a (click)="readChapter(chapter)" href="javascript:void(0);" title="Read {{libraryType !== LibraryType.Comic ? 'Chapter ' : 'Issue #'}} {{chapter.number}}">
<img class="mr-3" style="width: 74px" [src]="chapter.coverImage"> <img class="mr-3" style="width: 74px" [src]="chapter.coverImage">
</a> </a>
<ng-template #comicLink>
<a (click)="readChapter(chapter)" href="javascript:void(0);" title="Read Issue #{{chapter.number}}">
<img class="mr-3" style="width: 74px" [src]="chapter.coverImage">
</a>
</ng-template>
<div class="media-body"> <div class="media-body">
<h5 class="mt-0 mb-1"> <h5 class="mt-0 mb-1">
<span *ngIf="chapter.number !== '0'; else specialHeader"> <span *ngIf="chapter.number !== '0'; else specialHeader">
<span *ngIf="libraryType !== LibraryType.Comic; else comicAction" class=""> <span >
<app-card-actionables (actionHandler)="performAction($event, chapter)" [actions]="chapterActions" [labelBy]="'Chapter' + formatChapterNumber(chapter)"></app-card-actionables>&nbsp; <app-card-actionables (actionHandler)="performAction($event, chapter)" [actions]="chapterActions" [labelBy]="libraryType !== LibraryType.Comic ? 'Chapter ' : 'Issue #' + formatChapterNumber(chapter)"></app-card-actionables>&nbsp;
Chapter {{formatChapterNumber(chapter)}} {{libraryType !== LibraryType.Comic ? 'Chapter' : 'Issue #' }} {{formatChapterNumber(chapter)}}
</span> </span>
<ng-template #comicAction>
<span class="">
<app-card-actionables (actionHandler)="performAction($event, chapter)" [actions]="chapterActions" [labelBy]="'Chapter' + formatChapterNumber(chapter)"></app-card-actionables>&nbsp;
Issue #{{formatChapterNumber(chapter)}}
</span>
</ng-template>
<span class="badge badge-primary badge-pill"> <span class="badge badge-primary badge-pill">
<span *ngIf="chapter.pagesRead > 0 && chapter.pagesRead < chapter.pages">{{chapter.pagesRead}} / {{chapter.pages}}</span> <span *ngIf="chapter.pagesRead > 0 && chapter.pagesRead < chapter.pages">{{chapter.pagesRead}} / {{chapter.pages}}</span>
<span *ngIf="chapter.pagesRead === 0">UNREAD</span> <span *ngIf="chapter.pagesRead === 0">UNREAD</span>