maxenceg2m/iTunes
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

Stats for Album

Browse Source
This commit is contained in:
Maxence G. de Montauzan
2017-05-05 05:03:06 +02:00
parent c0d6459d0b
commit f58113ca22
2 changed files with 60 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
dashboard/src/app/album.component.html
View File

@@ -1,3 +1,4 @@
<div class="container">
<h1>{{albumName}}</h1>
<div class="alert alert-warning">
@@ -8,13 +9,62 @@
<span *ngIf="album && (songs.length != album['Track Count'])" class="glyphicon glyphicon-remove" style="color:red"></span>
</div>
<!-- TODO Album Details-->
<!--<ul class="heroes">
<li *ngFor="let song of songs | sortBy : 'Track Number'" >
{{("0" + song['Track Number']).slice(-2)}}. {{song.Name}} ({{song.Artist}}) [{{song.Album}}]
</li>
</ul>-->
<div class="row cardAdmin">
<div class="col-lg-4 col-md-4">
<div class="panel panel-yellow">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<span class="glyphicon glyphicon-star stats_icon"></span>
</div>
<div class="col-xs-9 text-right">
<div>
<h3 *ngIf="!album"><span class="glyphicon glyphicon-refresh loading"></span></h3>
<h3 *ngIf="album">{{album.Rating}}/100</h3>
</div>
<div><br>Rating</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<div class="panel panel-green">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<span class="glyphicon glyphicon-list-alt stats_icon"></span>
</div>
<div class="col-xs-9 text-right">
<div>
<h3 *ngIf="!album"><span class="glyphicon glyphicon-refresh loading"></span></h3>
<h3 *ngIf="album">{{album['Track Count']}}</h3>
</div>
<div><br>Songs</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<div class="panel panel-purple">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<span class="glyphicon glyphicon-headphones stats_icon"></span>
</div>
<div class="col-xs-9 text-right">
<div>
<h3 *ngIf="!album"><span class="glyphicon glyphicon-refresh loading"></span></h3>
<h3 *ngIf="album">{{album['Play Count']}} list.</h3>
</div>
<div><br>~{{album['Play Count'] / album['Track Count'] | number:'1.0-0'}} listening avg.</div>
</div>
</div>
</div>
</div>
</div>
</div>
<table class="table table-striped" (window:scroll)="onScroll($event)">
<thead>
@@ -47,4 +97,5 @@
<button type="button" class="btn btn-warning btn-top" [class.btn-top-is-visible]="atBottom"
aria-label="Top" (click)="scrollTop()">
<span class="glyphicon glyphicon-menu-up" style="color:white" aria-hidden="true"></span>
</button>
</button>
</div>

2
dashboard/src/app/album.component.ts
View File

@@ -9,7 +9,7 @@ import { Album } from './object/album';
@Component({
selector: 'album-component',
templateUrl: './album.component.html',
styleUrls: [ './album.component.css' ]
styleUrls: [ './album.component.css', './dashboard.component.css' ]
})
export class AlbumComponent implements OnInit {