feat: chapter changing and manga scaling

This commit is contained in:
2024-07-07 22:18:13 +03:00
parent 8f5f12ad30
commit 29fb7fd04d
9 changed files with 209 additions and 39 deletions

View File

@@ -1,11 +1,22 @@
<h1>It's reader page</h1>
<div class="flex flex-row items-center justify-between me-4">
<button class="bg-slate-600 text-white rounded-lg p-3 m-4" (click)="backToTitle()">
Назад к тайтлу
</button>
<h3>{{ currentChapterInfo?.number }}. {{ currentChapterInfo?.name }}</h3>
</div>
<div class="flex flex-col items-center">
@if(pages.length > 0){
<img #mangaImage [alt]="cachedPages[currentPageIndex]?.slug" />
<div class="flex items-center justify-center space-x-4 mb-10">
<button (click)="prevPage()" [disabled]="currentPageIndex === 0" class="p-3 text-white bg-slate-600 w-[100px] mt-5 rounded-lg"></button>
<p>{{pages[currentPageIndex]?.slug}} / {{pages.length}}</p>
<button (click)="nextPage()" [disabled]="currentPageIndex === pages.length - 1" class="p-3 text-white bg-slate-600 w-[100px] mt-5 rounded-lg"></button>
</div>
}
</div>
@if (pages.length > 0 && cachedPages[currentPageIndex]) {
<div class="h-[70vh] w-[95vw]">
<app-scale-image [imageSrc]="imageUrl"></app-scale-image>
</div>
<div class="flex items-center justify-center space-x-4 my-10">
<button (click)="prevPage()" class="p-3 text-white bg-slate-600 w-[100px] rounded-lg">
</button>
<p>{{ pages[currentPageIndex].slug }} / {{ pages.length }}</p>
<button (click)="nextPage()" class="p-3 text-white bg-slate-600 w-[100px] rounded-lg">
</button>
</div>
}
</div>