sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2025-06-13 17:40:40 +00:00
Code Issues Projects Releases Wiki Activity

Update settings page

Browse Source
This commit is contained in:
Patrick Jentsch
2023-03-27 13:56:24 +02:00
parent 020de69e45
commit df870c1c7d
5 changed files with 112 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
app/templates/settings/settings.html.j2
View File

@ -9,81 +9,62 @@
</div>
</div>
<div class="row">
<div class="col s4">
<div class="col s12 l4">
<h4>Profile Settings</h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea tak</p>
</div>
<div class="col s8">
<div class="col s12 l8">
<br>
<ul class="collapsible no-autoinit settings-collapsible">
<li>
<div class="collapsible-header" style="justify-content: space-between;"><span>Public Profile</span><i class="material-icons caret right">keyboard_arrow_right</i></div>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Profile Privacy Settings</span>
<i class="material-icons caret">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l3">
<div class="switch">
<label>
private
<input {% if user.is_public %}checked{% endif %} id="profile-is-public-switch" type="checkbox">
<span class="lever"></span>
public
</label>
</div>
</div>
<div class="col s12 l3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_EMAIL') %}checked{% endif %} class="profile-privacy-setting-checkbox" data-profile-privacy-setting-name="SHOW_EMAIL" {% if not user.is_public %}disabled{% endif %} type="checkbox">
<span>Email</span>
</label>
</div>
<div class="col s12 l3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_LAST_SEEN') %}checked{% endif %} class="profile-privacy-setting-checkbox" data-profile-privacy-setting-name="SHOW_LAST_SEEN" {% if not user.is_public %}disabled{% endif %} type="checkbox">
<span>Last seen</span>
</label>
</div>
<div class="col s12 l3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_MEMBER_SINCE') %}checked{% endif %} class="profile-privacy-setting-checkbox" data-profile-privacy-setting-name="SHOW_MEMBER_SINCE" {% if not user.is_public %}disabled{% endif %} type="checkbox">
<span>Member since</span>
</label>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Profile information</span>
<i class="material-icons caret">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<form method="POST" enctype="multipart/form-data">
{{ edit_profile_form.hidden_tag() }}
<div class="switch">
<label>
private
<input {% if user.is_public %}checked{% endif %} id="profile-is-public-switch" type="checkbox">
<span class="lever"></span>
public
</label>
</div>
<p></p>
<br>
<div class="divider"></div>
<p>Show:</p>
<div class="row">
<div class="col s3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_EMAIL') %}checked{% endif %} id="profile-show-email-checkbox" type="checkbox">
<span>Email</span>
</label>
</div>
<div class="col s3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_LAST_SEEN') %}checked{% endif %} id="profile-show-last-seen-checkbox" type="checkbox">
<span>Last seen</span>
</label>
</div>
<div class="col s3">
<label>
<input {% if user.has_profile_privacy_setting('SHOW_MEMBER_SINCE') %}checked{% endif %} id="profile-show-member-since-checkbox" type="checkbox">
<span>Member since</span>
</label>
</div>
</div>
{# <div class="row">
<div class="col s3">
<p>
<label>
{{ edit_profile_form.show_email() }}
<span>{{ edit_profile_form.show_email.label.text }}</span>
</label>
</p>
</div>
<div class="col s3">
<p>
<label>
{{ edit_profile_form.show_last_seen() }}
<span>{{ edit_profile_form.show_last_seen.label.text }}</span>
</label>
</p>
</div>
<div class="col s4">
<p>
<label>
{{ edit_profile_form.show_member_since() }}
<span>{{ edit_profile_form.show_member_since.label.text }}</span>
</label>
</p>
</div>
</div> #}
<p></p>
<br>
{{ wtf.render_field(edit_profile_form.full_name, material_icon='badge') }}
{{ wtf.render_field(edit_profile_form.about_me, material_icon='description', id='about-me-textfield') }}
{{ wtf.render_field(edit_profile_form.website, material_icon='laptop') }}
@ -113,20 +94,20 @@
</div>
</div>
<div class="row">
<div class="col s4">
<div class="col s12 l4">
<h4>General Settings</h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea tak</p>
</div>
<div class="col s8">
<div class="col s12 l8">
<br>
<ul class="collapsible no-autoinit settings-collapsible">
<li>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Account</span>
<i class="caret material-icons right">keyboard_arrow_right</i>
<i class="caret material-icons">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<form method="POST" enctype="multipart/form-data">
@ -167,7 +148,7 @@
<li>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Change Password</span>
<i class="caret material-icons right">keyboard_arrow_right</i>
<i class="caret material-icons">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<form method="POST">
@ -199,6 +180,7 @@
<a class="btn modal-close red waves-effect waves-light" id="delete-avatar">Delete</a>
</div>
</div>
<div class="modal" id="delete-user">
<div class="modal-content">
<h4>Confirm User deletion</h4>
@ -224,7 +206,7 @@ avatarUploadElement.addEventListener('change', () => {
});
deleteButtonElement.addEventListener('click', () => {
Requests.settings.entity.deleteAvatar(currentUserId)
Requests.settings.entity.deleteAvatar({{ user.hashid|tojson }})
.then(
(response) => {
avatarElement.src = {{ url_for('static', filename='images/user_avatar.png')|tojson }};
@ -233,7 +215,7 @@ deleteButtonElement.addEventListener('click', () => {
});
document.querySelector('#delete-user-button').addEventListener('click', (event) => {
Requests.settings.entity.delete(currentUserId)
Requests.settings.entity.delete({{ user.hashid|tojson }})
.then((response) => {window.location.href = '/';});
});
@ -253,15 +235,33 @@ for (let collapsibleElement of document.querySelectorAll('.collapsible.no-autoin
);
}
// #region Public Switch
// #region Profile Privacy settings
let profileIsPublicSwitchElement = document.querySelector('#profile-is-public-switch');
let profilePrivacySettingCheckboxElements = document.querySelectorAll('.profile-privacy-setting-checkbox');
profileIsPublicSwitchElement.addEventListener('change', (event) => {
let newIsPublic = profileIsPublicSwitchElement.checked;
Requests.settings.entity.isPublic.update(currentUserId, newIsPublic)
.catch((response) => {
profileIsPublicSwitchElement.checked = !newIsPublic;
});
Requests.settings.entity.isPublic.update({{ user.hashid|tojson }}, newIsPublic)
.then(
(response) => {
for (let profilePrivacySettingCheckboxElement of document.querySelectorAll('.profile-privacy-setting-checkbox')) {
profilePrivacySettingCheckboxElement.disabled = !newIsPublic;
}
},
(response) => {
profileIsPublicSwitchElement.checked = !newIsPublic;
}
);
});
// #endregion Public Switch
for (let profilePrivacySettingCheckboxElement of profilePrivacySettingCheckboxElements) {
profilePrivacySettingCheckboxElement.addEventListener('change', (event) => {
let newEnabled = profilePrivacySettingCheckboxElement.checked;
let valueName = profilePrivacySettingCheckboxElement.dataset.profilePrivacySettingName;
Requests.settings.entity.profilePrivacySettings.update({{ user.hashid|tojson }}, valueName, newEnabled)
.catch((response) => {
profilePrivacySettingCheckboxElement.checked = !newEnabled;
});
});
}
// #endregion Profile Privacy settings
</script>
{% endblock scripts %}