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 21a2ebfd4ef0f53c837348c6764e12bb65862e86..c1850e9615270fd452a7d750b4197b950b767293 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
@@ -16,6 +16,7 @@
<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>
+ <button ars-btn (click)="filterFavorites()"><i>star</i><p>{{'question-wall.filter-favorite' | translate}}</p></button>
</ars-col>
</ars-fill>
</ars-style-btn-material>
@@ -46,7 +47,18 @@
</ars-fill>
</ars-fill>
<ars-col [width]="450" [overflow]="'auto'" class="questionwall-list" #colComponent>
- <ars-row *ngFor="let comment of comments" class="questionwall-comment-anchor">
+ <ars-row *ngIf="hasFilter" class="questionwall-list-filter" [height]="45">
+ <ars-style-btn-material style="width:100%;height:100%;" ars-flex-box>
+ <ars-col ars-btn-wrp [xp]="48">
+ <button ars-btn><p>{{filterTitle | translate}} {{filterDesc}}</p></button>
+ </ars-col>
+ <ars-fill></ars-fill>
+ <ars-col ars-btn-wrp [xp]="48">
+ <button ars-btn (click)="deactivateFilter()"><i>remove_circle</i><p>remove filter</p></button>
+ </ars-col>
+ </ars-style-btn-material>
+ </ars-row>
+ <ars-row *ngFor="let comment of hasFilter?commentsFilter:comments" class="questionwall-comment-anchor">
<ars-row style="box-sizing:border-box;padding:8px;">
<ars-row
[ngClass]="comment===commentFocus?'questionwall-comment-border-on':'questionwall-comment-border-off'"
@@ -56,24 +68,18 @@
style="box-sizing:border-box;padding:16px;cursor:pointer">
<ars-col class="questionwall-comment-meta">
<i class="questionwall-icon">person</i>
- <p class="questionwall-comment-user">{{comment.comment.userNumber}}</p>
+ <p (click)="filterUser(comment);" class="questionwall-comment-user">{{comment.comment.userNumber}}</p>
<p class="questionwall-comment-timestamp">{{comment.timeAgo}}</p>
</ars-col>
- <ars-fill></ars-fill>
<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-style-btn-material>-->
+<!-- <ars-col ars-btn-wrp [xp]="16" [extraStart]="true" class="questionwall-comment-btn">-->
+<!-- <button ars-btn><i>{{comment.comment.favorite?'star':'star_border'}}</i></button>-->
+<!-- </ars-col>-->
+<!-- </ars-style-btn-material>-->
</ars-col>
</ars-row>
<ars-row
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 646ce06b12d0da419a874b4777ef4e9ae5df18ba..67e0dae7ebc377ef4c9089e7477fe5d040f50ec7 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
@@ -33,7 +33,7 @@
&-comment{
&-meta{
display:flex;
- justify-content:start;
+ justify-content:flex-start;
flex-direction:row;
}
&-border{
@@ -83,6 +83,10 @@
box-sizing:border-box;
padding:16px 0px;
border-left:solid 1px var(--ars-border-color);
+ &-filter{
+ border-top:solid 1px var(--ars-border-color);
+ border-bottom:solid 1px var(--ars-border-color);
+ }
}
&-present{
font-size:45px;
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 14df46d2fc8b32203087d8770fdbc1f45caf4196..0fc83046e3e9732f5a61dd2d4d331fae42ba18fd 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
@@ -26,11 +26,15 @@ export class QuestionWallComponent implements OnInit, AfterViewInit, OnDestroy {
roomId: string;
room: Room;
comments: QuestionWallComment[] = [];
+ commentsFilter: QuestionWallComment[] = [];
commentFocus: QuestionWallComment;
unreadComments = 0;
focusIncommingComments = false;
timeUpdateInterval;
keySupport: QuestionWallKeyEventSupport;
+ hasFilter = false;
+ filterTitle = 'Test';
+ filterDesc = 'test';
public wrap<E>(e: E, action: (e: E) => void) {
action(e);
@@ -66,7 +70,10 @@ export class QuestionWallComponent implements OnInit, AfterViewInit, OnDestroy {
this.translateService.use(localStorage.getItem('currentLang'));
this.commentService.getAckComments(this.roomId).subscribe(e => {
e.sort((a, b) => new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime());
- e.forEach(c => this.comments.push(new QuestionWallComment(c, true)));
+ e.forEach(c => {
+ const comment = new QuestionWallComment(c, true);
+ this.comments.push(comment);
+ });
});
this.roomService.getRoom(this.roomId).subscribe(e => {
this.room = e;
@@ -127,7 +134,7 @@ export class QuestionWallComponent implements OnInit, AfterViewInit, OnDestroy {
}
getCommentFocusIndex() {
- return this.comments.indexOf(this.commentFocus);
+ return this.getCurrentCommentList().indexOf(this.commentFocus);
}
moveComment(fx: number) {
@@ -189,18 +196,51 @@ export class QuestionWallComponent implements OnInit, AfterViewInit, OnDestroy {
}
sort(fun: (a, b) => number, reverse: boolean) {
+ const commentList = this.getCurrentCommentList();
if (reverse) {
- this.comments.sort(this.reverse(fun));
+ commentList.sort(this.reverse(fun));
} else {
- this.comments.sort(fun);
+ commentList.sort(fun);
}
setTimeout(() => {
- this.focusComment(this.comments[this.comments.length - 1]);
+ if (commentList.length > 1) {
+ this.focusComment(commentList[commentList.length - 1]);
+ }
}, 0);
}
+ getCurrentCommentList() {
+ if (this.hasFilter) {
+ return this.commentsFilter;
+ } else {
+ return this.comments;
+ }
+ }
+
reverse(fun: (a, b) => number): (a, b) => number {
return (a, b) => fun(b, a);
}
+ filterFavorites() {
+ this.filterTitle = 'question-wall.filter-favorite';
+ this.filterDesc = '';
+ this.commentsFilter = this.comments.filter(x => x.comment.favorite);
+ this.hasFilter = true;
+ }
+
+ filterUser(comment: QuestionWallComment) {
+ this.filterTitle = 'question-wall.filter-user';
+ this.filterDesc = comment.comment.userNumber + '';
+ this.commentsFilter = this.comments.filter(x => x.comment.userNumber === comment.comment.userNumber);
+ this.hasFilter = true;
+ }
+
+ deactivateFilter() {
+ this.hasFilter = false;
+ }
+
+ toggleFilter() {
+ this.hasFilter = !this.hasFilter;
+ }
+
}
diff --git a/src/assets/i18n/participant/de.json b/src/assets/i18n/participant/de.json
index bf7f6c1464a4d41135575e35027649bea6e7b2da..8f6492a3af8f3db6914be0b9d409d296c2e78e13 100644
--- a/src/assets/i18n/participant/de.json
+++ b/src/assets/i18n/participant/de.json
@@ -129,6 +129,8 @@
"intro-title": "Fragen-Fokus",
"intro-desc": "Klick auf eine Frage oder navigiere mit der Leertaste vorwärts oder mit den Pfeiltasten vor und zurück.",
"sort-time": "Zeit",
- "sort-score": "Bewertung"
+ "sort-score": "Bewertung",
+ "filter-user": "Benutzer",
+ "filter-favorite": "Favoriten"
}
}
diff --git a/src/assets/i18n/participant/en.json b/src/assets/i18n/participant/en.json
index 482b5a6c71aaada6eb9fdeb2e8e043af967a30a0..e2ed3ab6ef503862e2ce5c18805c1bc40b5c115b 100644
--- a/src/assets/i18n/participant/en.json
+++ b/src/assets/i18n/participant/en.json
@@ -128,6 +128,8 @@
"intro-title": "Question Focus",
"intro-desc": "Click on a question or navigate forwards with the space bar or backwards and forwards with the arrow keys.",
"sort-time": "Time",
- "sort-score": "Score"
+ "sort-score": "Score",
+ "filter-user": "User",
+ "filter-favorite": "Favorites"
}
}