add carts!

plugins/qlab/cart.ejs

@@ -1,15 +1,17 @@
-<div id="<%= cueList.uniqueID %>">
+<% let cueKeys = allCues[cueList.uniqueID]; %>
 
-<h3><%= cueList.displayName %></h3>
+<div id="<%= cueKeys.uniqueID %>">
+
+<h3><%= workspace.displayName %> &mdash; <%= cueList.listName %></h3>
 <%
-  let width = 100/cueList.cartColumns;
-  let height = 600/(cueList.cartRows);
+  let width = 100/cueKeys.cartColumns;
+  let height = 600/(cueKeys.cartRows);
 %>
 
 <div class="cart">
 
-<% for(let r=0; r<cueList.cartRows; r++){ %>
-  <% for(let c=0; c<cueList.cartColumns; c++){ %>
+<% for(let r=0; r<cueKeys.cartRows; r++){ %>
+  <% for(let c=0; c<cueKeys.cartColumns; c++){ %>
     <% let style = `style="left:${width*c}%; top:${height*r}px; width:${width }%; height:${height}px;"`; %>
 
     <div class="cartCueWrapper" <%= style %>><div class="cartCue cartBlank"></div></div>
@@ -18,25 +20,27 @@
 <% } %>
 
 
-<% for(var c in cueList.cues){ 
-  let cue = cueList.cues[c];
+<% for(let i=0; i<cueList.cues.length; i++){
+  let cue = allCues[cueList.cues[i].uniqueID];
 
   if(!cue.cartPosition){
     cue.cartPosition = [0, 0];
   }
 
+
   let row = cue.cartPosition[0]-1;
   let col = cue.cartPosition[1]-1;
 
   let colPos = width*col;
   let rowPos = height*row;
 
-  if(col>=cueList.cartColumns || row>=cueList.cartRows){
+  if(col>=cueKeys.cartColumns || row>=cueKeys.cartRows){
     continue;
-  } 
+  }
+
 %>
- 
-<%= tileTemplate({cue: allCues[cue.uniqueID], allCues: allCues}) %>
+
+<%= tileTemplate({cue: cueList.cues[i], allCues: allCues, workspace: workspace}) %>
 
 <% } %>
 

plugins/qlab/main.js

@@ -88,71 +88,78 @@ exports.data = function data(_device, oscData) {
   } else if (/reply\/cue_id\/.*\/valuesForKeys/.test(oscData.address)) {
     const json = JSON.parse(oscData.args[0]);
     const keyValues = json.data;
-    const cue = device.data.cueKeys[msgAddr[2]];
+    let cue = device.data.cueKeys[msgAddr[2]];
 
     if (cue === undefined) {
       // this cue is new!
-      console.log('HERE');
+
       // device.send(`/workspace/${json.workspace_id}/cueLists`);
-      // device.draw();
-    } else {
-      // console.log(keyValues.number);
-      cue.uniqueID = keyValues.uniqueID;
-      cue.number = keyValues.number;
-      cue.listName = keyValues.listName;
-      cue.isBroken = keyValues.isBroken;
-      cue.isRunning = keyValues.isRunning;
-      cue.isLoaded = keyValues.isLoaded;
-      cue.isFlagged = keyValues.isFlagged;
-      cue.type = keyValues.type;
-      cue.cues = keyValues.children;
-      cue.preWait = keyValues.preWait;
-      cue.postWait = keyValues.postWait;
-      cue.duration = keyValues.duration;
-      cue.colorName = keyValues.colorName;
-      cue.continueMode = keyValues.continueMode;
-      cue.mode = keyValues.mode;
-      cue.parent = keyValues.parent;
-      cue.cartRows = keyValues.cartRows;
-      cue.cartColumns = keyValues.cartColumns;
-      cue.cartPosition = keyValues.cartPosition;
-      cue.displayName = keyValues.displayName;
-      cue.preWaitElapsed = keyValues.preWaitElapsed;
-      cue.actionElapsed = keyValues.actionElapsed;
-      cue.postWaitElapsed = keyValues.postWaitElapsed;
-      cue.isPaused = keyValues.isPaused;
-      cue.currentCueTarget = keyValues.currentCueTarget;
-      cue.armed = keyValues.armed;
+      device.draw();
+      device.data.cueKeys[msgAddr[2]] = {};
+      cue = device.data.cueKeys[msgAddr[2]];
+    }
+    // console.log(keyValues.number);
+    cue.uniqueID = keyValues.uniqueID;
+    cue.number = keyValues.number;
+    cue.listName = keyValues.listName;
+    cue.isBroken = keyValues.isBroken;
+    cue.isRunning = keyValues.isRunning;
+    cue.isLoaded = keyValues.isLoaded;
+    cue.isFlagged = keyValues.isFlagged;
+    cue.type = keyValues.type;
+    cue.cues = keyValues.children;
+    cue.preWait = keyValues.preWait;
+    cue.postWait = keyValues.postWait;
+    cue.duration = keyValues.duration;
+    cue.colorName = keyValues.colorName;
+    cue.continueMode = keyValues.continueMode;
+    cue.mode = keyValues.mode;
+    cue.parent = keyValues.parent;
+    cue.cartRows = keyValues.cartRows;
+    cue.cartColumns = keyValues.cartColumns;
+    cue.cartPosition = keyValues.cartPosition;
+    cue.displayName = keyValues.displayName;
+    cue.preWaitElapsed = keyValues.preWaitElapsed;
+    cue.actionElapsed = keyValues.actionElapsed;
+    cue.postWaitElapsed = keyValues.postWaitElapsed;
+    cue.isPaused = keyValues.isPaused;
+    cue.currentCueTarget = keyValues.currentCueTarget;
+    cue.armed = keyValues.armed;
 
-      if (keyValues.isRunning) {
-        device.data.somethingPlaying = true;
+    if (keyValues.isRunning) {
+      device.data.somethingPlaying = true;
+    }
+
+    let testCue = device.data.cueKeys[msgAddr[2]];
+    let nestedGroupModes;
+
+    if (cue.type === 'Group') {
+      nestedGroupModes = [testCue.mode];
+    } else if (cue.parent !== '[root group of cue lists]') {
+      nestedGroupModes = [device.data.cueKeys[cue.parent].mode];
+    }
+
+    while (testCue.parent !== '[root group of cue lists]') {
+      testCue = device.data.cueKeys[testCue.parent];
+      if (testCue === undefined) {
+        break;
       }
 
-      let testCue = device.data.cueKeys[msgAddr[2]];
-      let nestedGroupModes;
-
-      if (cue.type === 'Group') {
-        nestedGroupModes = [testCue.mode];
-      } else if (cue.parent !== '[root group of cue lists]') {
-        nestedGroupModes = [device.data.cueKeys[cue.parent].mode];
-      }
-
-      while (testCue.parent !== '[root group of cue lists]') {
-        testCue = device.data.cueKeys[testCue.parent];
-        if (testCue === undefined) {
-          break;
-        }
-
-        nestedGroupModes.unshift(testCue.mode);
-        cue.nestedGroupModes = nestedGroupModes;
-      }
-      if (cue.type === 'Cue List' || cue.type === 'Group') {
+      nestedGroupModes.unshift(testCue.mode);
+      cue.nestedGroupModes = nestedGroupModes;
+    }
+    if (cue.type === 'Cue List' || cue.type === 'Group' || cue.type === 'Cart') {
+      if (device.data.cueKeys[msgAddr[2]].cueInWorkspace) {
         device.data.cueKeys[msgAddr[2]].cueInWorkspace.cues = [...keyValues.children];
       }
-      if (cue.type !== 'Cue List') {
-        device.update('updateCueRow', { cue, workspace: device.data.workspaces[json.workspace_id] });
-      }
     }
+    if (cue.type !== 'Cue List' && cue.type !== 'Cart') {
+      device.update('updateCueRow', { cue, workspace: device.data.workspaces[json.workspace_id] });
+    }
+    if (cue.type === 'Cart') {
+      device.draw();
+    }
+
     // console.log(cue);
   } else if (/reply\/cue_id\/active\/.*Elapsed/.test(oscData.address)) {
     const json = JSON.parse(oscData.args[0]);
@@ -173,6 +180,10 @@ exports.data = function data(_device, oscData) {
   } else if (/update\/workspace\/.*\/cue_id\/.*/.test(oscData.address)) {
     if (device.data.cueKeys[msgAddr[4]] && device.data.cueKeys[msgAddr[4]].type === 'Group') {
       device.send(`/workspace/${msgAddr[2]}/cueLists`);
+    } else if (device.data.cueKeys[msgAddr[4]] && device.data.cueKeys[msgAddr[4]].type === 'Cue List') {
+      device.send(`/workspace/${msgAddr[2]}/cueLists`);
+    } else if (device.data.cueKeys[msgAddr[4]] && device.data.cueKeys[msgAddr[4]].type === 'Cart') {
+      device.send(`/workspace/${msgAddr[2]}/cueLists`);
     } else {
       device.send(`/cue_id/${msgAddr[4]}/valuesForKeys`, [{ type: 's', value: valuesForKeysString }]);
     }
@@ -224,7 +235,21 @@ function processCueList(list, knownCueIDs, _device, _nestedIndex) {
 exports.update = function update(device, doc, updateType, data) {
   if (updateType === 'updateCueRow') {
     const $elem = doc.getElementById(data.cue.uniqueID);
-    $elem.outerHTML = device.templates.cue({ allCues: device.data.cueKeys, cue: data.cue, workspace: data.workspace });
+    if ($elem) {
+      if (device.data.cueKeys[data.cue.parent].type === 'Cart') {
+        $elem.outerHTML = device.templates.tile({
+          allCues: device.data.cueKeys,
+          cue: data.cue,
+          workspace: data.workspace,
+        });
+      } else {
+        $elem.outerHTML = device.templates.cue({
+          allCues: device.data.cueKeys,
+          cue: data.cue,
+          workspace: data.workspace,
+        });
+      }
+    }
   } else if (updateType === 'updatePlaybackAndSelected') {
     Array.from(doc.querySelectorAll('.selected')).forEach(($el) => {
       $el.classList.remove('selected');
@@ -234,11 +259,15 @@ exports.update = function update(device, doc, updateType, data) {
     });
     for (let i = 0; i < data.workspace.selected.length; i++) {
       const $elem = doc.getElementById(data.workspace.selected[i]);
-      $elem.classList.add('selected');
+      if ($elem) {
+        $elem.classList.add('selected');
+      }
     }
     if (data.workspace.playbackPosition) {
       const $elem = doc.getElementById(data.workspace.playbackPosition);
-      $elem.classList.add('playback-position');
+      if ($elem) {
+        $elem.classList.add('playback-position');
+      }
     }
   }
 };

plugins/qlab/template.ejs

@@ -8,15 +8,13 @@
 <% for(let i=0; i<workspaceKeys.length; i++){ %>
   <% const workspace = data.workspaces[workspaceKeys[i]]; %>
 
-  <h1><%= workspace.displayName %></h1>
-
   <% for(let j=0; j<workspace.cueLists.length; j++){ %>
     <% const cueList = workspace.cueLists[j]; %>
 
     <% if(cueList.type=="Cue List"){ %>
       <%= templates.cuelist({cueList: cueList, allCues: data.cueKeys, rowTemplate: templates.cue, workspace: workspace}) %>
     <% }else if(cueList.type=="Cart"){ %>
-      <%= templates.cart({cueList: cueList, allCues: data.cueKeys, tileTemplate: templates.tile}) %>
+      <%= templates.cart({cueList: cueList, allCues: data.cueKeys, tileTemplate: templates.tile, workspace: workspace}) %>
     <% } %>
 
   <% } %>

plugins/qlab/tile.ejs

@@ -1,17 +1,17 @@
 <%
-
   let height = 0;
   let width = 0;
   let left = 0;
   let top = 0;
+  let cueKeys = allCues[cue.uniqueID];
+  let parent = allCues[cue.parent];
 
+  if(cueKeys.parent){
+    width = 100/allCues[cueKeys.parent].cartColumns;
+    height = 600/allCues[cueKeys.parent].cartRows;
 
-  if(cue.parent){
-    width = 100/allCues[cue.parent].cartColumns;
-    height = 600/allCues[cue.parent].cartRows;
-
-    top = (cue.cartPosition[0]-1)*height;
-    left = (cue.cartPosition[1]-1)*width;
+    top = (cueKeys.cartPosition[0]-1)*height;
+    left = (cueKeys.cartPosition[1]-1)*width;
   }
 
   let style = `style="left:${left}%; top:${top}px; width:${width }%; height:${height}px;"`;
@@ -21,17 +21,17 @@
 <div id="<%= cue.uniqueID %>" class="cartCueWrapper" <%= style %> > 
 
   <div class="cartCueIcon">
-    <% if(cue.broken){ %>
+    <% if(cueKeys.isBroken){ %>
       <img src="plugins/qlab/img/status_broken_white.png" height="18px">
-    <% }else if(cue.running){ %>
+    <% }else if(cueKeys.isRunning){ %>
       <img src="plugins/qlab/img/pause_circled.png" height="24px">
     <% }else{ %>
       <img src="plugins/qlab/img/play_circled.png" height="24px">
     <% } %>
   </div>
 
-  <div class="cartCue cartColor-<%= cue.colorName %>">
-    <p><%= cue.number %> &bull;  <%= cue.displayName %></p>
+  <div class="cartCue cartColor-<%= cueKeys.colorName %>">
+    <p><%= cueKeys.number %> &bull;  <%= cueKeys.displayName %></p>
   </div>
 
 </div>