mirror of
https://github.com/Poniverse/Pony.fm.git
synced 2024-11-23 13:37:59 +01:00
71 lines
3.7 KiB
HTML
71 lines
3.7 KiB
HTML
<div class="resource-details playlist-details">
|
|
<header layout="row" layout-xs="column">
|
|
<div class="blurred-background" style="background-image: url('{{playlist.covers.normal}}');"></div>
|
|
<div layout="row" layout-xs="column" flex>
|
|
<div flex="50" flex-xs="100" class="info">
|
|
<h1>{{::playlist.title}}</h1>
|
|
<h2>
|
|
curated by: <a ng-href="{{::playlist.user.url}}">{{::playlist.user.name}}</a>
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="buttons" layout="row" layout-align="end top" layout-align-xs="center center" flex="50" flex-xs="100">
|
|
<md-menu>
|
|
<md-button class="md-icon-button" aria-label="Download" ng-click="$mdOpenMenu($event)">
|
|
<md-tooltip md-direction="bottom" md-delay="200">Download</md-tooltip>
|
|
<md-icon>file_download</md-icon>
|
|
</md-button>
|
|
|
|
<md-menu-content>
|
|
<md-menu-item ng-repeat="format in ::playlist.formats" ng-hide="isInProgress">
|
|
<md-button target="_blank" ng-if="::!format.isCacheable" ng-href="{{::format.url}}">
|
|
{{::format.name}} ({{::format.size}})
|
|
</md-button>
|
|
<md-button ng-if="format.isCacheable" ng-click="getCachedPlaylist(playlist.id, format);" href="">
|
|
{{::format.name}} ({{::format.size}})
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
|
|
<pfm-favourite-button resource="::playlist" type="playlist"></pfm-favourite-button>
|
|
|
|
<md-button class="md-icon-button" aria-label="Share or embed" ng-click="share()">
|
|
<md-tooltip md-direction="bottom" md-delay="200">Share or embed</md-tooltip>
|
|
<md-icon>share</md-icon>
|
|
</md-button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="stretch-to-bottom details-columns">
|
|
<div class="right">
|
|
<img class="cover" pfm-src-loader="::playlist.covers.normal" pfm-src-size="normal" />
|
|
|
|
<div class="share-buttons" pfm-share-buttons>
|
|
<a class="tumblr" ng-href="{{::playlist.share.tumblrUrl}}" title="Share on Tumblr" style="display:inline-block; overflow:hidden; width:20px; height:20px; background:url('/images/tumblr-share.png') top left no-repeat transparent;"></a>
|
|
<div class="facebook fb-like" data-href="{{::playlist.url}}" data-width="450" data-layout="button_count" data-show-faces="true" data-send="false"></div>
|
|
<iframe class="twitter" allowtransparency="true" frameborder="0" scrolling="no" ng-src="{{::playlist.share.twitterUrl}}" style="width:130px; height:20px;"></iframe>
|
|
</div>
|
|
|
|
<ul class="stats">
|
|
<li>Created: <strong>{{::playlist.created_at | date:'medium'}}</strong></li>
|
|
<li>Views: <strong>{{::playlist.stats.views}}</strong></li>
|
|
<li>Downloads: <strong>{{::playlist.stats.downloads}}</strong></li>
|
|
<li>Favourites: <strong>{{::playlist.stats.favourites}}</strong></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="left">
|
|
<div class="description" ng-show="::playlist.description.length">
|
|
<h2>Description</h2>
|
|
<p marked="::playlist.description"></p>
|
|
</div>
|
|
|
|
<h2>Tracks</h2>
|
|
<pfm-tracks-list tracks="::playlist.tracks" playlist="::playlist"></pfm-tracks-list>
|
|
|
|
<pfm-comments type="playlist" resource="::playlist"></pfm-comments>
|
|
</div>
|
|
</div>
|
|
</div>
|