aboutsummaryrefslogtreecommitdiff
path: root/src/app/components/profile/profile.component.html
blob: 0d9dc6a587b16bdaf9df5d9ac9625ff5df7c02e9 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<app-loading *ngIf="!dataArrived"></app-loading>

<div id="content" *ngIf="dataArrived">
	<nav id="navigation">
		<button class="submit-btn" (click)="goBack()">ᐊ Back</button>
		<button
			class="submit-btn"
			(click)="navigateToSettings()"
			*ngIf="isTheLoggedInUser"
		>
			Settings
		</button>
		<button
			class="submit-btn"
			(click)="navigateToAdminPanel()"
			*ngIf="isTheLoggedInUser && isAdminUser"
		>
			Panel
		</button>
		<button class="submit-btn" (click)="logout()" *ngIf="isTheLoggedInUser">
			Logout
		</button>
	</nav>
	<hr />
	<div class="scroll-standalone" (scroll)="onScroll($event)">
		<div id="main-info" class="rounded-border">
			<img class="round-image" [src]="user.profilePictureURL" alt="" />
			<div id="other-main-info">
				<div id="name">{{ user.firstName }} {{ user.lastName }}</div>
				<div id="username">@{{ user.userName }}</div>
				<form
					[formGroup]="updateFrienship"
					(ngSubmit)="modifyFriend()"
					*ngIf="!isTheLoggedInUser && isUserLoggedIn"
				>
					<button id="add-friend" type="submit" class="submit-btn">
						{{ friendOfUser ? "Unfriend" : "Add friend" }}
					</button>
					<br />
					<input
						id="loggedin-password"
						type="password"
						formControlName="password"
						class="input-field"
						*ngIf="updatingFriendship"
						placeholder="Type in password to confirm"
					/>
				</form>
			</div>
		</div>
		<div class="secondary-info rounded-border">
			Languages:
			<div *ngFor="let lang of user.languages">
				<div class="user-language">
					{{ lang.name }}
				</div>
			</div>
			<div *ngIf="user.languages.length === 0">&nbsp;None</div>
		</div>
		<div class="secondary-info rounded-border">
			Technologies:
			<div *ngFor="let tech of user.technologies">
				<div class="user-language">
					{{ tech.name }}
				</div>
			</div>
			<div *ngIf="user.technologies.length === 0">&nbsp;None</div>
		</div>
		<hr />
		<div id="posts">
			<div id="no-posts" *ngIf="userPosts.length === 0">
				{{ user.firstName }} {{ user.lastName }} hasn't posted anything
				yet!
			</div>
			<div *ngFor="let userPost of userPosts">
				<app-post [paramId]="userPost.postId.toString()"></app-post>
			</div>
		</div>
	</div>
	<app-footer></app-footer>
</div>