dizquetv/web/public/views/guide.html

88 lines
4.5 KiB
HTML

<div class='container-fluid'>
<h5>
{{title}}
</h5>
<div style='padding:0; position:relative'>
<table class="table tvguide" style="{'column-width': colspanPercent + '%' }">
<tr>
<th colspan="{{channelColspan}}" class='guidenav even' >
<button class="btn btn-sm btn-primary" ng-click="zoomIn()" ng-disabled='!zoomInEnabled()'>
<i class="fa fa-search-plus"></i>
</button>
<button class="btn btn-sm btn-primary" ng-click="zoomOut()" ng-disabled='!zoomOutEnabled()'>
<i class="fa fa-search-minus"></i>
</button>
<button class="btn btn-sm btn-primary" ng-click="back()" ng-disabled='!backEnabled()'>
<i class="fa fa-arrow-left"></i>
</button>
<button class="btn btn-sm btn-primary" ng-click="next()" ng-disabled='!nextEnabled()'>
<i class="fa fa-arrow-right"></i>
</button>
</th>
<th class="hour" ng-Class="{'even' : ($index % 2==1), 'odd' : ($index % 2==0) }" ng-repeat="time in times track by $index" colspan="{{time.duration}}">
{{time.label}}
</th>
</tr>
<tr ng-mouseover="channels[channelNumber].mouse=true" ng-mouseleave="channels[channelNumber].mouse=false" ng-repeat="channelNumber in channelNumbers track by $index" ng-Class="{'even' : ($index % 2==0), 'odd' : ($index % 2==1) }" >
<td title='{{channels[channelNumber].altTitle}}' class='even channel-number' colspan="{{channelNumberColspan}}" >
<div>
<a role="button" href='/media-player/{{channelNumber}}.m3u' title="Attempt to play channel: '{{channels[channelNumber].altTitle}}' in local media player" class='btn btn-sm btn-outline-primary play-channel' ng-show='channels[channelNumber].mouse'>
<span class='fa fa-play'></span>
</a>
<span ng-hide='channels[channelNumber].mouse' >
{{channels[channelNumber].number}}
</span>
</div>
</td>
<td title='{{channels[channelNumber].altTitle}}' class='even channel-icon' colspan="{{channelIconColspan}}" >
<img src='{{channels[channelNumber].icon}}' alt='{{channels[channelNumber].name}}' ng-click='channels[channelNumber].mouse=true' ></img>
</td>
<td class='odd program' colspan="{{totalSpan}}" ng-if="channels[channelNumber].loading">
<div class='loader'></div>
</td>
<td ng-repeat="program in channels[channelNumber].programs track by $index" colspan="{{program.duration}}"
title="{{program.altTitle}}"
ng-Class="{'program' : true, 'program-with-end' : program.end, 'program-with-start' : program.start, 'even' : ($index % 2==1), 'odd' : ($index % 2==0) }"
ng-if="! channels[channelNumber].loading"
>
<div class='show-title'>
{{program.showTitle}}
</div>
<div class='sub-title'>
{{program.subTitle}} <span class='episodeTitle'>{{program.episodeTitle}}</span>
</div>
</td>
</tr>
<tr>
<th colspan="{{channelColspan}}" class='guidenav even' >
<button class="btn btn-sm btn-primary" ng-click="zoomIn()" ng-disabled='!zoomInEnabled()'>
<span class="fa fa-search-plus"></span>
</button>
<button class="btn btn-sm btn-primary" ng-click="zoomOut()" ng-disabled='!zoomOutEnabled()'>
<span class="fa fa-search-minus"></span>
</button>
<button class="btn btn-sm btn-primary" ng-click="back()" ng-disabled='!backEnabled()'>
<span class="fa fa-arrow-left"></span>
</button>
<button class="btn btn-sm btn-primary" ng-click="next()" ng-disabled='!nextEnabled()'>
<span class="fa fa-arrow-right"></span>
</button>
</th>
<th class="hour" ng-Class="{'even' : ($index % 2==1), 'odd' : ($index % 2==0) }" ng-repeat="time in times track by $index" colspan="{{time.duration}}">
{{time.label}}
</th>
</tr>
</table>
<div class="tv-guide-now" ng-style="{'left': nowPosition + '%'}" ng-show='showNow' ></div>
</div>
</div>