mirror of
https://github.com/Poniverse/Pony.fm.git
synced 2024-11-24 22:18:00 +01:00
41 lines
2.3 KiB
HTML
41 lines
2.3 KiB
HTML
<div class="track-player" ng-show="player.isPlaying">
|
|
<ul class="buttons">
|
|
<li class="status">
|
|
<strong>{{player.currentTrack.progressSeconds | secondsDisplay}}</strong> /
|
|
<strong>{{player.currentTrack.duration | secondsDisplay}}</strong>
|
|
</li>
|
|
<li ng-class="{disabled: !player.canGoPrev}"><a pfm-eat-click ng-click="playPrev()" class="previous" href="#"><i class="fa fa-fast-backward"></i></a></li>
|
|
<li>
|
|
<a pfm-eat-click ng-click="playPause()" class="play" href="#">
|
|
<i class="fa fa-pause" ng-show="player.currentTrack.isPlaying"></i>
|
|
<i class="fa fa-play" ng-hide="player.currentTrack.isPlaying"></i>
|
|
</a>
|
|
</li>
|
|
<li ng-class="{disabled: !player.canGoNext}"><a pfm-eat-click ng-click="playNext()" class="next" href="#"><i class="fa fa-fast-forward"></i></a></li>
|
|
<li><a ng-class="{active: player.repeatState != 0}" pfm-eat-click ng-click="toggleRepeat()" class="repeat" href="#"><i class="fa fa-repeat"></i><span>{{ repeatText }}</span></a></li>
|
|
<li class="volume">
|
|
<a pfm-eat-click ng-click="" class="volume" href="#">
|
|
<i class="fa fa-volume-up"></i>
|
|
</a>
|
|
<div class="volume-slider">
|
|
<div class="bar"><a href="#" class="knob"> </a></div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<div class="image">
|
|
<div class="loader" ng-class="{showing: player.currentTrack.loadingProgress == 0}"><i class="fa fa-spin fa-rotate-right"></i></div>
|
|
<a colorbox ng-href="{{player.currentTrack.covers.original}}" pfm-eat-click>
|
|
<img pfm-src-loader="player.currentTrack.covers.thumbnail" pfm-src-size="thumbnail" />
|
|
</a>
|
|
</div>
|
|
<div class="inner">
|
|
<div class="title">
|
|
<span class="song"><a href="{{player.currentTrack.url}}">{{player.currentTrack.title}}</a></span>
|
|
<span class="artist"><a href="{{player.currentTrack.user.url}}">{{player.currentTrack.user.name}}</a></span>
|
|
</div>
|
|
<div class="transport" ng-click="seek($event)">
|
|
<div class="bar" pfm-progress-bar="player.currentTrack.progress"></div>
|
|
<div class="loader-bar" pfm-progress-bar="player.currentTrack.loadingProgress"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|