From: Ammar Faizi <[email protected]>
To: Muhammad Rizki <[email protected]>
Cc: Ammar Faizi <[email protected]>,
GNU/Weeb Mailing List <[email protected]>,
Alviro Iskandar Setiawan <[email protected]>
Subject: [PATCH gwmail 4/7] old: Add profile page
Date: Fri, 28 Feb 2025 06:22:31 +0700 [thread overview]
Message-ID: <[email protected]> (raw)
In-Reply-To: <[email protected]>
Initial example of profile related API.
Signed-off-by: Ammar Faizi <[email protected]>
---
old/assets/js/api.js | 58 ++++++++++++----
old/home.html | 8 +--
old/profile.html | 159 +++++++++++++++++++++++++++++++++++++++++++
3 files changed, 206 insertions(+), 19 deletions(-)
create mode 100644 old/profile.html
diff --git a/old/assets/js/api.js b/old/assets/js/api.js
index 6593198aab2a..9a14a83633c8 100644
--- a/old/assets/js/api.js
+++ b/old/assets/js/api.js
@@ -6,6 +6,12 @@ function gid(i)
return document.getElementById(i);
}
+function toggle_disable_inputs(form, disable)
+{
+ for (let i = 0; i < form.length; i++)
+ form[i].disabled = disable;
+}
+
function escape_html(s)
{
return s.replace(/&/g, "&")
@@ -71,6 +77,17 @@ function gwm_api_get_user_info(cb)
});
}
+function gwm_api_set_user_info(cb, data)
+{
+ gwm_exec_api_multipart({
+ method: "POST",
+ url: GWM_API_URL + "set_user_info",
+ data: data,
+ token: LS.getItem("gwm_token"),
+ callback: cb
+ });
+}
+
function gwm_api_login(cb, user, pass)
{
gwm_exec_api_json({
@@ -127,6 +144,11 @@ function gwm_fn_change_password(cb, cur_pass, new_pass, retype_new_pass)
});
}
+function gwm_fn_set_user_info(cb, data)
+{
+ gwm_api_set_user_info(cb, data);
+}
+
function gwm_fn_logout()
{
LS.clear();
@@ -148,6 +170,29 @@ function gwm_auth_redirect_if_authorized()
return false;
}
+function gwm_auth_renew_session(cb = null)
+{
+ gwm_api_get_user_info(function(j, x) {
+ // If cancelled, do nothing
+ if (x.status === 0)
+ return;
+
+ if (j.code !== 200) {
+ alert("Your session has expired. Please login again.");
+ gwm_fn_logout();
+ return;
+ }
+
+ let rt = j.res.renew_token;
+ LS.setItem("gwm_uinfo", JSON.stringify(j.res.user_info));
+ LS.setItem("gwm_token", rt.token);
+ LS.setItem("gwm_token_exp_at", rt.token_exp_at);
+
+ if (cb)
+ cb();
+ });
+}
+
function gwm_auth_redirect_if_not_authorized()
{
let tkn = LS.getItem("gwm_token");
@@ -166,17 +211,6 @@ function gwm_auth_redirect_if_not_authorized()
return true;
}
- gwm_api_get_user_info(function(j) {
- if (j.code !== 200) {
- alert("Your session has expired. Please login again.");
- gwm_fn_logout();
- return;
- }
-
- let rt = j.res.renew_token;
- LS.setItem("gwm_uinfo", JSON.stringify(j.res.user_info));
- LS.setItem("gwm_token", rt.token);
- LS.setItem("gwm_token_exp_at", rt.token_exp_at);
- });
+ gwm_auth_renew_session();
return false;
}
diff --git a/old/home.html b/old/home.html
index baaf067c8f20..4ba0039d044b 100644
--- a/old/home.html
+++ b/old/home.html
@@ -43,6 +43,7 @@ body {
<h1>GNU/Weeb Mail Dashboard</h1>
<h2>Welcome <span id="uinfo_full_name"></span></h2>
<h2>This is an emergency page to change your password. It's still under development.</h2>
+ <h1><a href="profile.html">Open Profile</a></h1>
<div class="form-cage">
<form action="javascript:void(0);" method="POST" id="change_pass_form">
<h1>Change Password</h1>
@@ -80,13 +81,6 @@ Auth: Normal Password
</div>
</body>
<script>
-
-function toggle_disable_inputs(form, disable)
-{
- for (let i = 0; i < form.length; i++)
- form[i].disabled = disable;
-}
-
function main()
{
let u, cpf;
diff --git a/old/profile.html b/old/profile.html
new file mode 100644
index 000000000000..07fa8f8434a0
--- /dev/null
+++ b/old/profile.html
@@ -0,0 +1,159 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>GNU/Weeb Mail Login</title>
+<meta charset="UTF-8"/>
+<meta name="viewport" content="width=device-width,initial-scale=1.00"/>
+<script type="text/javascript" src="assets/js/api.js"></script>
+</head>
+<body>
+<center><a href="/home.html"><h1>Back to Home</h1></a></center>
+<div id="frcg">
+ <form method="POST" id="uform" enctype="application/x-www-form-urlencoded">
+ <table>
+ <thead>
+ <tr colspan="3"><td></td></tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td align="center" colspan="3">
+ <div id="photo_box"></div>
+ </td>
+ </tr>
+ <tr>
+ <td>Upload Photo</td>
+ <td>:</td>
+ <td><input type="file" name="photo" id="uform_photo"/></td>
+ </tr>
+ <tr>
+ <td>Full Name</td>
+ <td>:</td>
+ <td><input type="text" name="full_name" id="uform_full_name" required/></td>
+ </tr>
+ <tr>
+ <td>External Email</td>
+ <td>:</td>
+ <td><input type="email" name="ext_email" id="uform_ext_email" required/></td>
+ </tr>
+ <tr>
+ <td>Gender</td>
+ <td>:</td>
+ <td>
+ <select name="gender" id="uform_gender" required>
+ <option value=""></option>
+ <option value="m">Male</option>
+ <option value="f">Female</option>
+ </select>
+ </td>
+ </tr>
+ <tr>
+ <!-- Username cannot be changed, so disable the input. -->
+ <td>Username</td>
+ <td>:</td>
+ <td><input type="text" name="username" disabled="1" id="uform_username"/></td>
+ </tr>
+ <tr>
+ <td>GitHub Username</td>
+ <td>:</td>
+ <td><input type="text" name="socials[github_username]" id="uform_github_username" required/></td>
+ </tr>
+ <tr>
+ <td>Telegram Username</td>
+ <td>:</td>
+ <td><input type="text" name="socials[telegram_username]" id="uform_telegram_username" required/></td>
+ </tr>
+ <tr>
+ <td>Twitter Username</td>
+ <td>:</td>
+ <td><input type="text" name="socials[twitter_username]" id="uform_twitter_username" required/></td>
+ </tr>
+ <tr>
+ <td>Discord Username</td>
+ <td>:</td>
+ <td><input type="text" name="socials[discord_username]" id="uform_discord_username" required/></td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr><td colspan="3"><hr/></td></tr>
+ <tr>
+ <td>Enter your password</td>
+ <td>:</td>
+ <td><input type="password" name="password" required/></td>
+ </tr>
+ <tr><td colspan="3"><hr/></td></tr>
+ <tr>
+ <td align="center" colspan="3">
+ <button type="submit">Save</button>
+ </td>
+ </tr>
+ </tfoot>
+ </table>
+ </form>
+</div>
+<style>
+#photo_box {
+ width: 200px;
+ height: 200px;
+ border: 1px solid #000;
+}
+#frcg {
+ margin: 0 auto;
+ margin-top: 100px;
+}
+#uform {
+ padding: 20px;
+ margin: 0 auto;
+ width: 800px;
+ border: 1px solid #000;
+}
+#uform table {
+ padding: 20px;
+ margin: 0 auto;
+ width: 500px;
+ border: 1px solid #000;
+}
+</style>
+<script>
+function form_uinfo_set_inputs(u)
+{
+ gid("uform_full_name").value = u.full_name;
+ gid("uform_ext_email").value = u.ext_email;
+ gid("uform_gender").value = u.gender;
+ gid("uform_username").value = u.username;
+ gid("uform_github_username").value = u.socials.github_username;
+ gid("uform_telegram_username").value = u.socials.telegram_username;
+ gid("uform_twitter_username").value = u.socials.twitter_username;
+ gid("uform_discord_username").value = u.socials.discord_username;
+}
+
+function main()
+{
+ if (gwm_auth_redirect_if_not_authorized())
+ return;
+
+ let u = gwm_auth_get_user();
+ if (!u) {
+ gwm_fn_logout();
+ return;
+ }
+
+ form_uinfo_set_inputs(u);
+ let photo = gid("uform_photo");
+ let uform = gid("uform");
+ uform.addEventListener("submit", function(e) {
+ e.preventDefault();
+ let fd = new FormData(uform);
+ gwm_fn_set_user_info(function (j) {
+ gwm_auth_renew_session(function () {
+ toggle_disable_inputs(uform, false);
+ let u = gwm_auth_get_user();
+ form_uinfo_set_inputs(u);
+ });
+ }, fd);
+ toggle_disable_inputs(uform, true);
+ });
+}
+main();
+</script>
+</body>
+</html>
--
Ammar Faizi
next prev parent reply other threads:[~2025-02-27 23:22 UTC|newest]
Thread overview: 10+ messages / expand[flat|nested] mbox.gz Atom feed top
2025-02-27 23:22 [PATCH gwmail 0/7] User Profile Page Ammar Faizi
2025-02-27 23:22 ` [PATCH gwmail 1/7] settings/account: Add header 'change password' Ammar Faizi
2025-02-27 23:22 ` [PATCH gwmail 2/7] public: Refactor old interface to keep up with new API Ammar Faizi
2025-02-27 23:22 ` [PATCH gwmail 3/7] Rename 'public' to 'old' Ammar Faizi
2025-02-27 23:22 ` Ammar Faizi [this message]
2025-02-27 23:22 ` [PATCH gwmail 5/7] old: Add photo profile support Ammar Faizi
2025-02-27 23:22 ` [PATCH gwmail 6/7] routes: layout: Adjust field with new API Ammar Faizi
2025-02-27 23:22 ` [PATCH gwmail 7/7] old: Use relative path to redirect Ammar Faizi
2025-02-27 23:28 ` [PATCH gwmail 0/7] User Profile Page Ammar Faizi
2025-02-27 23:31 ` Ammar Faizi
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox