Basic frontend cleanup.

src/app/channel/channelManager.js

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

src/views/channel.ejs

@@ -81,6 +81,7 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.-->
                         <div class="active-cpanel cpanel-doc" id="cpanel-active-doc">
                         </div>
                     </div>
+                    <div class="chat-panel" id="cpanel-pinned-splitter">
                         <div class="pinned-cpanel cpanel-div" id="cpanel-pinned-div">
                             <div class="pinned-cpanel cpanel-header-div" id="cpanel-pinned-header-div">
                                 <i class="pinned-cpanel cpanel-header-icon cpanel-unpin-icon bi-pin-fill" id="cpanel-pinned-unpin-icon"></i>
@@ -105,6 +106,7 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.-->
                                 <button class="chat-panel chat-panel-control" id="chat-panel-send-button">Send</button>
                             </div>
                         </div>
+                    </div>
                     <div class="chat-panel" id="chat-panel-users-div">
                         <div class="drag-handle left-drag-handle" id="chat-panel-users-drag-handle">
                         </div>

www/css/channel.css

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

www/css/theme/movie-night.css

@@ -17,7 +17,8 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.*/
 :root{
     --main-font: "open-sans", sans-serif;
     --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);
     --bg2: rgb(220, 220, 220);
     --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%);
 
-    /*--active-panel-effect: blur(1em);*/
-    --active-panel-effect: none;
+    --background-panel-effect-pretty: blur(4px);
+    --background-panel-effect-fast: none;
 }
 
 body{
@@ -249,8 +250,8 @@ select.panel-head-element{
 }
 
 #cpanel-active-div{
-    background-color: var(--bg0-alpha0);
-    backdrop-filter: var(--active-panel-effect);
+    background-color: var(--bg0-alpha1);
+    backdrop-filter: var(--background-panel-effect-fast);
 }
 
 .cpanel-div{

www/js/utils.js

@@ -54,6 +54,10 @@ class canopyUXUtils{
         startDrag(event){
             //we are now dragging
             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){
@@ -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
                 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){