diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html index d881a2c41be8fe7e4e40bb86fb34f688108aac8a..e4a6a3c36323838dd28dbdccd60653b420055b4f 100644 --- a/src/app/components/shared/comment-list/comment-list.component.html +++ b/src/app/components/shared/comment-list/comment-list.component.html @@ -15,5 +15,5 @@ <app-comment *ngFor="let current of filteredComments" [comment]="current"> </app-comment> </mat-card> <mat-card class="outer-card" *ngIf="!hideCommentsList"> - <app-comment *ngFor="let current of comments" [comment]="current"> </app-comment> + <app-comment *ngFor="let current of comments | orderBy: 'score'" [comment]="current"> </app-comment> </mat-card> diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html index cff841b361123d12a54dc8dc99ccdbc90a1b1533..d1363c0363e71a1e831fa1e5f5227372e785cf82 100644 --- a/src/app/components/shared/comment/comment.component.html +++ b/src/app/components/shared/comment/comment.component.html @@ -1,6 +1,7 @@ <mat-card class="card-container"> - <div fxLayout="row" fxLayoutAlign="center center"> - <div fxLayout="column"> + <div fxLayout="column"> + <div fxLayout="row"> + <span class="fill-remaining-space"></span> <button mat-icon-button *ngIf="comment.correct || !isStudent" [disabled]="isStudent" (click)="setCorrect(comment)" [matTooltip]="comment.correct ? 'Unmark as correct' : 'Mark as correct'"> <mat-icon [ngClass]="{true : 'correct-icon', false: 'incorrect-icon'}[comment.correct]">check_circle</mat-icon> </button> @@ -11,16 +12,18 @@ <mat-icon [ngClass]="{true: 'read-icon', false: 'unread-icon'}[comment.read]">visibility</mat-icon> </button> </div> - <div class="body" (click)="openPresentDialog(comment.body)">{{comment.body}}</div> - <span class="fill-remaining-space"></span> - <div fxLayout="column"> - <button mat-icon-button [disabled]="!isStudent" (click)="voteUp(comment)"> - <mat-icon class="voting-icon" [ngClass]="{'upvoted' : hasVoted === 1}">keyboard_arrow_up</mat-icon> - </button> + <div fxLayout="row"> + <div class="body" (click)="openPresentDialog(comment.body)">{{comment.body}}</div> + <span class="fill-remaining-space"></span> + <div fxLayout="column"> + <button mat-icon-button [disabled]="!isStudent" (click)="voteUp(comment)"> + <mat-icon class="voting-icon" [ngClass]="{'upvoted' : hasVoted === 1}">keyboard_arrow_up</mat-icon> + </button> <h2>{{comment.score}}</h2> - <button mat-icon-button [disabled]="!isStudent" (click)="voteDown(comment)"> - <mat-icon class="voting-icon" [ngClass]="{'downvoted' : hasVoted === -1}">keyboard_arrow_down</mat-icon> - </button> + <button mat-icon-button [disabled]="!isStudent" (click)="voteDown(comment)"> + <mat-icon class="voting-icon" [ngClass]="{'downvoted' : hasVoted === -1}">keyboard_arrow_down</mat-icon> + </button> + </div> </div> </div> </mat-card> diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts index 13a09ef9f2f855eedc99ec50854a9fa60a48de42..d74627c4dd9f9c563b0088224f577d6c07f97d9b 100644 --- a/src/app/components/shared/shared.module.ts +++ b/src/app/components/shared/shared.module.ts @@ -23,6 +23,7 @@ import { LoginComponent } from './login/login.component'; import { StatisticHelpComponent } from './_dialogs/statistic-help/statistic-help.component'; import { CommentComponent } from './comment/comment.component'; import { SubmitCommentComponent } from './_dialogs/submit-comment/submit-comment.component'; +import { OrderBy} from './sort'; import { PresentCommentComponent } from './_dialogs/present-comment/present-comment.component'; @NgModule({ @@ -54,6 +55,7 @@ import { PresentCommentComponent } from './_dialogs/present-comment/present-comm StatisticHelpComponent, CommentComponent, SubmitCommentComponent, + OrderBy, PresentCommentComponent ], exports: [ diff --git a/src/app/components/shared/sort.ts b/src/app/components/shared/sort.ts new file mode 100644 index 0000000000000000000000000000000000000000..57bbe8fee596d31f36e01455683d8d39ddc08895 --- /dev/null +++ b/src/app/components/shared/sort.ts @@ -0,0 +1,18 @@ +import { Pipe, PipeTransform } from '@angular/core'; + +@Pipe({ + name: 'orderBy' +}) + +export class OrderBy implements PipeTransform { + transform(array: Array<string>, args: string): Array<string> { + array.sort((a: any, b: any) => { + if (a[args] > b[args]) { + return -1; + } else if (a[args] <= b[args]) { + return 1; + } + }); + return array; + } +}