Newer
Older
<ars-screen ars-flex-box class="questionwall-screen">
<ars-row [height]="50" class="questionwall-header">
<ars-style-btn-material *ngIf="room" style="width:100%;height:100%;" ars-flex-box>
<ars-fill ars-flex-box>
<ars-col ars-btn-wrp [xp]="16" [yp]="0" [extra]="true">
<button ars-btn (click)="leave()" matRipple><i>arrow_back</i></button>
</ars-col>
</ars-fill>
<ars-col>
<!-- centered col -->
<ars-fill ars-flex-box>
<ars-fill></ars-fill>
<ars-col ars-btn-wrp [xp]="16" [extra]="true">
<button mat-menu-item (click)="sortTime(true)">{{'question-wall.sort-new' | translate}}</button>
<button mat-menu-item (click)="sortTime()">{{'question-wall.sort-old' | translate}}</button>
<button mat-menu-item (click)="sortScore(true)">{{'question-wall.sort-score' | translate}}</button>
</mat-menu>
<mat-menu #filterMenu>
<button mat-menu-item (click)="filterFavorites()">
<mat-icon>star</mat-icon>
<span>{{'question-wall.filter-disapproved' | translate}}</span>
<mat-menu #filterTagMenu>
<button mat-menu-item *ngFor="let tag of tags" (click)="filterTag(tag)">
<span>{{tag}}</span>
</button>
</mat-menu>
<button ars-btn [mat-menu-trigger-for]="sortMenu" matRipple>
<i>sort</i>
<p>{{'question-wall.sort' | translate}}</p>
</button>
<button ars-btn [mat-menu-trigger-for]="filterMenu" matRipple>
<i>filter_list</i>
<p>Filter</p>
</button>
<button ars-btn [mat-menu-trigger-for]="filterTagMenu" matRipple>
<mat-icon class="icon-svg" svgIcon="comment_tag"></mat-icon>
<p>{{'question-wall.filter-tag' | translate}}</p>
</button>
<button ars-btn (click)="openUserMap()" matRipple>
<i>person</i>
<p>{{'question-wall.filter-user'| translate}}</p>
</button>
</ars-col>
</ars-row>
<ars-fill ars-flex-box>
<ars-fill style="overflow:hidden;" ars-flex-box>
<ars-fill>
</ars-fill>
<ars-row class="questionwall-present-box-outer">
<div class="questionwall-present-box-inner">
<ng-container *ngIf="commentFocus">
<ars-row class="questionwall-present-meta">
<i class="questionwall-icon questionwall-present-meta-icon">person</i>
<h2 class="questionwall-present-meta-user">{{commentFocus.comment.userNumber}}</h2>
<h2 class="questionwall-present-meta-timestamp">{{commentFocus.timeAgo}}</h2>
</ars-row>
<ars-row>
<ars-row class="bound" style="padding:16px 32px 16px 32px;box-sizing:border-box;max-width:100%;">
<markdown [ngStyle]="{'font-size':fontSize+'%'}" class="questionwall-present-markdown" [data]="commentFocus.comment.body"></markdown>
<ars-row [height]="50">
<ars-style-btn-material style="width:100%;height:100%;" ars-flex-box>
<ars-col ars-btn-wrp [xp]="32" [extra]="true" class="questionwall-comment-btn">
<button ars-btn (click)="likeComment(commentFocus)" matRipple><i>thumb_up</i><p>{{commentFocus.comment.score}}</p></button>
<button ars-btn (click)="dislikeComment(commentFocus)" matRipple><i>thumb_down</i></button>
</ars-col>
<ars-fill></ars-fill>
<ars-col ars-btn-wrp [xp]="32" [extra]="true" *ngIf="commentFocus.comment.tag">
<button ars-btn matRipple (click)="filterTag(commentFocus.comment.tag);">
<mat-icon class="icon-svg" svgIcon="comment_tag"></mat-icon>
<p>{{commentFocus.comment.tag}}</p>
</button>
</ars-col>
</ars-style-btn-material>
</ars-row>
</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-fill>
</ars-fill>
<div class="questionwall-present-options-outer">
<div class="questionwall-present-options-inner" ars-flex-box>
<ars-col class="flex-column-center">
<mat-icon class="icon-color">zoom_out</mat-icon>
</ars-col>
<mat-slider class="questionwall-present-options-slider"
min="100" max="400" value="250"
(input)="sliderChange($event)">
</mat-slider>
<ars-col class="flex-column-center">
<mat-icon class="icon-color">zoom_in</mat-icon>
</ars-col>
<ars-col ars-flex-box [width]="450" class="questionwall-list" #colComponent>
<ars-row *ngIf="hasFilter" class="questionwall-list-border-bottom" [height]="50">
<ars-style-btn-material style="width:100%;height:100%;" ars-flex-box>
<ars-col ars-btn-wrp [xp]="48">
<button ars-btn matRipple>
<mat-icon *ngIf="isSvgIcon" class="icon-svg" [svgIcon]="filterIcon"></mat-icon>
<i *ngIf="!isSvgIcon">{{filterIcon}}</i>
<p>{{filterTitle | translate}} {{filterDesc}}</p>
</button>
</ars-col>
<ars-fill></ars-fill>
<ars-col ars-btn-wrp [xp]="48">
<button ars-btn (click)="deactivateFilter()" matRipple>
<i>remove_circle</i>
<p>{{'question-wall.filter-remove' | translate}}</p>
</button>
</ars-col>
</ars-style-btn-material>
</ars-row>
<ars-fill class="questionwall-list-comments">
<ars-row *ngIf="!userSelection">
<ars-fill *ngIf="(hasFilter?commentsFilter:comments).length==0"
style="float:left;">
<p class="questionwall-present-introduction-desc">
{{'question-wall.no-result' | translate}}
</p>
</ars-fill>
<ars-row *ngFor="let comment of hasFilter?commentsFilter:comments"
class="questionwall-comment-anchor"
style="float:left;">
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
<ars-row style="box-sizing:border-box;padding:8px;">
<ars-row
[ngClass]="comment===commentFocus?'questionwall-comment-border-on':'questionwall-comment-border-off'"
style="border-radius:5px">
<ars-row ars-flex-box
(click)="focusComment(comment)"
style="box-sizing:border-box;padding:16px;cursor:pointer">
<ars-col class="questionwall-comment-meta">
<i class="questionwall-icon">person</i>
<p (click)="filterUser(comment);" class="questionwall-comment-user" matRipple>{{comment.comment.userNumber}}</p>
<p class="questionwall-comment-timestamp">{{comment.timeAgo}}</p>
</ars-col>
<ars-col>
<p class="questionwall-comment-notification">{{comment.old?'':'NEW'}}</p>
</ars-col>
</ars-row>
<ars-row
(click)="focusComment(comment)"
style="box-sizing:border-box;padding:0 16px;cursor:pointer">
<p class="questionwall-comment-body">{{comment.comment.body}}</p>
</ars-row>
<ars-row [height]="50">
<ars-style-btn-material style="width:100%;height:100%;" ars-flex-box>
<ars-col ars-btn-wrp [xp]="16" [extra]="true" class="questionwall-comment-btn">
<button ars-btn (click)="likeComment(comment)" matRipple><i>thumb_up</i><p>{{comment.comment.score}}</p></button>
<button ars-btn (click)="dislikeComment(comment)" matRipple><i>thumb_down</i></button>
</ars-col>
<ars-fill (click)="focusComment(comment)" style="cursor:pointer"></ars-fill>
<ars-col ars-btn-wrp [xp]="16" [extra]="true"*ngIf="comment.comment.tag">
<button ars-btn (click)="filterTag(comment.comment.tag);" matRipple>
<mat-icon class="icon-svg" svgIcon="comment_tag"></mat-icon>
<p>{{comment.comment.tag}}</p>
</button>
</ars-col>
</ars-style-btn-material>
</ars-row>
</ars-row>
Lukas Haase
committed
</ars-row>
</ars-row>
</ars-row>
<ars-row *ngIf="userSelection">
<ars-style-btn-material style="width:100%">
<ars-row [height]="50" ars-flex-box class="questionwall-list-border-bottom">
<ars-col ars-btn-wrp [xp]="24" [extra]="true">
<button ars-btn (click)="cancelUserMap()" matRipple><i>arrow_back</i></button>
</ars-col>
<ars-col ars-btn-wrp [xp]="24" [extra]="true">
<button ars-btn class="pseudo-button">
<i>person</i>
<p>{{'question-wall.filter-user' | translate}}</p>
</button>
</ars-col>
Lukas Haase
committed
</ars-row>
<button ars-btn disabled class="questionwall-list-border-bottom pseudo-button">
<p>{{'question-wall.filter-user' | translate}}-ID</p>
<p>{{'question-wall.filter-user-count' | translate}}</p>
</button>
<button ars-btn mat-ripple *ngFor="let user of userList" (click)="applyUserMap(user[1])">
<p>{{user[1]}}</p><p>{{user[0]}}</p>
</button>
Lukas Haase
committed
</ars-row>
Lukas Haase
committed
</ars-row>
</ars-col>
</ars-fill>
<ars-row [height]="50" class="questionwall-footer">
<ars-style-btn-material style="width:100%;" ars-flex-box>
<ars-col ars-btn-wrp [xp]="16" [extra]="true">
<button ars-btn (click)="toggleFocusIncommingComments()" matRipple>
<ng-container *ngIf="focusIncommingComments">
<i>{{'question-wall.auto-renew-off-icon' | translate}}</i>
<p>{{'question-wall.auto-renew-off' | translate}}</p>
</ng-container>
<ng-container *ngIf="!focusIncommingComments">
<i>{{'question-wall.auto-renew-on-icon' | translate}}</i>
<p>{{'question-wall.auto-renew-on' | translate}}</p>
</ng-container>
</button>
</ars-col>
<ars-fill></ars-fill>
<ars-col style="display:flex;flex-direction:column;justify-content:center">
<p *ngIf="unreadComments" style="line-height:18px;" class="questionwall-text-color">{{unreadComments}}</p>
</ars-col>
<ars-col ars-btn-wrp [xp]="16" [extra]="true">
<button ars-btn (click)="prevComment()" matRipple>
<i>{{'question-wall.prev-comment-icon' | translate}}</i>
<p>{{'question-wall.prev-comment' | translate}}</p>
</button>
<button ars-btn (click)="nextComment()" matRipple>
<i>{{'question-wall.next-comment-icon' | translate}}</i>
<p>{{'question-wall.next-comment' | translate}}</p>
</button>
</ars-col>
</ars-style-btn-material>
</ars-row>