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/settings/main.php | 197 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 197 insertions(+)
 create mode 100644 src/web/_views/settings/main.php

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

diff --git a/src/web/_views/settings/main.php b/src/web/_views/settings/main.php
new file mode 100644
index 0000000..4401fe1
--- /dev/null
+++ b/src/web/_views/settings/main.php
@@ -0,0 +1,197 @@
+<?php /* Copyright (c) 2024 Freya Murphy */
+
+$user = $session;
+
+function __create_form($user, $col) {
+	$ph = ucfirst(lang('ph_' . $col));
+	$val = $user[$col];
+	return "<form action=\"\" class=\"row mt settings-form\" onsubmit=\"handleSubmit(event)\">
+			<div class=\"form-input mb\" style=\"flex: 1\">
+				<input
+					type=\"text\"
+					name=\"{$col}\"
+					id=\"{$col}\"
+					placeholder=\" \"
+					value=\"{$val}\"
+				>
+				<label for=\"{$col}\">
+					{$ph}
+				</label>
+			</div>
+			<input type=\"hidden\" name=\"col\" value=\"{$col}\">
+			<input type=\"hidden\" name=\"uid\" value=\"{$user['id']}\">
+			<button
+				class=\"btn btn-submit ml\"
+				style=\"flex: 0; height: fit-content;\"
+			><i class=\"mi\">check</i></button>
+		</form>";
+}
+
+?>
+
+<script>
+
+function onSuccess() {
+	successToast(<?=json_encode(ucfirst(lang('settings_success')))?>);
+}
+
+function handleSubmit(e) {
+	e.preventDefault();
+	let el = e.target.elements;
+	let col = el.col.value;
+	let uid = el.uid.value;
+	let val = el[col].value;
+
+	$.ajax({
+		url: '/api/user?id=eq.' + uid,
+		method: 'PATCH',
+		data: JSON.stringify({ [col]: val }),
+		success: onSuccess
+	});
+
+}
+
+function handlePassword(e) {
+	e.preventDefault();
+	let el = e.target.elements;
+	let curr = el.curr_password.value;
+	let newp = el.new_password.value;
+
+	$.ajax({
+		url: '/api/rpc/update_password',
+		method: 'POST',
+		data: JSON.stringify({
+			new_password: newp,
+			current_password: curr
+		}),
+		success: onSuccess
+	})
+}
+
+const toBase64 = file => new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = reject;
+});
+
+function updateMedia(media_type) {
+
+	var input = document.createElement('input');
+	input.type = 'file';
+
+	input.onchange = async (e) => {
+		var file = e.target.files[0];
+		var data = (await toBase64(file)).split(";");
+		var mime = data[0].split(":")[1];
+		var content = data[1].split(",")[1];
+
+		$.ajax({
+			url: '/api/rpc/update_user_media',
+			method: 'POST',
+			data: JSON.stringify({
+				media_type, mime, content
+			}),
+			success: onSuccess
+		});
+
+	}
+
+	input.click();
+
+}
+
+function resetMedia(media_type) {
+	$.ajax({
+		url: '/api/rpc/delete_user_media',
+		method: 'POST',
+		data: JSON.stringify({
+			media_type
+		}),
+		success: onSuccess
+	});
+}
+</script>
+
+<main id="main">
+	<div id="settings" class="card">
+		<h1><?=ucfirst(lang('title'))?></h1>
+		<hr class="mt">
+		<h2><?=ucfirst(lang('general_title'))?></h2>
+		<strong><?=ucfirst(lang('general_desc'))?></strong>
+		<?=__create_form($user, 'username')?>
+		<?=__create_form($user, 'email')?>
+		<?=__create_form($user, 'first_name')?>
+		<?=__create_form($user, 'last_name')?>
+		<?=__create_form($user, 'gender')?>
+		<?=__create_form($user, 'profile_bio')?>
+		<hr class="mt">
+		<h2><?=ucfirst(lang('security_title'))?></h2>
+		<strong><?=ucfirst(lang('security_desc'))?></strong>
+		<form action="" class="col mt settings-form" onsubmit="handlePassword(event)">
+			<div class="form-input mb" style="flex: 1">
+				<input
+					type="password"
+					name="curr_password"
+					id="curr_password"
+					placeholder=" "
+				>
+				<label for="curr_password">
+					<?=ucwords(lang('ph_current_pass'))?>
+				</label>
+			</div>
+			<div class="form-input mb" style="flex: 1">
+				<input
+					type="password"
+					name="new_password"
+					id="new_password"
+					placeholder=" "
+				>
+				<label for="new_password">
+					<?=ucwords(lang('ph_new_pass'))?>
+				</label>
+			</div>
+			<button
+				class="btn grow btn-alt btn-submit"
+				style="flex: 0; height: fit-content;"
+			><?=lang('update')?></button>
+		</form>
+		<hr class="mt">
+		<h2><?=ucfirst(lang('media_title'))?></h2>
+		<strong><?=ucfirst(lang('media_desc'))?></strong>
+		<h3><?=ucfirst(lang('ph_avatar'))?></h3>
+		<div class="row">
+		<?=image(
+			"/api/rpc/profile_avatar?user_id={$user['id']}",
+			height: '100px'
+		)?>
+			<div class="col ml">
+				<button
+					class="btn btn-alt btn-primary"
+					onclick="updateMedia('avatar')"
+				><?=ucfirst(lang('update'))?></button>
+				<button
+					class="btn btn-alt btn-primary mt"
+					onclick="resetMedia('avatar')"
+				><?=ucfirst(lang('reset'))?></button>
+			</div>
+		</div>
+		<h3><?=ucfirst(lang('ph_banner'))?></h3>
+		<div class="row">
+		<?=image(
+			"/api/rpc/profile_banner?user_id={$user['id']}",
+			height: '100px'
+		)?>
+			<div class="col ml">
+				<button
+					class="btn btn-alt btn-primary"
+					onclick="updateMedia('banner')"
+				><?=ucfirst(lang('update'))?></button>
+				<button
+					class="btn btn-alt btn-primary mt"
+					onclick="resetMedia('banner')"
+				><?=ucfirst(lang('reset'))?></button>
+			</div>
+		</div>
+	</div>
+</main>
-- 
cgit v1.2.3-freya