Files
iptvnator/src/app/player/components/video-player/video-player.component.html
T
2021-02-20 11:52:21 +01:00

83 lines
2.7 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]="'TOP_MENU.OPEN_CHANNELS_LIST' | translate"
>
<mat-icon>menu</mat-icon>
</button>
<button
mat-icon-button
(click)="addToFavorites(activeChannel)"
[matTooltip]="'TOP_MENU.TOGGLE_FAVORITE_FLAG' | translate"
>
<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]="'TOP_MENU.OPEN_EPG_LIST' | translate"
>
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>