56 lines
2.1 KiB
HTML
56 lines
2.1 KiB
HTML
<table class="table table-striped" (window:scroll)="onScroll($event)">
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th>Name</th>
|
|
<th>Album</th>
|
|
<th>Year</th>
|
|
<th>Artist</th>
|
|
<th>Album Artist</th>
|
|
<th>Play Count</th>
|
|
<th>Genre</th>
|
|
<th>Bit Rate</th>
|
|
<th>Rating</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr *ngFor="let song of songs | sortBy : 'Year':'Album':'Disc Number':'Track Number'">
|
|
<td>{{song['Track Number'] ? (("0" + song['Track Number']).slice(-2)) : "--"}}</td>
|
|
<td>{{song.Name}}</td>
|
|
<td>
|
|
<a [routerLink]="['/album', song.Album]">{{song.Album}}</a>
|
|
</td>
|
|
<td>{{song.Year}}</td>
|
|
<td>
|
|
<a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a>
|
|
</td>
|
|
<td>{{song['Album Artist'] ? song['Album Artist'] : "-" }}</td>
|
|
<td>{{song['Play Count']}}</td>
|
|
<td>
|
|
<a [routerLink]="['/genre', song.Genre]">{{song.Genre}}</a>
|
|
</td>
|
|
<td [title]="song['Bit Rate']">
|
|
<span [class]="'signal signal-' + roundBitRate(song['Bit Rate'])"></span>
|
|
</td>
|
|
<td class="star" [title]="(song['Rating Computed']?'Computed Rating: ':'Rating: ') + song.Rating">
|
|
<span *ngFor="let item of numberToArray(song.Rating, 20)">
|
|
<span class="glyphicon" [ngClass]="song['Rating Computed']?'glyphicon-star-empty':'glyphicon-star'"></span>
|
|
</span>
|
|
</td>
|
|
<td *ngIf="song.Loved" class="loved">
|
|
<span class="glyphicon glyphicon-heart heart"></span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<!-- Go to Top Button-->
|
|
<button type="button" class="btn btn-warning btn-top" [class.btn-top-is-visible]="bottomReached" aria-label="Top" (click)="scrollTop()"
|
|
title="Go back to Top!">
|
|
<span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-primary btn-top btn-sort" [class.btn-top-is-visible]="sortable" aria-label="Top" (click)="sort()"
|
|
title="Sort by Album & Track Number">
|
|
<span class="glyphicon glyphicon-sort-by-attributes" aria-hidden="true"></span>
|
|
</button>
|