Differential D238 Diff 855 src/app/userPosts/userPosts.component.html

Changeset View

Standalone View

src/app/userPosts/userPosts.component.html

<!-- Removed as of D114		<!-- Removed as of D114
<mat-input-container>		<mat-input-container>
<input matInput placeholder="Search Posts" type="text" name="search" (input)="searchInput()" [(ngModel)]="model.postText" #postText="ngModel" autocomplete="off" />		<input matInput placeholder="Search Posts" type="text" name="search" (input)="searchInput()" [(ngModel)]="model.postText" #postText="ngModel" autocomplete="off" />
</mat-input-container>		</mat-input-container>
-->		-->
<mat-card class="refreshButton" (click)="ngOnInit()" *ngIf="totalCount === 0 && !loading">
No posts, try posting?
<button class="wideButtons" mat-button>Refresh <i class="material-icons">refresh</i></button>
</mat-card>
<br><br>
<mat-progress-spinner *ngIf="loading"></mat-progress-spinner>

<ngx-masonry [options]="{ horizontalOrder: true }" *ngIf="currentArea">		<!-- Area List Component -->
<ngx-masonry-item class="brick" *ngFor="let post of backupPosts[currentArea] \| paginate: { id: 'server', itemsPerPage: limit, currentPage: index, totalItems: totalCount }; let i = index">		<app-area-list></app-area-list>
<mat-card class="userPostsGrid" (click)="goto(post.id)">
<font size="0.1">		<!-- <div fxLayout="column" class="profile-container">
<ng-container *ngIf="!post.anonym"><i class="material-icons">visibility_on</i></ng-container>		<div fxLayout="row" fxLayoutAlign="start center" style="margin-top: 3vh;">
<ng-container *ngIf="post.anonym"><i class="material-icons">visibility_off</i></ng-container>		<h2 class="profile-title">Areas</h2>
<ng-container *ngIf="imageArray[currentArea][i] \|\| post.image"><i class="material-icons">image</i></ng-container>		<p class="profile-title" fxFlexOffset="1rem" style="margin: 0;"><ng-container *ngIf="currentArea">{{currentArea.displayname}}</ng-container></p>
<span class="mainText" innerHTML="{{post.text \| slice:0:200 \| marked: post}}"></span><ng-container *ngIf="post.text.length > 200">...</ng-container>		</div>
<hr>		<div fxLayout="column" class="profile-post-group" fxFlexOffset="1rem">
{{post.created}}		<div *ngIf="currentArea" fxLayout="row" class="profile-post-row">
</font>		<div class="profile-post-card" [style.background]="post.active ? 'linear-gradient(0deg, #A2A2A2, #A2A2A2), linear-gradient(180deg, #A2A2A2 0%, #d3d3d3 99.99%)' : '#d3d3d3'" (click)="goto(post.id)" fxLayout="column" *ngFor="let post of backupPosts[currentArea.name] \| paginate: { id: 'server', itemsPerPage: limit, currentPage: index, totalItems: totalCount }; let i = index">
</mat-card>		<div fxLayout="row" fxLayoutAlign="end center" class="profile-post-row-icons">
</ngx-masonry-item>		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem" *ngIf="imageArray[currentArea.name][i] \|\| post.image">image</i>
</ngx-masonry>		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem" *ngIf="post.active">hourglass_full</i>
		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem" *ngIf="!post.active">hourglass_empty</i>
		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem" *ngIf="!post.anonym">visibility_on</i>
		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem" *ngIf="post.anonym">visibility_off</i>
		<i class="material-icons" style="width: 24px;zoom: 0.7;" fxFlexOffset="1rem">filter_none</i>
		<h5 style="color: #333333" fxFlexOffset="0.5rem">{{post.comments.length}}</h5>
		</div>
		<p class="marked" innerHTML="{{post.text \| slice:0:200 \| marked: post}}"></p>
		<ng-container *ngIf="post.text.length > 200">...</ng-container>
		</div>
		</div>
		</div>
		<pagination-controls fxFlexOffset="1rem" *ngIf="totalCount !== 0 && !loading" (pageChange)="getPosts($event)" id="server"></pagination-controls>
		<div *ngIf="loading" fxLayoutAlign="center center" fxFlexOffset="1rem">
		<mat-progress-spinner></mat-progress-spinner>
		</div>
		</div> -->

<!-- Removed as of D114		<!-- Removed as of D114
<masonry *ngIf="!checked && searching">		<masonry *ngIf="!checked && searching">
<mat-card class="userPostsGrid" style="margin: 0 auto; text-align: center;" *ngIf="searchArray.length === 0">		<mat-card class="userPostsGrid" style="margin: 0 auto; text-align: center;" *ngIf="searchArray.length === 0">
No posts match this search		No posts match this search
</mat-card>		</mat-card>
<masonry-brick class="brick" *ngFor="let post of searchArray; let i = index">		<masonry-brick class="brick" *ngFor="let post of searchArray; let i = index">
<mat-card class="userPostsGrid" (click)="goto('fun', post.id)">		<mat-card class="userPostsGrid" (click)="goto('fun', post.id)">
Show All 22 Lines	<mat-card class="userPostsGrid" (click)="goto('information', post.id)">
<span class="mainText" [innerHTML]="post.text \| slice:0:200 \| marked"></span><ng-container *ngIf="post.text.length > 200">...</ng-container>		<span class="mainText" [innerHTML]="post.text \| slice:0:200 \| marked"></span><ng-container *ngIf="post.text.length > 200">...</ng-container>
<hr>		<hr>
{{post.created}}		{{post.created}}
</font>		</font>
</mat-card>		</mat-card>
</masonry-brick>		</masonry-brick>
</masonry>		</masonry>
-->		-->

<pagination-controls *ngIf="totalCount !== 0 && !loading" (pageChange)="getPosts($event)" id="server"></pagination-controls>