mirror of
https://github.com/zoriya/Kyoo.Angular.git
synced 2025-12-06 06:16:10 +00:00
49 lines
2.3 KiB
HTML
49 lines
2.3 KiB
HTML
<div class="root">
|
|
<div class="episodes" #scrollView
|
|
(scroll)="onScroll()" infinite-scroll (scrolled)="this.episodes?.loadNext(this.client)"
|
|
[horizontal]="true" [scrollWindow]="false">
|
|
<a *ngFor="let episode of this.episodes?.items; index as i;" draggable="false"
|
|
routerLink="/watch/{{episode.slug}}" href="/watch/{{episode.slug}}"
|
|
appLongPress (longPressed)="this.openMenu(i)"
|
|
class="episode" #itemsDom>
|
|
<button mat-icon-button class="moreBtn" tabindex="-1"
|
|
[style.display]="this.openedIndex === i ? 'block' : undefined"
|
|
[matMenuTriggerFor]="more" [matMenuTriggerData]="{episode: episode}"
|
|
(menuOpened)="this.openedIndex = i" (menuClosed)="this.openedIndex = undefined"
|
|
(click)="$event.stopImmediatePropagation(); $event.preventDefault();">
|
|
<mat-icon>more_vert</mat-icon>
|
|
</button>
|
|
<div>
|
|
<div matRipple class="img" [style.background-image]="sanitize(episode.thumbnail)">
|
|
<button mat-icon-button class="playBtn" tabindex="-1">
|
|
<mat-icon class="playIcon">play_circle_outline</mat-icon>
|
|
</button>
|
|
</div>
|
|
<ng-container *ngIf="displayShowTitle; else noTitle;">
|
|
<h6 *ngIf="episode.seasonNumber != 0; else elseBlock;" class="title">{{episode.show.title}} - S{{episode.seasonNumber}}:E{{episode.episodeNumber}}</h6>
|
|
<ng-template #elseBlock><h6 class="title">{{episode.show.title}}</h6></ng-template>
|
|
<p class="subtitle">{{episode.title}}</p>
|
|
</ng-container>
|
|
<ng-template #noTitle>
|
|
<h6 *ngIf="episode.seasonNumber != 0; else elseBlock;" class="title">S{{episode.seasonNumber}}:E{{episode.episodeNumber}} - {{episode.title}}</h6>
|
|
<ng-template #elseBlock><h6 class="title">{{episode.title}}</h6></ng-template>
|
|
<p class="overview">{{episode.overview}}</p>
|
|
</ng-template>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<mat-menu #more="matMenu">
|
|
<ng-template matMenuContent let-episode="episode">
|
|
<a [href]="'/video/' + episode.slug" download><button mat-menu-item>Download episode</button></a>
|
|
</ng-template>
|
|
</mat-menu>
|
|
|
|
<button mat-raised-button color="accent" class="scrollBtn leftBtn d-none" #leftBtn (click)="scrollLeft()">
|
|
<mat-icon>arrow_left</mat-icon>
|
|
</button>
|
|
<button mat-raised-button color="accent" class="scrollBtn rightBtn" #rightBtn (click)="scrollRight()">
|
|
<mat-icon>arrow_right</mat-icon>
|
|
</button>
|
|
</div>
|