move pronouns JS

This commit is contained in:
hazycora 2023-09-26 00:56:20 -05:00
parent a6f068a93b
commit 994c6d3cde
No known key found for this signature in database
GPG key ID: 215AF1F81F86940E
2 changed files with 31 additions and 24 deletions

View file

@ -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>

View file

@ -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);
}