sop.epic/views/profile_settings.html
2023-07-01 23:30:36 -06:00

277 lines
21 KiB
HTML

{{if .Pjax}}
{{template "header.html" .}}
{{else}}
<title>{{.Title}}</title>
{{end}}
<div id="main-body" class="profile-top">
{{template "profile_sidebar.html" .Sidebar}}
<div class="main-column">
<div class="post-list-outline">
<h2 class="label">{{.Title}}</h2>
<form class="setting-form" method="post" action="/settings/profile">
<input type="hidden" name="csrfmiddlewaretoken" value="{{.CurrentUser.CSRFToken}}">
<ul class="settings-list">
<li class="setting-nickname">
<p class="settings-label">Nickname</p>
<div class="center center-input">
<input type="text" name="screen_name" maxlength="32" placeholder="Nickname" value="{{.User.Nickname}}">
</div>
<p class="note">Nickname, up to 32 characters.</p>
</li>
<li class="setting-profile-comment">
<span class="character-count" id="character-count">{{if not .Profile.CommentText}}2000{{end}}</span>
<p class="settings-label">Profile Comment</p>
<textarea class="textarea-text textarea" name="profile_comment" maxlength="2000" placeholder="Write about yourself here.">{{.Profile.CommentText}}</textarea>
<p class="note">Write anything you'd like to be shown on your profile. Just make sure it doesn't violate <a href="/rules/">our rules.</a></p>
</li>
<li class="setting-country">
<p class="settings-label">Region</p>
<div class="center center-input">
<input type="text" name="country" maxlength="64" placeholder="Region" value="{{.Profile.Region}}">
</div>
<p class="note">Enter your region here. It'll appear on your profile.<br>
<a class="get-ipinfo" href="#">If you want to use your location, you can grab it here (it will not be saved automatically).</a>
</p>
</li>
<li class="setting-website">
<p class="settings-label">DiscordTag</p>
<div class="center center-input">
<input type="text" name="discord" maxlength="37" placeholder="Enter your DiscordTag here." value="{{.Profile.Discord}}">
</div>
</li>
<li class="setting-website">
<p class="settings-label">YouTube Channel/URL</p>
<div class="center center-input">
<input type="text" name="website" maxlength="1024" placeholder="YouTube Channel or URL" value="{{.Profile.YouTube}}">
</div>
<p class="note">Add your YouTube channel or a random URL here.</p>
</li>
<li class="setting-website">
<p class="settings-label">PlayStation Network Username</p>
<div class="center center-input">
<input type="text" name="psn" maxlength="16" placeholder="Enter your PlayStation Network account here." value="{{.Profile.PSN}}">
</div>
</li>
<li class="setting-website">
<p class="settings-label">Nintendo Switch Friend Code</p>
<div class="center center-input">
<input type="text" name="switch_code" maxlength="17" placeholder="Enter your Nintendo Switch friend code here." value="{{.Profile.SwitchCode}}">
</div>
<p class="note">We recommend that you include the "SW-" at the start and seperate the numbers with dashes.</p>
</li>
<li class="setting-website">
<p class="settings-label">Twitter</p>
<div class="center center-input">
<input type="text" name="external" maxlength="15" placeholder="Enter your Twitter account here." value="{{.Profile.Twitter}}">
</div>
<p class="note">Don't add an "@" symbol at the start if you want it to be linked on your profile.</p>
</li>
<li class="setting-website">
<p class="settings-label">Steam</p>
<div class="center center-input">
<input type="text" name="steam" maxlength="64" placeholder="Enter your Steam username here." value="{{.Profile.Steam}}">
</div>
</li>
<li class="setting-color">
<p class="settings-label">Nickname Color</p>
<div class="center center-input">
<input type="color" class="color-value" name="color" maxlength="7" value="{{.User.Color}}">
<button type="button" class="button color-thing none">Open color picker</button><br>
<button type="button" class="button default-color">Reset to default</button>
</div>
<p class="note">This is the color your nickname will appear as.</p>
<div id="sidebar-profile-body">
<div username="{{.User.Username}}" class="icon-container
{{if not .User.HideOnline}}
{{if .User.Online}}
online
{{else}}
offline
{{end}}
{{end}}
{{if .User.Role.Image}} official-user"><img src="{{.User.Role.Image}}" class="official-tag">{{else}}">{{end}}
<a href="/users/{{.User.Username}}"><img src="{{.User.Avatar}}" alt="{{.User.Username}}" class="icon"></a>
</div>
{{if .User.Role.Organization}}<p class="user-organization">{{.User.Role.Organization}}</p>{{end}}
<a href="/users/{{.User.Username}}" class="nick-name"{{if .User.Color}} style="color:{{.User.Color}}"{{end}}>{{.User.Nickname}}</a>
<p class="id-name">{{.User.Username}}</p>
</div>
</li>
<li class="setting-color">
<p class="settings-label">Theme Color</p>
<div class="center center-input">
<input type="color" class="color-value" name="theme" maxlength="7" value="{{if .User.Theme}}{{index .User.ThemeColors 0}}{{else}}#8000ff{{end}}">
<button type="button" class="button color-thing none">Open color picker</button><br>
<button type="button" class="button default-color">Reset to default</button>
</div>
<p class="note">This is the color that will be shown on the site's menus, as well as on your profile to everyone else.</p>
</li>
<li>
<p class="settings-label"><label for="id_visibility">Who should be able to see your Nintendo Network ID?</label></p>
<div class="select-content">
<div class="select-button">
<select name="id_visibility" id="id_visibility">
<option value="0"{{if eq .Profile.NNIDVisibility 0}} selected{{end}}>Everyone</option>
<option value="1"{{if eq .Profile.NNIDVisibility 1}} selected{{end}}>My friends</option>
<option value="2"{{if eq .Profile.NNIDVisibility 2}} selected{{end}}>Nobody</option>
</select>
</div>
</div>
</li>
<li>
<p class="settings-label"><label for="let_friendrequest">Who should be able to send you friend requests?</label></p>
<div class="select-content">
<div class="select-button">
<select name="let_friendrequest" id="let_friendrequest">
<option value="0"{{if eq .Profile.AllowFriend 0}} selected{{end}}>Everyone</option>
<option value="1"{{if eq .Profile.AllowFriend 1}} selected{{end}}>People I'm following</option>
<option value="2"{{if eq .Profile.AllowFriend 2}} selected{{end}}>Nobody</option>
</select>
</div>
</div>
</li>
<li>
<p class="settings-label"><label for="pronoun_dot_is">What's your preferred pronoun?</label></p>
<div class="select-content">
<div class="select-button">
<select name="pronoun_dot_is" id="pronoun_dot_is">
<option value="0"{{if eq .Profile.Gender ""}} selected{{end}}>Prefer not to say</option>
<option value="1"{{if eq .Profile.Gender "He/him"}} selected{{end}}>He/him</option>
<option value="2"{{if eq .Profile.Gender "She/her"}} selected{{end}}>She/her</option>
<option value="3"{{if eq .Profile.Gender "He/she"}} selected{{end}}>He/she</option>
<option value="4"{{if eq .Profile.Gender "Nonbinary"}} selected{{end}}>Nonbinary</option>
<option value="5"{{if eq .Profile.Gender "They/them"}} selected{{end}}>They/them</option>
</select>
</div>
</div>
</li>
<li>
<p class="settings-label"><label for="yeahs_visibility">Who should be able to see your Yeahs given?</label></p>
<div class="select-content">
<div class="select-button">
<select name="yeahs_visibility" id="yeahs_visibility">
<option value="0"{{if eq .Profile.YeahVisibility 0}} selected{{end}}>Everyone</option>
<option value="1"{{if eq .Profile.YeahVisibility 1}} selected{{end}}>My friends</option>
<option value="2"{{if eq .Profile.YeahVisibility 2}} selected{{end}}>Nobody</option>
</select>
</div>
</div>
</li>
<li>
<p class="settings-label"><label for="comments_visibility">Who should be able to see your comments made?</label></p>
<div class="select-content">
<div class="select-button">
<select name="comments_visibility" id="comments_visibility">
<option value="0"{{if eq .Profile.ReplyVisibility 0}} selected{{end}}>Everyone</option>
<option value="1"{{if eq .Profile.ReplyVisibility 1}} selected{{end}}>My friends</option>
<option value="2"{{if eq .Profile.ReplyVisibility 2}} selected{{end}}>Nobody</option>
</select>
</div>
</div>
</li>
<li>
<p class="settings-label"><label for="comments_visibility">What should the default privacy setting for your posts be?</label></p>
<div class="select-content">
<div class="select-button">
<select name="default_privacy">
<option value="0"{{if eq .User.DefaultPrivacy 0}} selected{{end}}>Everyone</option>
<option value="1"{{if eq .User.DefaultPrivacy 1}} selected{{end}}>Friends, Following and Followers</option>
<option value="2"{{if eq .User.DefaultPrivacy 2}} selected{{end}}>Friends and Following</option>
<option value="3"{{if eq .User.DefaultPrivacy 3}} selected{{end}}>Friends and Followers</option>
<option value="4"{{if eq .User.DefaultPrivacy 4}} selected{{end}}>Friends Only</option>
<option value="5"{{if eq .User.DefaultPrivacy 5}} selected{{end}}>Followers and Following</option>
<option value="6"{{if eq .User.DefaultPrivacy 6}} selected{{end}}>Followers Only</option>
<option value="7"{{if eq .User.DefaultPrivacy 7}} selected{{end}}>Following Only</option>
<option value="8"{{if eq .User.DefaultPrivacy 8}} selected{{end}}>Admins Only</option>
<option value="9"{{if eq .User.DefaultPrivacy 9}} selected{{end}}>Only Me</option>
</select>
</div>
</div>
</li>
<li class="setting-profile-comment">
<p class="settings-label">Forbidden Keywords</p>
<textarea class="textarea" name="forbidden_keywords" maxlength="2000" placeholder="Put anything you don't want to see here.">{{.User.ForbiddenKeywords}}</textarea>
<p class="note">Posts or comments that contain any of the keywords you type here will be hidden from your view. Seperate each phrase with a comma (","), and type "\," to look for an actual comma. (and type "\\," to actually find "\,")</p>
<p class="note">Example: "my balls, itch"</p>
</li>
<li class="setting-nickname">
<p class="settings-label">Email Address</p>
<div class="center center-input">
<input type="text" name="email" maxlength="255" placeholder="Email Address" value="{{.User.Email}}">
</div>
<p class="note">Enter your email address here. This will not be displayed on your profile.</p><img src= "data:image/png;base64,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">
</li>
<li class="setting-nnid">
<p class="settings-label">Nintendo Network ID</p>
<div class="icon-container">
<img class="icon nnid-icon mii" src="{{if .Profile.MiiHash}}https://mii-secure.cdn.nintendo.net/{{.Profile.MiiHash}}_normal_face.png{{else}}/assets/img/anonymous.png{{end}}">
</div>
<input type="text" name="nnid" minlength="6" maxlength="16" placeholder="Nintendo Network ID" value="{{.Profile.NNID}}" data-action="/miis">
<input type="hidden" name="mh" value="{{.Profile.MiiHash}}">
<p class="error"></p>
<p class="note">Enter your Nintendo Network ID here. It'll appear on your profile if you set it to be visible.</p>
</li>
<li class="setting-avatar">
<div class="icon-container">
<img class="icon nnid-icon avatar preview-image {{if .User.HasMii}} none{{end}}" src="{{if .Profile.AvatarImage}}{{.Profile.AvatarImage}}{{else}}/assets/img/anonymous.png{{end}}">
<img class="icon nnid-icon mii{{if not .User.HasMii}} none{{end}}" src="{{if .Profile.MiiHash}}https://mii-secure.cdn.nintendo.net/{{.Profile.MiiHash}}_normal_face.png{{else}}/assets/img/anonymous.png{{end}}">
</div>
<p class="settings-label">Do you want the avatar shown beside your content to use the Mii from your Nintendo Network ID or an avatar?</p>
<label class="checked"><input type="radio" name="avatar" value="0"{{if not .User.HasMii}} checked{{end}}>Avatar</label>
<label><input type="radio" name="avatar" value="1"{{if .User.HasMii}} checked{{end}}>Mii</label>
<label class="file-button-container">
<span class="input-label">Avatar Image <span>PNG, JPEG and GIF files are allowed.</span></span>
<span class="button file-upload-button for-avatar">Upload</span>
<input accept="image/*" type="file" class="file-button none">
<input type="hidden" name="image" value="{{.Profile.AvatarID}}">
<script src="/assets/js/upload.js"></script>
</label>
</li>
{{if .Migrations}}
<li>
<p class="settings-label">Import Posts</p>
<p class="note">You can import your posts from other websites using this tool.</p>
{{range $migration := .Migrations}}
<div class="migration">
<img src="{{$migration.Image}}">
<button type="button" class="migrate-button{{if $migration.PasswordRequired}} password-required{{end}}" data-action="/migrate/{{$migration.ID}}">Import</button>
</div>
{{end}}
{{if .Imports}}
<button type="button" class="past-imports-button">Past Imports</button>
<div class="dialog past-imports none">
<div class="dialog-inner">
<div class="window">
<h1 class="window-title">Past Imports</h1>
<div class="window-body">
<p class="description">Here you can view your past post imports, and undo them if you wish.</p>
<div class="overflow-scroll">
{{range $import := .Imports}}
<div class="migration">
<img src="{{$import.Image}}">
<span class="import-name">{{$import.Username}}</span>
<button type="button" class="migrate-button" data-action="/rollback/{{$import.ID}}">Undo</button>
</div>
{{end}}
</div>
<div class="form-buttons">
<input type="button" class="post-button black-button" value="Close">
</div>
</div>
</div>
</div>
</div>
{{end}}
</li>
{{end}}
<div class="form-buttons">
<input type="submit" class="black-button apply-button" value="Save these settings">
</div>
</ul>
</form>
</div>
</div>
</div>
{{if .Pjax}}
{{template "footer.html"}}
{{end}}