First Commit

2026-08-06 22:33:39 +00:00 · 2021-10-18 04:55:03 -04:00
commit f3cb66b9f3
95 changed files with 18266 additions and 0 deletions
@@ -0,0 +1,4 @@
+
+.DS_Store
+node_modules
+out
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <title>Cue View</title>
+    <link rel="stylesheet" href="src/index.css">
+
+  </head>
+  <body>
+
+
+    <div id="main">
+
+        <div class="col" id="device-list-col">
+
+            <div id="view-buttons-bar">
+                <button id="save-slot-1" class="save-slot" title="Window arrangement 1">1</button>
+                <button id="save-slot-2" class="save-slot" title="Window arrangement 2">2</button>
+                <button id="save-slot-3" class="save-slot" title="Window arrangement 3">3</button>
+                
+            </div>
+
+            <div id="device-list">
+              <h3 class="init">Click the Search button to find devices on the network.</h3>
+            </div>
+
+            <div id="device-tools">
+                <select class="left button" id="add-device-button" title="Add Device..."></select>
+                <button class="left" id="search-button" title="Search network for devices"><img src="src/img/outline_search_white_18dp.png"></button>
+                <button class="left" id="refresh-device-button" title="Refresh Device" disabled><img src="src/img/outline_refresh_white_18dp.png"></button>
+            </div>
+
+
+
+            <div id="device-settings">
+                <table id="device-settings-table">
+                    <tr>
+                        <th>Name:</th>
+                        <td colspan="3"><input id="device-settings-name" type="text" maxlength="30"></td>
+                    </tr>
+                    <tr>
+                        <th>Type:</th>
+                        <td colspan="3"><select id="device-settings-plugin-dropdown"></select></td>
+                    </tr>
+                    <tr>
+                        <th>Addr:</th>
+                        <td colspan="3"><input id="device-settings-ip" type="text" maxlength="30"></td>
+                    </tr>
+                    <tr>
+                        <th>Port:</th>
+                        <td><input id="device-settings-port" type="number" value="53000" maxlength="5"></td>
+                        <th>Pin:</th>
+                        <td><input id="device-settings-pin" type="checkbox"></td>
+                </table>
+                <h3>No Device Selected</h3>
+
+            </div>
+
+
+        </div>
+
+        <div id="all-devices">
+
+            
+
+        </div>
+
+    </div>
+
+    <script src="src/index.js"></script>
+
+  </body>
+</html>
@@ -0,0 +1,195 @@
+const { app, BrowserWindow, Menu } = require('electron');
+const path = require('path');
+
+// Handle creating/removing shortcuts on Windows when installing/uninstalling.
+if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
+  app.quit();
+}
+
+if (require('electron-squirrel-startup')) {
+  app.quit();
+}
+
+
+var menu;
+let mainWindow;
+
+const createWindow = () => {
+  
+  mainWindow = new BrowserWindow({
+    width: 1500,
+    height: 900,
+    titleBarStyle: 'hiddenInset',
+    transparent: true,
+    frame: false,
+    show: false,
+    //backgroundColor: "#333333",
+    vibrancy: "window",
+    visualEffectState: "followWindow",
+    webPreferences: {
+      //enableRemoteModule: true,
+      contextIsolation: false,
+      nodeIntegration: true,
+      preload: path.join(__dirname, 'preload.js')
+    }
+  });
+
+  mainWindow.loadFile('index.html');
+
+  mainWindow.on('ready-to-show', () => {
+      mainWindow.show();
+  });
+
+  if(process.defaultApp){
+    mainWindow.webContents.openDevTools();
+  }
+
+
+  menu = Menu.buildFromTemplate(menuTemplate);
+  Menu.setApplicationMenu(menu);
+
+};
+
+
+
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', function () {
+    if (BrowserWindow.getAllWindows().length === 0) createWindow()
+  })
+})
+
+
+
+
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit();
+  }
+});
+
+
+
+const { ipcMain } = require('electron')
+ipcMain.on('enableDeviceDropdown', (event, arg) => {
+  menu.getMenuItemById('devicePin').enabled = true;
+  menu.getMenuItemById('deviceDelete').enabled = true;
+});
+ipcMain.on('disableDeviceDropdown', (event, arg) => {
+  menu.getMenuItemById('devicePin').enabled = false;
+  menu.getMenuItemById('deviceDelete').enabled = false;
+});
+
+ipcMain.on('enableSearchAll', (event, arg) => {
+  menu.getMenuItemById('deviceSearch').enabled = true;
+});
+ipcMain.on('disableSearchAll', (event, arg) => {
+  menu.getMenuItemById('deviceSearch').enabled = false;
+});
+
+ipcMain.on('setDevicePin', function(event, arg){
+  menu.getMenuItemById('devicePin').checked = arg;
+})
+
+const isMac = process.platform === 'darwin'
+
+const menuTemplate = [
+  { role: 'appMenu' },
+  {
+    label: "File",
+    submenu: [
+      {
+        label: "Clear Saved Data",
+        id: "resetViews",
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("resetViews");
+          
+        }
+      },
+      {
+        label: "Reload App",
+        role: "reload"
+      },
+      {
+        type: "separator"
+      },
+      isMac ? { role: 'close' } : { role: 'quit' },
+    ]
+  },
+  { role: 'editMenu' },
+  {
+    label: "View",
+    submenu: [
+      { role: 'togglefullscreen' },
+      { type: 'separator' },
+      {
+        label: "Arrangement 1",
+        accelerator: "CommandOrControl+1",
+        id: "window1",
+        enabled: true,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("doSlots1");
+        }
+      },
+      {
+        label: "Arrangement 2",
+        accelerator: "CommandOrControl+2",
+        id: "window2",
+        enabled: true,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("doSlots2");
+        }
+      },
+      {
+        label: "Arrangement 3",
+        accelerator: "CommandOrControl+3",
+        id: "window3",
+        enabled: true,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("doSlots3");
+        }
+      },
+      { type: 'separator' },
+      { role: 'toggleDevTools' }
+    ]
+  },
+  {
+    label: "Device",
+    submenu: [
+      {
+        label: "Search for Devices",
+        accelerator: "CommandOrControl+F",
+        id: "deviceSearch",
+        enabled: true,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("doSearch");
+        }
+      },
+      {
+        type: "separator"
+      },
+      {
+        label: "Pinned",
+        type: "checkbox",
+        checked: true,
+        accelerator: "CommandOrControl+P",
+        id: "devicePin",
+        enabled: false,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("setActiveDevicePinned", menuItem.checked);
+        }
+      },
+      {
+        label: "Delete",
+        accelerator: "CommandOrControl+Backspace",
+        id: "deviceDelete",
+        enabled: false,
+        click: function(menuItem, window, event){
+          mainWindow.webContents.send("doDelete");
+        }
+      }
+    ]
+  }
+]
@@ -0,0 +1,62 @@
+{
+  "name": "Cue View 2",
+  "version": "0.9.2",
+  "description": "Monitor audio, video, and lighting equipment",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "start": "electron-forge start",
+    "package": "electron-forge package",
+    "make": "electron-forge make"
+  },
+  "author": "Alec Sparks",
+  "license": "CC BY-SA 4.0",
+  "devDependencies": {
+    "@electron-forge/cli": "^6.0.0-beta.61",
+    "@electron-forge/maker-deb": "^6.0.0-beta.61",
+    "@electron-forge/maker-rpm": "^6.0.0-beta.61",
+    "@electron-forge/maker-squirrel": "^6.0.0-beta.61",
+    "@electron-forge/maker-zip": "^6.0.0-beta.61",
+    "electron": "^15.2.0"
+  },
+  "dependencies": {
+    "bonjour": "^3.5.0",
+    "ejs": "^3.1.5",
+    "electron-reload": "^1.5.0",
+    "electron-squirrel-startup": "^1.0.0",
+    "lodash": "^4.17.20",
+    "md5": "^2.3.0",
+    "netmask": "^1.0.6",
+    "osc": "^2.4.1",
+    "uuid": "^8.3.2"
+  },
+  "config": {
+    "forge": {
+      "packagerConfig": {
+        "icon": "./src/img/icon.icns"
+      },
+      "makers": [
+        {
+          "name": "@electron-forge/maker-squirrel",
+          "config": {
+            "name": "Cue View 2"
+          }
+        },
+        {
+          "name": "@electron-forge/maker-zip",
+          "platforms": [
+            "darwin"
+          ]
+        },
+        {
+          "name": "@electron-forge/maker-deb",
+          "config": {}
+        },
+        {
+          "name": "@electron-forge/maker-rpm",
+          "config": {}
+        }
+      ]
+    }
+  }
+}
@@ -0,0 +1,69 @@
+table{
+	background-color: #141414;
+	border: #404040 1px solid;
+	border-radius: 4px;
+	color: #a59baa;
+}
+th{
+	font-size: 14px;
+	font-weight: normal;
+	padding: 5px;
+}
+td{
+	text-align: center;
+	padding: 6px;
+}
+td:first-child{
+	text-align: left;
+}
+td.black{
+	background-color: black;
+	border-right: #212021 1px solid;
+}
+td.num{
+	color: white;
+	font-weight: 600;
+	font-size: 16px;
+}
+.scene{
+	background-color: black;
+	border-top: #141414 2px solid;
+	border-bottom: #141414 2px solid;
+}
+.scene hr{
+	border: #001f10 4px solid;
+}
+.scene span{
+	display: table;
+	margin: 0px auto;
+	margin-top: -25px;
+	padding: 4px;
+	background-color: black;
+	font-weight: bold;
+	font-size: 14px;
+}
+.time{
+	border: #2f2b35 2px solid;
+	border-radius: 5px;
+}
+tr.active-cue{
+	color: #d49800;
+}
+	tr.active-cue td.num{
+		color: #d49800;
+	}
+	tr.active-cue .time{
+		border-color: #d49800;
+	}
+
+	
+@media screen and (min-width: 0px) and (max-width: 750px) {
+	.hide-medium{
+		display: none;
+	}
+}
+@media screen and (min-width: 0px) and (max-width: 550px) {
+	.hide-small{
+		display: none;
+	}
+}
@@ -0,0 +1,119 @@
+<header>
+	<h1><%= listName  %></h1>
+	<h2><%= data.version  %></h2>
+</header>
+
+
+<% for(var i in data.cuelists){ %>
+	<strong>List <%= i %></strong>
+	<table cellspacing="0">
+		<tr>
+			<th width="70px">Cue</th>
+			<th width="30px">Int Up</th>
+			<th width="30px">Int Down</th>
+			<th width="40px" class="hide-medium">Focus</th>
+			<th width="40px" class="hide-medium">Color</th>
+			<th width="40px" class="hide-medium">Beam</th>
+			<th width="40px" class="hide-small">Dur</th>
+			<th width="20px" class="hide-small">M</th>
+			<th width="20px" class="hide-small">B</th>
+			<th width="20px" class="hide-small">A</th>
+			<th width="70px" class="hide-small">Fw/Hg</th>
+			<th width="150px">Label</th>
+			<th width="10px" class="hide-medium">Ext Links</th>
+		</tr>
+
+		<% var cues = Object.keys(data.cuelists[i]).sort(function(a, b){return Number(a)-Number(b)}) %>
+
+		<% for(var j=0; j<cues.length; j++){ %>
+			<% var q = data.cuelists[i][cues[j]] %>
+			
+			<% for(var partNumber in q){ %>
+
+				<% var p = q[partNumber] %>
+
+
+				<% if(p.scene.length>0 && partNumber==0){ %>
+				<tr>
+					<td></td>
+					<td colspan="12" class="scene"><hr><span><%= p.scene %></span></td>
+				</tr>
+				<% } %>
+
+				<% if(cues[j]==data.activeCue+""){ %>
+					<tr class="active-cue">
+				<% }else{ %>
+					<tr>
+				<% } %>
+
+					<% if(partNumber!=0){ %>
+						<td class="num">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;P<%= partNumber %></td>
+					<% }else{ %>
+						<td class="num">&nbsp;<%= cues[j] %></td>
+					<% } %>
+
+					<% if(partNumber!=0 || p.partcount==0){ %>
+
+						<!-- Int Up/Int Down -->
+						<% if(p.uptimeduration == p.downtimeduration || p.downtimeduration==-1){ %>
+							<td class="black" colspan="2"><%- prettyDuration(p.uptimedelay) || "" %><%- prettyDuration(p.uptimeduration, true) %></td>
+						<% }else{ %>
+							<td class="black"><%- prettyDuration(p.uptimedelay) || "" %><%- prettyDuration(p.uptimeduration, true) %></td>
+							<td class="black "><%- prettyDuration(p.downtimeduration, true) %></td>
+						<% } %>
+
+						<td class="black hide-medium"><%- prettyDuration(p.focustimeduration, true) %></td>
+						<td class="black hide-medium"><%- prettyDuration(p.colortimeduration, true) %></td>
+						<td class="black hide-medium"><%- prettyDuration(p.beamtimeduration, true) %></td>
+						<td class="hide-small"><%= prettyDuration(p.duration) %></td>
+
+					<% }else{ %>
+						<td class="black" colspan="2"></td>
+						<td class="black hide-medium"></td>
+						<td class="black hide-medium"></td>
+						<td class="black hide-medium"></td>
+						<td class="hide-small"></td>
+
+					<% } %>
+
+					<td class="black hide-small"><%= p.mark %></td>
+					<td class="black hide-small"><%= p.block %></td>
+					<td class="black hide-small"><%= p.assert %></td>
+					<td class="black hide-small">
+						<%= (p.follow>=0)? "F"+prettyDuration(p.follow) : "" %>
+						<%= (p.hang>=0)? "H"+prettyDuration(p.hang) : "" %>
+					</td>
+					<td class="black" style="text-align: left">
+						<%- (partNumber==0 ? "": "&nbsp;&nbsp;&nbsp;") %>
+						<%= p.label %>
+					</td>
+					<td class="black hide-medium"><%= p.extlinks %></td>
+				</tr>
+
+			<% } %>
+
+		<% } %>
+	</table>
+
+<% } %>
+
+<script>
+	var $scrollTo = document.getElementsByClassName("active-cue");
+	if($scrollTo.length==1){
+		window.scroll({top: $scrollTo[0].offsetTop-200, behavior: 'smooth'});
+	}
+</script>
+
+<%
+	function prettyDuration(milliseconds, box){
+		if(milliseconds==-1){
+			return "";
+		}
+		var num = Math.round(milliseconds/100)/10;
+		if(box){
+			return "<div class='time'>"+num+"</div>";
+		}
+		return num;
+		
+	}
+%>
@@ -0,0 +1,115 @@
+exports.defaultName = "ETC Eos";
+exports.connectionType = "osc";
+exports.searchOptions = {
+	type: "TCPport",
+	searchBuffer: Buffer.from("\xc0/eos/ping\x00\x00\x2c\x00\x00\x00\xc0", 'ascii'),
+	testPort: 3032,
+	validateResponse: function(msg, info){
+		return (msg.toString().indexOf("/eos/out"));
+	}
+}
+exports.defaultPort = 3032;
+
+//"\xc0/eos/ping\x00\x00\x2c\x00\x00\x00\xc0"
+
+
+exports.ready = function(device){
+	device.send("/eos/get/cuelist/count");
+	device.send("/eos/get/version");
+	device.send("/eos/subscribe", [{type: "i", value: 1}]);
+}
+
+exports.data = function(device, osc){
+	var address = osc.address;
+	var p = osc.address.split("/");
+	p.shift();
+
+	if(p[1]=="out" && p[2]=="show" && p[3]=="name"){
+		device.data.showName = osc.args[0];
+		device.data.cuelists = {};
+		this.deviceInfoUpdate(device, "defaultName", osc.args[0]);
+	}else if(osc.address=="/eos/out/get/cuelist/count"){
+		for(var i=0; i<osc.args[0]; i++){
+			device.send("/eos/get/cuelist/index/"+i);
+		}
+	}else if(p[1]=="out" && p[2]=="get" && p[3]=="cuelist" && p[5]=="list"){
+		device.data.cuelists[p[4]] = {};
+		device.send("/eos/get/cue/"+p[4]+"/count");
+	}else if(p[1]=="out" && p[2]=="get" && p[3]=="cue" && p[5]=="count"){
+		for(var i=0; i<osc.args[0]; i++){
+			device.send("/eos/get/cue/"+p[4]+"/index/"+i);
+		}
+	}else if(p[1]=="out" && p[2]=="get" && p[3]=="cue" && p[7]=="list"){
+		this.deviceInfoUpdate(device, "status", "ok");
+		if(device.data.cuelists[p[4]][p[5]]==undefined){
+			device.data.cuelists[p[4]][p[5]] = {};
+		}
+		device.data.cuelists[p[4]][p[5]][p[6]] = {
+			uid: osc.args[1],
+			label: osc.args[2],
+			uptimeduration: osc.args[3],
+			uptimedelay: osc.args[4],
+			downtimeduration: osc.args[5],
+			downtimedelay: osc.args[6],
+			focustimeduration: osc.args[7],
+			focustimedelay: osc.args[8],
+			colortimeduration: osc.args[9],
+			colortimedelay: osc.args[10],
+			beamtimeduration: osc.args[11],
+			beamtimedelay: osc.args[12],
+			mark: osc.args[16],
+			block: osc.args[17],
+			assert: osc.args[18],
+			follow: osc.args[20],
+			hang: osc.args[21],
+			partcount: osc.args[26],
+			scene: osc.args[28],
+			duration: Math.max(osc.args[3], osc.args[5], osc.args[7], osc.args[9], osc.args[11])
+		};
+
+		//console.log(p[4]+" "+p[5]+" "+p[6]+" updated")
+		device.draw();
+
+	}else if(p[1]=="out" && p[2]=="get" && p[3]=="cue" && p.length==6){
+
+		//console.log("cue "+p[4]+" "+p[5]+" deleted")
+
+
+		// There's no OSC notification of the deletion of a part. It just tells you to update the parent cue and remaining children.
+		// So: we should fetch all the parts of a cue somehow every time there's an update to a cue.
+
+
+
+		delete device.data.cuelists[p[4]][p[5]];
+		device.draw();
+
+	}else if(p[1]=="out" && p[2]=="get" && p[3]=="cue" && p[7]=="actions"){
+		if(osc.args.length==3){
+			device.data.cuelists[p[4]][p[5]][0].extlinks = osc.args[2];
+		}
+	}else if(p[1]=="out" && p[2]=="event" && p[3]=="cue" && p[6]=="fire"){
+		// explore replacing this with /eos/out/active/cue
+		device.data.activeCue = p[5];
+		device.draw();
+	}else if(p[1]=="out" && p[2]=="notify" && p[3]=="cue"){
+		var cueList = p[4];
+		var listIndex = p[6];
+		var listCount = p[7];
+		var cueNumber = osc.args[1];
+		
+		device.send("/eos/get/cue/"+cueList+"/"+cueNumber);
+		//console.log("SENT /eos/get/cue/"+cueList+"/"+cueNumber);
+	}else if(p[2]=="cmd" || p[2]=="ping" || p[2]=="user" || p[2]=="softkey"){
+
+	}else if(p[3]=="version"){
+		device.data.version = osc.args[0];
+
+	}else{
+		//console.log(osc);
+	}
+	//console.log(p)
+}
+exports.heartbeat = function(device){
+	device.send("/eos/ping");
+}
+
@@ -0,0 +1,10 @@
+
+.warning{
+	color: #e9873a;
+}
+.error{
+	color: #ed5f5d;
+}
+.ok{
+	color: #79b757;
+}
@@ -0,0 +1,97 @@
+<header>
+	<h1><%= listName  %></h1>
+</header>
+
+
+<table class="cv-table">
+	<tr>
+		<td>Power</td>
+		<td><div>
+		<% if(data.power==0){ %><span class='error'>OFF</span><% } %>
+		<% if(data.power==1){ %><span class='ok'>ON</span><% } %>
+		<% if(data.power==2){ %><span class='warning'>COOLING DOWN</span><% } %>
+		<% if(data.power==3){ %><span class='warning'>WARMING UP</span><% } %>
+		</div></td>
+	</tr>
+	<tr>
+		<td>AV Mute</td>
+		<td><div>
+		<% if(data.avmute==11){ %><span class='error'>Video Mute</span><% } %>
+		<% if(data.avmute==21){ %><span class='error'>Audio Mute</span><% } %>
+		<% if(data.avmute==31){ %><span class='error'>Video &amp; Audio Mute</span><% } %>
+		<% if(data.avmute==30){ %>...<% } %>
+		</div></td>
+	</tr>
+	<tr>
+		<td>Errors</td>
+		<td><div>
+		<% if(data.fanError==1){ %><span class="warning">Fan Warning</span><br><% } %>
+		<% if(data.fanError==2){ %><span class="error">Fan Error</span><br><% } %>
+
+		<% if(data.lampError==1){ %><span class="warning">Lamp Warning</span><br><% } %>
+		<% if(data.lampError==2){ %><span class="error">Lamp Error</span><br><% } %>
+
+		<% if(data.tempError==1){ %><span class="warning">Temp Warning</span><br><% } %>
+		<% if(data.tempError==2){ %><span class="error">Temp Error</span><br><% } %>
+
+		<% if(data.coverError==1){ %><span class="warning">Cover Warning</span><br><% } %>
+		<% if(data.coverError==2){ %><span class="error">Cover Error</span><br><% } %>
+
+		<% if(data.filterError==1){ %><span class="warning">Filter Warning</span><br><% } %>
+		<% if(data.filterError==2){ %><span class="error">Filter Error</span><br><% } %>
+
+		<% if(data.otherError==1){ %><span class="warning">Other Warning</span><br><% } %>
+		<% if(data.otherError==2){ %><span class="error">Other Error</span><br><% } %>
+		&nbsp;</div></td>
+	</tr>
+	<tr>
+		<td>Input</td>
+		<td><div>
+		<% if(data.input){ %>
+		<% if(data.input[0]==1){ %>RGB<% } %>
+		<% if(data.input[0]==2){ %>Video<% } %>
+		<% if(data.input[0]==3){ %>Digital<% } %>
+		<% if(data.input[0]==4){ %>Storage<% } %>
+		<% if(data.input[0]==5){ %>Network<% } %>
+		<%= data.input[1] %>
+		<% } %>
+		</div></td>
+	</tr>
+	
+	<% if(data.lamp){ %>
+		<% for(var i=0; i<data.lamp.length; i+=2){ %>
+		<tr>
+			<td>Lamp <%= i/2 %></td>
+			<td>
+			<% if(Number(data.lamp[i+1])){ %>
+				<div class='ok'>ON</div>
+			<% }else{ %>
+				<div class='error'>OFF</div>
+			<% } %>
+			</td>
+		</tr>
+		<% } %>
+	<% } %>
+
+
+	<tr>
+		<td>Name</td>
+		<td><div><%= data.name %></div></td>
+	</tr>
+	<tr>
+		<td>Info 1</td>
+		<td><div><%= data.info1 %></div></td>
+	</tr>
+	<tr>
+		<td>Info 2</td>
+		<td><div><%= data.info2 %></div></td>
+	</tr>
+	<tr>
+		<td>Serial Number</td>
+		<td><div><%= data.serial %></div></td>
+	</tr>
+	<tr>
+		<td>Version</td>
+		<td><div><%= data.version %></div></td>
+	</tr>
+</table>
@@ -0,0 +1,116 @@
+exports.defaultName = "PJLink Projector";
+exports.connectionType = "TCPsocket";
+exports.heartbeatInterval = 5000;
+exports.searchOptions = {
+	type: "UDPsocket",
+	searchBuffer: Buffer.from([0x25, 0x32, 0x53, 0x52, 0x43, 0x48, 0x0d]),
+	devicePort: 4352,
+	listenPort: 4352,
+	validateResponse: function(msg, info){
+		return (msg.toString().indexOf("%2ACKN=")>=0);
+	}
+}
+exports.defaultPort = 4352;
+
+exports.ready = function(device){
+	//Power status query
+	//device.send("%1POWR ?\r");
+}
+var password = false;
+
+exports.data = function(device, message){
+	this.deviceInfoUpdate(device, "status", "ok");
+	var msg =  message.toString();
+
+	const md5 = require("md5");
+
+	if(msg.substring(0, 8)=="PJLINK 1"){
+		password = md5(msg.substring(9, 17)+"JBMIAProjectorLink")
+		device.send(password+"%1POWR ?\r%1INPT ?\r%1AVMT ?\r%1ERST ?\r%1LAMP ?\r%1NAME ?\r%1INF1 ?\r%1INF2 ?\r%2SNUM ?\r%2SVER ?\r");
+	}
+	if(msg.substring(0, 7)=="%1POWR="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1INPT="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1AVMT="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1ERST="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1LAMP="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1NAME="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1INF1="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%1INF2="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%2SNUM="){
+		processPJLink(device, msg, this);
+	}
+	if(msg.substring(0, 7)=="%2SVER="){
+		processPJLink(device, msg, this);
+	}
+}
+
+function processPJLink(device, str, that){
+	var arr = str.split("%");
+	for(var key in arr){
+		var split = arr[key].split("=");
+		var key = split[0];
+		var value = split[1];
+		
+		switch(key){
+			case "1POWR":
+				device.data.power = value;
+				break;
+			case "1INPT":
+				device.data.input = value;
+				break;
+			case "1AVMT":
+				device.data.avmute = value;
+				break;
+			case "1ERST":
+				device.data.fanError = value[0];
+				device.data.lampError = value[1];
+				device.data.tempError = value[2];
+				device.data.coverError = value[3];
+				device.data.filterError = value[4];
+				device.data.otherError = value[5];
+				break;
+			case "1LAMP":
+				device.data.lamp = value.split(" ");
+				break;
+			case "1NAME":
+				device.data.name = value;
+				that.deviceInfoUpdate(device, "defaultName", device.data.name);
+				break;
+			case "1INF1":
+				device.data.info1 = value;
+				break;
+			case "1INF2":
+				device.data.info2 = value;
+				break;
+			case "2SNUM":
+				device.data.serial = value;
+				break;
+			case "2SVER":
+				device.data.version = value;
+				break;
+		}
+	}
+	device.draw();
+}
+
+exports.heartbeat = function(device){
+	if(password){
+		device.send(password+"%1POWR ?\r%1INPT ?\r%1AVMT ?\r%1ERST ?\r%1LAMP ?\r%1NAME ?\r%1INF1 ?\r%1INF2 ?\r%2SNUM ?\r%2SVER ?\r");
+	}
+}
@@ -0,0 +1,189 @@
+table{
+	background-color: #323232;
+	border: 0px;
+	color: #b8b8b8;
+	font-family: sans-serif;
+	width: 100%;
+	table-layout:fixed;
+	margin-bottom: 30px;
+}
+th{
+	font-size: 12px;
+	font-weight: normal;
+	padding: 0px 4px;
+	background-color: #2d2c2d;
+	border: #545454 1px solid;
+	border-right: none;
+}
+	th.no-border{
+		border-left: none;
+		border-right: none;
+		padding: 0px;
+	}
+
+td{
+	padding: 0px;
+	height: 25px;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+	td img{
+		padding-top: 4px;
+	}
+
+
+
+tr:nth-child(even) {
+	background: #2c2c2c;
+}
+tr:nth-child(odd) {
+	background: #323232;
+}
+
+
+tr:nth-child(even).q-red{
+	background: linear-gradient(to top, #2c2c2c, #4c3130 1px);
+}
+tr:nth-child(odd).q-red{
+	background: linear-gradient(to top, #323232, #513635 1px);
+}
+	.q-red td:first-of-type{
+		padding-left: 5px;
+		border-left: 5px #ff4242 solid;
+	}
+tr:nth-child(even).q-orange{
+	background: linear-gradient(to top, #2c2c2c, #4b3e2a 1px);
+}
+tr:nth-child(odd).q-orange{
+	background: linear-gradient(to top, #323232, #514330 1px);
+}
+	.q-orange td:first-of-type{
+		padding-left: 5px;
+		border-left: 5px #ffa500 solid;
+	}
+tr:nth-child(even).q-green{
+	background: linear-gradient(to top, #2c2c2c, #2d452d 1px);
+}
+tr:nth-child(odd).q-green{
+	background: linear-gradient(to top, #323232, #324b33 1px);
+}
+	.q-green td:first-of-type{
+		padding-left: 5px;
+		border-left: 5px #01d52f solid;
+	}
+tr:nth-child(even).q-blue{
+	background: linear-gradient(to top, #2c2c2c, #323647 1px);
+}
+tr:nth-child(odd).q-blue{
+	background: linear-gradient(to top, #323232, #363b4b 1px);
+}
+	.q-blue td:first-of-type{
+		padding-left: 5px;
+		border-left: 5px #536de0 solid;
+	}
+tr:nth-child(even).q-purple{
+	background: linear-gradient(to top, #2c2c2c, #39273d 1px);
+}
+tr:nth-child(odd).q-purple{
+	background: linear-gradient(to top, #323232, #433147 1px);
+}
+	.q-purple td:first-of-type{
+		padding-left: 5px;
+		border-left: 5px #a601c0 solid;
+	}
+
+tr.q-armed-false td{
+	background: url("img/disarmed-pattern-light.png");
+	background-attachment: fixed;
+}
+
+
+tr.playback-position{
+	background-image: none !important;
+	background: #1557da !important;
+	color: white !important;
+}
+tr.playback-position .q-gray-text{
+	color: white !important;
+}
+
+
+.gLeft{
+	height: 24px;
+	width: 12px;
+	border-left: 2px solid;
+}
+.gTop{
+	border-top: 2px solid;
+}
+.gBot{
+	border-bottom: 2px solid;
+}
+.gRight{
+	border-right: 2px solid;
+}
+.gMode-1.gLeft.gTop{
+	border-radius: 6px 0px 0px 0px;
+}
+.gMode-1.gLeft.gBot{
+	border-radius: 0px 0px 0px 6px;
+}
+.gMode-1.gRight.gBot{
+	border-radius: 0px 0px 6px 0px;
+}
+.gMode-1.gLeft.gTop.gBot{
+	border-radius: 6px 0px 0px 6px;
+}
+.gMode-1.gLeft.gTop.gRight{
+	border-radius: 6px 6px 0px 0px;
+}
+.gMode-1.gTop.gRight.gBot{
+	border-radius: 0px 6px 6px 0px;
+}
+.gMode-1.gLeft.gTop.gRight.gBot{
+	border-radius: 6px;
+}
+.gMode-1{
+	border-color: #5a5a87;
+}
+.gMode-2{
+	border-color: #5a5a87;
+}
+.gMode-3{
+	border-color: #429242;
+}
+.gMode-4{
+	border-color: #925fc0;
+}
+.gMode-, .gMode-0{
+	border-color: rgba(0, 0, 0, 0);
+}
+.group-arrow{
+	width: 13px;
+	background-image: url("img/arrow-down.png");
+	background-position: center;
+	background-repeat: no-repeat;
+}
+
+.q-time{
+	font-size: 14px;
+	text-align: center;
+}
+.q-gray-text{
+	color: #424242;
+}
+
+
+
+@media screen and (min-width: 0px) and (max-width: 750px) {
+	.hide-medium{
+		display: none;
+	}
+}
+@media screen and (min-width: 0px) and (max-width: 550px) {
+	.hide-small{
+		display: none;
+	}
+}
+
@@ -0,0 +1,196 @@
+<% function cueTemplate(cueList, groupModes, depth, workspace){ %>
+
+	<% depth++ %>
+
+	<% for(var c in cueList.cues){ %>
+
+		<% var cue = cueList.cues[c] %>
+			<tr class="q-<%= cue.colorName %> q-armed-<%= cue.armed %> <%if(data.playbackPosition==cue.uniqueID){ %>playback-position scroll-position<% } %>" id="<%= cue.uniqueID %>">
+
+				<td></td> <!-- playhead/color indicator -->
+
+				<% if(cue.broken){ %>
+					<td><center><img src="plugins/qlab/img/status_broken.png" height="18px"></center></td>
+				<% }else if(cue.running){ %>
+					<td><center><img src="plugins/qlab/img/status_running.png" height="18px"></center></td>
+				<% }else if(cue.loaded){ %>
+					<td><center><img src="plugins/qlab/img/status_loaded.png" height="18px"></center></td>
+				<% }else if(cue.flagged){ %>
+					<td><center><img src="plugins/qlab/img/status_flagged.png" height="20px"></center></td>
+				<% }else{ %>
+					<td></td>
+				<% } %>
+
+
+				<td><img src="plugins/qlab/img/<%= cue.type.toLowerCase() %>.png" height="20px"></td>
+				<td><center><%- cue.number || "&nbsp;" %></center></td>
+
+				<%
+				var nextCueDepth = 0;
+				if(workspace.allCuesOrdered[cue.index+1]!=undefined){
+					nextCueDepth = workspace.allCuesOrdered[cue.index+1].groups.length-1;
+				}
+
+				%>
+				
+				
+
+				<!-- spacer cells before cue name --> 
+				<% for(var i=0; i<depth; i++){ %>
+
+					<% if(i==depth-1 && cue.type=="Group"){ %>
+
+						<% if(cue.cues.length==0){ %>
+							<td width="15px" class="group-arrow gMode-<%= cue.mode %> gLeft gTop gBot"></td>
+
+						<% }else{ %>
+							<td width="15px" class="group-arrow gMode-<%= cue.mode %> gLeft gTop"></td>
+
+						<% } %>
+
+					<% }else if(i<nextCueDepth){ %>
+						<td width="15px" class="gMode-<%= groupModes[i] %> gLeft"></td>
+
+					<% }else if(i>=nextCueDepth && i<depth-1 ){ %>
+						<td width="15px" class="gMode-<%= groupModes[i] %> gLeft gBot"></td>
+
+					<% }else if(i==depth-1 && i>nextCueDepth){ %>
+						<td width="15px" class="gMode-<%= groupModes[groupModes.length-1] %> gBot"></td>
+
+					<% }else{ %>
+						<td width="15px" ></td>
+
+					<% } %>
+
+				<% } %>
+
+				
+
+				<!-- cue name -->
+				<% if(cue.type=="Group"){ %>
+					<% if(cue.cues.length==0){ %>
+						<td colspan="<%= 11-depth %>" class="gMode-<%= cue.mode %> gTop gBot gRight"><%= cue.listName %></td>
+
+					<% }else{ %>
+						<td colspan="<%= 11-depth %>" class="gMode-<%= cue.mode %> gTop gRight"><%= cue.listName %></td>
+
+					<% } %>
+				<% }else if(depth>nextCueDepth+1){ %>
+					<td colspan="<%= 11-depth %>" class="gMode-<%= groupModes[groupModes.length-1] %> gBot gRight"><%= cue.listName %></td>
+
+				<% }else if(depth>1){ %>
+					<td colspan="<%= 11-depth %>" class="gMode-<%= groupModes[groupModes.length-1] %> gRight"><%= cue.listName %></td>
+
+				<% }else{ %>
+					<td colspan="<%= 11-depth %>"><%= cue.listName %></td>
+
+				<% } %>
+
+				<td class="q-time hide-medium"><%= cue.target %></td>
+
+				<% if(cue.preWait){ %>
+					<td class="q-time hide-small"><%= prettyFormatTime(cue.preWait) %></td>
+				<% }else{ %>
+					<td class="q-time q-gray-text hide-small">00:00.00</td>
+				<% } %>
+
+				<% if(cue.duration || (cue.type=="Group" && cue.mode==3)){ %>
+					<% %>
+					<td class="q-time hide-medium"><%= prettyFormatTime(cue.duration) %></td>
+				<% }else{ %>
+					<td class="hide-medium"></td>
+				<% } %>
+
+				<% if(cue.postWait){ %>
+					<td class="q-time q-gray-text hide-medium"><%= prettyFormatTime(cue.postWait) %></td>
+				<% }else{ %>
+					<td class="q-time q-gray-text hide-medium">00:00.00</td>
+				<% } %>
+
+				<% if(cue.continueMode==2){ %>
+					<td class="hide-small"><center><img src="plugins/qlab/img/auto_follow.png" height="20px"></center></td>
+				<% }else if(cue.continueMode==1){ %>
+					<td class="hide-small"><center><img src="plugins/qlab/img/auto_continue.png" height="20px"></center></td>
+				<% }else{ %>
+					<td class="hide-small"></td>
+				<% } %>
+
+				
+
+				
+				
+			
+
+
+			</tr>
+		<% if(cue.cues){ %>
+			<% groupModes.push(cue.mode) %>
+			<% cueTemplate(cue, groupModes, depth, workspace) %>
+		<% } %>
+
+	<% } %>
+	<% groupModes.pop(); %>
+<% } %>
+
+<header>
+	<h1><%= listName %></h1>
+	<h2><%= data.version || "" %></h2>
+</header>
+
+
+<% for(var i in data.workspaces){ %>
+	<% for(var j in data.workspaces[i].cueLists){ %>
+		<% let cueList = data.workspaces[i].cueLists[j] %>
+		<h3><%= cueList.listName %> - <%= data.workspaces[i].displayName %></h3>
+
+		<% cueListOffset = 0 %>
+		<table cellspacing="0">
+			<tr>
+				<th width="1px" style="border-left: none; border-right: none;"></th>
+				<th width="20px" style="border-left: none; border-right: none;"></th>
+				<th width="20px" style="border-left: none;"></th>
+				<th width="55px">Number</th>
+				<th width="25px" style="padding: 0px"></th>
+				<th width="25px" class="no-border">Q</th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th width="25px" class="no-border"></th>
+				<th class="no-border"></th>
+				<th width="55px" class="hide-medium">Target</th>
+				<th width="80px" class="hide-small"style="border-right: none;">Pre Wait</th>
+				<th width="80px" class="hide-medium" style="border-left: none; border-right: none;">Action</th>
+				<th width="80px" class="hide-medium" style="border-left: none; border-right: none;">Post Wait</th>
+				<th width="20px" class="hide-small" style="border-left: none; border-right: none;">
+					<img src="plugins/qlab/img/auto_continue_stubby.png" height="20px">
+				</th>
+			</tr>
+			<% cueTemplate(cueList, [], [], data.workspaces[i]) %>
+		</table>
+	<% } %>
+
+<% } %>
+
+<script>
+	var $scrollTo = document.getElementsByClassName("scroll-position");
+	if($scrollTo.length==1){
+		window.scroll({top: $scrollTo[0].offsetTop-200, behavior: 'smooth'});
+	}
+</script>
+
+<%
+	function prettyFormatTime(seconds){
+		var startIndex = 14;
+		if(seconds>=3600){
+			startIndex = 11;
+		}
+		var string = new Date(seconds * 1000).toISOString()
+		return string.substring(startIndex, string.length-2)
+	}
+
+
+%>
@@ -0,0 +1,133 @@
+exports.defaultName = "QLab 4";
+exports.connectionType = "osc";
+exports.searchOptions = {
+	type: "Bonjour",
+	bonjourName: "qlab"
+}
+
+
+
+exports.ready = function(device){
+	device.send("/workspaces");
+}
+
+exports.data = function(device, osc){
+	var address = osc.address;
+	var p = osc.address.split("/");
+	p.shift();
+
+	//console.log(address)
+
+	if(osc.address=="/reply/workspaces"){
+		const d = JSON.parse(osc.args[0]).data;
+		device.data.workspaces = {};
+		for(var i=0; i<d.length; i++){
+			device.data.workspaces[d[i].uniqueID] = {
+				"displayName": d[i].displayName,
+				"selectionIsPlayhead": true,
+			}
+			device.data.version = d[i].version;
+			device.send("/workspace/"+d[i].uniqueID+"/cueLists");
+			device.send("/workspace/"+d[i].uniqueID+"/updates", [{type: "i", value: 1}]);
+			device.send("/cue/playbackPosition/uniqueID");
+			device.send("/workspace/"+d[i].uniqueID+"/selectionIsPlayhead");
+		}
+
+	}else if(p[1]=="workspace" && p[3]=="cueLists"){
+		var workspace = p[2];
+		var d = JSON.parse(osc.args[0]).data;
+		device.data.workspaces[workspace].cueLists = {};
+		device.data.workspaces[workspace].allCues = {};
+		device.data.workspaces[workspace].allCuesOrdered = [];
+		device.data.lastCueInGroup = {};
+
+		for(var i in d){
+
+			device.data.workspaces[workspace].cueLists[d[i].uniqueID]=d[i];
+			device.data.workspaces[workspace].cueLists[d[i].uniqueID].cues = d[i].cues;
+
+			getMoreCueInfo(d[i], []);
+
+			function getMoreCueInfo(group, groups_arg){
+				var groups = JSON.parse(JSON.stringify(groups_arg))
+				groups.push(group.uniqueID);
+
+				for(var cueIndex in group.cues){
+					var cue = group.cues[cueIndex];
+					//console.log(cue)
+
+					device.data.lastCueInGroup[group.uniqueID] = cue;
+
+					cue.groups = groups;
+					device.send("/workspace/"+workspace+"/cue_id/"+cue.uniqueID+"/valuesForKeys", [{type: "s", value: "[\"mode\", \"parent\", \"isBroken\", \"preWait\", \"duration\", \"postWait\", \"continueMode\", \"cueTargetNumber\", \"isLoaded\", \"isRunning\"]"}]);
+					cue.index = device.data.workspaces[workspace].allCuesOrdered.push(cue)-1;
+
+					if(cue.cues){
+						cue.mode = 0;
+						getMoreCueInfo(cue, groups);
+					}
+
+					device.data.workspaces[workspace].allCues[cue.uniqueID] = cue;
+
+				}
+			}
+
+		}
+
+		//console.log(device.data.lastCueInGroup)
+
+		
+		device.draw();
+	}else if(p[0]=="update" && p[1]=="workspace" && p[3]=="cue_id"){
+		device.send("/workspace/"+p[2]+"/cueLists");
+	}else if(p[0]=="update" && p[1]=="workspace" && p[5]=="playbackPosition"){
+		console.log('pb move')
+		device.data.playbackPosition = osc.args[0];
+		device.draw();
+	}else if(p[0]=="reply" && p[1]=="cue_id"){
+
+		if(p[3] == "uniqueID"){
+			// response to /cue/playbackPosition/uniqueID
+			device.data.playbackPosition = JSON.parse(osc.args[0]).data;
+		}else if(p[3]=="mode"){
+			var cueID = p[2];
+			var mode = JSON.parse(osc.args[0]).data;
+			var workspaceID = JSON.parse(osc.args[0]).workspace_id;
+
+			device.data.workspaces[workspaceID].allCues[cueID].mode = mode;
+
+		}else if(p[3]=="valuesForKeys"){
+			this.deviceInfoUpdate(device, "status", "ok");
+
+			var d = JSON.parse(osc.args[0]);
+
+			var cueID = p[2];
+			var workspace = d.workspace_id;
+			var cueList = d.data.parent;
+
+			device.data.workspaces[workspace].allCues[cueID].mode = d.data.mode;
+			device.data.workspaces[workspace].allCues[cueID].preWait = d.data.preWait;
+			device.data.workspaces[workspace].allCues[cueID].duration = d.data.duration;
+			device.data.workspaces[workspace].allCues[cueID].postWait = d.data.postWait;
+			device.data.workspaces[workspace].allCues[cueID].continueMode = d.data.continueMode;
+			device.data.workspaces[workspace].allCues[cueID].target = d.data.cueTargetNumber;
+			device.data.workspaces[workspace].allCues[cueID].loaded = d.data.isLoaded;
+			device.data.workspaces[workspace].allCues[cueID].broken = d.data.isBroken;
+			device.data.workspaces[workspace].allCues[cueID].running = d.data.isRunning;
+		}
+		device.draw();
+
+	}else if(p[1]=="workspace" && p[3]=="selectionIsPlayhead"){
+
+		device.data.workspaces[p[2]].selectionIsPlayhead = JSON.parse(osc.args[0]).data;
+
+	}else{
+		
+	}
+}
+
+exports.heartbeat = function(device){
+	try{
+		device.send("/workspace/"+(Object.keys(device.data.workspaces)[0])+"/thump");
+	}catch(err){}
+}
@@ -0,0 +1,16 @@
+table{
+	font-family: PlexMono !important;
+}
+
+
+
+
+.warning{
+	color: #e9873a;
+}
+.error{
+	color: #ed5f5d;
+}
+.ok{
+	color: #79b757;
+}
@@ -0,0 +1,63 @@
+<header>
+	<h1><%= listName %></h1>
+</header>
+
+
+<table class="cv-table">
+	<tr>
+		<td colspan="2">
+		<% if(data.rate=="true"){ %>
+			<span class="ok">Playing</span>
+		<% }else{ %>
+			<span class="warning">Stopped</span>
+		<% } %>
+		</td>
+	</tr>
+	<tr>
+		<% var seconds = Math.floor(data.position/1000) %>
+		<% var minutes = Math.floor(seconds/60) %>
+		<% var millis = data.position %>
+		<td colspan="2"><h1><%= minutes %>:<%= ((seconds%60)+"").padStart(2, "0") %>.<%= millis%1000 %></h1></td>
+	</tr>
+
+	
+
+	<tr>
+		<td>Busy</td>
+		<td><div><%= data.busy %></div></td></td>
+	</tr>
+	
+	<tr>
+		<td>Display Open</td>
+		<td><div><%= data.displayOpen %></td></td>
+	</tr>
+	<tr>
+		<td>Active</td>
+		<td><div><%= data.showActive %></td></td>
+	</tr>
+	<tr>
+		<td>Programmer</td>
+		<td><div><%= data.programmerOnline %></td></td>
+	</tr>
+	<tr>
+		<td>Health</td>
+		<td><div><%= data.health %></td></td>
+	</tr>
+	<tr>
+		<td>Standby</td>
+		<td><div><%= data.standby %></td></td>
+	</tr>
+	<tr>
+		<td>Error</td>
+		<td>
+		<% if(data.error==1){ %><span class="error">Operating System Error</span><% } %>
+		<% if(data.error==2){ %><span class="error">QuickTime Error</span><% } %>
+		<% if(data.error==3){ %><span class="error">Rendering API Error</span><% } %>
+		<% if(data.error==4){ %><span class="error">Network Error</span><% } %>
+		<% if(data.error==5){ %><span class="error">File Server Error</span><% } %>
+		<% if(data.error==6){ %><span class="error">Syntax/Parser Error</span><% } %>
+		<% if(data.error==7){ %><span class="error">General Runtime Error</span><% } %>
+		<% if(data.error==8){ %><span class="error">Authentication Error</span><% } %>
+		</td>
+	</tr>
+</table>
@@ -0,0 +1,56 @@
+exports.defaultName = "Dataton Watchout";
+exports.connectionType = "TCPsocket";
+exports.heartbeatInterval = 500;
+exports.searchOptions = {
+	type: "TCPport",
+	searchBuffer: Buffer.from("authenticate 1\n", 'ascii'),
+	testPort: 3040,
+	validateResponse: function(msg, info){
+		return (msg.toString().substring(0, 5)=="Ready");
+	}
+}
+exports.defaultPort = 3040;
+
+exports.ready = function(device){
+	device.send("authenticate 1\n");
+}
+
+exports.data = function(device, message){
+	var msg = message.toString();
+	if(msg.substring(0, 5)=="Ready"){
+		device.send("getStatus\n");
+	}
+	if(msg.substring(0, 5)=="Reply"){
+		var arr = msg.split(" ");
+
+
+		device.data.showName = "";
+		var i = 0;
+		while(arr[i][arr[i].length-1]!='"'){
+			i++;
+			device.data.showName+=arr[i]+" ";
+		}
+		device.data.showName = device.data.showName.substring(1, device.data.showName.length-2);
+
+		i--;
+		device.data.busy = arr[i+2];
+		device.data.health = arr[i+3];
+		device.data.displayOpen = arr[i+4];
+		device.data.showActive = arr[i+5];
+		device.data.programmerOnline = arr[i+6];
+		device.data.position = Number(arr[i+7]).toFixed(2);
+		device.data.rate = arr[i+8];
+		device.data.standby = arr[i+9];
+
+		this.deviceInfoUpdate(device, "defaultName", device.data.showName);
+		device.draw();
+	}
+	// if(msg.substring(0, 5)=="Error"){
+	// 	device.data.error = msg.substring(6, 7);
+	// }
+	//console.log(msg)
+}
+
+exports.heartbeat = function(device){
+	device.send("getStatus\n");
+}
@@ -0,0 +1,113 @@
+td{
+	padding: 3px 16px !important;
+}
+tr td:first-child{
+	text-align: center;
+}
+
+.mute-0, .mute-1{
+	width: 30px;
+	padding: 4px;
+	font-size: 14px;
+	border: black 2px solid;
+	text-align: center;
+	border-radius: 10px;
+}
+.mute-1{
+	border-color: gray;
+	color: gray;
+}
+.mute-0{
+	border-color: #fc3344;
+	color: #fc3344;
+}
+.white{
+	color: white;
+}
+
+.color{
+	padding: 1px 6px;
+	border-radius: 10px;
+	color: black;
+	font-family: PlexMono !important;
+	text-align: center;
+	text-overflow: ellipsis;
+	white-space: nowrap; 
+	overflow: hidden;
+}
+.color-0{ /*Black*/
+	background-color: #212121;
+	color: white;
+}
+.color-1{ /*Red*/
+	background-color: #fc545b;
+}
+.color-2{ /*Green*/
+	background-color: #65b84d;
+}
+.color-3{ /*Yellow*/
+	background-color: #fec52e;
+}
+.color-4{ /*Blue*/
+	background-color: #157efb;
+}
+.color-5{ /*Purple*/
+	background-color: #a453a5;
+}
+.color-6{ /*Teal*/
+	background-color: #00dae3;
+}
+.color-7{ /*White*/
+	background-color: #e0e0e0;
+}
+.color-8{ /*Gray*/
+	background-color: #8c8c8c;
+}
+.color-9{ /*Red*/
+	color: #fc545b;
+	border: #fc545b 1px solid;
+}
+.color-10{ /*Green*/
+	color: #65b84d;
+	border: #65b84d 1px solid;
+}
+.color-11{ /*Yellow*/
+	color: #fec52e;
+	border: #fec52e 1px solid;
+}
+.color-12{ /*Blue*/
+	color: #157efb;
+	border: #157efb 1px solid;
+}
+.color-13{ /*Purple*/
+	color: #a453a5;
+	border: #a453a5 1px solid;
+}
+.color-14{ /*Teal*/
+	color: #00dae3;
+	border: #00dae3 1px solid;
+}
+.color-15{ /*White*/
+	color: #e0e0e0;
+	border: #e0e0e0 1px solid;
+}
+
+input[type=range] {
+  -webkit-appearance: none;
+  margin: 0px;
+  width: 100%;
+}
+input[type=range]::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  margin-top: -9px;
+  height: 26px;
+  width: 8px;
+  border-radius: 4px;
+  background: #929292;
+}
+input[type=range]::-webkit-slider-runnable-track {
+  width: 100%;
+  height: 8px;
+  background: #3b3b3b;
+  border-radius: 4px;
+}
@@ -0,0 +1,47 @@
+<header>
+	<h1><%= listName %></h1>
+	<h2><%= data.model %></h2>
+</header>
+
+<table class="cv-table">
+	<tr>
+		<th width="40px"></th>
+		<th width="100px">Channel</th>
+		<th width="55px">Mute</th>
+		<th width="45px">dB</th>
+		<th width="160px">Fader</th>
+	</tr>
+	<tr>
+		<td width="40px">LR</td>
+		<td width="100px"><div class="color color-8">MAIN OUT</div></td>
+		<td><div class="fader-mute mute-<%=data.stereoMute%>">M</div></td>
+		<td><%- formatAsDB(data.stereoFaderDB) %></td>
+		<td><input type="range" min="0" max="100" value="<%= data.stereoFader*100 %>" disabled></td>
+	</tr>
+	<% for(var i=0; i<32; i++){ %>
+		<% if(data.channelNames[i]=="end"){break;} %>
+		<tr>
+			<td><%= i+1 %></td>
+			<td><div class="color color-<%= data.channelColors[i] %>"><%- data.channelNames[i] || i+1 %></div></td>
+			<td><div class="fader-mute mute-<%=data.channelMutes[i]%>">M</div></td>
+			<td><%- formatAsDB(data.channelFadersDB[i]) %></td>
+			<td><input type="range" min="0" max="100" value="<%= data.channelFaders[i]*100 %>" disabled></td>
+		</tr>
+	<% } %>
+
+</table>
+
+
+
+<%
+function formatAsDB(val){
+	if(val==-90){
+		return "-&infin;";
+	}
+	if(val>0){
+		return "+"+val.toFixed(1);
+	}
+	return val.toFixed(1);
+}
+
+%>
@@ -0,0 +1,129 @@
+exports.defaultName = "X32 Mixer";
+exports.connectionType = "UDPsocket";
+exports.heartbeatInterval = 10000;
+exports.searchOptions = {
+	type: "UDPsocket",
+	searchBuffer: Buffer.from([0x2f, 0x78, 0x69, 0x6e, 0x66, 0x6f]),
+	devicePort: 10023,
+	listenPort: 0,
+	validateResponse: function(msg, info){
+		return (msg.toString().indexOf("/xinfo")==0);
+	}
+}
+exports.defaultPort = 10023;
+
+exports.ready = function(device){
+
+	device.data.channelFaders = new Array(32).fill(0);
+	device.data.channelFadersDB = new Array(32).fill(0);
+	device.data.channelMutes = new Array(32).fill(0);
+	device.data.channelNames = new Array(32).fill("end");
+	device.data.channelColors = new Array(32);
+
+	device.data.stereoFader = 0;
+	device.data.stereoFaderDB = 0;
+	device.data.stereoMute = 0;
+
+	device.send(Buffer.from("/xinfo"));
+
+
+	//device.send(Buffer.from("\x2f\x62\x61\x74\x63\x68\x73\x75\x62\x73\x63\x72\x69\x62\x65\x00\x2c\x73\x73\x69\x69\x69\x00\x00\x6d\x65\x74\x65\x72\x73\x2f\x30\x00\x00\x00\x00\x2f\x6d\x65\x74\x65\x72\x73\x2f\x30\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x01"));
+	//device.send(Buffer.from("/batchsubscribe\x00,ssiii\x00\x00meters/0\x00\x00\x00\x00/meters/0\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x01"));
+
+	//device.send(Buffer.from("/subscribe\x00,si\x00/-stat/solosw/01\x001"));
+
+}
+
+exports.data = function(device, buf){
+	this.deviceInfoUpdate(device, "status", "ok");
+	var msg = buf.toString().split('\u0000\u0000')
+
+	if(msg[0]=="/xinfo"){
+		this.deviceInfoUpdate(device, "defaultName", msg[4]);
+		device.data.name = msg[4];
+		device.data.ip = msg[2];
+		device.data.firmware = msg[7];
+		device.data.model = msg[5];
+
+
+		device.send(Buffer.from("/lr/mix/fader\u0000\u0000\u0000\u0000"));
+		device.send(Buffer.from("/lr/mix/on\u0000\u0000\u0000\u0000"));
+
+		for(var i=0; i<=32; i++){
+			device.send(Buffer.from("/ch/"+i.toString().padStart(2, "0")+"/config/name\u0000\u0000\u0000\u0000"));
+		}
+		device.draw();
+
+
+	}else if(msg[0]=="/meters/0"){
+		//console.log(msg)
+	}else if(msg[0].indexOf("/mix/fader")>=0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+
+		if(addr[0]=="ch"){
+			device.data.channelFaders[channel-1] = buf.readFloatBE(24);
+			device.data.channelFadersDB[channel-1] = convertToDBTheBehringerWay(buf.readFloatBE(24));
+		}else if(addr[0]=="lr"){
+			device.data.stereoFader = buf.readFloatBE(20);
+			device.data.stereoFaderDB = convertToDBTheBehringerWay(buf.readFloatBE(20));
+		}
+
+		device.draw();
+
+	}else if(msg[0].indexOf("/mix/on")>=0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+
+		if(addr[0]=="ch"){
+			device.data.channelMutes[channel-1] = buf[23];
+		}else if(addr[0]=="lr"){
+			device.data.stereoMute = buf[19];
+		}
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/mix/fader\u0000\u0000\u0000\u0000"));
+
+	}else if(msg[0].indexOf("/config/name")>0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+		device.data.channelNames[channel-1] = msg[2];
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/config/color\u0000\u0000\u0000\u0000"));
+
+	}else if(msg[0].indexOf("/config/color")>0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+		device.data.channelColors[channel-1] = buf.readInt8(27);
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/mix/on\u0000\u0000\u0000\u0000"));
+
+	}else{
+		//console.log(msg)
+	}
+	//console.log(msg)
+
+}
+
+exports.heartbeat = function(device){
+	device.send(Buffer.from("/xremote"));
+}
+
+
+function parseAddress(msg){
+	var addr = msg.split("/");
+	addr.shift();
+	return addr;
+}
+
+function convertToDBTheBehringerWay(f){
+	if(f>=0.5){
+		return f*40-30;
+	}else if(f>=0.25){
+		return f*80-50;
+	}else if(f>=0.0625){
+		return f*160-70;
+	}else{
+		return f*480-90;
+	}
+}
+
@@ -0,0 +1,113 @@
+td{
+	padding: 3px 16px !important;
+}
+tr td:first-child{
+	text-align: center;
+}
+
+.mute-0, .mute-1{
+	width: 30px;
+	padding: 4px;
+	font-size: 14px;
+	border: black 2px solid;
+	text-align: center;
+	border-radius: 10px;
+}
+.mute-1{
+	border-color: gray;
+	color: gray;
+}
+.mute-0{
+	border-color: #fc3344;
+	color: #fc3344;
+}
+.white{
+	color: white;
+}
+
+.color{
+	padding: 1px 6px;
+	border-radius: 10px;
+	color: black;
+	font-family: PlexMono !important;
+	text-align: center;
+	text-overflow: ellipsis;
+	white-space: nowrap; 
+	overflow: hidden;
+}
+.color-0{ /*Black*/
+	background-color: #212121;
+	color: white;
+}
+.color-1{ /*Red*/
+	background-color: #fc545b;
+}
+.color-2{ /*Green*/
+	background-color: #65b84d;
+}
+.color-3{ /*Yellow*/
+	background-color: #fec52e;
+}
+.color-4{ /*Blue*/
+	background-color: #157efb;
+}
+.color-5{ /*Purple*/
+	background-color: #a453a5;
+}
+.color-6{ /*Teal*/
+	background-color: #00dae3;
+}
+.color-7{ /*White*/
+	background-color: #e0e0e0;
+}
+.color-8{ /*Gray*/
+	background-color: #8c8c8c;
+}
+.color-9{ /*Red*/
+	color: #fc545b;
+	border: #fc545b 1px solid;
+}
+.color-10{ /*Green*/
+	color: #65b84d;
+	border: #65b84d 1px solid;
+}
+.color-11{ /*Yellow*/
+	color: #fec52e;
+	border: #fec52e 1px solid;
+}
+.color-12{ /*Blue*/
+	color: #157efb;
+	border: #157efb 1px solid;
+}
+.color-13{ /*Purple*/
+	color: #a453a5;
+	border: #a453a5 1px solid;
+}
+.color-14{ /*Teal*/
+	color: #00dae3;
+	border: #00dae3 1px solid;
+}
+.color-15{ /*White*/
+	color: #e0e0e0;
+	border: #e0e0e0 1px solid;
+}
+
+input[type=range] {
+  -webkit-appearance: none;
+  margin: 0px;
+  width: 100%;
+}
+input[type=range]::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  margin-top: -9px;
+  height: 26px;
+  width: 8px;
+  border-radius: 4px;
+  background: #929292;
+}
+input[type=range]::-webkit-slider-runnable-track {
+  width: 100%;
+  height: 8px;
+  background: #3b3b3b;
+  border-radius: 4px;
+}
@@ -0,0 +1,47 @@
+<header>
+	<h1><%= listName %></h1>
+	<h2><%= data.model %></h2>
+</header>
+
+<table class="cv-table">
+	<tr>
+		<th width="40px"></th>
+		<th width="100px">Channel</th>
+		<th width="55px">Mute</th>
+		<th width="45px">dB</th>
+		<th width="160px">Fader</th>
+	</tr>
+	<tr>
+		<td width="40px">LR</td>
+		<td width="100px"><div class="color color-8">MAIN OUT</div></td>
+		<td><div class="fader-mute mute-<%=data.stereoMute%>">M</div></td>
+		<td><%- formatAsDB(data.stereoFaderDB) %></td>
+		<td><input type="range" min="0" max="100" value="<%= data.stereoFader*100 %>" disabled></td>
+	</tr>
+	<% for(var i=0; i<32; i++){ %>
+		<% if(data.channelNames[i]=="end"){break;} %>
+		<tr>
+			<td><%= i+1 %></td>
+			<td><div class="color color-<%= data.channelColors[i] %>"><%- data.channelNames[i] || i+1 %></div></td>
+			<td><div class="fader-mute mute-<%=data.channelMutes[i]%>">M</div></td>
+			<td><%- formatAsDB(data.channelFadersDB[i]) %></td>
+			<td><input type="range" min="0" max="100" value="<%= data.channelFaders[i]*100 %>" disabled></td>
+		</tr>
+	<% } %>
+
+</table>
+
+
+
+<%
+function formatAsDB(val){
+	if(val==-90){
+		return "-&infin;";
+	}
+	if(val>0){
+		return "+"+val.toFixed(1);
+	}
+	return val.toFixed(1);
+}
+
+%>
@@ -0,0 +1,129 @@
+exports.defaultName = "X Air Mixer";
+exports.connectionType = "UDPsocket";
+exports.heartbeatInterval = 10000;
+exports.searchOptions = {
+	type: "UDPsocket",
+	searchBuffer: Buffer.from([0x2f, 0x78, 0x69, 0x6e, 0x66, 0x6f]),
+	devicePort: 10024,
+	listenPort: 0,
+	validateResponse: function(msg, info){
+		return (msg.toString().indexOf("/xinfo")==0);
+	}
+}
+exports.defaultPort = 10024;
+
+exports.ready = function(device){
+
+	device.data.channelFaders = new Array(32).fill(0);
+	device.data.channelFadersDB = new Array(32).fill(0);
+	device.data.channelMutes = new Array(32).fill(0);
+	device.data.channelNames = new Array(32).fill("end");
+	device.data.channelColors = new Array(32);
+
+	device.data.stereoFader = 0;
+	device.data.stereoFaderDB = 0;
+	device.data.stereoMute = 0;
+
+	device.send(Buffer.from("/xinfo"));
+
+
+	//device.send(Buffer.from("\x2f\x62\x61\x74\x63\x68\x73\x75\x62\x73\x63\x72\x69\x62\x65\x00\x2c\x73\x73\x69\x69\x69\x00\x00\x6d\x65\x74\x65\x72\x73\x2f\x30\x00\x00\x00\x00\x2f\x6d\x65\x74\x65\x72\x73\x2f\x30\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x01"));
+	//device.send(Buffer.from("/batchsubscribe\x00,ssiii\x00\x00meters/0\x00\x00\x00\x00/meters/0\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00\x01"));
+
+	//device.send(Buffer.from("/subscribe\x00,si\x00/-stat/solosw/01\x001"));
+
+}
+
+exports.data = function(device, buf){
+	this.deviceInfoUpdate(device, "status", "ok");
+	var msg = buf.toString().split('\u0000\u0000')
+
+	if(msg[0]=="/xinfo"){
+		this.deviceInfoUpdate(device, "defaultName", msg[4]);
+		device.data.name = msg[4];
+		device.data.ip = msg[2];
+		device.data.firmware = msg[7];
+		device.data.model = msg[5];
+
+
+		device.send(Buffer.from("/lr/mix/fader\u0000\u0000\u0000\u0000"));
+		device.send(Buffer.from("/lr/mix/on\u0000\u0000\u0000\u0000"));
+
+		for(var i=0; i<=32; i++){
+			device.send(Buffer.from("/ch/"+i.toString().padStart(2, "0")+"/config/name\u0000\u0000\u0000\u0000"));
+		}
+		device.draw();
+
+
+	}else if(msg[0]=="/meters/0"){
+		//console.log(msg)
+	}else if(msg[0].indexOf("/mix/fader")>=0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+
+		if(addr[0]=="ch"){
+			device.data.channelFaders[channel-1] = buf.readFloatBE(24);
+			device.data.channelFadersDB[channel-1] = convertToDBTheBehringerWay(buf.readFloatBE(24));
+		}else if(addr[0]=="lr"){
+			device.data.stereoFader = buf.readFloatBE(20);
+			device.data.stereoFaderDB = convertToDBTheBehringerWay(buf.readFloatBE(20));
+		}
+
+		device.draw();
+
+	}else if(msg[0].indexOf("/mix/on")>=0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+
+		if(addr[0]=="ch"){
+			device.data.channelMutes[channel-1] = buf[23];
+		}else if(addr[0]=="lr"){
+			device.data.stereoMute = buf[19];
+		}
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/mix/fader\u0000\u0000\u0000\u0000"));
+
+	}else if(msg[0].indexOf("/config/name")>0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+		device.data.channelNames[channel-1] = msg[2];
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/config/color\u0000\u0000\u0000\u0000"));
+
+	}else if(msg[0].indexOf("/config/color")>0){
+		var addr = parseAddress(msg[0]);
+		var channel = Number(addr[1]);
+		device.data.channelColors[channel-1] = buf.readInt8(27);
+		device.draw();
+		device.send(Buffer.from("/ch/"+addr[1]+"/mix/on\u0000\u0000\u0000\u0000"));
+
+	}else{
+		//console.log(msg)
+	}
+	//console.log(msg)
+
+}
+
+exports.heartbeat = function(device){
+	device.send(Buffer.from("/xremote"));
+}
+
+
+function parseAddress(msg){
+	var addr = msg.split("/");
+	addr.shift();
+	return addr;
+}
+
+function convertToDBTheBehringerWay(f){
+	if(f>=0.5){
+		return f*40-30;
+	}else if(f>=0.25){
+		return f*80-50;
+	}else if(f>=0.0625){
+		return f*160-70;
+	}else{
+		return f*480-90;
+	}
+}
+
@@ -0,0 +1,215 @@
+
+const { remote } = require('electron');
+const { ipcRenderer } = require('electron');
+//let currWindow = remote.BrowserWindow.getFocusedWindow();
+const { v4: uuid } = require('uuid');
+let ejs = require('ejs');
+
+let net = require("net");
+
+
+
+let DEVICE = require("./src/device.js");
+let PLUGINS = require("./src/plugins.js");
+let SEARCH = require("./src/search.js");
+let VIEW = require("./src/view.js");
+let SAVESLOTS = require("./src/saveSlots.js");
+
+window.addDevice = DEVICE.addDevice;
+
+
+
+window.init = function(){
+
+  console.log("init!")
+
+  ipcRenderer.send("enableDeviceDropdown");
+  ipcRenderer.send("enableSearchAll");
+  
+  PLUGINS.init(function(){
+    VIEW.init();
+    SAVESLOTS.loadDevices();
+    SAVESLOTS.loadSlot(1);
+  });
+
+  document.getElementById("device-settings-table").onclick = function(e){
+    e.stopPropagation();
+  }
+  document.getElementById("device-settings-name").onchange = function(e){
+    e.stopPropagation();
+    DEVICE.changeActiveName(e.target.value)
+  }
+  document.getElementById("device-settings-plugin-dropdown").onchange = function(e){
+    e.stopPropagation();
+    DEVICE.changeActiveType(e.target.value)
+  }
+  document.getElementById("device-settings-ip").onchange = function(e){
+    e.stopPropagation();
+    DEVICE.changeActiveIP(e.target.value)
+  }
+  document.getElementById("device-settings-port").onchange = function(e){
+    e.stopPropagation();
+    DEVICE.changeActivePort(e.target.value)
+  }
+  document.getElementById("device-settings-pin").onchange = function(e){
+    e.stopPropagation();
+    if(e.target.checked){
+      VIEW.pinActiveDevice();
+    }else{
+      VIEW.unpinActiveDevice();
+    }
+  }
+
+  document.getElementById("save-slot-1").onclick = function(e){
+      e.stopPropagation();
+      SAVESLOTS.loadSlot(1);
+  }
+  document.getElementById("save-slot-2").onclick = function(e){
+      e.stopPropagation();
+      SAVESLOTS.loadSlot(2);
+  }
+  document.getElementById("save-slot-3").onclick = function(e){
+      e.stopPropagation();
+      SAVESLOTS.loadSlot(3);
+  }
+
+  document.getElementById("refresh-device-button").onclick = function(e){
+    e.stopPropagation();
+      DEVICE.refreshActive()
+  }
+
+  document.getElementById("device-list").onclick = function(e){
+      e.stopPropagation();
+      var deviceID = e.srcElement.id;
+      if(e.srcElement.id != "device-list"){
+          VIEW.switchDevice(deviceID);
+      }
+  }
+
+  document.getElementById("add-device-button").onchange = function(e){
+
+      DEVICE.registerDevice({
+      type: e.target.value,
+      defaultName: "New Device",
+      port: undefined,
+      addresses: []
+    });
+    e.target.selectedIndex = 0;
+
+    SAVESLOTS.saveAll();
+
+  }
+
+
+
+  document.onkeyup = function(e){
+    switch(e.key){
+      case "ArrowUp":
+        VIEW.selectPreviousDevice();
+        break;
+      case "ArrowDown":
+        VIEW.selectNextDevice();
+        break;
+      case "Tab":
+        if(document.activeElement.tagName!="INPUT" && document.activeElement.tagName!="SELECT"){
+          document.getElementById("device-settings-name").select();
+        }
+        break;
+    }
+  }
+
+
+  // document.getElementById("device-settings-delete").onclick = function(e){
+  //  e.stopPropagation();
+  //  confirm("Are you sure you want to delete device \n\""+VIEW.getActiveDevice().name+"\"?")
+  // }
+
+
+
+  document.getElementById("device-list-col").onclick = function(e){
+    
+      try{
+          document.querySelector("#device-list .active-device").classList.remove("active-device");
+          ipcRenderer.send("disableDeviceDropdown", "");
+      }catch(err){
+        //console.log(err)
+      }
+      try{
+          document.getElementsByClassName("active-device-outline")[0].classList.remove("active-device-outline");
+      }catch(err){
+        //console.log(err)
+      }
+        
+    VIEW.switchDevice();
+  }
+
+
+
+  
+
+}
+
+
+
+
+
+
+
+
+
+
+
+ipcRenderer.on("setActiveDevicePinned", function(event, message){
+  if(!message){
+    VIEW.unpinActiveDevice();
+  }else{
+    VIEW.pinActiveDevice();
+  }
+});
+
+ipcRenderer.on("doSearch", function(event, message){
+  window.searchAll();
+});
+
+ipcRenderer.on("doDelete", function(event, message){
+  DEVICE.deleteActive();
+});
+
+ipcRenderer.on("resetViews", function(event, message){
+  SAVESLOTS.resetSlots();
+});
+
+ipcRenderer.on("doSlots1", function(event, message){
+  SAVESLOTS.loadSlot(1);
+});
+ipcRenderer.on("doSlots2", function(event, message){
+  SAVESLOTS.loadSlot(2);
+});
+ipcRenderer.on("doSlots3", function(event, message){
+  SAVESLOTS.loadSlot(3);
+});
+
+
+
+
+
+
+
+function log(type, message){
+  
+}
+
+function switchClass(element, className){
+  try{
+    document.getElementsByClassName(className)[0].classList.remove(className);
+  }catch(err){
+    //console.log(err)
+  }
+  element.classList.add(className);
+}
+window.switchClass = function(element, className){
+  switchClass(element, className);
+}
+
+
+
@@ -0,0 +1,96 @@
+body{
+	color: #6e6c6f;
+	font-family: sans-serif;
+	margin: 0px;
+	margin-top: 40px;
+	user-select: none;
+	/*overflow-x: hidden;*/
+	visibility: visible !important;
+	max-width: 100%;
+    padding: 10px;
+    
+}
+header{
+	position: fixed;
+	top: 0px;
+	left: 0px;
+	height: 36px;
+	width: 100%;
+	box-sizing:content-box;
+
+	background-color: rgba(0, 0, 0, 0.2);
+	border-bottom: black 1px solid;
+	-webkit-app-region: drag;
+}
+h1, h2, h3, h4, h5, h6{
+	color: white;
+}
+
+header h1, header h2{
+	margin: 8px;
+	margin-left: 20px;
+	font-weight: normal;
+	font-size: 18px;
+	float: left;
+}
+header h2{
+	color: #b6b6b6;
+}
+
+
+table.cv-table{
+	border: none;
+	table-layout: fixed;
+	border-collapse: collapse;
+	color: #dddddd;
+	font-size: 15px;
+}
+	table.cv-table th{
+		padding: 6px 16px;
+		color: #969696;
+		text-align: left;
+		border-bottom: #555 1px solid;
+		border-bottom: #555 1px solid;
+		font-weight: normal;
+		background-color: #1e1e1e;
+	}
+	table.cv-table tr:nth-child(odd){
+		background-color: #292929;
+	}
+	table.cv-table tr td:first-child{
+		padding-left: 10px;
+		-webkit-border-top-left-radius: 10px;
+	    -webkit-border-bottom-left-radius: 10px;
+	}
+	table.cv-table tr td:last-child{
+		padding-right: 10px;
+		-webkit-border-top-right-radius: 10px;
+	    -webkit-border-bottom-right-radius: 10px;
+	}
+	table.cv-table td{
+		padding: 7px 16px;
+	}
+
+
+
+
+
+.not-responding{
+}
+.not-responding em{
+	background-color: #3f3f3f;
+	color: white;
+	padding: 2px 10px;
+	display: inline-block;
+	border-radius: 5px;
+}
+
+@font-face {
+    font-family: PlexMono;
+    src: url("media/IBMPlexMono-Text.otf") format("opentype");
+}
+
+@font-face {
+    font-family: PlexSans;
+    src: url("media/IBMPlexSans-Light.otf") format("opentype");
+}
@@ -0,0 +1,274 @@
+const { v4: uuid } = require('uuid');
+let osc = require("osc");
+let net = require("net");
+let udp = require('dgram');
+var _ = require('lodash/function');
+
+
+let PLUGINS = require("./plugins.js");
+let VIEW = require("./view.js");
+let SAVESLOTS = require("./saveSlots.js");
+
+
+var devices = {};
+module.exports.all = devices;
+
+
+registerDevice = function(newDevice){
+
+	console.log(PLUGINS.all)
+
+	if(PLUGINS.all[newDevice.type]==undefined){
+		console.error("Plugin for device "+newDevice.type+" does not exist.");
+		return true;
+	}
+
+	var initElements = document.getElementsByClassName('init');
+	for(var i=0; i<initElements.length; i++){
+		initElements[i].style.display="none";
+	}
+
+	// only register device if it hasn't already been added
+	if(newDevice.addresses.length>0){
+		for(var i in devices){
+			if(devices[i].type==newDevice.type && JSON.stringify(devices[i].addresses) == JSON.stringify(newDevice.addresses)){
+				// This device has already been added
+				infoUpdate(devices[i], "status", "ok");
+				return false;
+			}
+		}
+	}
+
+	//console.log("Registered new "+newDevice.type)
+
+	var id = newDevice.id || uuid();
+	devices[id] = {
+		id: id,
+		status: "new",
+		type: newDevice.type,
+		displayName: newDevice.displayName,
+		defaultName: newDevice.defaultName,
+		port: newDevice.port,
+		addresses: newDevice.addresses,
+		data: {},
+		pinIndex: false,
+		lastDrawn: 0,
+		lastHeartbeat: 0,
+		heartbeatInterval: PLUGINS.all[newDevice.type].heartbeatInterval,
+		draw: _.debounce(function(){ VIEW.draw(this); }, 30, { leading: true, trailing: true})
+	}
+	
+	VIEW.addDeviceToList(devices[id]);
+	initDeviceConnection(id);
+
+}
+module.exports.registerDevice = registerDevice;
+
+
+initDeviceConnection = function(id){
+
+
+	var device = devices[id];
+
+	infoUpdate(device, "status", "new");
+
+	if(device.port==undefined || device.addresses.length==0){
+		return true;
+	}
+	try{
+		// mostly only useful for UDP
+		device.connection.close();
+	}catch(err){}
+ 
+	const type = devices[id].type;
+	var plugins = PLUGINS.all;
+
+	if(plugins[type].connectionType == "osc"){
+		device.connection = new osc.TCPSocketPort({
+			address: device.addresses[0],
+			port: device.port
+		});
+		device.connection.open();
+		device.connection.on("error", function (error) {
+			//console.error(error)
+			device.connection.close();
+		});
+		device.connection.on("ready", function () {
+			plugins[type].ready(device);
+			if(Object.keys(devices).length==1){
+				VIEW.switchDevice(device.id);
+			}
+		});
+		device.connection.on("message", function(message){
+			//log("OSC IN", message.address);
+			plugins[type].data(device, message);
+			device.lastMessage = Date.now();
+		});
+		device.send = function(address, args){
+			device.connection.send({address: address, args: args});
+		}
+		device.plugin = plugins[type];
+
+	}else if(plugins[type].connectionType == "TCPsocket"){
+		device.connection = new net.Socket();
+
+		device.connection.connect({port: device.port, host: device.addresses[0]}, function() {
+			
+		});
+		
+		device.connection.on("error", function (error) {
+			//console.error(error)
+		});
+		device.connection.on("ready", function () {
+			plugins[type].ready(device);
+			if(Object.keys(devices).length==1){
+				VIEW.switchDevice(device.id);
+			}
+		});
+		device.connection.on("data", function(message){
+			//log("SOCK IN", message);
+			plugins[type].data(device, message);
+			device.lastMessage = Date.now();
+			infoUpdate(device, "status", "ok");
+		});
+		device.send = function(data){
+			//log("SOCK OUT", data);
+			device.connection.write(data);
+		}
+
+	}else if(plugins[type].connectionType == "UDPsocket"){
+
+		device.connection = udp.createSocket('udp4');
+
+		device.connection.bind(function(){
+
+			plugins[type].ready(device);
+
+			device.connection.on('message',function(msg,info){
+				plugins[type].data(device, msg);
+				infoUpdate(device, "status", "ok");
+			});
+		});
+
+		device.send = function(data){
+			device.connection.send(data, device.port, device.addresses[0], function(err){
+				//console.log(err);
+			});
+		}
+
+
+	}
+
+}
+module.exports.initDeviceConnection = initDeviceConnection;
+
+
+module.exports.deleteActive = function(){
+	var device = VIEW.getActiveDevice();
+	var choice = confirm("Are you sure you want to delete "+device.type+" device \""+(device.displayName || device.defaultName)+"\"?");
+
+	if(choice){
+		VIEW.removeDeviceFromList(device);
+		delete devices[device.id];
+		SAVESLOTS.deleteFromSlots(device);
+		SAVESLOTS.saveAll();
+		SAVESLOTS.reloadActiveSlot();
+	}
+
+}
+
+module.exports.changeActiveType = function(newType){
+	var device = VIEW.getActiveDevice();
+	device.type = newType;
+
+	initDeviceConnection(device.id);
+	VIEW.draw(device);
+	//SAVESLOTS.saveAll();
+}
+
+module.exports.changeActiveIP = function(newIP){
+	var device = VIEW.getActiveDevice();
+	device.addresses[0] = newIP;
+	initDeviceConnection(device.id);
+	VIEW.draw(device);
+	SAVESLOTS.saveAll();
+}
+
+module.exports.changeActivePort = function(newPort){
+	var device = VIEW.getActiveDevice();
+	device.port = newPort;
+
+	initDeviceConnection(device.id);
+	VIEW.draw(device);
+	SAVESLOTS.saveAll();
+}
+
+module.exports.changeActiveName = function(newName){
+	var device = VIEW.getActiveDevice();
+	device.displayName = newName;
+	infoUpdate(device, "displayName", newName);
+	VIEW.draw(device);
+	SAVESLOTS.saveAll();
+}
+module.exports.changeActivePinIndex = function(newPin){
+	var device = VIEW.getActiveDevice();
+	device.pinIndex = newPin;
+	VIEW.draw(device);
+	SAVESLOTS.saveAll();
+}
+module.exports.changePinIndex = function(device, newPin){
+	device.pinIndex = newPin;
+	//SAVESLOTS.saveAll();
+}
+module.exports.refreshActive = function(){
+	var device = VIEW.getActiveDevice();
+	if(device==undefined){
+		return true;
+	}
+	initDeviceConnection(device.id);
+	VIEW.draw(device);
+}
+
+
+
+
+infoUpdate = function(device, param, value){
+	if(param=="addresses"){
+		device.addresses = value.replace(/\s+/g, '').split(",");
+	}else{
+		device[param] = value;
+	}
+	VIEW.addDeviceToList(device);
+}
+module.exports.infoUpdate = infoUpdate;
+
+
+setInterval(heartbeat, 100);
+function heartbeat(){
+	for(var i in devices){
+		var device = devices[i];
+		if(Date.now()>=device.lastHeartbeat+device.heartbeatInterval){
+			
+			if(device.status=="broken"){
+				initDeviceConnection(i);
+			}else if(Date.now()-device.lastMessage>10000){
+				infoUpdate(device, "status", "broken");
+			}else{
+				if(device.port!=undefined && device.addresses.length>0){
+					PLUGINS.all[device.type].heartbeat(device);
+				}else{
+					//console.error("Invalid IP/Port on device "+device.name)
+				}
+			}
+			device.lastHeartbeat = Date.now();
+		}
+		
+	}
+}
+
+
+
+
+
+
+
@@ -0,0 +1,360 @@
+html {
+  font-size: 1rem;
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont;
+}
+*, a, button {
+    cursor: default;
+    user-select: none;
+}
+
+
+
+body{
+	color: #6e6c6f;
+	margin: 0px;
+	user-select: none;
+	overflow-x: hidden;
+}
+a{
+	text-decoration: none;
+}
+.red{
+	color: #eb6b5e;
+}
+.green{
+	color: #61c650;
+}
+.left{
+	float: left;
+}
+
+
+#main{
+	box-sizing: border-box;
+	display: grid;
+	width: 100%;
+	height: 100vh;
+	grid-template-columns: 270px 1fr;
+}
+.col{
+	border-right: rgba(0, 0, 0, 0.5) 1px solid;
+	height: 100vh !important;
+	overflow: hidden;
+	box-sizing: border-box;
+	position: relative;
+}
+
+/* FIRST COL */
+#device-list-col{
+	background-color: transparent;
+	color: #707070;
+}
+#view-buttons-bar{
+	box-sizing: border-box;
+	text-align: right;
+	padding-left: 100px;
+	padding-right: 7px;
+	user-select: text;
+	-webkit-app-region: drag;
+	z-index: 1000;
+	/*border-bottom: black 1px solid;*/
+	/*background: linear-gradient(#3f3f3f 0%, #343434 100%);*/
+	/*background-color: #363636;*/
+	/*background-color: rgba(0, 0, 0, 0.4);*/
+}
+#view-buttons-bar button{
+	background-color: rgba(255, 255, 255, 0.07);
+	width: 26px;
+	border-radius: 10px;
+	font-size:  0.8rem;
+}
+#view-buttons-bar button:hover{
+	background-color: rgba(255, 255, 255, 0.25);
+}
+
+
+
+
+#device-list{
+	box-sizing: border-box;
+	width: 100%;
+	padding: 0px 10px;
+}
+	#device-list div{
+		pointer-events: none;
+	}
+	#device-list .device{
+		box-sizing: border-box;
+		clear: both;
+		display: block;
+		width: 100%;
+		height: 40px;
+		padding: 10px 5px;
+		overflow: hidden;
+		border-radius: 5px;
+	}
+	#device-list .device.active-device{
+		/*background-color: #0e5ccd;*/
+		/*background-color: #c9961f;*/
+		background-color: rgba(255, 255, 255, 0.2);
+	}
+	#device-list .status{
+		float: left;
+		width: 25px;
+		font-size: 18px;
+	}
+	#device-list .type{
+		float: left;
+		width: 30px;
+		color: #f6bd26;
+	}
+	#device-list .name{
+		position: relative;
+		left: 0px;
+		color: white;
+		font-weight: 600;
+
+		text-overflow: ellipsis;
+		white-space: nowrap; 
+		overflow: hidden;
+	}
+	#device-list h3.init{
+		margin: 0px auto;
+		padding-top: 200px;
+		text-align: center;
+		font-weight: 300;
+		font-size: 16px;
+		width: 210px;
+		pointer-events: none;
+	}
+
+
+
+	
+#device-tools{
+	position: absolute;
+	bottom: 210px;
+	left: 0px;
+	width: 100%;
+	height: 30px;
+	padding-right: 10px;
+	/*background: linear-gradient(#2f2f2f 0%, #2c2c2c 100%);*/
+	background-color: rgba(0, 0, 0, 0.2);
+	text-align: center;
+	border-top: rgba(0, 0, 0, 0.3) 1px solid;
+	/*border-bottom: #3a3a3a 1px solid;*/
+}
+#device-tools select{
+	text-align: center;
+}
+
+
+
+#device-settings{
+	position: absolute;
+	left: 0px;
+	bottom: 0px;
+	height: 200px;
+	padding: 5px;
+	color: white;
+	font-weight: 300;
+	width: 100%;
+	background-color: rgba(0, 0, 0, 0.2);
+}
+	#device-settings th{
+		text-align: right;
+		padding-right: 3px;
+		color: white;
+		font-weight: normal;
+	}
+	#device-settings td{
+		padding: 6px;
+	}
+	#device-settings-table{
+		display: none;
+	}
+	#device-settings h3{
+		padding-top: 20px;
+		text-align: center;
+		font-weight: 300;
+	}
+	#device-settings #device-settings-name,
+	#device-settings #device-settings-ip,
+	#device-settings #device-settings-plugin-dropdown{
+		width: 170px;
+	}
+	#device-settings #device-settings-port{
+		width: 70px;
+	}
+
+
+
+/* SECOND COL */
+#all-devices{
+	display: grid;
+	grid-template-columns: repeat(4, 1fr);
+	background-color: rgba(0, 0, 0, 0.3);
+}
+.device-pin{
+	position:absolute;
+	right: 15px;
+	top: 8px;
+	height: 20px;
+}
+.device-wrapper{
+	box-sizing: border-box;
+	border-top: rgba(0, 0, 0, 0) 2px solid;
+	border-bottom: rgba(0, 0, 0, 0) 2px solid;
+}
+.draw-area{
+	height: 100%;
+	overflow-y: scroll;
+	width: 100%;
+	height: 100%;
+	border: 0;
+
+}
+.active-device-outline{
+	outline: #fdea08 2px solid;
+	border-top: #fdea08 2px solid;
+	border-bottom: #fdea08 2px solid;
+}
+
+
+
+
+
+
+input{
+	display: block;
+	box-sizing:content-box;
+	background-color: rgba(0, 0, 0, 0.2);
+	height: 28px;
+	padding: 2px 6px;
+	margin: 0px;
+	border: rgba(255, 255, 255, 0.1) 1px solid;
+	border-radius: 4px;
+	color: #fff;
+	font-size: 16px;
+	font-weight: 500;
+}
+select{
+	display: block;
+	box-sizing:content-box;
+	background-color: rgba(255, 255, 255, 0.15);
+	height: 28px;
+	padding: 2px 6px;
+	margin: 0px;
+	border: rgba(255, 255, 255, 0.1) 1px solid;
+	border-radius: 4px;
+	color: #fff;
+	font-size: 16px;
+	font-weight: 500;
+}
+input:focus, select:focus{
+	outline: #fdea08 2px solid;
+	color: white;
+}
+input[type='checkbox']{
+	position: relative;
+	height: 14px;
+	width: 14px;
+	padding: 2px;
+	-webkit-appearance: none;
+}
+input[type='checkbox']:checked{
+	background-color: #616064;
+}
+input[type='checkbox']:checked:after {
+	content: '\2713';
+	font-size: 18px;
+	position: absolute;
+	top: -1px;
+	left: 1px;
+	color: white;
+}
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+button, select.button{
+	box-sizing:content-box;
+	width:  40px;
+	height: 25px;
+	margin-top: 7px;
+	margin-bottom: 7px;
+	margin-left: 4px;
+	border: none;
+	outline: none;
+	padding: 0px;
+
+	color: white;
+	background: rgba(255, 255, 255, 0.15);
+	border-radius: 4px;
+	font-size: 1rem;
+	user-select: none;
+}
+	button:hover{
+		background-color: rgba(255, 255, 255, 0.2);
+	}
+	button:focus{
+		outline: none;
+	}
+	button.active{
+		background-color: rgba(255, 255, 255, 0.3);
+		color: white;
+	}
+	button:disabled{
+		background: rgba(255, 255, 255, 0.03);
+	}
+	button img{
+		height: 18px;
+	}
+
+select.button:focus{
+	outline: none;
+}
+
+
+
+
+
+
+
+
+
+
+
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: local('img/Material Icons'),
+    local('img/MaterialIcons-Regular'),
+    url(img/MaterialIcons-Regular.ttf) format('truetype');
+}
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;  /* Preferred icon size */
+  display: inline-block;
+  line-height: 1;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  white-space: nowrap;
+  direction: ltr;
+
+  /* Support for all WebKit browsers. */
+  -webkit-font-smoothing: antialiased;
+  /* Support for Safari and Chrome. */
+  text-rendering: optimizeLegibility;
+
+  /* Support for Firefox. */
+  -moz-osx-font-smoothing: grayscale;
+
+  /* Support for IE. */
+  font-feature-settings: 'liga';
+}
@@ -0,0 +1,23 @@
+document.onclick = function(e){
+	window.closePopovers();
+}
+
+window.init();
+
+
+document.getElementById("search-button").onclick = function(e){
+    window.searchAll();
+}
+document.getElementById("add-device-button").onclick = function(e){
+	//e.stopPropagation();
+    //document.getElementById("add-device-popover").style.display = "block";
+}
+
+
+
+window.closePopovers = function(){
+	//document.getElementById("add-device-popover").style.display = "none";
+}
+
+
+
@@ -0,0 +1,36 @@
+let fs = require('fs');
+let DEVICE = require("./device.js");
+let VIEW = require("./view.js");
+
+
+var allPlugins = {};
+module.exports.all = allPlugins;
+
+module.exports.init = function(callback){
+
+	console.log("Loading Plugin Files...")
+
+	fs.readdir("./plugins", function(err, files){
+		for(var i in files){
+			var plugin = files[i];			
+
+			if(plugin[0]!="."){
+				allPlugins[plugin] = require(process.cwd()+"/plugins/"+plugin+"/"+plugin+".js");
+
+				allPlugins[plugin].deviceInfoUpdate = function(device, param, value){
+					DEVICE.infoUpdate(device, param, value)
+				}
+				allPlugins[plugin].draw = function(device){
+					VIEW.draw(device);
+				}
+
+				allPlugins[plugin].template = ejs.compile(fs.readFileSync(process.cwd()+"/plugins/"+plugin+"/"+plugin+".html", 'utf8'));
+				
+				if(allPlugins[plugin].heartbeatInterval==undefined || allPlugins[plugin].heartbeatInterval<50){
+					allPlugins[plugin].heartbeatInterval = 5000;
+				}
+			}
+		}
+		callback();
+	});
+}
@@ -0,0 +1,118 @@
+let VIEW = require("./view.js");
+let DEVICE = require("./device.js");
+
+
+var activeSlot = false;
+var savedSlots = [[], [], [], []];
+var savedDevices = [];
+
+var storedSlots = localStorage.getItem('savedSlots');;
+if(storedSlots){
+	savedSlots = JSON.parse(storedSlots);
+}
+
+var storedDevices = localStorage.getItem('savedDevices');;
+if(storedDevices){
+	savedDevices = JSON.parse(storedDevices);
+}
+
+loadSlot = function(slotIndex){
+	
+	VIEW.toggleSlotButtons(slotIndex);
+	activeSlot = slotIndex;
+
+	for(var d in DEVICE.all){
+		DEVICE.changePinIndex(DEVICE.all[d], false);
+	}
+	VIEW.resetPinned();
+
+	for(var d in savedSlots[slotIndex]){
+		var savedDevice = savedSlots[slotIndex][d];
+		for(var d in DEVICE.all){
+			var device = DEVICE.all[d];
+			//if(device.addresses[0] == savedDevice.addresses[0] && device.type == savedDevice.type){
+			if(device.id == savedDevice.id){
+				VIEW.pinDevice(device);
+				VIEW.switchDevice(device.id)
+			}else if(device.addresses[0] == savedDevice.addresses[0] && device.type == savedDevice.type && savedDevice.addresses[0]!=undefined ){
+				VIEW.pinDevice(device);
+				VIEW.switchDevice(device.id)
+			}
+		}
+	}	
+}
+module.exports.loadSlot = loadSlot;
+
+module.exports.loadDevices = function(){
+	console.log("Loading "+savedDevices.length+" saved devices...")
+	console.log(savedDevices)
+
+	for(var i=0; i<savedDevices.length; i++){
+		DEVICE.registerDevice({
+			type: savedDevices[i].type,
+			displayName: savedDevices[i].displayName,
+			defaultName: savedDevices[i].defaultName,
+			port: savedDevices[i].port,
+			addresses: savedDevices[i].addresses,
+			id: savedDevices[i].id
+		})
+	}
+
+
+}
+
+module.exports.saveAll = function(){
+	console.log("Saving...")
+	var currentPins = VIEW.getPinnedDevices();
+
+	savedSlots[activeSlot] = [];
+	for(var i=0; i<currentPins.length; i++){
+		savedSlots[activeSlot][i] = {
+			addresses: currentPins[i].addresses,
+			type: currentPins[i].type,
+			id: currentPins[i].id
+		}
+	}
+	localStorage.setItem('savedSlots', JSON.stringify(savedSlots));
+	console.log("Saved "+currentPins.length+" pinned devices to slot "+activeSlot+"!")
+
+	savedDevices = []
+	var i = 0;
+	for(var d in DEVICE.all){
+		var device = DEVICE.all[d];
+		savedDevices[i] = {
+			addresses: device.addresses,
+			type: device.type,
+			displayName: device.displayName,
+			defaultName: device.defaultName,
+			port: device.port,
+			id: device.id
+		}
+		i++;
+	}
+	localStorage.setItem('savedDevices', JSON.stringify(savedDevices));
+
+}
+
+module.exports.deleteFromSlots = function(device){
+	for(var i = 1; i<=3; i++){
+		console.log(savedSlots);
+		for(var j=0; j<savedSlots[i].length; j++){
+			if(savedSlots[i][j].id == device.id){
+				delete savedSlots[i][j];
+			}
+		}
+
+	}
+}
+
+module.exports.reloadActiveSlot = function(){
+	loadSlot(activeSlot)
+}
+
+module.exports.resetSlots = function(){
+	localStorage.clear();
+}
+
+
+
@@ -0,0 +1,399 @@
+const { ipcRenderer } = require('electron');
+let netmask = require('netmask').Netmask;
+let dgram = require('dgram');
+let bonjour = require('bonjour')();
+let net = require("net");
+let os = require("os");
+let ip = require("ip");
+
+
+let DEVICE = require("./device.js");
+let SEARCH = require("./search.js");
+let PLUGINS = require("./plugins.js");
+
+
+var searching = false;
+var allServers = false;
+
+searchAll = function(){
+	if(searching){
+		return true;
+	}
+	searching = true;
+	ipcRenderer.send("disableSearchAll", "");
+	document.getElementById("search-button").style.opacity = 0.2;
+	//console.clear();
+
+	for(var i in DEVICE.all){
+		DEVICE.infoUpdate(DEVICE.all[i], "status", "refresh");
+	}
+
+	console.log("Searching...")
+
+
+	//findOnlineDevices();
+	allServers = getServers();
+	var TCPFlag = true;
+	if(allServers.length>2046){
+		alert("Unable to search for TCP devices - subnet too large!\n\nCue View requires subnet 255.255.248.0 (/21) or smaller.")
+		TCPFlag = false;
+	}
+
+	console.log(PLUGINS)
+
+	for(var p in PLUGINS.all){
+		var plugin = PLUGINS.all[p];
+		console.log(p)
+		try{
+			switch(plugin.searchOptions.type){
+				case "TCPport":
+					if(TCPFlag){
+						newSearchTCP(p, plugin);
+					}
+				break;
+				case "Bonjour":
+					newSearchBonjour(p, plugin)
+				break;
+				case "UDPsocket":
+					newSearchUDP(p, plugin)
+				break;
+			}
+		}catch(err){
+			console.error("Unable to search for plugin "+p)
+		}
+	}
+
+	//searchBonjour();
+	//searchTCP();
+	//searchUDP();
+
+	setTimeout(function(){
+		searching = false;
+		document.getElementById("search-button").style.opacity = "";
+
+		for(var i=0; i<searchSockets.length; i++){
+			try{searchSockets[i].close();}catch(err){}
+		}
+
+		ipcRenderer.send("enableSearchAll", "");
+
+	}, 5000)
+}
+module.exports.searchAll = searchAll;
+
+
+
+
+ //  ____              _                  
+ // |  _ \            (_)                 
+ // | |_) | ___  _ __  _  ___  _   _ _ __ 
+ // |  _ < / _ \| '_ \| |/ _ \| | | | '__|
+ // | |_) | (_) | | | | | (_) | |_| | |   
+ // |____/ \___/|_| |_| |\___/ \__,_|_|   
+ //                  _/ |                 
+ //                 |__/                  
+
+newSearchBonjour = function(pluginType, plugin){
+	bonjour.find({type: plugin.searchOptions.bonjourName}, function(e){
+		console.log(pluginType)
+		
+		var validAddresses = [];
+		for(var i in e.addresses){
+			if(e.addresses[i].indexOf(":")==-1){
+				validAddresses.push(e.addresses[i])
+			}
+		}
+		
+		DEVICE.registerDevice({
+			type: pluginType,
+			defaultName: e.name,
+			port: e.port,
+			addresses: validAddresses
+		})
+	});
+}
+
+
+// searchBonjour = function(){
+// 	bonjour.find({type: "qlab"}, function(e){
+// 		for(var i in e.addresses){
+// 			if(e.addresses[i].indexOf(":")){
+// 				e.addresses.splice(i, 1);
+// 			}
+// 		}
+// 		DEVICE.registerDevice({
+// 			type: "qlab",
+// 			name: e.name,
+// 			port: e.port,
+// 			addresses: e.addresses
+// 		})
+// 	});
+
+
+// }
+
+
+
+ //  _______ _____ _____  
+ // |__   __/ ____|  __ \ 
+ //    | | | |    | |__) |
+ //    | | | |    |  ___/ 
+ //    | | | |____| |     
+ //    |_|  \_____|_|     
+                                          
+
+
+newSearchTCP = function(pluginType, plugin){
+	for(var i=0; i<allServers.length; i++){
+		TCPtest(allServers[i], pluginType, plugin);
+	}
+}
+
+TCPtest = function(ip, pluginType, plugin){
+	var client = net.createConnection(plugin.searchOptions.testPort, ip, function(){
+		client.write(plugin.searchOptions.searchBuffer);
+		// DEVICE.registerDevice({
+		// 	type: pluginType,
+		// 	defaultName: plugin.defaultName,
+		// 	port: plugin.defaultPort,
+		// 	addresses: [ip]
+		// })
+	});
+	client.on('data', (data) => {
+		if(plugin.searchOptions.validateResponse(data)){
+			DEVICE.registerDevice({
+				type: pluginType,
+				defaultName: plugin.defaultName,
+				port: plugin.defaultPort,
+				addresses: [ip]
+			})
+		}
+		client.end();
+	});
+	client.on("error", function(err){
+	 	//no device here
+	});
+} 
+
+
+
+// from local-devices library
+function getServers () {
+  var interfaces = os.networkInterfaces()
+  var result = []
+
+  for (var key in interfaces) {
+    var addresses = interfaces[key]
+    for (var i = addresses.length; i--;) {
+      var address = addresses[i]
+      if (address.family === 'IPv4' && !address.internal) {
+        var subnet = ip.subnet(address.address, address.netmask)
+        var current = ip.toLong(subnet.firstAddress)
+        var last = ip.toLong(subnet.lastAddress) - 1
+        while (current++ < last) result.push(ip.fromLong(current))
+      }
+    }
+  }
+
+  return result;
+}
+
+
+
+findOnlineDevices = function(){
+	var allInterfaces = require('os').networkInterfaces();
+	var validInterfaces = [];
+	for(var i in allInterfaces){
+		for(var j=0; j<allInterfaces[i].length; j++){
+			var iface = allInterfaces[i][j];
+
+			if(iface.family=="IPv4" && iface.internal==false && iface.address.split(".")[0]!="169"){
+				validInterfaces.push(iface);
+			}
+		}
+	}
+
+	for(var i=0; i<validInterfaces.length; i++){
+		var block = new netmask(validInterfaces[i].cidr);
+		var f = block.first.split(".");
+		var l = block.last.split(".");
+		var cur = [f[0], f[1], f[2], f[3]];
+
+		for(var j=Number(f[2]); j<=Number(l[2]); j++){
+			cur[2] = j;
+			for(var k = Number(f[3]); k<Number(l[3]); k++){
+				cur[3] = k;
+				allIPs.push(cur[0]+"."+cur[1]+"."+cur[2]+"."+cur[3]);
+			}
+		}
+	}
+}
+
+
+
+
+// window.searchTCP = function(){
+// 	var allInterfaces = require('os').networkInterfaces();
+// 	var validInterfaces = [];
+// 	for(var i in allInterfaces){
+// 		for(var j=0; j<allInterfaces[i].length; j++){
+// 			var iface = allInterfaces[i][j];
+
+// 			if(iface.family=="IPv4" && iface.internal==false && iface.address.split(".")[0]!="169"){
+// 				validInterfaces.push(iface);
+// 			}
+// 		}
+// 	}
+
+// 	for(var i=0; i<validInterfaces.length; i++){
+// 		var block = new netmask(validInterfaces[i].cidr);
+// 		var f = block.first.split(".");
+// 		var l = block.last.split(".");
+// 		var cur = [f[0], f[1], f[2], f[3]];
+
+// 		for(var j=Number(f[2]); j<=Number(l[2]); j++){
+// 			cur[2] = j;
+// 			for(var k = Number(f[3]); k<Number(l[3]); k++){
+// 				cur[3] = k;
+// 				var ip = cur[0]+"."+cur[1]+"."+cur[2]+"."+cur[3];
+
+// 				TCPtest(ip, 3033);
+// 				TCPtest(ip, 3039);
+// 				TCPtest(ip, 3040);
+// 			}
+// 		}
+// 	}
+// }
+// TCPtest = function(address, port){
+// 	var client = net.createConnection(port, address, function(){
+// 		if(port==3033){
+// 			DEVICE.registerDevice({
+// 				type: "eos",
+// 				name: "ETC Eos Console",
+// 				port: 3032,
+// 				addresses: [address]
+// 			});
+// 		}else if(port==3040){
+// 			DEVICE.registerDevice({
+// 				type: "watchout",
+// 				name: "Watchout",
+// 				port: 3040,
+// 				addresses: [address]
+// 			});
+// 		}
+// 	});
+// 	client.on("error", function(err){
+// 	 	//no EOS here
+// 	});
+// }
+
+
+
+ //  _    _ _____  _____  
+ // | |  | |  __ \|  __ \ 
+ // | |  | | |  | | |__) |
+ // | |  | | |  | |  ___/ 
+ // | |__| | |__| | |     
+ //  \____/|_____/|_|     
+                       
+const pjLinkMessage = Buffer.from([0x25, 0x32, 0x53, 0x52, 0x43, 0x48, 0x0d]);
+const xAirMessage = Buffer.from([0x2f, 0x78, 0x69, 0x6e, 0x66, 0x6f]);
+var serverUDP = dgram.createSocket('udp4');
+var serverUDP2 = dgram.createSocket('udp4');
+
+var searchSockets = [];
+
+
+newSearchUDP = function(pluginType, plugin){
+	var i = searchSockets.push(dgram.createSocket('udp4'))-1;
+	searchSockets[i].bind(plugin.searchOptions.listenPort, function(){
+		searchSockets[i].send(plugin.searchOptions.searchBuffer, plugin.searchOptions.devicePort, '255.255.255.255', (err) => {
+			//console.log(err)
+		});
+		setTimeout(function(){
+			searchSockets[i].send(plugin.searchOptions.searchBuffer, plugin.searchOptions.devicePort, '255.255.255.255', (err) => {
+				//console.log(err)
+			});
+		}, 100);
+		setTimeout(function(){
+			searchSockets[i].send(plugin.searchOptions.searchBuffer, plugin.searchOptions.devicePort, '255.255.255.255', (err) => {
+				//console.log(err)
+			});
+		}, 400);
+
+		searchSockets[i].on('message',function(msg,info){
+			if(plugin.searchOptions.validateResponse(msg, info)){
+				DEVICE.registerDevice({
+					type: pluginType,
+					defaultName: plugin.defaultName,
+					port: plugin.defaultPort,
+					addresses: [info.address]
+				})
+			}
+		});
+
+	});
+	searchSockets[i].on('listening', function(){
+	    searchSockets[i].setBroadcast(true);
+	});
+}
+
+
+// searchUDP = function(){
+
+// 	dgramPJLink = dgram.createSocket('udp4');
+// 	dgramPJLink.bind(function(){
+// 		dgramPJLink.send(pjLinkMessage, 4352, '255.255.255.255', (err) => {
+// 			//console.log(err)
+// 		});
+// 		dgramPJLink.on('message',function(msg,info){
+// 			if(msg.toString().indexOf("%2ACKN")==0){
+// 				DEVICE.registerDevice({
+// 					type: "pjlink",
+// 					name: "PJLink Projector",
+// 					port: 4352,
+// 					addresses: [info.address]
+// 				})
+// 			}
+// 		});
+
+// 	});
+// 	dgramPJLink.on('listening', function(){
+// 	    dgramPJLink.setBroadcast(true);
+// 	});
+
+
+// 	dgramXAir = dgram.createSocket('udp4');
+// 	dgramXAir.bind(function(){
+// 		dgramXAir.send(xAirMessage, 10024, '255.255.255.255', (err) => {
+// 			//console.log(err)
+// 		});
+// 		setTimeout(function(){
+// 			dgramXAir.send(xAirMessage, 10024, '255.255.255.255', (err) => {
+// 				//console.log(err)
+// 			});
+// 		}, 100);
+
+// 		dgramXAir.on('message',function(msg,info){
+// 			if(msg.toString().indexOf("/xinfo,ssss")){
+// 				DEVICE.registerDevice({
+// 					type: "xair",
+// 					name: "X Air Mixer",
+// 					port: 10024,
+// 					addresses: [info.address]
+// 				})
+// 			}
+// 		});
+
+// 	});
+// 	dgramXAir.on('listening', function(){
+// 	    dgramXAir.setBroadcast(true);
+// 	});
+	
+
+// }
+
+
+
+
+
@@ -0,0 +1,293 @@
+const { ipcRenderer } = require('electron');
+let DEVICE = require("./device.js");
+let PLUGINS = require("./plugins.js");
+var _ = require('lodash/function');
+
+var pinnedDevices = [];
+module.exports.pinnedDevices = pinnedDevices;
+let activeDevice = false;
+
+
+
+module.exports.init = function(){
+	populatePluginLists();
+}
+
+
+
+drawDeviceInterface = function(id){
+
+	// console.log("DRAW")
+
+	var $deviceDrawArea = document.getElementById("device-"+id+"-draw-area");
+	var $devicePinned = document.getElementById("device-"+id+"-pinned");
+
+	if($deviceDrawArea==null){
+		return true;
+	}
+
+	d = DEVICE.all[id];
+
+	var str = "<html><head>";
+	if(d.status=="ok"){
+		str+="<link href='./plugins/"+d.type+"/"+d.type+".css' rel='stylesheet' type='text/css'>";
+	}
+	
+
+	//scrollbar styles are inline to prevent the styles flickering in
+	str+="<style>";
+	str+="::-webkit-scrollbar {background-color: black;width: 12px;}";
+	str+="::-webkit-scrollbar-track {background-color: #2b2b2b;}";
+	str+="::-webkit-scrollbar-thumb {background-color: #6b6b6b;border-radius: 16px;border: 3px solid #2b2b2b;}";
+	str+="::-webkit-scrollbar-button {display:none;}";
+	str+="body{visibility: hidden;}";
+	str+="</style>";
+	str+="<link href='src/defaultPlugin.css' rel='stylesheet' type='text/css'>";
+	str+="</head><body>";
+
+	if(d.status=="ok"){
+		try{
+			str += PLUGINS.all[d.type].template({data: d.data, listName: d.displayName || d.defaultName});
+		}catch(err){
+			console.log(err)
+			str += "<h3>Plugin Template Error</h3>";
+		}
+	}else{
+		str+="<header><h1>"+(d.displayName || d.defaultName)+"</h1></header>";
+		str+="<div class='not-responding'>";
+		str+="<h2><em>"+d.type+"</em> is not responding to requests for data.</h2>";
+		str+="<h3>IP <em>"+d.addresses[0]+"</em></h3>";
+		str+="<h3>Port <em>"+d.port+"</em></h3></div>";
+	}
+	
+	str+="</body></html>";
+
+		
+	$deviceDrawArea.setAttribute("class", d.type+" draw-area");
+	$deviceDrawArea.contentWindow.document.open();
+	$deviceDrawArea.contentWindow.document.write(str);
+
+
+	if(d.pinIndex){
+		$devicePinned.style.display = "block";
+	}else{
+		$devicePinned.style.display = "none";
+	}
+}
+
+module.exports.draw = function(device){
+	if(device==undefined){
+		return true;
+	}
+	drawDeviceInterface(device.id)
+}
+
+
+
+
+module.exports.addDeviceToList = function(device){
+	var d = device;
+	var addressStr = d.addresses[0] || "";
+	for(var i=1; i<d.addresses.length; i++){
+		addressStr+=", "+d.addresses[i];
+	}
+	var html = "";
+	if(d.status=="ok"){
+		html += "<div class='status material-icons green'>done</div>";
+	}else if(d.status=="refresh"){
+		html += "<div class='status material-icons'>refresh</div>";
+	}else{
+		html+="<div class='status material-icons red'>clear</div>";
+	}
+	html+="<div class='type'><img height='18px' src='plugins/"+d.type+"/icon.png'></div>";
+	html+="<div class='name'>"+(d.displayName || d.defaultName)+"</div>";
+
+	let elem = document.getElementById(d.id);
+	if(elem==null){
+		document.getElementById("device-list").insertAdjacentHTML("beforeend", "<a class='device' id='"+d.id+"'>"+html+"</a>");
+	}else{
+		elem.innerHTML = html;
+	}
+}
+module.exports.removeDeviceFromList = function(device){
+	var d = device;
+	document.getElementById(device.id).remove();
+}
+
+
+
+switchDevice = function(id){
+
+	if(activeDevice && activeDevice.pinIndex==false){
+		document.getElementById("device-"+activeDevice.id).remove();
+		activeDevice = false;
+	}
+	activeDevice = DEVICE.all[id];
+
+
+	var cols = 1;
+	if(pinnedDevices.length>0){
+		cols+=pinnedDevices.length;
+	}
+	if(pinnedDevices.indexOf(activeDevice)>=0 || id==undefined){
+		cols--;
+	}
+
+	document.getElementById("all-devices").style.gridTemplateColumns = "repeat("+(cols)+", 1fr)";
+
+	if(id==undefined){
+		//document.getElementById('refresh-device-button').style.opacity = 0.2;
+		document.getElementById('refresh-device-button').disabled = true;
+		document.getElementById('device-settings-table').style.display = "none";
+		return true;
+	}else{
+		document.getElementById('refresh-device-button').disabled = false;
+		//document.getElementById('refresh-device-button').style.opacity = 1;
+	}
+
+
+	var i = DEVICE.all[id].id;
+
+	var $deviceWrapper = document.getElementById("device-"+i);
+	if(!$deviceWrapper){
+		var html = '<div class="col device-wrapper" id="device-'+i+'">'
+		+'<img id="device-'+i+'-pinned" class="device-pin" src="src/img/outline_push_pin_white_18dp.png">'
+		+'<iframe id="device-'+i+'-draw-area" class="draw-area"></iframe>'
+		+'<div id="device-'+i+'-settings"></div></div>';
+		document.getElementById("all-devices").insertAdjacentHTML("afterbegin", html);
+
+		$deviceWrapper = document.getElementById("device-"+i);
+	}
+
+    switchClass(document.getElementById(id), "active-device");
+    drawDeviceInterface(id);
+    switchClass(document.getElementById("device-"+id), "active-device-outline");
+
+
+
+    document.getElementById('device-settings-table').style.display = "block";
+    document.getElementById('device-settings-plugin-dropdown').value=activeDevice.type;
+    document.getElementById("device-settings-name").value = activeDevice.displayName || activeDevice.defaultName || "";
+    document.getElementById("device-settings-ip").value = activeDevice.addresses[0] || "";
+    document.getElementById("device-settings-port").value = activeDevice.port || "";
+    document.getElementById("device-settings-pin").checked = activeDevice.pinIndex;
+
+
+    ipcRenderer.send("enableDeviceDropdown", "");
+    ipcRenderer.send("setDevicePin", !DEVICE.all[id].pinIndex==false);
+   
+}
+module.exports.switchDevice = switchDevice;
+
+
+module.exports.getActiveDevice = function(){
+	return activeDevice;
+}
+
+module.exports.pinActiveDevice = function(){
+	if(activeDevice==undefined){
+		return true;
+	}
+	if(pinnedDevices.indexOf(DEVICE.all[activeDevice.id])==-1){
+		pinnedDevices.push(DEVICE.all[activeDevice.id]);
+	}
+	DEVICE.changeActivePinIndex(true);
+}
+
+module.exports.unpinActiveDevice = function(){
+	if(activeDevice==undefined){
+		return true;
+	}
+	pinnedDevices.splice(pinnedDevices.indexOf(DEVICE.all[activeDevice.id]), 1);
+	DEVICE.changeActivePinIndex(false);
+}
+
+module.exports.pinDevice = function(device){
+	pinnedDevices.push(device)
+	DEVICE.changePinIndex(device, true);
+}
+module.exports.unpinDevice = function(device){
+	pinnedDevices.push(device)
+	DEVICE.changePinIndex(device, false);
+}
+
+module.exports.resetPinned = function(){
+	pinnedDevices.length = 0;
+	activeDevice = false;
+	//switchDevice();
+	try{
+		document.querySelector("#device-list .active-device").classList.remove("active-device");
+	}catch(err){}
+	document.getElementById("all-devices").innerHTML = "";
+}
+
+module.exports.getPinnedDevices = function(){
+	return pinnedDevices;
+}
+
+
+module.exports.toggleSlotButtons = function(slotIndex){
+	if(slotIndex==1){
+		document.getElementById("save-slot-1").classList.add("active");
+		document.getElementById("save-slot-2").classList.remove("active");
+		document.getElementById("save-slot-3").classList.remove("active");
+	}else if(slotIndex==2){
+		document.getElementById("save-slot-1").classList.remove("active");
+		document.getElementById("save-slot-2").classList.add("active");
+		document.getElementById("save-slot-3").classList.remove("active");
+	}else if(slotIndex==3){
+		document.getElementById("save-slot-1").classList.remove("active");
+		document.getElementById("save-slot-2").classList.remove("active");
+		document.getElementById("save-slot-3").classList.add("active");
+	}
+}
+
+module.exports.selectPreviousDevice = function(){
+	if(activeDevice==undefined){
+		return true;
+	}
+	var keys = Object.keys(DEVICE.all);
+	var prevIndex = Math.max(0, keys.indexOf(activeDevice.id)-1);
+	switchDevice(keys[prevIndex])
+}
+module.exports.selectNextDevice = function(){
+	if(activeDevice==undefined){
+		return true;
+	}
+	var keys = Object.keys(DEVICE.all);
+	var prevIndex = Math.min(keys.length-1, keys.indexOf(activeDevice.id)+1);
+	switchDevice(keys[prevIndex])
+}
+
+
+
+populatePluginLists = function(){
+
+	var typeSelect = "";
+	var addSelect = '<option value="" disabled selected hidden>+</option>';
+
+	for(const pluginType in PLUGINS.all){
+		var plugin = PLUGINS.all[pluginType];
+
+		addSelect+="<option value='"+pluginType+"'>"+plugin.defaultName+"</option>";
+		typeSelect+="<option value='"+pluginType+"'>"+plugin.defaultName+"</option>";
+	}
+
+	document.getElementById("device-settings-plugin-dropdown").innerHTML = typeSelect;
+	document.getElementById("add-device-button").innerHTML = addSelect;
+}
+
+function debounce(func, wait, immediate) {
+	var timeout;
+	return function() {
+		var context = this, args = arguments;
+		var later = function() {
+			timeout = null;
+			if (!immediate) func.apply(context, args);
+		};
+		var callNow = immediate && !timeout;
+		clearTimeout(timeout);
+		timeout = setTimeout(later, wait);
+		if (callNow) func.apply(context, args);
+	};
+};