UI Updated to reflect active livestreams, queue locks while streaming.

src/app/channel/media/queue.js

@@ -62,7 +62,7 @@ module.exports = class{
     defineListeners(socket){
         //Queueing Functions
         socket.on("queue", (data) => {this.queueURL(socket, data)});
-        socket.on("stop", (data) => {this.stopMedia(socket)}); //needs perms
+        socket.on("stop", () => {this.stopMedia(socket)}); //needs perms
         socket.on("delete", (data) => {this.deleteMedia(socket, data)});
         socket.on("clear", (data) => {this.deleteRange(socket, data)});
         socket.on("move", (data) => {this.moveMedia(socket, data)});
@@ -407,6 +407,17 @@ module.exports = class{
     }
 
     async removeRange(start = new Date().getTime() - 60 * 1000, end = new Date().getTime(), socket){
+        //If we're streamlocked
+        if(this.streamLock){
+            //If an originating socket was provided for this request
+            if(socket != null){
+                //Yell at the user for being an asshole
+                loggerUtils.socketErrorHandler(socket, "You cannot edit the schedule while livestreaming!", "queue");
+            }
+            //Stop while we're ahead since the stream hasn't ended yet
+            return;
+        }
+
         //Find items within given range
         const foundItems = this.getItemsBetweenEpochs(start, end);
 
@@ -440,6 +451,17 @@ module.exports = class{
     }
 
     async rescheduleMedia(uuid, start = new Date().getTime(), socket){
+        //If we're streamlocked
+        if(this.streamLock){
+            //If an originating socket was provided for this request
+            if(socket != null){
+                //Yell at the user for being an asshole
+                loggerUtils.socketErrorHandler(socket, "You cannot edit the schedule while livestreaming!", "queue");
+            }
+            //Stop while we're ahead since the stream hasn't ended yet
+            return;
+        }       
+
         //Find our media, don't remove it yet since we want to do some more testing first
         const media = this.getItemByUUID(uuid);
 
@@ -502,6 +524,17 @@ module.exports = class{
     }
 
     async removeMedia(uuid, socket, chanDB){
+        //If we're streamlocked
+        if(this.streamLock){
+            //If an originating socket was provided for this request
+            if(socket != null){
+                //Yell at the user for being an asshole
+                loggerUtils.socketErrorHandler(socket, "You cannot edit the schedule while livestreaming!", "queue");
+            }
+            //Stop while we're ahead since the stream hasn't ended yet
+            return;
+        }
+
         //Get requested media
         const media = this.getItemByUUID(uuid);
 
@@ -643,6 +676,17 @@ module.exports = class{
         https://community.appsmith.com/content/blog/dark-side-foreach-why-you-should-think-twice-using-it
         */
 
+        //If we're streamlocked
+        if(this.streamLock){
+            //If an originating socket was provided for this request
+            if(socket != null){
+                //Yell at the user for being an asshole
+                loggerUtils.socketErrorHandler(socket, "You cannot edit the schedule while livestreaming!", "queue");
+            }
+            //Stop while we're ahead since the stream hasn't ended yet
+            return;
+        }
+
         for(let mediaObj of media){
             const now = new Date().getTime();
 

www/js/channel/panels/queuePanel/queuePanel.js

@@ -599,7 +599,7 @@ class queuePanel extends panelObj{
                 //Otherwise, if the item is currently playing
                 }else if(this.getMediaEnd(entry[1]) > now.getTime()){
                     //Add 'Stop' option to context menu
-                    menuMap.set("Stop", ()=>{this.client.socket.emit('stop', {uuid: entry[1].uuid})});
+                    menuMap.set("Stop", ()=>{this.client.socket.emit('stop')});
                     //Add the Now Playing glow, not the prettiest place to add this, but why let a good conditional go to waste?
                     entryDiv.classList.add('now-playing');
                 //Otherwise, if the item has been archived
@@ -636,10 +636,11 @@ class queuePanel extends panelObj{
                 this.queueContainer.append(entryDiv);
             }
 
-            //Render out any playing livestreams
-            this.renderLiveStream(date);
         }
 
+        //Render out any playing livestreams
+        this.renderLiveStream(date);
+
         function clickEntry(event){
             //If it's not a left click
             if(event.buttons != 1){
@@ -1040,6 +1041,20 @@ class queuePanel extends panelObj{
                 utils.ux.displayTooltip(event, tooltipDiv, false, null, true, this.ownerDoc);
             });
 
+            const menuMap = new Map([
+                ["Stop", ()=>{this.client.socket.emit('stop');}],
+                ["Delete", ()=>{this.client.socket.emit('delete', {uuid: nowPlaying.uuid});}],
+                ["Open in New Tab", ()=>{window.open(nowPlaying.url, '_blank').focus();}],
+                ["Copy URL", ()=>{navigator.clipboard.writeText(nowPlaying.url);}],
+
+            ]);
+
+            //Setup context menu
+            entryDiv.addEventListener('contextmenu', (event)=>{
+                //Display context menu
+                utils.ux.displayContextMenu(event, '', menuMap, this.ownerDoc);
+            });
+
             //Append entry div to queue container
             this.queueContainer.appendChild(entryDiv);
         }else{