diff --git a/projects/ars/src/lib/components/style/menu/material-btn/material-btn.component.scss b/projects/ars/src/lib/components/style/menu/material-btn/material-btn.component.scss
index b004ebb98a542a31d5c5e7ad0b21bf0c0a349875..779e84f280e3d70ecb0f14caabedd0256294c0a0 100644
--- a/projects/ars/src/lib/components/style/menu/material-btn/material-btn.component.scss
+++ b/projects/ars/src/lib/components/style/menu/material-btn/material-btn.component.scss
@@ -26,7 +26,6 @@
}
ars-col > button > p{
- text-transform:uppercase;
font-weight:500;
font-size:14px;
line-height:18px;
diff --git a/src/app/components/shared/questionwall/question-wall/question-wall.component.html b/src/app/components/shared/questionwall/question-wall/question-wall.component.html
index 232a2b1c76b78dee532036ff0e28b23ae9e6eb37..4a61e63fb7e4e9af1bccb7fff0ae582ff8ab007f 100644
--- a/src/app/components/shared/questionwall/question-wall/question-wall.component.html
+++ b/src/app/components/shared/questionwall/question-wall/question-wall.component.html
@@ -9,8 +9,14 @@
<ars-col>
<!-- centered col -->
</ars-col>
- <ars-fill>
- <!-- right -->
+ <ars-fill ars-flex-box>
+ <ars-fill></ars-fill>
+ <ars-col ars-btn-wrp [xp]="16" [extra]="true">
+ <button ars-btn (click)="sortTime()"><p>{{'question-wall.sort-time' | translate}}</p><i>expand_less</i></button>
+ <button ars-btn (click)="sortTime(true)"><i>expand_more</i></button>
+ <button ars-btn (click)="sortScore()"><p>{{'question-wall.sort-score' | translate}}</p><i>expand_less</i></button>
+ <button ars-btn (click)="sortScore(true)"><i>expand_more</i></button>
+ </ars-col>
</ars-fill>
</ars-style-btn-material>
</ars-row>
@@ -18,15 +24,17 @@
<ars-fill style="overflow:hidden;" ars-flex-box>
<ars-fill>
</ars-fill>
- <ars-row>
- <ng-container *ngIf="commentFocus">
- <h2 class="questionwall-present-timestamp">{{commentFocus.timeAgo}}</h2>
- <p class="questionwall-present">{{commentFocus.comment.body}}</p>
- </ng-container>
- <ng-container *ngIf="!commentFocus">
- <p class="questionwall-present-introduction-title">{{'question-wall.introduction-title' | translate}}</p>
- <p class="questionwall-present-introduction-desc">{{'question-wall.introduction-desc' | translate}}</p>
- </ng-container>
+ <ars-row class="questionwall-present-box-outer">
+ <div class="questionwall-present-box-inner">
+ <ng-container *ngIf="commentFocus">
+ <h2 class="questionwall-present-timestamp">{{commentFocus.timeAgo}}</h2>
+ <p class="questionwall-present">{{commentFocus.comment.body}}</p>
+ </ng-container>
+ <ng-container *ngIf="!commentFocus">
+ <p class="questionwall-present-introduction-title">{{'question-wall.intro-title' | translate}}</p>
+ <p class="questionwall-present-introduction-desc">{{'question-wall.intro-desc' | translate}}</p>
+ </ng-container>
+ </div>
</ars-row>
<ars-fill>
</ars-fill>
@@ -47,6 +55,18 @@
<ars-col>
<p class="questionwall-comment-notification">{{comment.old?'':'NEW'}}</p>
</ars-col>
+ <ars-col>
+ <!-- Fav,Mark as wrong/correct -->
+ <!--
+ <ars-style-btn-material>
+ <ars-col ars-btn-wrp [xp]="16" [extraStart]="true" class="questionwall-comment-btn">
+ <button ars-btn><i>check_circle</i></button>
+ <button ars-btn><i>not_interested</i></button>
+ <button ars-btn><i>{{comment.comment.favorite?'star':'star_border'}}</i></button>
+ </ars-col>
+ </ars-style-btn-material>
+ -->
+ </ars-col>
</ars-row>
<ars-row
(click)="focusComment(comment)"
diff --git a/src/app/components/shared/questionwall/question-wall/question-wall.component.scss b/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
index 3275f99d781a65fc7770334c339c32cbbe5f0028..4cc0163dd9378a56e0a2daa337e60901d1c08de8 100644
--- a/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
+++ b/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
@@ -52,6 +52,7 @@
font-size:12px;
text-transform:uppercase;
letter-spacing:2px;
+ line-height:18px;
font-weight:600;
color: #cc4244;
}
@@ -66,6 +67,17 @@
padding:16px 32px 16px 32px;
color:var(--ars-header-color);
word-break:break-word;
+ &-box{
+ &-outer{
+ display:flex;
+ flex-direction:row;
+ justify-content:center;
+ }
+ &-inner{
+ width:1000px;
+ flex-shrink:1;
+ }
+ }
&-timestamp{
font-size:18px;
padding:32px 32px 0 32px;
diff --git a/src/app/components/shared/questionwall/question-wall/question-wall.component.ts b/src/app/components/shared/questionwall/question-wall/question-wall.component.ts
index 385c77a639848f5c12a9db42f2200d92889ab2eb..4aef124e194bd832c58aeb6478556382464d0cac 100644
--- a/src/app/components/shared/questionwall/question-wall/question-wall.component.ts
+++ b/src/app/components/shared/questionwall/question-wall/question-wall.component.ts
@@ -176,4 +176,27 @@ export class QuestionWallComponent implements OnInit, AfterViewInit, OnDestroy {
this.wsCommentService.voteDown(comment.comment, this.authenticationService.getUser().id);
}
+ sortScore(reverse?: boolean) {
+ this.sort((a, b) => a.comment.score - b.comment.score, reverse);
+ }
+
+ sortTime(reverse?: boolean) {
+ this.sort((a, b) => new Date(a.comment.timestamp).getTime() - new Date(b.comment.timestamp).getTime(), reverse);
+ }
+
+ sort(fun: (a, b) => number, reverse: boolean) {
+ if (reverse) {
+ this.comments.sort(this.reverse(fun));
+ } else {
+ this.comments.sort(fun);
+ }
+ setTimeout(() => {
+ this.focusComment(this.comments[this.comments.length - 1]);
+ }, 0);
+ }
+
+ reverse(fun: (a, b) => number): (a, b) => number {
+ return (a, b) => fun(b, a);
+ }
+
}
diff --git a/src/assets/i18n/participant/de.json b/src/assets/i18n/participant/de.json
index c0bcb083768d1e7d4f1797bab5b520a933804b39..b56cfa8a2953b41a40b51ee394825a7a7f5a7ee3 100644
--- a/src/assets/i18n/participant/de.json
+++ b/src/assets/i18n/participant/de.json
@@ -127,6 +127,8 @@
"auto-renew-off": "Autofokus beenden",
"auto-renew-off-icon": "cancel",
"intro-title": "Fragen-Fokus",
- "intro-desc": "Klicke auf eine Frage oder navigiere mit der Leertaste vorwärts oder mit den Pfeiltasten vor und zurück."
+ "intro-desc": "Klicke auf eine Frage oder navigiere mit der Leertaste vorwärts oder mit den Pfeiltasten vor und zurück.",
+ "sort-time": "Zeit",
+ "sort-score": "Bewertung"
}
}
diff --git a/src/assets/i18n/participant/en.json b/src/assets/i18n/participant/en.json
index 1230979550c3e1f6088719cf447035ac03315a6c..1706b4afe6e086e2556c2e4256fca6294f970f21 100644
--- a/src/assets/i18n/participant/en.json
+++ b/src/assets/i18n/participant/en.json
@@ -117,15 +117,17 @@
"bonus-token-header": "Tokens for bonus points"
},
"question-wall": {
- "next-comment": "next comment",
+ "next-comment": "Next Comment",
"next-comment-icon": "keyboard_arrow_right",
- "prev-comment": "previous comment",
+ "prev-comment": "Previous Comment",
"prev-comment-icon": "keyboard_arrow_left",
- "auto-renew-on": "start automatically focus new comments",
+ "auto-renew-on": "Start automatically focus new comments",
"auto-renew-on-icon": "refresh",
- "auto-renew-off": "stop automatically focus new comments",
+ "auto-renew-off": "Stop automatically focus new comments",
"auto-renew-off-icon": "cancel",
"intro-title": "Questionwall",
- "intro-desc": "Questionwall-desc"
+ "intro-desc": "Click on a question or navigate forwards with the space bar or back and forth with the arrow keys.",
+ "sort-time": "Time",
+ "sort-score": "Score"
}
}