stagehacks/Cue-View
1
0
Fork 0
mirror of https://github.com/stagehacks/Cue-View.git synced 2026-08-10 00:03:39 +00:00
Code Issues Packages Projects Releases 9 Wiki Activity

linting

Browse Source
This commit is contained in:
sparks-alec
2022-02-17 01:38:23 -05:00
parent d1f31e5095
commit 9c60b9dd8a
11 changed files with 387 additions and 425 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.eslintrc.js
+1
View File
@@ -20,5 +20,6 @@ module.exports = {
'no-use-before-define': 'off',
'space-infix-ops': 'warn',
'no-bitwise': 'off',
'no-restricted-globals': 'off'
},
};
main.js
+7 -7
View File
@@ -13,7 +13,7 @@ const menuTemplate = [
{
label: 'Clear Saved Data',
id: 'resetViews',
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('resetViews');
}
},
@@ -36,7 +36,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+1',
id: 'window1',
enabled: true,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('doSlots1');
}
},
@@ -45,7 +45,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+2',
id: 'window2',
enabled: true,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('doSlots2');
}
},
@@ -54,7 +54,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+3',
id: 'window3',
enabled: true,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('doSlots3');
}
},
@@ -70,7 +70,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+F',
id: 'deviceSearch',
enabled: true,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('doSearch');
}
},
@@ -82,7 +82,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+P',
id: 'devicePin',
enabled: false,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send(
'setActiveDevicePinned',
menuItem.checked
@@ -94,7 +94,7 @@ const menuTemplate = [
accelerator: 'CommandOrControl+Backspace',
id: 'deviceDelete',
enabled: false,
click: function (menuItem, window, event) {
click (menuItem, window, event) {
mainWindow.webContents.send('doDelete');
}
}
preload.js
+48 -48
View File
@@ -1,9 +1,4 @@
// const { remote } = require('electron');
const { ipcRenderer } = require('electron');
// let currWindow = remote.BrowserWindow.getFocusedWindow();
// const { v4: uuid } = require('uuid');
//const net = require('net');
const DEVICE = require('./src/device.js');
const PLUGINS = require('./src/plugins.js');
@@ -12,8 +7,9 @@ const VIEW = require('./src/view.js');
const SAVESLOTS = require('./src/saveSlots.js');
window.addDevice = DEVICE.addDevice;
window.searchAll = SEARCH.searchAll;
window.init = function () {
window.init = function init() {
console.log('init!');
ipcRenderer.send('enableDeviceDropdown');
@@ -25,27 +21,35 @@ window.init = function () {
SAVESLOTS.loadSlot(1);
});
document.getElementById('device-settings-table').onclick = function (e) {
document.getElementById('search-button').onclick = (e) => {
SEARCH.searchAll();
};
document.getElementById('device-settings-table').onclick = function settingsClick(e) {
e.stopPropagation();
};
document.getElementById('device-settings-name').onchange = function (e) {
document.getElementById('device-settings-name').onchange = function nameChange(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) {
document.getElementById('device-settings-plugin-dropdown').onchange = function dropdownChange(e) {
e.stopPropagation();
DEVICE.changeActiveType(e.target.value);
};
document.getElementById('device-settings-ip').onchange = function ipChange(e) {
e.stopPropagation();
DEVICE.changeActiveIP(e.target.value);
};
document.getElementById('device-settings-port').onchange = function (e) {
document.getElementById('device-settings-port').onchange = function portChange(e) {
e.stopPropagation();
DEVICE.changeActivePort(e.target.value);
};
document.getElementById('device-settings-pin').onchange = function (e) {
document.getElementById('device-settings-pin').onchange = function pinChange(e) {
e.stopPropagation();
if (e.target.checked) {
VIEW.pinActiveDevice();
@@ -54,33 +58,35 @@ window.init = function () {
}
};
document.getElementById('save-slot-1').onclick = function (e) {
document.getElementById('save-slot-1').onclick = function slot1click(e) {
e.stopPropagation();
SAVESLOTS.loadSlot(1);
};
document.getElementById('save-slot-2').onclick = function (e) {
document.getElementById('save-slot-2').onclick = function slot2click(e) {
e.stopPropagation();
SAVESLOTS.loadSlot(2);
};
document.getElementById('save-slot-3').onclick = function (e) {
document.getElementById('save-slot-3').onclick = function slot3click(e) {
e.stopPropagation();
SAVESLOTS.loadSlot(3);
};
document.getElementById('refresh-device-button').onclick = function (e) {
document.getElementById('refresh-device-button').onclick = function refreshClick(e) {
e.stopPropagation();
DEVICE.refreshActive();
};
document.getElementById('device-list').onclick = function (e) {
document.getElementById('device-list').onclick = function listClick(e) {
e.stopPropagation();
const deviceID = e.srcElement.id;
if (e.srcElement.id != 'device-list') {
if (e.srcElement.id !== 'device-list') {
VIEW.switchDevice(deviceID);
}
};
document.getElementById('add-device-button').onchange = function (e) {
document.getElementById('add-device-button').onchange = function addDeviceClick(e) {
DEVICE.registerDevice({
type: e.target.value,
defaultName: 'New Device',
@@ -92,31 +98,25 @@ window.init = function () {
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.onkeyup = function keyUp(e) {
if(e.key === 'ArrowUp'){
VIEW.selectPreviousDevice();
}else if(e.key === 'ArrowDown'){
VIEW.selectNextDevice();
}else if(e.key === 'Tab'){
if (
document.activeElement.tagName !== 'INPUT' &&
document.activeElement.tagName !== 'SELECT'
) {
document.getElementById('device-settings-name').select();
}
}
};
// 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) {
document.getElementById('device-list-col').onclick = function deviceListClick(e) {
try {
document
.querySelector('#device-list .active-device')
@@ -160,9 +160,11 @@ ipcRenderer.on('resetViews', (event, message) => {
ipcRenderer.on('doSlots1', (event, message) => {
SAVESLOTS.loadSlot(1);
});
ipcRenderer.on('doSlots2', (event, message) => {
SAVESLOTS.loadSlot(2);
});
ipcRenderer.on('doSlots3', (event, message) => {
SAVESLOTS.loadSlot(3);
});
@@ -175,6 +177,4 @@ function switchClass(element, className) {
}
element.classList.add(className);
}
window.switchClass = function (element, className) {
switchClass(element, className);
};
window.switchClass = switchClass;
src/defaultPlugin.css
+18 -17
View File
@@ -1,7 +1,7 @@
body {
font-family: sans-serif;
margin: 0px;
margin-top: 40px;
margin-top: 40px;
user-select: none;
visibility: visible !important;
max-width: 100%;
@@ -15,7 +15,7 @@ header {
width: 100%;
box-sizing: content-box;
white-space: nowrap;
overflow: hidden;
overflow: hidden;
background-color: #111111;
border-bottom: black 1px solid;
@@ -63,20 +63,20 @@ table.cv-table tr:nth-child(odd) {
}
table.cv-table tr td:first-child {
padding-left: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
border-top-left-radius: 10px;
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;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
table.cv-table td {
padding: 7px 16px;
}
.not-responding {
color: white;
color: white;
}
.not-responding em {
background-color: #3f3f3f;
@@ -84,22 +84,23 @@ table.cv-table td {
display: inline-block;
border-radius: 5px;
}
.not-responding hr{
margin-top: 100px;
border-color: #333;
.not-responding hr {
margin-top: 100px;
border-color: #333;
}
.device-info{
color: #AAA;
.device-info {
color: #aaa;
}
.device-info h4, .device-info h2{
color: #BBB;
.device-info h4,
.device-info h2 {
color: #bbb;
}
.device-info em{
.device-info em {
background-color: #3f3f3f;
padding: 2px 5px;
display: inline-block;
border-radius: 5px;
color: #fdea08;
margin: 1px;
color: #fdea08;
margin: 1px;
}
src/device.js
+89 -62
View File
@@ -2,7 +2,7 @@ const { v4: uuid } = require('uuid');
const osc = require('osc');
const net = require('net');
const udp = require('dgram');
const { debounce } = require('lodash/function');
const _ = require('lodash');
const PLUGINS = require('./plugins.js');
const VIEW = require('./view.js');
@@ -11,9 +11,9 @@ const SAVESLOTS = require('./saveSlots.js');
const devices = {};
module.exports.all = devices;
registerDevice = function (newDevice) {
function registerDevice(newDevice) {
if (PLUGINS.all[newDevice.type] == undefined) {
if (PLUGINS.all[newDevice.type] === undefined) {
console.error(`Plugin for device ${newDevice.type} does not exist.`);
return true;
}
@@ -25,17 +25,17 @@ registerDevice = function (newDevice) {
// only register device if it hasn't already been added
if (newDevice.addresses.length > 0) {
for (let 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;
}
const existing = _.find(devices, (e) => {
const typeMatch = e.type === newDevice.type;
const addressMatch = JSON.stringify(e.addresses) === JSON.stringify(newDevice.addresses);
return typeMatch && addressMatch;
});
if(existing){
return false;
}
}
// console.log("Registered new "+newDevice.type)
@@ -55,10 +55,10 @@ registerDevice = function (newDevice) {
lastDrawn: 0,
lastHeartbeat: 0,
heartbeatInterval: PLUGINS.all[newDevice.type].heartbeatInterval,
draw: function(){
draw(){
VIEW.draw(this);
},
update: function(type, data){
update(type, data){
if(this.drawn){
VIEW.update(this, type, data);
}else{
@@ -69,27 +69,30 @@ registerDevice = function (newDevice) {
VIEW.addDeviceToList(devices[id]);
initDeviceConnection(id);
return true;
};
module.exports.registerDevice = registerDevice;
initDeviceConnection = function (id) {
function initDeviceConnection(id) {
const device = devices[id];
infoUpdate(device, 'status', 'new');
if (device.port == undefined || device.addresses.length == 0) {
if (device.port === undefined || device.addresses.length === 0) {
return true;
}
try {
// mostly only useful for UDP
device.connection.close();
} catch (err) {}
} catch (err){
//
}
const { type } = devices[id];
const plugins = PLUGINS.all;
if (plugins[type].connectionType == 'osc') {
if (plugins[type].connectionType === 'osc') {
device.connection = new osc.TCPSocketPort({
address: device.addresses[0],
port: device.port,
@@ -101,7 +104,7 @@ initDeviceConnection = function (id) {
});
device.connection.on('ready', () => {
plugins[type].ready(device);
if (Object.keys(devices).length == 1) {
if (Object.keys(devices).length === 1) {
VIEW.switchDevice(device.id);
}
});
@@ -113,26 +116,26 @@ initDeviceConnection = function (id) {
}
device.lastMessage = Date.now();
});
device.send = function (address, args) {
device.connection.send({ address: address, args: args });
device.send = (address, args) => {
device.connection.send({ 'address': address, 'args': args });
};
device.plugin = plugins[type];
} else if (plugins[type].connectionType == 'TCPsocket') {
} else if (plugins[type].connectionType === 'TCPsocket') {
device.connection = new net.Socket();
device.connection.connect(
{ port: device.port, host: device.addresses[0] },
() => {}
);
device.connection.connect({
port: device.port,
host: device.addresses[0]
}, () => {});
device.connection.on('error', (error) => {
// console.error(error)
});
device.connection.on('ready', () => {
plugins[type].ready(device);
if (Object.keys(devices).length == 1) {
if (Object.keys(devices).length === 1) {
VIEW.switchDevice(device.id);
}
});
@@ -142,13 +145,13 @@ initDeviceConnection = function (id) {
device.lastMessage = Date.now();
infoUpdate(device, 'status', 'ok');
});
device.send = function (data) {
device.send = (data) => {
// log("SOCK OUT", data);
device.connection.write(data);
};
} else if (plugins[type].connectionType == 'UDPsocket') {
} else if (plugins[type].connectionType === 'UDPsocket') {
device.connection = udp.createSocket('udp4');
device.connection.bind({port: plugins[type].defaultPort}, () => {
@@ -160,14 +163,14 @@ initDeviceConnection = function (id) {
});
});
device.send = function (data) {
device.send = (data) => {
device.connection.send(Buffer.from(data), device.port, device.addresses[0], (err) => {
// console.log(err);
});
};
} else if (plugins[type].connectionType == 'multicast') {
} else if (plugins[type].connectionType === 'multicast') {
device.connection = udp.createSocket('udp4');
device.connection.bind(device.port, () => {
@@ -179,14 +182,14 @@ initDeviceConnection = function (id) {
});
});
device.send = function (data) {};
device.send = (data) => { };
}
return true;
};
module.exports.initDeviceConnection = initDeviceConnection;
module.exports.deleteActive = function () {
module.exports.deleteActive = function deleteActive() {
const device = VIEW.getActiveDevice();
const choice = confirm(
`Are you sure you want to delete ${device.type} device "${
@@ -203,7 +206,7 @@ module.exports.deleteActive = function () {
}
};
module.exports.changeActiveType = function (newType) {
module.exports.changeActiveType = function changeActiveType(newType) {
const device = VIEW.getActiveDevice();
device.type = newType;
@@ -212,7 +215,7 @@ module.exports.changeActiveType = function (newType) {
// SAVESLOTS.saveAll();
};
module.exports.changeActiveIP = function (newIP) {
module.exports.changeActiveIP = function changeActiveIP(newIP) {
const device = VIEW.getActiveDevice();
device.addresses[0] = newIP;
initDeviceConnection(device.id);
@@ -220,7 +223,7 @@ module.exports.changeActiveIP = function (newIP) {
SAVESLOTS.saveAll();
};
module.exports.changeActivePort = function (newPort) {
module.exports.changeActivePort = function changeActivePort(newPort) {
const device = VIEW.getActiveDevice();
device.port = newPort;
@@ -229,59 +232,83 @@ module.exports.changeActivePort = function (newPort) {
SAVESLOTS.saveAll();
};
module.exports.changeActiveName = function (newName) {
module.exports.changeActiveName = function changeActiveName(newName) {
const device = VIEW.getActiveDevice();
device.displayName = newName;
infoUpdate(device, 'displayName', newName);
VIEW.draw(device);
SAVESLOTS.saveAll();
};
module.exports.changeActivePinIndex = function (newPin) {
module.exports.changeActivePinIndex = function changeActivePinIndex(newPin) {
const device = VIEW.getActiveDevice();
device.pinIndex = newPin;
VIEW.draw(device);
SAVESLOTS.saveAll();
};
module.exports.changePinIndex = function (device, newPin) {
device.pinIndex = newPin;
module.exports.changePinIndex = function changePinIndex(device, newPin) {
const d = device;
d.pinIndex = newPin;
// SAVESLOTS.saveAll();
};
module.exports.refreshActive = function () {
module.exports.refreshActive = function refreshActive() {
const device = VIEW.getActiveDevice();
if (device == undefined) {
if (device === undefined) {
return true;
}
initDeviceConnection(device.id);
VIEW.draw(device);
return true;
};
infoUpdate = function (device, param, value) {
if (param == 'addresses') {
device.addresses = value.replace(/\s+/g, '').split(',');
function infoUpdate(device, param, value) {
const d = device;
if (param === 'addresses') {
d.addresses = value.replace(/\s+/g, '').split(',');
} else {
device[param] = value;
d[param] = value;
}
VIEW.addDeviceToList(device);
};
module.exports.infoUpdate = infoUpdate;
function heartbeat() {
for (let i in devices) {
const device = devices[i];
if (Date.now() >= device.lastHeartbeat + device.heartbeatInterval) {
if (device.status == 'broken') {
initDeviceConnection(i);
} else if (Date.now() - device.lastMessage > device.heartbeatTimeout) {
infoUpdate(device, 'status', 'broken');
Object.keys(devices).forEach((deviceID) => {
const d = devices[deviceID];
if (Date.now() >= d.lastHeartbeat + d.heartbeatInterval) {
if (d.status === 'broken') {
initDeviceConnection(deviceID);
} else if (Date.now() - d.lastMessage > d.heartbeatTimeout) {
infoUpdate(d, 'status', 'broken');
} else if (d.port !== undefined && d.addresses.length > 0) {
PLUGINS.all[d.type].heartbeat(d);
} 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();
d.lastHeartbeat = Date.now();
}
}
});
// for (let i in devices) {
// const device = devices[i];
// if (Date.now() >= device.lastHeartbeat + device.heartbeatInterval) {
// if (device.status == 'broken') {
// initDeviceConnection(i);
// } else if (Date.now() - device.lastMessage > device.heartbeatTimeout) {
// 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();
// }
// }
}
setInterval(heartbeat, 100);
src/index.css
+5 -5
View File
@@ -193,8 +193,8 @@ a {
}
.device-wrapper {
box-sizing: border-box;
border: black 1px solid;
padding: 2px;
border: black 1px solid;
padding: 2px;
}
.draw-area {
height: 100%;
@@ -204,7 +204,7 @@ a {
border: 0;
}
.active-device-outline {
padding: 0px;
padding: 0px;
border: #fdea08 3px solid;
}
@@ -234,10 +234,10 @@ select {
font-size: 16px;
font-weight: 500;
}
select option{
select option {
/* these styles don't affect macOS but are important for Windows! */
text-align: left;
background-color: #333333;
background-color: #333333;
}
input:focus,
select:focus {
src/index.js
+1 -17
View File
@@ -1,17 +1 @@
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";
};
window.init();
src/plugins.js
+19 -14
View File
@@ -1,29 +1,32 @@
/* eslint-disable global-require */
const fs = require('fs');
const _ = require('lodash');
const DEVICE = require('./device.js');
const VIEW = require('./view.js');
const _ = require('lodash');
const allPlugins = {};
module.exports.all = allPlugins;
module.exports.init = function (callback) {
module.exports.init = function init(callback) {
console.log(`Loading plugin files... ${__dirname}/../plugins`);
fs.readdir(`${__dirname}/../plugins`, (err, files) => {
for (let i in files) {
const plugin = files[i];
if (plugin[0] != '.') {
files.forEach((plugin)=>{
if (plugin[0] !== '.') {
console.log(`${i} ${plugin}`);
console.log(`${plugin} started`);
// eslint-disable-next-line import/no-dynamic-require
allPlugins[plugin] = require(`${__dirname}/../plugins/${plugin}/main.js`);
let p = allPlugins[plugin];
const p = allPlugins[plugin];
p.deviceInfoUpdate = function (device, param, value) {
p.deviceInfoUpdate = function deviceInfoUpdate(device, param, value) {
DEVICE.infoUpdate(device, param, value);
};
p.draw = function (device) {
p.draw = (device) => {
VIEW.draw(device);
};
@@ -42,20 +45,22 @@ module.exports.init = function (callback) {
);
if (p.heartbeatTimeout == undefined || p.heartbeatTimeout < 50) {
if (p.heartbeatTimeout === undefined || p.heartbeatTimeout < 50) {
if(p.heartbeatInterval){
p.heartbeatTimeout = p.heartbeatInterval*1.5;
p.heartbeatTimeout = p.heartbeatInterval * 1.5;
}else{
p.heartbeatTimeout = 10000;
}
}
if (p.heartbeatInterval == undefined || p.heartbeatInterval < 50) {
if (p.heartbeatInterval === undefined || p.heartbeatInterval < 50) {
p.heartbeatInterval = 5000;
}
}
}
});
callback();
});
};
src/saveSlots.js
+36 -23
View File
@@ -15,37 +15,45 @@ if (storedDevices) {
savedDevices = JSON.parse(storedDevices);
}
loadSlot = function (slotIndex) {
function loadSlot(slotIndex) {
VIEW.toggleSlotButtons(slotIndex);
activeSlot = slotIndex;
for (var d in DEVICE.all) {
console.log(DEVICE.all);
Object.keys(DEVICE.all).forEach((d)=>{
DEVICE.changePinIndex(DEVICE.all[d], false);
}
});
VIEW.resetPinned();
for (var d in savedSlots[slotIndex]) {
const savedDevice = savedSlots[slotIndex][d];
for (var d in DEVICE.all) {
console.log(savedSlots[slotIndex]);
Object.keys(savedSlots[slotIndex]).forEach((slot) => {
const savedDevice = savedSlots[slotIndex][slot];
Object.keys(DEVICE.all).forEach((d) => {
const device = DEVICE.all[d];
// if(device.addresses[0] == savedDevice.addresses[0] && device.type == savedDevice.type){
if (device.id == savedDevice.id) {
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
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 () {
module.exports.loadDevices = function loadDevices() {
console.log(`Loading ${savedDevices.length} saved devices...`);
for (let i = 0; i < savedDevices.length; i++) {
@@ -60,7 +68,8 @@ module.exports.loadDevices = function () {
}
};
module.exports.saveAll = function () {
module.exports.saveAll = function saveAll() {
console.log('Saving...');
const currentPins = VIEW.getPinnedDevices();
@@ -78,9 +87,9 @@ module.exports.saveAll = function () {
);
savedDevices = [];
var i = 0;
for (var d in DEVICE.all) {
var device = DEVICE.all[d];
let i = 0;
Object.keys(DEVICE.all).forEach((d) => {
const device = DEVICE.all[d];
savedDevices[i] = {
addresses: device.addresses,
type: device.type,
@@ -90,25 +99,29 @@ module.exports.saveAll = function () {
id: device.id,
};
i++;
}
});
localStorage.setItem('savedDevices', JSON.stringify(savedDevices));
};
module.exports.deleteFromSlots = function (device) {
module.exports.deleteFromSlots = function deleteFromSlots(device) {
for (let i = 1; i <= 3; i++) {
console.log(savedSlots);
for (let j = 0; j < savedSlots[i].length; j++) {
if (savedSlots[i][j].id == device.id) {
if (savedSlots[i][j].id === device.id) {
delete savedSlots[i][j];
}
}
}
};
module.exports.reloadActiveSlot = function () {
module.exports.reloadActiveSlot = function reloadActiveSlot() {
loadSlot(activeSlot);
};
module.exports.resetSlots = function () {
module.exports.resetSlots = function resetSlots() {
localStorage.clear();
};
src/search.js
+44 -93
View File
@@ -1,5 +1,4 @@
const { ipcRenderer } = require('electron');
const { Netmask } = require('netmask');
const dgram = require('dgram');
const bonjour = require('bonjour')();
const net = require('net');
@@ -13,12 +12,11 @@ const PLUGINS = require('./plugins.js');
let searching = false;
let allServers = false;
// from local-devices library
function getServers() {
const interfaces = os.networkInterfaces();
const result = [];
for (const key in interfaces) {
Object.keys(interfaces).forEach((key) => {
const addresses = interfaces[key];
for (let i = addresses.length; i--; ) {
const address = addresses[i];
@@ -29,29 +27,26 @@ function getServers() {
while (current++ < last) result.push(ip.fromLong(current));
}
}
}
});
return result;
}
const searchSockets = [];
searchAll = function () {
function searchAll() {
if (searching) {
return true;
return;
}
searching = true;
ipcRenderer.send('disableSearchAll', '');
document.getElementById('search-button').style.opacity = 0.2;
//== console.clear();
for (let i in DEVICE.all) {
Object.keys(DEVICE.all).forEach((i) => {
DEVICE.infoUpdate(DEVICE.all[i], 'status', 'refresh');
}
});
console.log('Searching...');
// findOnlineDevices();
allServers = getServers();
let TCPFlag = true;
if (allServers.length > 2046) {
@@ -61,34 +56,32 @@ searchAll = function () {
TCPFlag = false;
}
for (let p in PLUGINS.all) {
Object.keys(PLUGINS.all).forEach((p) => {
const plugin = PLUGINS.all[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;
case 'multicast':
newSearchMulticast(p, plugin);
break;
const t = plugin.searchOptions.type;
if(t === 'TCPport'){
if (TCPFlag) {
searchTCP(p, plugin);
}
}else if(t === 'Bonjour'){
searchBonjour(p, plugin);
}else if(t === 'UDPsocket'){
searchUDP(p, plugin);
}else if(t === 'multicast'){
searchMulticast(p, plugin);
}
} catch (err) {
console.error(`Unable to search for plugin ${p}`);
}
}
// searchBonjour();
// searchTCP();
// searchUDP();
});
setTimeout(() => {
searching = false;
@@ -97,7 +90,9 @@ searchAll = function () {
for (let i = 0; i < searchSockets.length; i++) {
try {
searchSockets[i].close();
} catch (err) {}
} catch (err) {
//
}
}
ipcRenderer.send('enableSearchAll', '');
@@ -107,15 +102,15 @@ module.exports.searchAll = searchAll;
newSearchBonjour = function (pluginType, plugin) {
function searchBonjour(pluginType, plugin) {
bonjour.find({ type: plugin.searchOptions.bonjourName }, (e) => {
const validAddresses = [];
for (let i in e.addresses) {
if (e.addresses[i].indexOf(':') == -1) {
validAddresses.push(e.addresses[i]);
e.addresses.forEach((address) => {
if (address.indexOf(':') === -1) {
validAddresses.push(address);
}
}
});
DEVICE.registerDevice({
type: pluginType,
@@ -124,24 +119,19 @@ newSearchBonjour = function (pluginType, plugin) {
addresses: validAddresses,
});
});
};
newSearchTCP = function (pluginType, plugin) {
function searchTCP(pluginType, plugin) {
for (let i = 0; i < allServers.length; i++) {
TCPtest(allServers[i], pluginType, plugin);
}
};
TCPtest = function (ip, pluginType, plugin) {
const client = net.createConnection(plugin.searchOptions.testPort, ip, () => {
function TCPtest(ipAddr, pluginType, plugin) {
const client = net.createConnection(plugin.searchOptions.testPort, ipAddr, () => {
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)) {
@@ -149,7 +139,7 @@ TCPtest = function (ip, pluginType, plugin) {
type: pluginType,
defaultName: plugin.defaultName,
port: plugin.defaultPort,
addresses: [ip],
addresses: [ipAddr],
});
}
client.end();
@@ -159,47 +149,8 @@ TCPtest = function (ip, pluginType, plugin) {
});
};
findOnlineDevices = function () {
const allInterfaces = os.networkInterfaces();
const validInterfaces = [];
for (let i in allInterfaces) {
for (let j = 0; j < allInterfaces[i].length; j++) {
const iface = allInterfaces[i][j];
if (
iface.family == 'IPv4' &&
iface.internal == false &&
iface.address.split('.')[0] != '169'
) {
validInterfaces.push(iface);
}
}
}
for (let i = 0; i < validInterfaces.length; i++) {
const block = new Netmask(validInterfaces[i].cidr);
const f = block.first.split('.');
const l = block.last.split('.');
const cur = [f[0], f[1], f[2], f[3]];
for (let j = Number(f[2]); j <= Number(l[2]); j++) {
cur[2] = j;
for (let k = Number(f[3]); k < Number(l[3]); k++) {
cur[3] = k;
allIPs.push(`${cur[0]}.${cur[1]}.${cur[2]}.${cur[3]}`);
}
}
}
};
//const pjLinkMessage = Buffer.from([0x25, 0x32, 0x53, 0x52, 0x43, 0x48, 0x0d]);
//const xAirMessage = Buffer.from([0x2f, 0x78, 0x69, 0x6e, 0x66, 0x6f]);
//const serverUDP = dgram.createSocket('udp4');
//const serverUDP2 = dgram.createSocket('udp4');
newSearchUDP = function (pluginType, plugin) {
function searchUDP(pluginType, plugin) {
const i = searchSockets.push(dgram.createSocket('udp4')) - 1;
searchSockets[i].bind(plugin.searchOptions.listenPort, () => {
@@ -260,8 +211,8 @@ newSearchUDP = function (pluginType, plugin) {
};
newSearchMulticast = function (pluginType, plugin) {
let socket = dgram.createSocket('udp4');
function searchMulticast(pluginType, plugin) {
const socket = dgram.createSocket('udp4');
socket.on('message', (msg, info) => {
if (plugin.searchOptions.validateResponse(msg, info)) {
socket.close();
@@ -273,7 +224,7 @@ newSearchMulticast = function (pluginType, plugin) {
});
}
});
socket.bind(plugin.searchOptions.port, function(){
socket.bind(plugin.searchOptions.port, () => {
socket.addMembership(plugin.searchOptions.address);
});
}
src/view.js
+119 -139
View File
@@ -7,11 +7,12 @@ const pinnedDevices = [];
module.exports.pinnedDevices = pinnedDevices;
let activeDevice = false;
module.exports.init = function () {
module.exports.init = function init() {
populatePluginLists();
};
drawDeviceFrame = function (id) {
function drawDeviceFrame(id) {
const $deviceDrawArea = document.getElementById(`device-${id}-draw-area`);
const $devicePinned = document.getElementById(`device-${id}-pinned`);
@@ -20,10 +21,10 @@ drawDeviceFrame = function (id) {
return true;
}
d = DEVICE.all[id];
const d = DEVICE.all[id];
let str = '<html><head>';
str += "<link href='./plugins/" +d.type +"/styles.css' rel='stylesheet' type='text/css'>";
str += `<link href='./plugins/${d.type}/styles.css' rel='stylesheet' type='text/css'>`;
// scrollbar styles are inline to prevent the styles flickering in
str += '<style>';
@@ -56,14 +57,15 @@ drawDeviceFrame = function (id) {
$devicePinned.style.display = 'none';
}
return true;
};
generateBodyHTML = function(d){
function generateBodyHTML(d){
let str = "";
if (d.status == 'ok') {
if (d.status === 'ok') {
try {
str += PLUGINS.all[d.type].template({
@@ -75,258 +77,236 @@ generateBodyHTML = function(d){
str += '<h3>Plugin Template Error</h3>';
}
} else {
str += '<header><h1>' + (d.displayName || d.defaultName) + d.status + '</h1></header>';
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>';
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>`;
str += '<hr></div>';
str += '<div class="device-info">'+PLUGINS.all[d.type].info()+'<div>';
str += `<div class="device-info">${PLUGINS.all[d.type].info()}<div>`;
}
return str;
}
module.exports.draw = function (device) {
module.exports.draw = function draw(device) {
let $deviceDrawArea = document.getElementById(`device-${device.id}-draw-area`);
const d = device;
const $deviceDrawArea = document.getElementById(`device-${d.id}-draw-area`);
if($deviceDrawArea){
const scriptEl = $deviceDrawArea.contentWindow.document.createRange().createContextualFragment(generateBodyHTML(device));
const scriptEl = $deviceDrawArea.contentWindow.document.createRange().createContextualFragment(generateBodyHTML(d));
$deviceDrawArea.contentWindow.document.body.replaceChildren(scriptEl);
}else{
drawDeviceFrame(device.id);
drawDeviceFrame(d.id);
}
device.drawn = true;
d.drawn = true;
};
module.exports.update = function(device, type, data){
let doc = document.getElementById(`device-${device.id}-draw-area`);
module.exports.update = function update(device, type, data){
const doc = document.getElementById(`device-${device.id}-draw-area`);
if(doc){
PLUGINS.all[device.type].update(device, doc.contentWindow.document, type, data);
}
}
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') {
module.exports.addDeviceToList = function addDeviceToList(device) {
const d = device;
let html = '';
if (d.status === 'ok') {
html += "<div class='status material-icons green'>done</div>";
} else if (d.status == 'refresh') {
} 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);
html += `<div class='type'><img height='18px' src='plugins/${d.type}/icon.png'></div>`;
html += `<div class='name'>${d.displayName || d.defaultName}</div>`;
const elem = document.getElementById(d.id);
if (elem == null) {
document
.getElementById('device-list')
.insertAdjacentHTML(
'beforeend',
"<a class='device' id='" + d.id + "'>" + html + '</a>'
);
.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();
module.exports.removeDeviceFromList = function removeDeviceFromList(device) {
const d = device;
document.getElementById(d.id).remove();
};
function switchDevice(id) {
if (activeDevice && activeDevice.pinIndex === false) {
document.getElementById(`device-${activeDevice.id}`).remove();
activeDevice = false;
}
activeDevice = DEVICE.all[id];
var cols = 1;
let cols = 1;
if (pinnedDevices.length > 0) {
cols += pinnedDevices.length;
}
if (pinnedDevices.indexOf(activeDevice) >= 0 || id == undefined) {
if (pinnedDevices.indexOf(activeDevice) >= 0 || id === undefined) {
cols--;
}
document.getElementById('all-devices').style.gridTemplateColumns =
'repeat(' + cols + ', 1fr)';
document.getElementById('all-devices').style.gridTemplateColumns = `repeat(${cols}, 1fr)`;
if (id == undefined) {
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;
return;
}
var i = DEVICE.all[id].id;
document.getElementById('refresh-device-button').disabled = false;
// document.getElementById('refresh-device-button').style.opacity = 1;
const i = DEVICE.all[id].id;
let $deviceWrapper = document.getElementById(`device-${i}`);
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>`;
document
.getElementById('all-devices')
.insertAdjacentHTML('afterbegin', html);
const 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>`;
document.getElementById('all-devices').insertAdjacentHTML('afterbegin', html);
$deviceWrapper = document.getElementById(`device-${i}`);
}
switchClass(document.getElementById(id), 'active-device');
window.switchClass(document.getElementById(id), 'active-device');
drawDeviceFrame(id);
switchClass(document.getElementById(`device-${id}`), 'active-device-outline');
window.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;
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);
ipcRenderer.send('setDevicePin', !DEVICE.all[id].pinIndex === false);
};
module.exports.switchDevice = switchDevice;
module.exports.getActiveDevice = function () {
module.exports.getActiveDevice = function getActiveDevice() {
return activeDevice;
};
module.exports.pinActiveDevice = function () {
if (activeDevice == undefined) {
return true;
module.exports.pinActiveDevice = function pinActiveDevice() {
if (activeDevice === undefined) {
return;
}
if (pinnedDevices.indexOf(DEVICE.all[activeDevice.id]) == -1) {
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;
module.exports.unpinActiveDevice = function unpinActiveDevice() {
if (activeDevice === undefined) {
return;
}
pinnedDevices.splice(pinnedDevices.indexOf(DEVICE.all[activeDevice.id]), 1);
DEVICE.changeActivePinIndex(false);
};
module.exports.pinDevice = function (device) {
module.exports.pinDevice = function pinDevice(device) {
pinnedDevices.push(device);
DEVICE.changePinIndex(device, true);
};
module.exports.unpinDevice = function (device) {
module.exports.unpinDevice = function unpinDevice(device) {
pinnedDevices.push(device);
DEVICE.changePinIndex(device, false);
};
module.exports.resetPinned = function () {
module.exports.resetPinned = function resetPinned() {
pinnedDevices.length = 0;
activeDevice = false;
// switchDevice();
try {
document
.querySelector('#device-list .active-device')
.classList.remove('active-device');
} catch (err) {}
} catch (err) {
//
}
document.getElementById('all-devices').innerHTML = '';
};
module.exports.getPinnedDevices = function () {
module.exports.getPinnedDevices = function getPinnedDevices() {
return pinnedDevices;
};
module.exports.toggleSlotButtons = function (slotIndex) {
if (slotIndex == 1) {
module.exports.toggleSlotButtons = function toggleSlotButtons(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) {
} 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) {
} 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;
module.exports.selectPreviousDevice = function selectPreviousDevice() {
if (activeDevice === undefined) {
return;
}
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);
const keys = Object.keys(DEVICE.all);
const prevIndex = Math.max(0, 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>';
module.exports.selectNextDevice = function selectNextDevice() {
if (activeDevice === undefined) {
return;
}
const keys = Object.keys(DEVICE.all);
const prevIndex = Math.min(keys.length - 1, keys.indexOf(activeDevice.id) + 1);
switchDevice(keys[prevIndex]);
};
document.getElementById('device-settings-plugin-dropdown').innerHTML =
typeSelect;
function populatePluginLists() {
let typeSelect = '';
let addSelect = '<option value="" disabled selected hidden>+</option>';
Object.keys(PLUGINS.all).forEach((pluginType) => {
const 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);
};
}