Finished up with channel rank/perms frontend.

This commit is contained in:
rainbow napkin 2024-11-27 02:16:54 -05:00
parent edb4215929
commit 796bb033a7
22 changed files with 472 additions and 57 deletions

View file

@ -22,6 +22,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
</head>
<body>
<%- include('partial/navbar', {user}); %>
<h1 class="panel-title"><%= instance %> Admin Panel</h1>
<%- include('partial/adminPanel/channelList', {chanGuide}) %>
<%- include('partial/adminPanel/userList', {user, userList, rankEnum}) %>
<%- include('partial/adminPanel/permList', {permList, rankEnum}) %>

View file

@ -17,17 +17,16 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<html>
<head>
<%- include('partial/styles', {instance, user}); %>
<link rel="stylesheet" type="text/css" href="/css/newChannel.css">
<title><%= instance %> - Channel Settings: <%= channel.name %></title>
<!-- Gonna be a shitter and re-use the adminPanel css :P -->
<link rel="stylesheet" type="text/css" href="/css/adminPanel.css">
<title><%= instance %> - <%= channel.name %> - Channel Settings</title>
</head>
<body>
<%- include('partial/navbar', {user}); %>
<form action="javascript:">
<span>
<label>Hidden:</label>
<input id="channel-hidden" type="checkbox" <% if(channel.settings.hidden){ %> checked <% } %>>
</span>
</form>
<h1 class="panel-title"><%- channel.name %> - Channel Settings</h1>
<%- include('partial/channelSettings/userList.ejs'); %>
<%- include('partial/channelSettings/settings.ejs'); %>
<%- include('partial/channelSettings/permList.ejs'); %>
<a href="javascript:" id="channel-delete">Delete Channel</a>
<footer>
<%- include('partial/scripts', {user}); %>

View file

@ -20,10 +20,10 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<td id="admin-channel-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title">
<h3>Img</h3>
</td>
<td id="admin-channel-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-channel-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>Name</h3>
</td>
<td id="admin-channel-list-entry-description-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-channel-list-entry-description-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>Description</h3>
</td>
</tr>
@ -34,12 +34,12 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<img id="admin-channel-list-entry-img-<%- channel.name %>" class="admin-list-entry admin-list-entry-item" src="<%- channel.thumbnail %>">
</a>
</td>
<td id="admin-channel-list-entry-name-<%- channel.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-channel-list-entry-name-<%- channel.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<a href="/c/<%- channel.name %>" class="admin-list-entry admin-list-entry-item">
<%- channel.name %>
</a>
</td>
<td id="admin-channel-list-entry-description-<%- channel.name %>" class="admin-list-entry admin-list-entry-large admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-channel-list-entry-description-<%- channel.name %>" class="admin-list-entry admin-list-entry-large admin-list-entry-item admin-list-entry-not-first-col">
<%- channel.description %>
</td>
</tr>

View file

@ -15,7 +15,7 @@ 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 id="admin-perm-list-div" class="admin-list-div">
<h3>Permissions:</h3>
<field id="admin-perm-list-field" class="admin-list-field">
<form action="javascript:" id="admin-perm-list-field" class="admin-list-field">
<% Object.keys(permList).forEach((key)=>{ %>
<% if(key != "channelOverrides"){ %>
<span class="admin-list-field-container">
@ -41,5 +41,5 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
</span>
<% } %>
<% }); %>
</field>
</form>
</div>

View file

@ -20,19 +20,19 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<td id="admin-user-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title">
<h3>Img</h3>
</td>
<td id="admin-user-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>ID</h3>
</td>
<td id="admin-user-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>Name</h3>
</td>
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>Rank</h3>
</td>
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>E-Mail</h3>
</td>
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col">
<h3>Sign-Up Date</h3>
</td>
</tr>
@ -43,17 +43,17 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<img id="admin-user-list-entry-img-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item" src="<%- curUser.img %>">
</a>
</td>
<td id="admin-user-list-entry-id-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-id-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<a href="/profile/<%- curUser.name %>" class="admin-list-entry admin-list-entry-item">
<%- curUser.id %>
</a>
</td>
<td id="admin-user-list-entry-name-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-name-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<a href="/profile/<%- curUser.name %>" class="admin-list-entry admin-list-entry-item">
<%- curUser.name %>
</a>
</td>
<td id="admin-user-list-entry-rank-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-rank-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<% if(rankEnum.indexOf(curUser.rank) < rankEnum.indexOf(user.rank)){%>
<select id="admin-user-list-rank-select-<%- curUser.name %>" class="admin-user-list-rank-select">
<%rankEnum.slice().reverse().forEach((rank)=>{ %>
@ -64,10 +64,10 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<%- curUser.rank %>
<% } %>
</td>
<td id="admin-user-list-entry-email-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-email-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<%- curUser.email ? curUser.email : "N/A" %>
</td>
<td id="admin-user-list-entry-date-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-row">
<td id="admin-user-list-entry-date-<%- curUser.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col">
<%- curUser.date.toUTCString() %>
</td>
</tr>

View file

@ -0,0 +1,32 @@
<!--Canopy - The next generation of stoner streaming software
Copyright (C) 2024 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/>.-->
<div class="admin-list-div">
<h3> Permissions:</h3>
<form action="javascript:" class="admin-list-field">
<% Object.keys(channel.permissions.toObject()).forEach((key)=>{ %>
<% if(key != "channelOverrides"){ %>
<span class="admin-list-field-container">
<label id="admin-perm-list-label-<%- key %>" class="admin-list-label admin-perm-list" for="admin-perm-list-rank-select-<%- key %>"><%- key %>: </label>
<select id="admin-perm-list-rank-select-<%- key %>" name="admin-perm-list-rank-select-<%- key %>" class="channel-perm-select admin-list-select admin-perm-list-rank-select">
<%rankEnum.slice().reverse().forEach((rank)=>{ %>
<option <%if(channel.permissions.toObject()[key] == rank){%> selected <%}%> value="<%- rank %>"><%- rank %></option>
<% }); %>
</select>
</span>
<% } %>
<% }); %>
</form>
</div>

View file

@ -0,0 +1,26 @@
<!--Canopy - The next generation of stoner streaming software
Copyright (C) 2024 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/>.-->
<div class="admin-list-div">
<h3>Channel Preferences:</h3>
<form action="javascript:" class="admin-list-field">
<% Object.keys(channel.settings).forEach((key) => { %>
<span class="admin-list-field-container">
<label class="admin-list-label"><%- key %>:</label>
<input id=<%- `channel-preference-${key}` %> class="channel-preference-list-item" type="checkbox" <% if(channel.settings[key]){ %> checked <% } %>>
</span>
<% }); %>
</form>
</div>

View file

@ -0,0 +1,36 @@
<!--Canopy - The next generation of stoner streaming software
Copyright (C) 2024 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/>.-->
<div class="admin-list-div">
<h3 id="channel-rank-title">Channel Ranks:</h3>
<sup id="channel-rank-sup">Users set to default channel rank 'user' will NOT be listed below.</sup>
<span id="new-rank-span">
<input placeholder="Add Username..." id="new-rank-input">
<select id="new-rank-select">
<%rankEnum.slice().reverse().forEach((rank)=>{ %>
<option value="<%= rank %>"><%= rank %></option>
<% }); %>
</select>
</span>
<table class="admin-list-table">
<tr class="admin-list-entry-title-row">
<td class="admin-list-entry-item admin-list-entry admin-list-entry-img-title"><h3>Img</h3></td>
<td id="admin-user-list-entry-id-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>ID</h3></td>
<td class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Name</h3></td>
<td id="channel-user-list-entry-rank-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Rank</h3></td>
</tr>
<!-- This is getting filled via AJAX since we need to refresh it when new users are added anywho. -->
</table>
</div>

View file

@ -17,7 +17,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<p class="navbar-item" id="instance-title"><a href="/" class="navbar-item"><%= instance %></a></p>
<span class="navbar-item" id="right-controls">
<% if(user){ %>
<p class="navbar-item">Welcome, <a class="navbar-item" href="/profile"><%= user.user %></a> - <% if(user.rank == "admin"){ %><a href="/adminPanel" title="Admin Panel" class="bi bi-server navbar-item"></a> <% } %><a class="navbar-item" href="javascript:" id="logout-button">logout</a></p>
<p class="navbar-item">Welcome, <a class="navbar-item" id="username" href="/profile"><%= user.user %></a> - <% if(user.rank == "admin"){ %><a href="/adminPanel" title="Admin Panel" class="bi bi-server navbar-item"></a> <% } %><a class="navbar-item" href="javascript:" id="logout-button">logout</a></p>
<% }else{ %>
<input class="navbar-item login-prompt" id="username-prompt" placeholder="username">
<input class="navbar-item login-prompt" id="password-prompt" placeholder="password" type="password">

View file

@ -29,28 +29,28 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<%- include('partial/navbar', {user}); %>
<% if(profile){ %>
<div class="profile" id="profile-div">
<h1 class="profile-item" id="profile-username"><%= profile.user %></h1>
<img class="profile-item" id="profile-img" src="<%= profile.img %>">
<h1 class="profile-item" id="profile-username"><%- profile.user %></h1>
<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>
<% } %>
<p class="profile-item" id="profile-tokes">tokes: <%= profile.tokes %> (Not yet implemented)</p>
<p class="profile-item" id="profile-tokes">tokes: <%- profile.tokes %> (Not yet implemented)</p>
<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>
<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>
<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>
<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>
<p class="profile-item" id="profile-creation-date">Joined: <%= profile.date.toUTCString(); %></p>
<p class="profile-item" id="profile-creation-date">Joined: <%- profile.date.toUTCString(); %></p>
<div class="profile-item" id="profile-badge-shelf">
<h3 class="profile-item" id="no-badge-label">Badgeless?</h3>
</div>