rainbownapkin/canopy
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Gave profile page a facelift in perperation for email/password update pop-ups.

Browse source
This commit is contained in:
rainbow napkin 2024-12-31 06:50:34 -05:00
parent a51152a89d
commit c32f3df3f3
16 changed files with 316 additions and 157 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/controllers/api/account/updateController.js
View file

@ -27,6 +27,7 @@ module.exports.post = async function(req, res){
const data = matchedData(req);
var tempResult = [];
//This is gross and quite honestly password changes should be their own endpoint anyways
//if we're not chaning the password
if(data.passChange == null){
//go through validation errors
@ -48,6 +49,7 @@ module.exports.post = async function(req, res){
const userDB = await userModel.findOne(user);
const update = {};
if(userDB){
if(data.img){
userDB.img = data.img;
@ -64,6 +66,15 @@ module.exports.post = async function(req, res){
update.signature = data.signature;
}
if(data.pronouns != null){
userDB.pronouns = data.pronouns;
if(data.pronouns == ''){
update.pronouns = "Unset/Hidden";
}else{
update.pronouns = data.pronouns;
}
}
if(data.passChange){
//kill active session to prevent connect-mongo from freaking out
accountUtils.killSession(req.session);

1
src/routers/api/accountRouter.js
View file

@ -46,6 +46,7 @@ router.post('/register', accountValidator.user(),
router.post('/update', accountValidator.img(),
accountValidator.bio(),
accountValidator.signature(),
accountValidator.pronouns(),
accountValidator.pass('passChange.oldPass'),
accountValidator.securePass('passChange.newPass'),
accountValidator.pass('passChange.confirmPass'), updateController.post);

3
src/schemas/user/userSchema.js
View file

@ -435,9 +435,10 @@ userSchema.methods.getProfile = function(){
tokeCount: this.getTokeCount(),
img: this.img,
signature: this.signature,
pronouns: this.pronouns,
bio: this.bio
};
//return profile hashtable
return profile;
}

2
src/validators/accountValidator.js
View file

@ -32,6 +32,8 @@ module.exports = {
img: (field = 'img') => body(field).optional().isURL({require_tld: false, require_host: false}).trim(),
pronouns: (field = 'pronouns') => body(field).optional().escape().trim().isLength({min: 0, max: 15}),
signature: (field = 'signature') => body(field).optional().escape().trim().isLength({min: 1, max: 150}),
bio: (field = 'bio') => body(field).optional().escape().trim().isLength({min: 1, max: 1000}),

13
src/views/partial/profile/bio.ejs
View file

@ -13,9 +13,12 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<span class="profile-item" id="profile-bio">
<p class="profile-item profile-item-label" id="profile-bio-label">Bio: <span class="profile-content" id="profile-bio-content"><%- profile.bio %></span></p>
<% if(selfProfile){ %>
<p class="profile-item-edit">(<a class="profile-item-edit" id="profile-bio-edit" href="javascript:">edit</a>)</p>
<% } %>
<span class="profile-bio-span">
<h4 id="profile-bio-label" class="profile-item-label">Bio:</h4>
<% if(selfProfile){ %>
<p class="profile-item interactive" id="profile-bio-content"><%- profile.bio %></p>
<textarea class="profile-item-prompt" id="profile-bio-prompt"></textarea>
<% }else{ %>
<p class="profile-item" id="profile-bio-content"><%- profile.bio %></p>
<% } %>
</span>

4
src/views/partial/profile/date.ejs
View file

@ -13,4 +13,6 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<p class="profile-item" id="profile-creation-date">Joined: <%- profile.date.toUTCString(); %></p>
<span class="profile-item">
<p class="profile-item" id="profile-creation-date" title="<%- profile.date.toUTCString() %>">Joined: <%- profile.date.toLocaleDateString(); %></p>
</span>

10
src/views/partial/profile/image.ejs
View file

@ -13,7 +13,9 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<img class="profile-item" id="profile-img" src="<%- profile.img %>">
<% if(selfProfile){ %>
<p class="profile-item-edit">(<a class="profile-item-edit" id="profile-img-edit" href="javascript:">edit</a>)</p>
<% } %>
<div class="profile-item" id="profile-img">
<img class="profile-item" id="profile-img-content" src="<%- profile.img %>">
<% if(selfProfile){ %>
<input class="profile-item-prompt" id="profile-img-prompt">
<% } %>
</div>

33
src/views/partial/profile/pronouns.ejs Normal file
View file

@ -0,0 +1,33 @@
<%# Canopy - The next generation of stoner streaming software
Copyright (C) 2024-2025 Rainbownapkin and the TTN Community
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as
published by the Free Software Foundation, either version 3 of the
License, or (at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<%# If pronons are unset and the user is viewing their own profile %>
<% if((profile.pronouns == null || profile.pronouns == "") && selfProfile){ %>
<span class="profile-item profile-item-oneliner">
<p class="profile-item profile-item-oneliner" id="profile-pronouns">Pronouns: <span class="profile-content interactive" id="profile-pronouns-content">Unset/Hidden</span></p>
<input class="profile-item-prompt" id="profile-pronouns-prompt">
</span>
<%# If pronons are set regardless of who's profile %>
<% }else if(profile.pronouns != null && profile.pronouns != ""){ %>
<span class="profile-item profile-item-oneliner">
<% if(selfProfile){ %>
<p class="profile-item profile-item-oneliner" id="profile-pronouns">Pronouns: <span class="profile-content interactive" id="profile-pronouns-content"><%- profile.pronouns %></span></p>
<input class="profile-item-prompt" id="profile-pronouns-prompt">
<% }else{ %>
<p class="profile-item profile-item-oneliner" id="profile-pronouns">Pronouns: <span class="profile-content" id="profile-pronouns-content"><%- profile.pronouns %></span></p>
<% } %>
</span>
<% } %>

12
src/views/partial/profile/settings.ejs
View file

@ -13,15 +13,11 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<div class="account-settings" id="account-settings-div">
<div class="account-settings dynamic-container" id="account-settings-div">
<h3 class="account-settings" id="account-settings-label">Account Settings</h3>
<span class="account-settings-password-reset" id="account-settings-password-reset-div">
<h4 class="account-settings-password-reset" id="account-settings-password-reset-label">Password Reset:</h4>
<input class="account-settings-password-reset" id="account-settings-password-reset-old" placeholder="Current Password" type="password">
<input class="account-settings-password-reset" id="account-settings-password-reset-new" placeholder="New Password" type="password">
<input class="account-settings-password-reset" id="account-settings-password-reset-confirm" placeholder="Confirm New Password" type="password">
</span>
<span class="account-settings" id="account-settings-delete">
<span class="account-settings" id="account-settings-buttons">
<button href="javascript:" class="account-settings positive-button" id="account-settings-update-email-button">Update Email</button>
<button href="javascript:" class="account-settings positive-button" id="account-settings-change-password-button">Change Password</button>
<button href="javascript:" class="account-settings danger-button" id="account-settings-delete-button">Delete Account</button>
</span>
</div>

10
src/views/partial/profile/signature.ejs
View file

@ -13,9 +13,11 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<span class="profile-item" id="profile-signature">
<p class="profile-item profile-item-label" id="profile-signature-label">Signature: <span class="profile-content" id="profile-signature-content"><%- profile.signature %></span></p>
<% if(selfProfile){ %>
<p class="profile-item-edit">(<a class="profile-item-edit" id="profile-signature-edit" href="javascript:">edit</a>)</p>
<span class="profile-item">
<% if(selfProfile){ %>
<p class="profile-item profile-item-oneliner" id="profile-signature">Signature: <span class="profile-content interactive" id="profile-signature-content"><%- profile.signature %></span></p>
<input class="profile-item-prompt" id="profile-signature-prompt">
<% }else{ %>
<p class="profile-item profile-item-oneliner" id="profile-signature">Signature: <span class="profile-content" id="profile-signature-content"><%- profile.signature %></span></p>
<% } %>
</span>

6
src/views/partial/profile/tokeCount.ejs
View file

@ -14,10 +14,10 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<span class="profile-item profile-toke-count">
<p class="profile-item profile-toke-count">tokes: <%- profile.tokeCount %> </p>
<i class="profile-item bi-caret-left-fill profile-toke-count" id="toggle-toke-list"></i>
<p class="profile-item profile-toke-count interactive">Toke Count: (<%- profile.tokeCount %> Total) </p>
<i class="-item bi-caret-left-fill profile-toke-count" id="toggle-toke-list"></i>
</span>
<div class="profile-item dynamic-container" id="profile-tokes">
<div class="profile-item nested-dynamic-container" id="profile-tokes">
<% profile.tokes.forEach((count, toke) => { %>
<p class="profile-item profile-toke" id='profile-tokes<%-toke%>'>!<%- toke %>: <%- count %></p>
<% }); %>

29
src/views/profile.ejs
View file

@ -29,18 +29,25 @@ along with this program. If not, see <https://www.gnu.org/licenses/>. %>
<body>
<%- include('partial/navbar', {user}); %>
<% if(profile){ %>
<div class="profile" id="profile-div">
<h1 class="profile-item" id="profile-username"><%- profile.user %></h1>
<%- include('partial/profile/image', {profile, selfProfile}); %>
<%- include('partial/profile/tokeCount', {profile, selfProfile}); %>
<%- include('partial/profile/signature', {profile, selfProfile}); %>
<%- include('partial/profile/bio', {profile, selfProfile}); %>
<%- include('partial/profile/date', {profile, selfProfile}); %>
<%- include('partial/profile/badges', {profile, selfProfile}); %>
<div id="account">
<div class="profile dynamic-container" id="profile-div">
<span id="profile-info" class="profile">
<h1 class="profile-item" id="profile-username"><%- profile.user %></h1>
<%- include('partial/profile/image', {profile, selfProfile}); %>
<%- include('partial/profile/pronouns', {profile, selfProfile}); %>
<%- include('partial/profile/signature', {profile, selfProfile}); %>
<%- include('partial/profile/tokeCount', {profile, selfProfile}); %>
<%- include('partial/profile/date', {profile, selfProfile}); %>
</span>
<span id="profile-info-aux" class="profile">
<%- include('partial/profile/bio', {profile, selfProfile}); %>
<%- include('partial/profile/badges', {profile, selfProfile}); %>
</span>
</div>
<% if(selfProfile){ %>
<%- include('partial/profile/settings', {profile, selfProfile}); %>
<% } %>
</div>
<% if(selfProfile){ %>
<%- include('partial/profile/settings', {profile, selfProfile}); %>
<% } %>
<% }else if(user){ %>
<h1 class="profile-item" id="profile-error-label">Profile not found!</h1>
<% } else {%>