2022-05-04 23:09:46 +00:00
{% extends "settings.html" %}
2022-11-21 08:52:22 +00:00
{% block pagetitle %}Security Settings{% endblock %}
2022-05-04 23:09:46 +00:00
{% block content %}
2022-09-24 07:04:06 +00:00
< script defer src = "{{'js/settings_security.js' | asset}}" > < / script >
2022-11-06 06:35:49 +00:00
< div class = "row settings-page" id = "settings-page-security" >
2022-05-04 23:09:46 +00:00
< div class = "col col-lg-8" >
< div class = "settings" >
2022-11-06 06:35:49 +00:00
< section id = "site-settings-email-section" class = "settings-section-section" >
< h5 > Email< / h5 >
< div class = "settings-section rounded" >
< form action = "/settings/security" method = "post" >
2022-11-15 09:19:08 +00:00
< input type = "hidden" name = "formkey" value = "{{v|formkey}}" >
2022-11-06 06:35:49 +00:00
< input type = "hidden" name = "now" value = "{{now}}" >
< div class = "body" >
< div class = "d-lg-flex" >
< label for = "new-email" class = "w-lg-25" > Email< / label >
< div class = "w-lg-100" >
2023-01-20 07:10:54 +00:00
< input autocomplete = "off" class = "form-control" id = "new_email" { % if v . email % } placeholder = "{{v.email}}" { % else % } placeholder = "Your email" { % endif % } type = "email" pattern = '{{EMAIL_REGEX_PATTERN}}' name = "new_email" required >
2022-11-06 06:35:49 +00:00
{% if v.email and not v.is_activated %}
2023-01-01 11:58:39 +00:00
< div class = "text-danger text-small mt-1" id = "email-verify-text" > Email not verified. You will not be able to recover your account with this email until you verify it. < u > < button type = "button" data-nonce = "{{g.nonce}}" data-onclick = "postToastSwitch(this,'/verify_email');emailVerifyText()" class = "text-primary font-weight-bold ml-1" > Verify now.< / button > < / u > < / div >
2022-11-06 06:35:49 +00:00
{% elif not v.email %}
< div class = "text-danger text-small mt-1" id = "email-verify-text" > Add an email to secure your account in case you forget your password.< / div >
{% endif %}
< / div >
< / div >
< div class = "d-lg-flex mt-3" >
< label for = "email-password" class = "w-lg-25 d-none" id = "email-password-label" > Password< / label >
< div class = "w-lg-100" >
< input autocomplete = "off" type = "password" class = "form-control mb-2 d-none" id = "email-password" name = "password" required >
< small id = "emailpasswordRequired" class = "form-text font-weight-bold text-danger d-none mt-1" > Password required to update your email.< / small >
< / div >
2022-05-04 23:09:46 +00:00
< / div >
< small id = "emailpasswordRequired" class = "form-text font-weight-bold text-danger d-none mt-1" > Password required to update your email.< / small >
< / div >
2022-11-06 06:35:49 +00:00
< div class = "footer" >
< div class = "d-flex" >
2022-11-21 23:08:29 +00:00
{% if FEATURES['MARSEYBUX'] %}
2022-11-06 06:35:49 +00:00
{% if KOFI_TOKEN %}
2022-12-30 12:14:18 +00:00
< button type = "button" class = "btn btn-success" data-nonce = "{{g.nonce}}" data-onclick = "postToastSwitch(this,'/settings/kofi')" > Claim {{patron}} rewards< / button >
2022-11-06 06:35:49 +00:00
{% else %}
2022-12-30 12:14:18 +00:00
< button type = "button" class = "btn btn-success" data-nonce = "{{g.nonce}}" data-onclick = "postToastSwitch(this,'/settings/gumroad')" > Claim {{patron}} rewards< / button >
2022-11-06 06:35:49 +00:00
{% endif %}
{% endif %}
{% if v.email %}
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" class = "btn btn-primary ml-auto" type = "submit" data-nonce = "{{g.nonce}}" data-onclick = "disable(this)" value = "Update email" >
2022-10-30 18:43:06 +00:00
{% else %}
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" class = "btn btn-primary ml-auto" type = "submit" data-nonce = "{{g.nonce}}" data-onclick = "disable(this)" value = "Add email" >
2022-10-30 18:43:06 +00:00
{% endif %}
2022-11-06 06:35:49 +00:00
< / div >
2022-11-21 23:08:29 +00:00
{% if FEATURES['MARSEYBUX'] %}
2022-11-06 06:35:49 +00:00
< span class = "text-small text-muted pl-1" > Must be same email as the one you used to donate
2022-11-26 20:20:30 +00:00
{% if v.truescore >= TRUESCORE_DONATE_MINIMUM %}
2023-01-01 11:36:20 +00:00
on
2022-11-06 06:35:49 +00:00
{% if KOFI_TOKEN %}
< a rel = "nofollow noopener" class = "text-primary" href = "{{KOFI_LINK}}" > Kofi< / a >
{% else %}
< a rel = "nofollow noopener" class = "text-primary" href = "{{GUMROAD_LINK}}" > Gumroad< / a >
{% endif %}
{% endif %}
< / span >
2022-09-13 16:53:19 +00:00
{% endif %}
2022-11-06 06:35:49 +00:00
< / div >
2023-01-01 11:36:20 +00:00
< / form >
2022-05-04 23:09:46 +00:00
< / div >
2022-11-06 06:35:49 +00:00
< / section >
< section id = "site-settings-password-section" class = "settings-section-section" >
< h5 > Password< / h5 >
< div class = "settings-section rounded" >
< form action = "/settings/security" method = "post" >
2023-01-01 11:36:20 +00:00
< div class = "body" >
2022-11-06 06:35:49 +00:00
< div class = "d-lg-flex" >
< label for = "old_password" class = "mb-0 w-lg-25" > Old Password< / label >
2022-12-25 02:10:56 +00:00
< input autocomplete = "off" class = "form-control mb-2 w-lg-100" id = "old_password" type = "password" name = "old_password" required >
2022-11-06 06:35:49 +00:00
< / div >
< div class = "d-lg-flex mt-5" >
< label for = "new_password" class = "mb-0 w-lg-25" > New Password< / label >
2022-12-25 02:10:56 +00:00
< input autocomplete = "off" class = "form-control w-lg-100" id = "new_password" type = "password" name = "new_password" required >
2022-11-06 06:35:49 +00:00
< small id = "passwordHelpChange" class = "form-text font-weight-bold text-muted d-none mt-1 w-lg-100" > Minimum of 8 characters required.< / small >
< small id = "passwordHelpChangeSuccess" class = "form-text font-weight-bold text-success d-none mt-1 w-lg-100" > Your password meets the requirements.< / small >
< / div >
< div class = "d-lg-flex mt-4" >
< label for = "cnf_password" class = "mb-0 w-lg-25" > Confirm New Password< / label >
2022-12-25 02:10:56 +00:00
< input autocomplete = "off" class = "form-control w-lg-100" id = "cnf_password" type = "password" name = "cnf_password" required >
2022-11-06 06:35:49 +00:00
< small id = "passwordHelpCnf" class = "form-text font-weight-bold text-muted d-none mt-1 w-lg-100" > Passwords do not match.< / small >
< small id = "passwordHelpCnfSuccess" class = "form-text font-weight-bold text-success d-none mt-1 w-lg-100" > Passwords match.< / small >
< / div >
< / div >
< div class = "footer" >
2022-11-15 09:19:08 +00:00
< input type = "hidden" name = "formkey" value = "{{v|formkey}}" >
2022-11-06 06:35:49 +00:00
< input type = "hidden" name = "now" value = "{{now}}" >
< div class = "d-flex" >
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" class = "btn btn-primary ml-auto" type = "submit" data-nonce = "{{g.nonce}}" data-onclick = "disable(this)" value = "Change Password" >
2022-11-06 06:35:49 +00:00
< / div >
< / div >
< / form >
< / div >
< / section >
< section id = "site-settings-2fa-section" class = "settings-section-section" >
< h5 > Two-Factor Authentication< / h5 >
< div class = "settings-section rounded" >
< div class = "d-lg-flex" >
< div class = "title w-lg-25" >
< label for = "2faToggle" > Use 2-step login< / label >
< / div >
< div class = "body w-lg-100" >
< div class = "custom-control custom-switch" >
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" type = "checkbox" class = "custom-control-input" id = "2faToggle" name = "2faToggle" data-nonce = "{{g.nonce}}" { % if v . mfa_secret % } checked { % endif % } >
2022-11-06 06:35:49 +00:00
< label class = "custom-control-label" for = "2faToggle" > < / label >
< / div >
< span class = "text-small text-muted" > This requires entering a randomly-generated, 6-digit code and your password to login.< / span >
< / div >
< / div >
< / div >
< / section >
< section id = "site-settings-logout-everywhere-section" class = "settings-section-section" >
< h5 > Log Out Everywhere< / h5 >
< form action = "/settings/log_out_all_others" method = "post" >
2022-11-15 09:19:08 +00:00
< input type = "hidden" name = "formkey" value = "{{v|formkey}}" >
2022-05-04 23:09:46 +00:00
< div class = "body" >
< div class = "d-lg-flex" >
2022-11-06 06:35:49 +00:00
< label for = "forcelog-password" class = "w-lg-25" id = "email-password-label" > Password< / label >
< div class = "w-lg-100" >
< input autocomplete = "off" type = "password" class = "form-control mb-2" id = "forcelog-password" name = "password" required >
< / div >
2022-05-04 23:09:46 +00:00
< / div >
2022-11-06 06:35:49 +00:00
< small id = "emailpasswordRequired" class = "form-text mt-1" > This will also invalidate any existing recovery links associated with this account.< / small >
< / div >
< div class = "footer" >
< div class = "d-flex" >
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" class = "btn btn-primary ml-auto" type = "submit" data-nonce = "{{g.nonce}}" data-onclick = "disable(this)" value = "Log out everywhere" >
2022-11-06 06:35:49 +00:00
< / div >
< / div >
< / form >
< / section >
< section id = "site-settings-blocks-section" class = "settings-section-section" >
< div class = "row" >
< div class = "col" >
< div class = "d-md-flex justify-content-between mb-3" >
< div >
< h5 > Users you block< / h5 >
< p class = "text-small text-muted mb-md-0" > You have blocked the following users. They cannot reply to your content or notify you with a username mention.< / p >
< / div >
< div class = "mt-auto" >
< button type = "button" class = "btn btn-primary" data-bs-toggle = "modal" data-bs-target = "#blockmodal" > Block user< / button >
< / div >
< / div >
{% if v.blocking.first() %}
< div class = "card mb-5" >
< div class = "overflow-x-auto" > < table class = "table table-hover rounded mb-0" >
< thead class = "thead-dark" >
< tr >
2022-12-10 08:47:15 +00:00
< th > User< / th >
< th > Unblock< / th >
2022-11-06 06:35:49 +00:00
< / tr >
< / thead >
< tbody class = "text-muted" >
{% for block in v.blocking %}
{% set user=block.target %}
< tr >
< td >
{% include "user_in_table.html" %}
< / td >
< td >
2022-12-30 12:14:18 +00:00
< button type = "button" class = "btn btn-primary" data-nonce = "{{g.nonce}}" data-onclick = "unblock_user(this, '/settings/unblock?username={{user.username}}&formkey={{v|formkey}}')" > Unblock< / button >
2022-11-06 06:35:49 +00:00
< / td >
< / tr >
{% else %}
< td > There are no blocked users< / td >
{% endfor %}
< / tbody >
< / table >
< / div >
{% else %}
2022-12-11 23:44:34 +00:00
{{macros.ghost_box('No blocked users', '', 2)}}
2022-11-06 06:35:49 +00:00
{% endif %}
< / div >
2022-05-04 23:09:46 +00:00
< / div >
2022-11-06 06:35:49 +00:00
< / section >
2022-05-04 23:09:46 +00:00
< / div >
< / div >
< / div >
2022-12-04 15:40:32 +00:00
2023-01-01 11:12:35 +00:00
< div class = "modal fade" id = "2faModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog modal-dialog-centered" role = "document" >
2022-12-04 15:40:32 +00:00
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" >
{% if mfa_secret %}
Setup two-step login
{% elif mfa_secret and not v.email %}
Email required for two-step login
{% else %}
Disable two-step login
{% endif %}
< / h5 >
2022-12-25 02:10:56 +00:00
< button type = "button" class = "close" data-bs-dismiss = "modal" >
< span > < i class = "far fa-times" > < / i > < / span >
2022-12-04 15:40:32 +00:00
< / button >
< / div >
< form action = "/settings/security" method = "post" >
< input type = "hidden" name = "formkey" value = "{{v|formkey}}" >
< input type = "hidden" name = "2fa_secret" value = "{{mfa_secret}}" >
< div class = "modal-body" >
{% if mfa_secret %}
2022-12-20 21:16:49 +00:00
< p > < span class = "font-weight-bold" > Step 1:< / span > Scan this QR code (or enter the code) using a two-factor authentication app such as Google Authenticator or Authy.< / p >
2022-12-04 15:40:32 +00:00
< div class = "text-center mb-3" >
< img alt = "two-factor QR code" loading = "lazy" class = "img-fluid" width = 175 src = "/2faqr/{{mfa_secret}}" >
< div class = "text-small text-muted mt-1" > Or enter this code: {{mfa_secret}}< / div >
< / div >
< p > < span class = "font-weight-bold" > Step 2:< / span > Enter the six-digit code generated in the authenticator app and your {{SITE_NAME}} account password.< / p >
< label for = "2fa_input" > 6-digit code< / label >
< input autocomplete = "off" type = "text" class = "form-control mb-2" id = "2fa_input" name = "2fa_token" placeholder = "# # # # # #" required >
< label for = "2fa_input_password" > Password< / label >
2023-01-01 02:17:46 +00:00
< input autocomplete = "off" type = "password" class = "form-control mb-2" id = "2fa_input_password" name = "password" data-nonce = "{{g.nonce}}" data-undisable_element = "toggle2faButton" required >
2022-12-20 21:22:37 +00:00
{% set action = "Enable" %}
2022-12-04 15:40:32 +00:00
{% else %}
2023-01-01 11:12:35 +00:00
< div class = "alert alert-warning" role = "alert" >
2022-12-04 15:40:32 +00:00
< i class = "fas fa-info-circle" > < / i >
To disable two-step login, please enter your {{SITE_NAME}} account password and the 6-digit code generated in your authentication app. If you no longer have your two-step device, < a href = "/lost_2fa" > click here< / a > .
< / div >
< label for = "2fa_input_password" > Password< / label >
< input autocomplete = "off" type = "password" class = "form-control mb-2" id = "2fa_input_password" name = "password" required >
< label for = "2fa_input" > 6-digit code< / label >
2023-01-01 02:17:46 +00:00
< input autocomplete = "off" type = "text" class = "form-control mb-2" id = "2fa_input" name = "2fa_remove" placeholder = "# # # # # #" data-nonce = "{{g.nonce}}" data-undisable_element = "toggle2faButton" required >
2022-12-20 21:22:37 +00:00
{% set action = "Disable" %}
2022-12-04 15:40:32 +00:00
{% endif %}
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-link text-muted" data-bs-dismiss = "modal" > Cancel< / button >
2022-12-30 12:14:18 +00:00
< input autocomplete = "off" id = "toggle2faButton" class = "btn btn-primary" type = "submit" data-nonce = "{{g.nonce}}" data-onclick = "disable(this)" value = "{{action}} 2-step login" disabled >
2022-12-04 15:40:32 +00:00
< / div >
< / form >
< / div >
< / div >
< / div >
2023-01-01 11:12:35 +00:00
< div class = "modal fade" id = "blockmodal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog modal-dialog-centered" role = "document" >
2022-12-30 12:52:59 +00:00
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > Block user< / h5 >
< button type = "button" class = "close" data-bs-dismiss = "modal" >
< span > < i class = "far fa-times" > < / i > < / span >
< / button >
2022-12-04 15:40:32 +00:00
< / div >
2022-12-30 12:52:59 +00:00
< div class = "modal-body" >
< input type = "hidden" name = "formkey" value = "{{v|formkey}}" >
< input autocomplete = "off" type = "text" name = "username" placeholder = "Enter username..." id = "block-username" class = "form-control" maxlength = 25 required >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-link text-muted" data-bs-dismiss = "modal" > Cancel< / button >
< button type = "button" class = "btn btn-primary" id = "blockUserButton" data-nonce = "{{g.nonce}}" data-onclick = "block_user()" > Block user< / button >
< / div >
< / div >
2022-12-04 15:40:32 +00:00
< / div >
< / div >
2022-05-04 23:09:46 +00:00
2023-01-01 11:12:35 +00:00
< div class = "toast error" id = "toast-exile-error" role = "alert" data-bs-animation = "true" data-bs-autohide = "true" data-bs-delay = "5000" >
2022-11-06 06:35:49 +00:00
< div class = "toast-body text-center" >
< i class = "fas fa-exclamation-circle text-danger mr-2" > < / i > < span id = "toast-error-message" > Error. Please try again.< / span >
< / div >
< / div >
2022-10-10 05:22:18 +00:00
{% endblock %}