forked from MarseyWorld/MarseyWorld
380 lines
21 KiB
HTML
380 lines
21 KiB
HTML
{% extends "settings.html" %}
|
|
{% block pagetitle %}Personal Settings{% endblock %}
|
|
{% block content %}
|
|
<div class="row settings-page" id="settings-page-personal">
|
|
<div class="col col-lg-10">
|
|
<div class="settings">
|
|
<section id="site-settings-experience-section" class="settings-section-section">
|
|
<h5>Site Experience</h5>
|
|
<div class="settings-section rounded" id="site-settings-experience">
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="patron-status">{{patron}} Status</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<p>You're a {{TIER_TO_NAME[v.patron] if v.patron else "freeloader"}}!</p>{% if v.patron %} Thanks ily! <3{% endif %}
|
|
{% if not v.patron and v.truescore >= TRUESCORE_DONATE_MINIMUM and DONATE_LINK != DEFAULT_CONFIG_VALUE %}
|
|
<p class="font-italic">To stop freeloading, first <a href="/settings/security#site-settings-email-section">verify your email</a>, then support us on <a href="{{DONATE_LINK}}">{{DONATE_SERVICE}}</a> with the same email, and then click "Claim {{patron}} Rewards" <a href="/settings/security#site-settings-email-section">here</a></p>
|
|
{% elif not v.patron %}
|
|
<p class="font-italic">To stop freeloading, you can <a href="/donate">donate by crypto</a>. If you do that, please let us know by <a href="/contact">sending us the transaction id via modmail</a> so we can give you your {{patron}} rewards manually!</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="theme">Website Theme</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<div class="input-group">
|
|
<select autocomplete="off" id='theme' class="form-control setting_select" form="profile-settings" name="theme" data-nonce="{{g.nonce}}" data-reload="1">
|
|
{% for entry in THEMES %}
|
|
<option value="{{entry}}" {% if v.theme == entry %} selected {% endif %}>
|
|
{{entry}}
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{common.color_section('theme-color', '/settings/themecolor', 'themecolor', 'Theme Color', v.themecolor)}}
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="background">Website Backgrounds</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<p>Change the background for the website.</p>
|
|
<div class="input-group">
|
|
<select autocomplete="off" id='backgroundSelector' class="form-control" form="profile-settings" name="background" data-nonce="{{g.nonce}}" data-onchange="updatebgselection()">
|
|
{% for entry in BACKGROUND_CATEGORIES %}
|
|
<option value="{{entry}}" {% if v.background and v.background.startswith(entry) %}selected{% endif %}>
|
|
{{entry}}
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<form class="d-flex mt-3 mb-2" id="upload-custom-background" action="/settings/custom_background" method="post" enctype="multipart/form-data">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<label class="btn btn-primary" for="upload-custom-background-file">
|
|
<i class="fas fa-image mr-1"></i>
|
|
{% if v.background and v.background.startswith('/images/') %}
|
|
{{v.background}}
|
|
{% else %}
|
|
Upload custom site background
|
|
{% endif %}
|
|
</label>
|
|
<input autocomplete="off" id="upload-custom-background-file" accept="image/*", type="file" name="file" data-nonce="{{g.nonce}}" onchange_submit hidden>
|
|
</form>
|
|
{% if v.background %}
|
|
<div class="d-flex mb-3">
|
|
<button type="button" class="btn btn-danger" data-nonce="{{g.nonce}}" data-onclick="postToastReload(this,'/settings/remove_background')">
|
|
<i class="fas fa-image-slash mr-1"></i>
|
|
Remove current background
|
|
</button>
|
|
</div>
|
|
{% endif %}
|
|
<div id="bgcontainer"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section id="site-settings-aesthetic-section" class="settings-section-section">
|
|
<h5>Your Aesthetic</h5>
|
|
<div class="settings-section rounded" id="site-settings-aesthetic">
|
|
{% if FEATURES['HOUSES'] %}
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="theme">House</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
{% if v.house %}
|
|
{% set cost = HOUSE_SWITCH_COST %}
|
|
<p>Change your house (cost: {{cost}} coins or marseybux).</p>
|
|
{% if ' Founder' in v.house %}
|
|
<p>Warning: you'll lose your founder status if you join a different house</p>
|
|
{% endif %}
|
|
{% else %}
|
|
{% set cost = HOUSE_JOIN_COST %}
|
|
<p>Join a house (cost: {{cost}} coins or marseybux).</p>
|
|
{% endif %}
|
|
<div class="input-group">
|
|
<select data-cost="{{cost}}" id="changing-house"{% if cost > v.coins + v.marseybux or v.bite %}disabled{% endif %} autocomplete="off" id='house' class="form-control setting_select" form="profile-settings" name="house" data-nonce="{{g.nonce}}">
|
|
{% for entry in ["None"]+HOUSES %}
|
|
<option value="{{entry}}" {% if v.house.startswith(entry) %}selected{% endif %}>
|
|
{{entry}}
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{%- endif %}
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="profile-picture">Profile Picture</label>
|
|
</div>
|
|
<div class="title w-lg-25 text-md-center">
|
|
<img loading="lazy" alt="your profile picture" src="{{v.profileurl}}" class="profile-pic-75">
|
|
</div>
|
|
<div class="body w-lg-100 my-auto">
|
|
<div class="d-flex">
|
|
<div>
|
|
<form action="/settings/images/profile" method="post" enctype="multipart/form-data">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<label class="btn btn-secondary text-capitalize mr-2 mb-0">
|
|
Upload<input autocomplete="off" type="file" accept="image/*" {% if g.is_tor %}disabled{% endif %} hidden name="profile" data-nonce="{{g.nonce}}" onchange_submit>
|
|
</label>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="text-small text-muted mt-3">All image files are supported. Max file size is {% if v and v.patron %}16{% else %}8{% endif %} MB.</div>
|
|
</div>
|
|
</div>
|
|
{% if FEATURES['USERS_PROFILE_BANNER'] -%}
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="banner">Banner</label>
|
|
</div>
|
|
<div class="title w-lg-75 text-md-center">
|
|
<img loading="lazy" alt="your banner" src="{{v.banner_url}}" class="banner-pic">
|
|
</div>
|
|
<div class="body w-lg-100 my-auto">
|
|
<div class="d-flex">
|
|
<div>
|
|
<form action="/settings/images/banner" method="post" enctype="multipart/form-data">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<label class="btn btn-secondary text-capitalize mr-2 mb-0">
|
|
Upload<input autocomplete="off" type="file" {% if g.is_tor %}disabled{% endif %} accept="image/*" hidden name="banner" data-nonce="{{g.nonce}}" onchange_submit>
|
|
</label>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="text-small text-muted mt-3">All image files are supported. Max file size is {% if v and v.patron %}16{% else %}8{% endif %} MB.</div>
|
|
</div>
|
|
</div>
|
|
{%- endif %}
|
|
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="profile_background">Profile Background</label>
|
|
</div>
|
|
{% if v.profile_background %}
|
|
<div class="title w-lg-75 text-md-center">
|
|
<img loading="lazy" alt="your profile background" src="{{v.profile_background}}" class="profile-background-pic">
|
|
</div>
|
|
{% endif %}
|
|
<div class="body w-lg-100 my-auto">
|
|
<div class="d-flex">
|
|
<div>
|
|
<form action="/settings/images/profile_background" method="post" enctype="multipart/form-data">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<label class="btn btn-secondary text-capitalize mr-2 mb-0">
|
|
Upload<input autocomplete="off" type="file" {% if g.is_tor %}disabled{% endif %} accept="image/*" hidden name="profile_background" data-nonce="{{g.nonce}}" onchange_submit>
|
|
</label>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="text-small text-muted mt-3">All image files are supported. Max file size is {% if v and v.patron %}16{% else %}8{% endif %} MB.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="name">Username</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<p>Your original username will always stay reserved for you: <code>{{v.original_username}}</code></p>
|
|
<form action="/settings/name_change" method="post" data-nonce="{{g.nonce}}" data-onsubmit="sendFormXHR(this)">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
{% if v.patron %}
|
|
{% set minlength = 1 %}
|
|
{% else %}
|
|
{% set minlength = 3 %}
|
|
{% endif %}
|
|
<input id="name-body" autocomplete="off" type="text" name="name" class="form-control" value="{{v.username}}" minlength="{{minlength}}" maxlength="25" {% if v.namechanged %}disabled{% endif %}>
|
|
<small>{{minlength}}-25 characters, including letters, numbers, _ , and -</small>
|
|
<div class="d-flex mt-2">
|
|
<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="Change Display Name" {% if v.namechanged %}disabled{% endif %}>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{{common.color_section('namecolor', '/settings/namecolor', 'namecolor', 'Name Color', v.name_color)}}
|
|
|
|
{% if FEATURES['PRONOUNS'] %}
|
|
{{common.line_text_section('pronouns', '/settings/pronouns_change', 'pronouns', 'Pronouns', v.pronouns, 'Limit of 15 characters', 'Enter pronouns here', 'Change Pronouns', false, 3, 15, '([a-zA-Z]{1,7})/[a-zA-Z]{1,7}(/[a-zA-Z]{1,7})?', false)}}
|
|
{% endif %}
|
|
|
|
{{common.line_text_section('flair', '/settings/change_flair', 'flair', 'Flair', v.flair, 'Limit of 100 characters', 'Enter a flair here', 'Change Flair', true, 0, 100, '.*', v.flairchanged)}}
|
|
|
|
{{common.color_section('flaircolor', '/settings/flaircolor', 'flaircolor', 'Flair Color', v.flaircolor)}}
|
|
|
|
{% if FEATURES['USERS_PROFILE_SONG'] -%}
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="anthem">Profile Anthem</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<p>You can use an MP3 file or a YouTube video.</p>
|
|
<form action="/settings/song_change_mp3" method="post" enctype="multipart/form-data">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<label class="btn btn-secondary d-inline-block m-0 mb-3">
|
|
<div><i class="fas fa-file"></i>
|
|
{% if v.song and v.song|length in (1,2,3,4,5,17) %}
|
|
{{v.song}}.mp3
|
|
{% else %}
|
|
Use an MP3 file (Max size is 8MB)
|
|
{% endif %}
|
|
</div>
|
|
<input autocomplete="off" id="file-upload2" type="file" name="file" {% if g.is_tor %}disabled{% endif %} accept="audio/mp3" data-nonce="{{g.nonce}}" onchange_submit hidden>
|
|
</label>
|
|
</form>
|
|
<form action="/settings/song_change" method="post">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<input class="form-control" style="display:inline;max-width:75%;font-size: min(3.5vw,16px)!important" autocomplete="off" type="text" name="song" class="form-control" value="{% if v.song and v.song|length not in (1,2,3,4,5,17) %}https://youtu.be/{{v.song}}{% endif %}" placeholder='Enter a YouTube video link here'>
|
|
<input class="btn btn-primary" style="font-size: min(3.5vw,16px)!important" autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="Submit">
|
|
</form>
|
|
<br><small>In some browsers, users have to click at least once anywhere in the profile page for the anthem to play.</small>
|
|
</div>
|
|
</div>
|
|
{%- endif %}
|
|
|
|
{% if FEATURES['USERS_PROFILE_BODYTEXT'] %}
|
|
{{common.text_area_section('profile-bio', '/settings/personal', 'bio', 'Bio', v.bio, 'Limit of ' ~ BIO_FRIENDS_ENEMIES_LENGTH_LIMIT ~ ' characters', 'Tell the community a bit about yourself.', true, BIO_FRIENDS_ENEMIES_LENGTH_LIMIT)}}
|
|
{% endif %}
|
|
|
|
{{common.text_area_section('profile-friends', '/settings/personal', 'friends', 'Friends', v.friends, 'Limit of ' ~ BIO_FRIENDS_ENEMIES_LENGTH_LIMIT ~ ' characters', 'Enter your friends on the site...', false, BIO_FRIENDS_ENEMIES_LENGTH_LIMIT)}}
|
|
|
|
{{common.text_area_section('profile-enemies', '/settings/personal', 'enemies', 'Enemies', v.enemies, 'Limit of ' ~ BIO_FRIENDS_ENEMIES_LENGTH_LIMIT ~ ' characters', 'Enter your enemies on the site...', false, BIO_FRIENDS_ENEMIES_LENGTH_LIMIT)}}
|
|
|
|
{{common.text_area_section('profile-signature', '/settings/personal', 'sig', 'Signature', v.sig, 'Limit of 200 characters', 'Enter a signature...', true, 200)}}
|
|
|
|
{{common.toggle_section('Private Mode', 'privateswitch', 'private', v.is_private, 'This will hide your profile page from other users.', false)}}
|
|
|
|
{{common.toggle_section('Donation Visiblity', 'lifetimedonated_visibleswitch', 'lifetimedonated_visible', v.lifetimedonated_visible, 'Make your donation badges, your lifetime-donated amount, and your total award discount visible to everyone instead of just you.', false)}}
|
|
|
|
{{common.toggle_section('Spider', 'spiderswitch', 'spider', v.spider, 'Have a spider friend accompany you during your journey on the site.', v.spider > 1)}}
|
|
|
|
{{common.toggle_section('Marsify', 'marsifyswitch', 'marsify', v.marsify, 'Automatically insert relevant
|
|
marseys into your future comments.', v.marsify > 1)}}
|
|
</div>
|
|
</section>
|
|
|
|
<section id="site-settings-checkmark-section" class="settings-section-section">
|
|
<h5>Checkmark Customization</h5>
|
|
<div class="settings-section rounded" id="site-settings-checkmark">
|
|
{{common.color_section('verifiedcolor', '/settings/verifiedcolor', 'verifiedcolor', 'Checkmark Color', v.verifiedcolor)}}
|
|
|
|
{{common.line_text_section('checkmark_text', '/settings/checkmark_text', 'checkmark-text', 'Checkmark Hover Text', v.verified, 'Limit of 100 characters', 'Enter checkmark hover text here', 'Change Text', false, 0, 100, '.*', false)}}
|
|
</div>
|
|
</section>
|
|
|
|
<section id="site-settings-filters-section" class="settings-section-section">
|
|
<h5>Filters</h5>
|
|
<div class="settings-section rounded" id="site-settings-filters">
|
|
{% set ns = namespace(slurtext='Enable if you would like to automatically replace slurs.', profanitytext='Enable if you would like to automatically replace profanities.') %}
|
|
{% if FEATURES['USERS_PERMANENT_WORD_FILTERS'] %}
|
|
{% if v.slurreplacer > 1 %}
|
|
{% set slurtext = "You've enabled the slur replacer permanently! ✊🏿" %}
|
|
{% else %}
|
|
{% set slurtext = 'Enable if you would like to automatically replace slurs. <button type="button" {% if v.slurreplacer == 0 %}hidden{% endif %} id="slurreplacer-perma-link" class="text-primary" data-bs-toggle="modal" data-bs-target="#modal-slurreplacer">Make filter permanent for a badge!</button>' %}
|
|
{% endif %}
|
|
|
|
{% if v.profanityreplacer > 1 %}
|
|
{% set profanitytext = "You've enabled the profanity replacer permanently! 😇" %}
|
|
{% else %}
|
|
{% set profanitytext = 'Enable if you would like to automatically replace profanities. <button type="button" {% if v.profanityreplacer == 0 %}hidden{% endif %} id="profanityreplacer-perma-link" class="text-primary" data-bs-toggle="modal" data-bs-target="#modal-profanityreplacer">Make filter permanent for a badge!</button>' %}
|
|
{% endif %}
|
|
{% endif %}
|
|
{{common.toggle_section("Slur Replacer", "slurreplacerswitch", 'slurreplacer', v.slurreplacer, slurtext, FEATURES['USERS_PERMANENT_WORD_FILTERS'] and v.slurreplacer > 1)}}
|
|
{{common.toggle_section("Profanity Replacer", "profanityreplacerswitch", 'profanityreplacer', v .profanityreplacer, profanitytext, FEATURES['USERS_PERMANENT_WORD_FILTERS'] and v.profanityreplacer > 1)}}
|
|
</div>
|
|
</section>
|
|
<section id="site-settings-referral-section" class="settings-section-section">
|
|
<h5>Refer a Friend!</h5>
|
|
<div class="settings-section rounded" id="site-settings-referral">
|
|
<div class="d-lg-flex border-bottom">
|
|
<div class="title w-lg-25">
|
|
<label for="referral_code">Referral Code</label>
|
|
</div>
|
|
<div class="body w-lg-100">
|
|
<div class="input-group">
|
|
<input autocomplete="off" type="text" readonly class="form-control copy-link" id="referral_code" value="{{SITE_FULL}}/signup?ref={{v.id}}" data-clipboard-text="{{SITE_FULL}}/signup?ref={{v.id}}">
|
|
<span class="input-group-append" data-bs-toggle="tooltip" data-bs-placement="top" title="You have referred {{v.referral_count}} user{{'s' if v.referral_count != 1 else ''}} so far. {% if v.referral_count == 0 %}¯\_(ツ)_/¯{% elif v.referral_count>10 %}Wow!{% endif %}">
|
|
<span class="input-group-text border-0 font-weight-bold"><i class="fas fa-user mr-1"></i>{{v.referral_count}}</span>
|
|
</span>
|
|
</div>
|
|
<div class="text-small text-muted mt-3">Share this link with a friend. {% if v.referral_count == 0 %} When they sign up, you'll get the bronze recruitment badge. <a href="/badges">Learn more.</a>{% elif v.referral_count<10 %} When you refer 10 friends, you'll receive the silver recruitment badge. <a href="/badges">Learn more.</a>{% elif v.referral_count<100 %} When you refer 100 friends, you'll receive the gold recruitment badge. <a href="/badges">Learn more</a>.{% endif %}</div>
|
|
</div>
|
|
</div>
|
|
<div class="d-lg-flex border-bottom px-3">
|
|
<div class="title w-lg-25 px-0">
|
|
<label>Referred Users</label>
|
|
</div>
|
|
<table>
|
|
{% for user in v.referrals %}
|
|
<tr>
|
|
<td>{% include "user_in_table.html" %}</td>
|
|
<td data-time="{{user.created_utc}}"></td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% include "modals/emoji.html" %}
|
|
{% include "modals/gif.html" %}
|
|
|
|
{% if v.flairchanged %}
|
|
<input hidden id="flairchanged" value="{{v.flairchanged}}">
|
|
<script defer src="{{'js/flairchanged.js' | asset}}"></script>
|
|
{% endif %}
|
|
|
|
{% if v.namechanged %}
|
|
<input hidden id="namechanged" value="{{v.namechanged}}">
|
|
<script defer src="{{'js/namechanged.js' | asset}}"></script>
|
|
{% endif %}
|
|
|
|
{% if v.marsify and v.marsify != 1 %}
|
|
<input hidden id="marsified" value="{{v.marsify}}">
|
|
<script defer src="{{'js/marsified.js' | asset}}"></script>
|
|
{% endif %}
|
|
|
|
<script defer src="{{'js/settings_profile.js' | asset}}"></script>
|
|
|
|
{% macro permanent_filter_modal(id, form_action, field, friendly_name, badge_name) %}
|
|
{% if FEATURES['USERS_PERMANENT_WORD_FILTERS'] -%}
|
|
<div class="modal fade" id="modal-{{id}}" tabindex="-1">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<form class="m-auto" action="{{form_action}}" id="{{id}}-form" method="post" data-nonce="{{g.nonce}}" data-onsubmit="sendFormXHRReload(this)">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Make {{friendly_name}} Permanent</h5>
|
|
<button type="button" class="close" data-bs-dismiss="modal">
|
|
<span><i class="fas fa-times"></i></span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<input hidden name="{{field}}" value="true">
|
|
<input hidden name="permanent" value="true">
|
|
<input hidden name="formkey" value="{{v|formkey}}">
|
|
<p>This form will permanently enable the filter for you. You will receive the {{badge_name}} badge and <strong>will not</strong> be able to disable the filter.<br>Type your username to continue.</p>
|
|
<input autocomplete="off" type="text" name="username" placeholder="Enter your username to confirm" id="username-{{id}}" class="form-control" pattern="{{v.username}}" required>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-link text-muted" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="submit" class="btn btn-danger" id="submit-{{id}}-form">Make Permanent</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{%- endif %}
|
|
{% endmacro %}
|
|
|
|
{{permanent_filter_modal('slurreplacer', '/settings/personal', 'slurreplacer', 'Slur Replacer', 'Social Justice Berserker')}}
|
|
{{permanent_filter_modal('profanityreplacer', '/settings/personal', 'profanityreplacer', 'Profanity Replacer', 'Soapy-Mouthed Angel')}}
|
|
{% endblock %}
|