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

Basic frontend cleanup.

Browse source
This commit is contained in:
rainbownapkin 2024-11-16 17:39:52 -05:00
parent be09c2457e
commit d0184c5b6b
5 changed files with 42 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/app/channel/channelManager.js
View file

@ -79,8 +79,6 @@ module.exports.handleConnection = async function(io, socket){
//Get active channel //Get active channel
var activeChan = activeChannels.get(socket.chan); var activeChan = activeChannels.get(socket.chan);
console.log(socket);
//If we have more than one active connection //If we have more than one active connection
if(activeChan.userList.get(socket.user.user).length > 1){ if(activeChan.userList.get(socket.user.user).length > 1){
//temporarily store list of active user sockets //temporarily store list of active user sockets

42
src/views/channel.ejs
View file

@ -81,28 +81,30 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<div class="active-cpanel cpanel-doc" id="cpanel-active-doc"> <div class="active-cpanel cpanel-doc" id="cpanel-active-doc">
</div> </div>
</div> </div>
<div class="pinned-cpanel cpanel-div" id="cpanel-pinned-div"> <div class="chat-panel" id="cpanel-pinned-splitter">
<div class="pinned-cpanel cpanel-header-div" id="cpanel-pinned-header-div"> <div class="pinned-cpanel cpanel-div" id="cpanel-pinned-div">
<i class="pinned-cpanel cpanel-header-icon cpanel-unpin-icon bi-pin-fill" id="cpanel-pinned-unpin-icon"></i> <div class="pinned-cpanel cpanel-header-div" id="cpanel-pinned-header-div">
<p class="pinned-cpanel cpanel-title" id="cpanel-pinned-title">NULL PANEL</p> <i class="pinned-cpanel cpanel-header-icon cpanel-unpin-icon bi-pin-fill" id="cpanel-pinned-unpin-icon"></i>
<span class="pinned-cpanel cpanel-title-spacer" id="cpanel-pinned-title-spacer"></span> <p class="pinned-cpanel cpanel-title" id="cpanel-pinned-title">NULL PANEL</p>
<i class="pinned-cpanel cpanel-header-icon cpanel-popout-icon bi-window-stack" id="cpanel-pinned-popout-icon"></i> <span class="pinned-cpanel cpanel-title-spacer" id="cpanel-pinned-title-spacer"></span>
<i class="pinned-cpanel cpanel-header-icon cpanel-close-icon bi-x" id="cpanel-pinned-close-icon"></i> <i class="pinned-cpanel cpanel-header-icon cpanel-popout-icon bi-window-stack" id="cpanel-pinned-popout-icon"></i>
<i class="pinned-cpanel cpanel-header-icon cpanel-close-icon bi-x" id="cpanel-pinned-close-icon"></i>
</div>
<div class="pinned-cpanel cpanel-doc" id="cpanel-pinned-doc">
</div>
<div class="drag-handle right-drag-handle" id="cpanel-pinned-drag-handle">
</div> </div>
<div class="pinned-cpanel cpanel-doc" id="cpanel-pinned-doc">
</div> </div>
<div class="drag-handle right-drag-handle" id="cpanel-pinned-drag-handle"> <div class="chat-panel" id="chat-area">
</div> <div class="chat-panel" id="chat-panel-buffer-div">
</div> </div>
<div class="chat-panel" id="chat-area"> <div class="chat-panel" id="chat-panel-control-div">
<div class="chat-panel" id="chat-panel-buffer-div"> <i class="chat-panel chat-panel-control bi-gear-fill" id="chat-panel-settings-icon"></i>
</div> <i class="chat-panel chat-panel-control bi-magic" id="chat-panel-admin-icon"></i>
<div class="chat-panel" id="chat-panel-control-div"> <i class="chat-panel chat-panel-control bi-images" id="chat-panel-emote-icon"></i>
<i class="chat-panel chat-panel-control bi-gear-fill" id="chat-panel-settings-icon"></i> <input class="chat-panel chat-panel-control" id="chat-panel-prompt" placeholder="Chat...">
<i class="chat-panel chat-panel-control bi-magic" id="chat-panel-admin-icon"></i> <button class="chat-panel chat-panel-control" id="chat-panel-send-button">Send</button>
<i class="chat-panel chat-panel-control bi-images" id="chat-panel-emote-icon"></i> </div>
<input class="chat-panel chat-panel-control" id="chat-panel-prompt" placeholder="Chat...">
<button class="chat-panel chat-panel-control" id="chat-panel-send-button">Send</button>
</div> </div>
</div> </div>
<div class="chat-panel" id="chat-panel-users-div"> <div class="chat-panel" id="chat-panel-users-div">

6
www/css/channel.css
View file

@ -238,4 +238,10 @@ input#chat-panel-prompt{
display: none; display: none;
min-width: 4em; min-width: 4em;
width: 30%; width: 30%;
}
#cpanel-pinned-splitter{
display: flex;
flex-direction: row;
flex: 1;
} }

11
www/css/theme/movie-night.css
View file

@ -17,7 +17,8 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
:root{ :root{
--main-font: "open-sans", sans-serif; --main-font: "open-sans", sans-serif;
--bg0: rgb(158, 158, 158); --bg0: rgb(158, 158, 158);
--bg0-alpha0: rgba(158, 158, 158, 0.75); --bg0-alpha0: rgba(158, 158, 158, 0.4);
--bg0-alpha1: rgba(158, 158, 158, 0.75);
--bg1: rgb(70, 70, 70); --bg1: rgb(70, 70, 70);
--bg2: rgb(220, 220, 220); --bg2: rgb(220, 220, 220);
--bg1-alt0: rgb(30, 30, 30); --bg1-alt0: rgb(30, 30, 30);
@ -43,8 +44,8 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
--media-header-gradient: linear-gradient(180deg, var(--bg1-alt0) 0%, #FFFFFF00 76%); --media-header-gradient: linear-gradient(180deg, var(--bg1-alt0) 0%, #FFFFFF00 76%);
/*--active-panel-effect: blur(1em);*/ --background-panel-effect-pretty: blur(4px);
--active-panel-effect: none; --background-panel-effect-fast: none;
} }
body{ body{
@ -249,8 +250,8 @@ select.panel-head-element{
} }
#cpanel-active-div{ #cpanel-active-div{
background-color: var(--bg0-alpha0); background-color: var(--bg0-alpha1);
backdrop-filter: var(--active-panel-effect); backdrop-filter: var(--background-panel-effect-fast);
} }
.cpanel-div{ .cpanel-div{

8
www/js/utils.js
View file

@ -54,6 +54,10 @@ class canopyUXUtils{
startDrag(event){ startDrag(event){
//we are now dragging //we are now dragging
this.dragLock = true; this.dragLock = true;
//Keep user from selecting text or changing cursor as we drag
window.document.body.style.userSelect = "none";
window.document.body.style.cursor = "ew-resize";
} }
endDrag(event){ endDrag(event){
@ -67,6 +71,10 @@ class canopyUXUtils{
//if this is true, it no longer needs to be, though it *should* be reset by the drag function by the time it matters anywho :P //if this is true, it no longer needs to be, though it *should* be reset by the drag function by the time it matters anywho :P
this.fixWidth = false; this.fixWidth = false;
} }
//Return cursor to normal, and allow user to select text again
window.document.body.style.userSelect = "auto";
window.document.body.style.cursor = "auto";
} }
drag(event){ drag(event){