mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-13 04:26:16 -08:00
83 lines
2.6 KiB
HTML
83 lines
2.6 KiB
HTML
<mat-drawer-container class="main-container" (backdropClick)="close()">
|
|
<!-- sidebar content -->
|
|
<mat-drawer
|
|
#drawer
|
|
mode="side"
|
|
opened
|
|
(keydown.escape)="close()"
|
|
disableClose
|
|
>
|
|
<ng-container *ngIf="channels$ | async as channels">
|
|
<app-channel-list-container [channelList]="channels">
|
|
</app-channel-list-container>
|
|
</ng-container>
|
|
</mat-drawer>
|
|
|
|
<mat-drawer-content>
|
|
<ng-container *ngIf="activeChannel$ | async as activeChannel">
|
|
<!-- toolbar with drawer icon -->
|
|
<mat-toolbar color="primary">
|
|
<button
|
|
mat-icon-button
|
|
(click)="drawer.toggle()"
|
|
matTooltip="Open channels list"
|
|
>
|
|
<mat-icon>menu</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="addToFavorites(activeChannel)"
|
|
matTooltip="Toggle favorite flag"
|
|
>
|
|
<mat-icon>
|
|
{{
|
|
(favorites$ | async).includes(activeChannel.id)
|
|
? 'star'
|
|
: 'star_outline'
|
|
}}</mat-icon
|
|
>
|
|
</button>
|
|
{{ activeChannel.name }}
|
|
<div class="spacer"></div>
|
|
<button
|
|
*ngIf="epgAvailable$ | async"
|
|
mat-button
|
|
(click)="drawerRight.toggle()"
|
|
matTooltip="Open EPG list"
|
|
>
|
|
EPG
|
|
</button>
|
|
</mat-toolbar>
|
|
|
|
<!-- video.js player -->
|
|
<app-vjs-player
|
|
*ngIf="player === 'videojs'"
|
|
[options]="{
|
|
sources: [
|
|
{
|
|
src: activeChannel.url + activeChannel.epgParams,
|
|
type: 'application/x-mpegURL'
|
|
}
|
|
]
|
|
}"
|
|
></app-vjs-player>
|
|
</ng-container>
|
|
<!-- default html player component -->
|
|
<app-html-video-player
|
|
*ngIf="player === 'html5'"
|
|
[channel]="activeChannel$ | async"
|
|
>
|
|
</app-html-video-player>
|
|
</mat-drawer-content>
|
|
<!-- right sidebar content -->
|
|
<mat-drawer
|
|
position="end"
|
|
#drawerRight
|
|
mode="side"
|
|
(keydown.escape)="close()"
|
|
disableClose
|
|
>
|
|
<app-epg-list></app-epg-list>
|
|
</mat-drawer>
|
|
</mat-drawer-container>
|