From 5a2ba9c2e7605bb788bc406184547d22c6436867 Mon Sep 17 00:00:00 2001
From: Freya Murphy <freya@freyacat.org>
Date: Mon, 23 Dec 2024 11:13:27 -0500
Subject: v2.1.0, refactor w/ crimson

---
 src/web/_views/profile/main.php | 269 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 269 insertions(+)
 create mode 100644 src/web/_views/profile/main.php

(limited to 'src/web/_views/profile/main.php')

diff --git a/src/web/_views/profile/main.php b/src/web/_views/profile/main.php
new file mode 100644
index 0000000..3e7129c
--- /dev/null
+++ b/src/web/_views/profile/main.php
@@ -0,0 +1,269 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<main id="main">
+	<div id="profile-header-container">
+		<div id="profile-header" class="col">
+			<?=image('/api/rpc/profile_banner?user_id=' . $user['id'], 'banner', mime: $user['banner_mime'])?>
+			<div class="info row">
+				<div class="pfp-wrapper">
+					<?=pfp($user)?>
+				</div>
+				<div class="col content grow">
+					<div class="row grow">
+						<div class="col mb">
+							<strong class="name"><?=$this->format_name($user)?></strong>
+							<span class="subtext"><?=$user['follower_count'] . ' ' . ucfirst(lang('followers'))?></span>
+						</div>
+						<?php if (
+							$session &&
+							($session['id'] != $user['id'])
+						): ?>
+						<div class="follow">
+							<?=ilang(
+								'action_follow',
+								id: 'action-follow-follow',
+								class: 'btn btn-alt',
+								sub: [$user['first_name']],
+								style: (!$following && !$followed) ? '' : 'display: none',
+							)?>
+							<?=ilang(
+								'action_follow_back',
+								id: 'action-follow-follow-back',
+								class: 'btn btn-alt',
+								sub: [$user['first_name']],
+								style: (!$following && $followed) ? '' : 'display: none',
+							)?>
+							<?=ilang(
+								'action_following',
+								id: 'action-follow-following',
+								class: 'btn btn-alt btn-primary',
+								sub: [$user['first_name']],
+								style: ($following && !$followed) ? '' : 'display: none',
+							)?>
+							<?=ilang(
+								'action_friends',
+								id: 'action-follow-friends',
+								class: 'btn btn-alt btn-primary',
+								sub: [$user['first_name']],
+								style: ($following && $followed) ? '' : 'display: none',
+							)?>
+						</div>
+						<script>
+							let following = <?=json_encode($following)?>;
+							let followingId = <?=json_encode($following_id)?>;
+							let followed = <?=json_encode($followed)?>;
+							let followee_id = <?=json_encode($user['id'])?>;
+							let btns = {};
+
+							const disableBtn = (btn) => {
+								btn.css('display', 'none');
+							};
+
+							const enableBtn	= (btn) => {
+								btn.css('display', '');
+							};
+
+							const updateFollow = () => {
+								for (let btn of Object.values(btns)) {
+									disableBtn(btn);
+								}
+								if (!following && !followed) {
+									enableBtn(btns['follow']);
+								} else if (!following && followed) {
+									enableBtn(btns['follow-back']);
+								} else if (following && !followed) {
+									enableBtn(btns['following']);
+								} else if (following && followed) {
+									enableBtn(btns['friends']);
+								}
+							}
+
+							const onPatchFollow = (data) => {
+								following = data[0].value;
+								updateFollow();
+							}
+
+							const onPostFollow = (data) => {
+								followingId = data[0].id;
+								following = true;
+								updateFollow();
+							}
+
+							const onClickFollow = () => {
+								if (followingId) {
+									$.ajax({
+										url: '/api/follow?id=eq.' + followingId,
+										method: 'PATCH',
+										data: JSON.stringify({ followee_id, value: !following }),
+										success: onPatchFollow
+									});
+								} else {
+									$.ajax({
+										url: '/api/follow',
+										method: 'POST',
+										data: JSON.stringify({ followee_id, value: !following }),
+										success: onPostFollow,
+									});
+								}
+							}
+
+							const loadBtn = (name) => {
+								let btn = $('#action-follow-' + name);
+								btn.on('click', onClickFollow);
+
+								btns[name] = btn;
+							};
+
+							loadBtn('follow');
+							loadBtn('follow-back');
+							loadBtn('following');
+							loadBtn('friends');
+						</script>
+						<?php endif; ?>
+					</div>
+					<?php if(strlen($user['profile_bio']) > 0): ?>
+						<br>
+						<strong><?=ucfirst(lang('bio'))?></strong>
+						<span class="subtext"><?=$user['profile_bio']?></span>
+					<?php endif; ?>
+				</div>
+			</div>
+			<hr>
+			<div class="row options">
+				<?=ilang('action_posts',
+					sub: [$user['first_name']],
+					class: 'btn btn-primary btn-border',
+					id: 'action-posts'
+				)?>
+				<?=ilang('action_about',
+					sub: [$user['first_name']],
+					class: 'btn',
+					id: 'action-about'
+				)?>
+				<?=ilang('action_followers',
+					sub: [$user['first_name']],
+					class: 'btn',
+					id: 'action-followers'
+				)?>
+				<?=ilang('action_following',
+					sub: [$user['first_name']],
+					class: 'btn',
+					id: 'action-following'
+				)?>
+		</div>
+		</div>
+	</div>
+	<div id="tab-container" class="mt">
+		<div id="tab-posts" class="tab">
+			<?php
+				$_GET['user_id'] = $user['id'];
+				$this->post_controller->index();
+			?>
+		</div>
+		<div id="tab-about" class="tab card">
+			<h1><?=ucfirst(lang('about_general'))?></h1>
+			<table>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_general_username'))?></strong></td>
+					<td><?=$user['username']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_general_full_name'))?></strong></td>
+					<td><?=$user['first_name'] . ' ' . $user['last_name']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_general_email'))?></strong></td>
+					<td><?=$user['email']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_general_gender'))?></strong></td>
+					<td><?=$user['gender']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_general_birth_date'))?></strong></td>
+					<td><?=$this->format_date($user['birth_date'])?></td>
+				</tr>
+			</table>
+			<h1><?=ucfirst(lang('about_stats'))?></h1>
+			<table>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_posts'))?></strong></td>
+					<td><?=$user['post_count']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_like'))?></strong></td>
+					<td><?=$user['like_count']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_comments'))?></strong></td>
+					<td><?=$user['comment_count']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_following'))?></strong></td>
+					<td><?=$user['followed_count']?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_joined'))?></strong></td>
+					<td><?=$this->format_date($user['created'])?></td>
+				</tr>
+				<tr>
+					<td><strong><?=ucfirst(lang('about_stats_seen'))?></strong></td>
+					<td><?=$this->format_date($user['seen'])?></td>
+				</tr>
+			</table>
+		</div>
+		<div id="tab-followers" class="tab">
+		<?php
+			$_GET['filter'] = 'follower';
+			$_GET['uid'] = $user['id'];
+			$this->people_controller->content();
+		?>
+		</div>
+		<div id="tab-following" class="tab">
+		<?php
+			$_GET['filter'] = 'followee';
+			$_GET['uid'] = $user['id'];
+			$this->people_controller->content();
+		?>
+		</div>
+	</div>
+	<script>
+		let tabs = {};
+
+		const disableTab = (tab) => {
+			tab.btn.removeClass('btn-primary');
+			tab.btn.removeClass('btn-border');
+			tab.tab.css('display', 'none');
+		};
+
+		const enableTab = (tab) => {
+			tab.btn.addClass('btn-primary');
+			tab.btn.addClass('btn-border');
+			tab.tab.css('display', '');
+		};
+
+		const loadTab = (name, disable = true) => {
+			let btn = $('#action-' + name);
+			btn.on('click', function() {
+				for (let tab of Object.values(tabs)) {
+					disableTab(tab);
+				}
+				enableTab(tabs[name]);
+			});
+
+			tabs[name] = {
+				'btn': btn,
+				'tab': $('#tab-' + name)
+			};
+
+			if (disable) {
+				disableTab(tabs[name]);
+			}
+		};
+
+		loadTab('posts', false);
+		loadTab('about');
+		loadTab('followers');
+		loadTab('following');
+	</script>
+</main>
-- 
cgit v1.2.3-freya