Skip to content

Commit a972709

Browse files
author
Ian Redpath
committed
more not crappy styling
1 parent 1f69706 commit a972709

File tree

5 files changed

+70
-38
lines changed

5 files changed

+70
-38
lines changed

‎public/project/assets/default_library.png‎

15.2 KB
Loading

‎public/project/components/libraries/libraries.ts‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -45,19 +45,17 @@ export class Libraries {
4545

4646
calculateHighestRatedLibs() {
4747
return _.sortBy(this.libraries, lib => {
48-
return _.reduce((<any>lib).ratings,
49-
(acc, rat) => { return acc + (<any>rat).value },
50-
0) / lib.ratings.length
48+
return - this.getAvgRating((<any>lib).ratings)
5149
})
5250
}
5351
calculateMostCommentsLibs() {
5452
return _.sortBy(this.libraries, lib => {
55-
return lib.comments.length
53+
return -lib.comments.length
5654
})
5755
}
5856
calculateMostMoviesLibs() {
5957
return _.sortBy(this.libraries, lib => {
60-
return lib.movies.length
58+
return -lib.movies.length
6159
})
6260
}
6361

@@ -91,5 +89,12 @@ export class Libraries {
9189
getResultsPage(page: number) {
9290
this.currentPage = page
9391
}
92+
getAvgRating(ratings: Array<any>) {
93+
console.log(ratings)
94+
return _.reduce(ratings, (acc, rat) => { return acc + (<any>rat).value }, 0) / Math.max(ratings.length, 1)
95+
//console.log(rat)
96+
//return rat
97+
}
98+
9499

95100
}

‎public/project/components/libraries/libraries.view.html‎

Lines changed: 45 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -12,37 +12,58 @@ <h1>Libraries</h1>
1212
</div>
1313
<div *ngIf="!showSearchResults" class="libraries-no-search">
1414
<h4>Highest rated libraries</h4>
15-
<div class="sample-libraries">
16-
<ul>
17-
<li *ngFor="#library of highestRatedLibs.slice(0, 10)" class="library">
18-
<a class="thumbnail" [routerLink]="['/Library', { library: library._id }]">{{library.name}}</a>
19-
</li>
20-
</ul>
15+
<div class="sample-libraries row">
16+
<div *ngFor="#library of highestRatedLibs.slice(0, 10)" class="library-movie col-xs-6 col-sm-4 col-md-3 col-lg-2">
17+
<div class="movie-poster-container" style="position:relative; height:75%; padding:7px">
18+
<img src="./assets/default_library.png" class="" style="margin-bottom:2px; height:auto; width:100%; padding:4px"[routerLink]="['/Library', { library: library._id }]">
19+
</div>
20+
<div class="library-details" style="height:25%">
21+
<span>{{library.name}} ({{library.user.username}})</span>
22+
<div class="ratings" style="display:block">
23+
<span class="glyphicon {{ getAvgRating(library.ratings) < 1 ? 'glyphicon-star-empty': 'glyphicon-star' }}"></span>
24+
<span class="glyphicon {{ getAvgRating(library.ratings) < 2 ? 'glyphicon-star-empty': 'glyphicon-star' }}"></span>
25+
<span class="glyphicon {{ getAvgRating(library.ratings) < 3 ? 'glyphicon-star-empty': 'glyphicon-star' }}"></span>
26+
<span class="glyphicon {{ getAvgRating(library.ratings) < 4 ? 'glyphicon-star-empty': 'glyphicon-star' }}"></span>
27+
<span class="glyphicon {{ getAvgRating(library.ratings) < 5 ? 'glyphicon-star-empty': 'glyphicon-star' }}"></span>
28+
</div>
29+
</div>
30+
</div>
2131
</div>
2232
<h4>Libraries with the most movies</h4>
23-
<div class="sample-libraries">
24-
<ul>
25-
<li *ngFor="#library of mostMoviesLibs.slice(0, 10)" class="library">
26-
<a class="thumbnail" [routerLink]="['/Library', { library: library._id }]">{{library.name}}</a>
27-
</li>
28-
</ul>
33+
<div class="sample-libraries row">
34+
<div *ngFor="#library of mostMoviesLibs.slice(0, 10)" class="library-movie col-xs-6 col-sm-4 col-md-3 col-lg-2">
35+
<div class="movie-poster-container" style="position:relative; height:75%; padding:7px">
36+
<img src="./assets/default_library.png" class="" style="margin-bottom:2px; height:auto; width:100%; padding:4px"[routerLink]="['/Library', { library: library._id }]">
37+
</div>
38+
<div class="library-details" style="height:25%">
39+
<span>{{library.name}} ({{library.user.username}})</span>
40+
<span style="display:block">{{library.movies.length}} {{library.movies.length === 1 ? 'movie' : 'movies' }}</span>
41+
</div>
42+
</div>
2943
</div>
3044
<h4>Libraries with the most comments</h4>
31-
<div class="sample-libraries">
32-
<ul>
33-
<li *ngFor="#library of mostCommentsLibs.slice(0, 10)" class="library">
34-
<a class="thumbnail" [routerLink]="['/Library', { library: library._id }]">{{library.name}}</a>
35-
</li>
36-
</ul>
45+
<div class="sample-libraries row">
46+
<div *ngFor="#library of mostCommentsLibs.slice(0, 10)" class="library-movie col-xs-6 col-sm-4 col-md-3 col-lg-2">
47+
<div class="movie-poster-container" style="position:relative; height:75%; padding:7px">
48+
<img src="./assets/default_library.png" class="" style="margin-bottom:2px; height:auto; width:100%; padding:4px"[routerLink]="['/Library', { library: library._id }]">
49+
</div>
50+
<div class="library-details" style="height:25%">
51+
<span>{{library.name}} ({{library.user.username}})</span>
52+
<span style="display:block">{{library.comments.length}} {{library.comments.length === 1 ? 'comment' : 'comments' }}</span>
53+
</div>
54+
</div>
3755
</div>
3856
</div>
3957
<div class="libraries-search" *ngIf="showSearchResults">
40-
<div class="libraries-search-results">
41-
<ul>
42-
<li *ngFor="#library of getShownResults()" class="library">
43-
<a class="thumbnail" [routerLink]="['/User', { library: library._id }]">{{library.name}}</a>
44-
</li>
45-
</ul>
58+
<div class="sample-libraries row">
59+
<div *ngFor="#library of getShownResults()" class="library-movie col-xs-6 col-sm-4 col-md-3 col-lg-2">
60+
<div class="movie-poster-container" style="position:relative; height:75%; padding:7px">
61+
<img src="./assets/default_library.png" class="" style="margin-bottom:2px; height:auto; width:100%; padding:4px"[routerLink]="['/Library', { library: library._id }]">
62+
</div>
63+
<div class="library-details" style="height:25%">
64+
<span>{{library.name}} ({{library.user.username}})</span>
65+
</div>
66+
</div>
4667
</div>
4768
<nav>
4869
<ul class="pagination">

‎public/project/components/users/user.view.html‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,28 @@
11
<div *ngIf='!fetchingUser' class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2">
22
<div class="profile-header">
3-
<div class="col-sm-4 col-md-3">
4-
<span class="glyphicon glyphicon-user"></span>
3+
<div class="col-sm-4 col-md-4">
4+
<img style="width:100%" src="./assets/default_user.png">
55
</div>
6-
<div class="col-sm-6 col-md-5">
6+
<div class="col-sm-6 col-md-6">
77
<h1>{{user.username}}</h1>
88
</div>
9-
<div class="col-sm-2 col-md-4"></div>
9+
<div class="col-sm-2 col-md-2"></div>
1010
</div>
1111
<div>
1212
<h3>Libraries</h3>
1313
<div class="new-library" *ngIf='hasEditRights()'>
1414
<input type="text" [(ngModel)]="newLibraryName" placeholder="Library name">
1515
<button class="btn btn-default" (click)='newLibrary()'>+</button>
1616
</div>
17-
<div class="library-carousel">
18-
<div *ngFor="#library of user.libraries" class="user-library">
19-
<span *ngIf="hasEditRights()" class="glyphicon glyphicon-remove thumbnail-remove" (click)="removeLibrary(library._id)"></span>
20-
<a class="thumbnail" [routerLink]="['/Library', { library: library._id }]">{{library.name}}</a>
21-
</div>
17+
18+
<div class="user-libraries row">
19+
<div *ngFor="#library of user.libraries" class="library-movie col-xs-6 col-sm-4 col-md-3 col-lg-2">
20+
<button *ngIf="hasEditRights()" class="btn btn-xs glyphicon glyphicon-remove thumbnail-remove" (click)="removeLibrary(library._id)" style="position:absolute; right:0px; top:0px"></button>
21+
<div class="movie-poster-container" style="position:relative; height:75%; padding:7px">
22+
<img src="./assets/default_library.png" class="" style="margin-bottom:2px; height:auto; width:100%; padding:4px"[routerLink]="['/Library', { library: library._id }]">
23+
</div>
24+
<span>{{library.name}}</span>
25+
</div>
2226
</div>
2327
</div>
2428
</div>

‎public/project/components/users/users.view.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ <h4>Users with the most libraries</h4>
1919
</div>
2020
<div class="user-details" style="height:25%">
2121
<span>{{user.username}} ({{user.firstname}} {{user.lastname}})</span>
22+
<span style="display:block">{{user.libraries.length}} {{user.libraries.length === 1 ? 'library' : 'libraries'}}</span>
2223
</div>
2324
</div>
2425
</div>
@@ -30,6 +31,7 @@ <h4>Users with the most ratings</h4>
3031
</div>
3132
<div class="user-details" style="height:25%">
3233
<span>{{user.username}} ({{user.firstname}} {{user.lastname}})</span>
34+
<span style="display:block">Has rated {{user.ratings.length}} {{user.ratings.length === 1 ? 'thing' : 'things' }}</span>
3335
</div>
3436
</div>
3537
</div>

0 commit comments

Comments
 (0)