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

(front) Albums: changing layout with templating

Browse Source 
Still not satisfied with this
This commit is contained in:
Maxence G. de Montauzan
2021-01-19 19:20:38 +01:00
parent 66dc29be92
commit 8e79bee1c4
1 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
dashboard/src/app/albums/albums.component.html
View File

@@ -2,11 +2,13 @@
<h1>Albums</h1>
<div class="col-md-12">
<table class="table table-striped">
<table class="table table-striped" style="white-space: nowrap;">
<thead>
<tr>
<th>Album</th>
<th>Track Count</th>
<th></th>
<th></th>
<th>Artist/Album Artist</th>
<th>Avg Bit Rate (min)</th>
<th>Play Count</th>
@@ -17,27 +19,34 @@
<tr *ngFor="let album of albums">
<td>
<a [routerLink]="['/album', album.Album]">{{album.Album}}</a>&nbsp;
<span class="glyphicon glyphicon-remove-circle" style="cursor:pointer" (click)="exlude('Album', album)"></span>
<span class="glyphicon glyphicon-remove-circle" style="cursor:pointer;color:red;" (click)="exlude('Album', album)"></span>
</td>
<td>{{album['Track Count']}}</td>
<td>
<!-- {{album['Album Artist'] ? album['Album Artist'] : album.Artist}} -->
<span *ngIf="album['Album Artist']; else artistSection">
<span class="glyphicon glyphicon-ban-circle" style="cursor:pointer" (click)="exlude('Album Artist', album)"></span>
<span class="glyphicon glyphicon-zoom-in" style="cursor:pointer" (click)="select('Album Artist', album)"></span>
<a [routerLink]="['/artist', album['Album Artist']]">{{album['Album Artist']}}</a>&nbsp;
</span>
<ng-template [ngIf]="album['Album Artist']" [ngIfElse]="artistSection">
<td>
<span class="glyphicon glyphicon-ban-circle" style="cursor:pointer;color:red;" (click)="exlude('Album Artist', album)"></span>
</td>
<td>
<span class="glyphicon glyphicon-zoom-in" style="cursor:pointer;" (click)="select('Album Artist', album)"></span>
</td>
<td>
<a [routerLink]="['/artist', album['Album Artist']]">{{album['Album Artist']}}</a>&nbsp;
</td>
</ng-template>
<ng-template #artistSection>
<span>
<span class="glyphicon glyphicon-ban-circle" style="cursor:pointer" (click)="exlude('Artist', album)"></span>
<span class="glyphicon glyphicon-zoom-in" style="cursor:pointer" (click)="select('Artist', album)"></span>
<ng-template #artistSection>
<td>
<span class="glyphicon glyphicon-ban-circle" style="cursor:pointer;color:red;" (click)="exlude('Artist', album)"></span>
</td>
<td>
<span class="glyphicon glyphicon-zoom-in" style="cursor:pointer;" (click)="select('Artist', album)"></span>
</td>
<td>
<a [routerLink]="['/artist', album.Artist[0]]">{{album.Artist}}</a>&nbsp;
</span>
</ng-template>
</td>
</td>
</ng-template>
<td>
{{album['Avg Bit Rate']}}