From 994c6d3cde77278badc6dd74d9c1e54129e8c7e5 Mon Sep 17 00:00:00 2001
From: hazycora <hazysu@riseup.net>
Date: Tue, 26 Sep 2023 00:56:20 -0500
Subject: [PATCH] move pronouns JS
---
templates/user/settings/profile.tmpl | 24 ---------------------
web_src/js/features/user-settings.js | 31 ++++++++++++++++++++++++++++
2 files changed, 31 insertions(+), 24 deletions(-)
diff --git a/templates/user/settings/profile.tmpl b/templates/user/settings/profile.tmpl
index 7638727e8c..822651a9db 100644
--- a/templates/user/settings/profile.tmpl
+++ b/templates/user/settings/profile.tmpl
@@ -62,30 +62,6 @@
</div>
</div>
<input id="pronouns-custom" name="pronouns" value="{{.SignedUser.Pronouns}}" maxlength="50">
- <script>
- (() => {
- const pronounsDropdown = document.getElementById('pronouns-dropdown')
- const pronounsCustom = document.getElementById('pronouns-custom')
- const pronounsInput = pronounsDropdown.querySelector('input')
- pronounsCustom.removeAttribute('name')
- pronounsDropdown.style.display = ''
- function onPronounsDropdownUpdate() {
- const isCustom = !(pronounsInput.value == 'he/him' || pronounsInput.value == 'she/her' || pronounsInput.value == 'they/them' || pronounsInput.value == 'it/its')
- if (isCustom) {
- pronounsCustom.value = pronounsInput.value
- pronounsCustom.style.display = ''
- } else {
- pronounsCustom.style.display = 'none'
- }
- }
- function onPronounsCustomUpdate() {
- pronounsInput.value = pronounsCustom.value
- }
- onPronounsDropdownUpdate()
- pronounsInput.addEventListener('change', onPronounsDropdownUpdate)
- pronounsCustom.addEventListener('input', onPronounsCustomUpdate)
- })()
- </script>
</div>
<div class="divider"></div>
diff --git a/web_src/js/features/user-settings.js b/web_src/js/features/user-settings.js
index 2d8c53e457..d2617dda6a 100644
--- a/web_src/js/features/user-settings.js
+++ b/web_src/js/features/user-settings.js
@@ -1,5 +1,27 @@
import {hideElem, showElem} from '../utils/dom.js';
+function onPronounsDropdownUpdate() {
+ const pronounsCustom = document.getElementById('pronouns-custom');
+ const pronounsInput = document.querySelector('#pronouns-dropdown input');
+ const isCustom = !(
+ pronounsInput.value === 'he/him' ||
+ pronounsInput.value === 'she/her' ||
+ pronounsInput.value === 'they/them' ||
+ pronounsInput.value === 'it/its'
+ );
+ if (isCustom) {
+ pronounsCustom.value = pronounsInput.value;
+ pronounsCustom.style.display = '';
+ } else {
+ pronounsCustom.style.display = 'none';
+ }
+}
+function onPronounsCustomUpdate() {
+ const pronounsCustom = document.getElementById('pronouns-custom');
+ const pronounsInput = document.querySelector('#pronouns-dropdown input');
+ pronounsInput.value = pronounsCustom.value;
+}
+
export function initUserSettings() {
if (!document.querySelectorAll('.user.settings.profile').length) return;
@@ -16,4 +38,13 @@ export function initUserSettings() {
hideElem(promptRedirect);
}
});
+
+ const pronounsDropdown = document.getElementById('pronouns-dropdown');
+ const pronounsCustom = document.getElementById('pronouns-custom');
+ const pronounsInput = pronounsDropdown.querySelector('input');
+ pronounsCustom.removeAttribute('name');
+ pronounsDropdown.style.display = '';
+ onPronounsDropdownUpdate();
+ pronounsInput.addEventListener('change', onPronounsDropdownUpdate);
+ pronounsCustom.addEventListener('input', onPronounsCustomUpdate);
}