Pony.fm/public/templates/directives/tracks-list.html
2016-08-29 23:02:14 +01:00

41 lines
2.4 KiB
HTML

<ul class="tracks-listing {{::class}}">
<li ng-repeat="track in tracks track by track.id" ng-class="{'can-favourite': auth.isLogged, 'is-favourited': auth.isLogged && track.user_data.is_favourited, 'is-playing': track.isPlaying, 'has-played': auth.isLogged && track.user_data.views}">
<div class="image">
<a href="#" class="play-button" pfm-eat-click ng-click="play(track)">
<i class="fa fa-play" ng-if="!track.isPlaying"></i>
<i class="fa fa-pause" ng-if="track.isPlaying"></i>
</a>
<img pfm-src-loader="track.covers.thumbnail" pfm-src-size="thumbnail" />
</div>
<div class="icons">
<span><i ng-class="::{'fa fa-microphone-slash': !track.is_vocal, 'fa fa-microphone': track.is_vocal}"></i></span>
<a pfm-eat-click class="icon-favourite" href="#" ng-click="toggleFavourite(track)" ng-if="::auth.isLogged">
<i class="fa fa-star-o"></i>
</a>
<a pfm-eat-click href="#" ng-click="removeFromPlaylist(track)" ng-if="::canModifyPlaylist()">
<i class="fa fa-trash"></i>
</a>
</div>
<a class="info" ng-href="{{::track.url}}" ng-if="!clickOverride">
<span class="title">{{::track.title}}</span>
<span class="stats" title="{{::track.stats.favourites}} Favourites / {{:: track.stats.comments}} Comments / {{::track.stats.plays}} Plays">
<strong>{{::track.stats.favourites}}</strong>f
<strong>{{::track.stats.comments}}</strong>c
<strong>{{::track.stats.plays}}</strong>p
</span>
<span class="artist">{{::track.user.name}} / {{::track.genre.name}}</span>
</a>
<a class="info" ng-if="clickOverride" href="#" ng-click="clickOverride({id: track.id})">
<span class="title">{{::track.title}}</span>
<span class="stats" title="{{::track.stats.favourites}} Favourites / {{:: track.stats.comments}} Comments / {{::track.stats.plays}} Plays">
<strong>{{::track.stats.favourites}}</strong>f
<strong>{{::track.stats.comments}}</strong>c
<strong>{{::track.stats.plays}}</strong>p
</span>
<span class="artist">{{::track.user.name}} / {{::track.genre.name}}</span>
</a>
</li>
<li ng-if="!tracks.length" class="empty">
No tracks found&hellip;
</li>
</ul>