Use 98.css to style app. Add logging to mock mode.

This commit is contained in:
mmcwilliams 2024-07-31 15:07:09 -04:00
parent 169940a83e
commit 38c61e78cb
7 changed files with 82 additions and 49 deletions

View File

@ -7,6 +7,7 @@ export declare class Camera {
private baud; private baud;
private next; private next;
private port; private port;
private prefix;
constructor(); constructor();
private begin; private begin;
private filter; private filter;

50
dist/camera/index.js vendored
View File

@ -24,7 +24,7 @@ class CameraSerialPortMock extends serialport_1.SerialPortMock {
} }
write(buffer) { write(buffer) {
super.write(buffer); super.write(buffer);
//this.log.info(`Received data: "${buffer}"`); //this.log.info(this.prefix + `Received data: "${buffer}"`);
switch (buffer) { switch (buffer) {
case Commands.CONNECT: case Commands.CONNECT:
this._mockSend(Commands.CONNECT, 3); this._mockSend(Commands.CONNECT, 3);
@ -45,7 +45,7 @@ class CameraSerialPortMock extends serialport_1.SerialPortMock {
this._mockSend(Commands.CAMERA_BACKWARD, 2); this._mockSend(Commands.CAMERA_BACKWARD, 2);
break; break;
default: default:
this.log.warn(`Command "${buffer}" does not exist on mock`); this.log.warn(`[MOCK] Command "${buffer}" does not exist on mock`);
} }
return true; return true;
} }
@ -63,6 +63,7 @@ class Camera {
this.baud = 57600; this.baud = 57600;
this.next = null; this.next = null;
this.port = null; this.port = null;
this.prefix = '';
this.log = (0, log_1.createLog)('camera'); this.log = (0, log_1.createLog)('camera');
this.parser = new parser_readline_1.ReadlineParser({ delimiter: '\r\n' }); this.parser = new parser_readline_1.ReadlineParser({ delimiter: '\r\n' });
this.begin(); this.begin();
@ -74,27 +75,27 @@ class Camera {
ports = await this.enumerate(); ports = await this.enumerate();
} }
catch (err) { catch (err) {
this.log.error('Error calling enumerate()', err); this.log.error(this.prefix + 'Error calling enumerate()', err);
} }
if (ports.length > 0) { if (ports.length > 0) {
for (let port of ports) { for (let port of ports) {
this.log.info(`Found USB serial device: ${port} ${selected ? '*' : ''}`); this.log.info(this.prefix + `Found USB serial device: ${port} ${selected ? '*' : ''}`);
selected = false; selected = false;
} }
try { try {
await this.connect(ports[0]); await this.connect(ports[0]);
} }
catch (err) { catch (err) {
this.log.error(`Error connecting to ${ports[0]}`, err); this.log.error(this.prefix + `Error connecting to ${ports[0]}`, err);
} }
} }
else { else {
this.log.warn(`No USB serial devices found, connecting to MOCK...`); this.log.warn(this.prefix + `No USB serial devices found, connecting to MOCK...`);
try { try {
await this.connectMock(); await this.connectMock();
} }
catch (err) { catch (err) {
this.log.error(`Error connecting to MOCK USB serial device "/dev/fake"`, err); this.log.error(this.prefix + `Error connecting to MOCK USB serial device "/dev/fake"`, err);
} }
} }
await (0, delay_1.delay)(3000); await (0, delay_1.delay)(3000);
@ -115,7 +116,7 @@ class Camera {
listed = await serialport_1.SerialPort.list(); listed = await serialport_1.SerialPort.list();
} }
catch (err) { catch (err) {
this.log.error('Error listing serial ports', err); this.log.error(this.prefix + 'Error listing serial ports', err);
} }
return listed.filter(this.filter).map((port) => port.path); return listed.filter(this.filter).map((port) => port.path);
} }
@ -128,7 +129,7 @@ class Camera {
}); });
} }
catch (err) { catch (err) {
this.log.error('Error creating SerialPort object', err); this.log.error(this.prefix + 'Error creating SerialPort object', err);
return; return;
} }
if (this.serial !== null) { if (this.serial !== null) {
@ -137,7 +138,7 @@ class Camera {
} }
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
this.serial.on('open', () => { this.serial.on('open', () => {
this.log.info(`Connected to USB serial device ${this.port} @ ${this.baud} baud`); this.log.info(this.prefix + `Connected to USB serial device ${this.port} @ ${this.baud} baud`);
this.connected = true; this.connected = true;
return resolve(true); return resolve(true);
}); });
@ -153,7 +154,7 @@ class Camera {
}, null, this.parser); }, null, this.parser);
} }
catch (err) { catch (err) {
this.log.error('Error creating SerialPortMock object', err); this.log.error(this.prefix + 'Error creating SerialPortMock object', err);
return; return;
} }
if (this.serial !== null) { if (this.serial !== null) {
@ -162,14 +163,15 @@ class Camera {
} }
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
this.serial.on('open', () => { this.serial.on('open', () => {
this.log.info(`Connected to MOCK USB serial device ${this.port} @ ${this.baud} baud`); this.prefix = '[MOCK] ';
this.log.info(this.prefix + `Connected to MOCK USB serial device ${this.port} @ ${this.baud} baud`);
this.connected = true; this.connected = true;
return resolve(true); return resolve(true);
}); });
}.bind(this)); }.bind(this));
} }
onData(data) { onData(data) {
this.log.info(`Received data: "${data}"`); this.log.info(this.prefix + `Received data: "${data}"`);
if (this.next !== null) { if (this.next !== null) {
this.next(data); this.next(data);
} }
@ -177,22 +179,22 @@ class Camera {
async verify() { async verify() {
try { try {
await this.confirm(Commands.CONNECT, Commands.CONNECT); await this.confirm(Commands.CONNECT, Commands.CONNECT);
this.log.info(`Confirmed mcopy device`); this.log.info(this.prefix + `Confirmed mcopy device`);
} }
catch (err) { catch (err) {
this.log.error(`Error connecting to mcopy device`, err); this.log.error(this.prefix + `Error connecting to mcopy device`, err);
return; return;
} }
try { try {
await this.confirm(Commands.MCOPY_IDENTIFIER, Commands.CAMERA_IDENTIFIER); await this.confirm(Commands.MCOPY_IDENTIFIER, Commands.CAMERA_IDENTIFIER);
this.log.info(`Confirmed mcopy camera`); this.log.info(this.prefix + `Confirmed mcopy camera`);
} }
catch (err) { catch (err) {
this.log.error(`Error identifying device`, err); this.log.error(this.prefix + `Error identifying device`, err);
return; return;
} }
this.ready = true; this.ready = true;
this.log.info(`Camera connected and ready`); this.log.info(this.prefix + `Camera connected and ready`);
} }
async confirm(cmd, res) { async confirm(cmd, res) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
@ -205,10 +207,10 @@ class Camera {
return reject(new Error(`Response ${data} !== ${res}`)); return reject(new Error(`Response ${data} !== ${res}`));
} }
}.bind(this); }.bind(this);
this.log.info(`Send data: "${cmd}"`); this.log.info(this.prefix + `Send data: "${cmd}"`);
this.serial.write(cmd, (err, results) => { this.serial.write(cmd, (err, results) => {
if (err) { if (err) {
this.log.error('Error writing to device', err); this.log.error(this.prefix + 'Error writing to device', err);
return reject(err); return reject(err);
} }
}); });
@ -219,7 +221,7 @@ class Camera {
let ms; let ms;
await this.confirm(Commands.CAMERA, Commands.CAMERA); await this.confirm(Commands.CAMERA, Commands.CAMERA);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`frame() - ${ms}ms`); this.log.info(this.prefix + `frame() - ${ms}ms`);
return ms; return ms;
} }
async open() { async open() {
@ -227,7 +229,7 @@ class Camera {
let ms; let ms;
await this.confirm(Commands.CAMERA_OPEN, Commands.CAMERA_OPEN); await this.confirm(Commands.CAMERA_OPEN, Commands.CAMERA_OPEN);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`open() - ${ms}ms`); this.log.info(this.prefix + `open() - ${ms}ms`);
return ms; return ms;
} }
async close() { async close() {
@ -235,7 +237,7 @@ class Camera {
let ms; let ms;
await this.confirm(Commands.CAMERA_CLOSE, Commands.CAMERA_CLOSE); await this.confirm(Commands.CAMERA_CLOSE, Commands.CAMERA_CLOSE);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`close() - ${ms}ms`); this.log.info(this.prefix + `close() - ${ms}ms`);
return ms; return ms;
} }
async direction(dir) { async direction(dir) {
@ -244,7 +246,7 @@ class Camera {
const cmd = dir ? Commands.CAMERA_FORWARD : Commands.CAMERA_BACKWARD; const cmd = dir ? Commands.CAMERA_FORWARD : Commands.CAMERA_BACKWARD;
await this.confirm(cmd, cmd); await this.confirm(cmd, cmd);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`direction(${dir}) - ${ms}ms`); this.log.info(this.prefix + `direction(${dir}) - ${ms}ms`);
return ms; return ms;
} }
} }

File diff suppressed because one or more lines are too long

View File

@ -38,7 +38,7 @@ class CameraSerialPortMock extends SerialPortMock {
write (buffer : any) : boolean { write (buffer : any) : boolean {
super.write(buffer) super.write(buffer)
//this.log.info(`Received data: "${buffer}"`); //this.log.info(this.prefix + `Received data: "${buffer}"`);
switch (buffer) { switch (buffer) {
case Commands.CONNECT : case Commands.CONNECT :
this._mockSend(Commands.CONNECT, 3); this._mockSend(Commands.CONNECT, 3);
@ -59,7 +59,7 @@ class CameraSerialPortMock extends SerialPortMock {
this._mockSend(Commands.CAMERA_BACKWARD, 2); this._mockSend(Commands.CAMERA_BACKWARD, 2);
break; break;
default: default:
this.log.warn(`Command "${buffer}" does not exist on mock`); this.log.warn(`[MOCK] Command "${buffer}" does not exist on mock`);
} }
return true; return true;
} }
@ -80,6 +80,7 @@ export class Camera {
private baud : number = 57600; private baud : number = 57600;
private next : Function = null; private next : Function = null;
private port : string = null; private port : string = null;
private prefix : string = '';
constructor () { constructor () {
this.log = createLog('camera'); this.log = createLog('camera');
@ -93,24 +94,24 @@ export class Camera {
try { try {
ports = await this.enumerate(); ports = await this.enumerate();
} catch (err) { } catch (err) {
this.log.error('Error calling enumerate()', err); this.log.error(this.prefix + 'Error calling enumerate()', err);
} }
if (ports.length > 0) { if (ports.length > 0) {
for (let port of ports) { for (let port of ports) {
this.log.info(`Found USB serial device: ${port} ${selected ? '*' : ''}`); this.log.info(this.prefix + `Found USB serial device: ${port} ${selected ? '*' : ''}`);
selected = false; selected = false;
} }
try { try {
await this.connect(ports[0]); await this.connect(ports[0]);
} catch (err) { } catch (err) {
this.log.error(`Error connecting to ${ports[0]}`, err); this.log.error(this.prefix + `Error connecting to ${ports[0]}`, err);
} }
} else { } else {
this.log.warn(`No USB serial devices found, connecting to MOCK...`) this.log.warn(this.prefix + `No USB serial devices found, connecting to MOCK...`)
try { try {
await this.connectMock(); await this.connectMock();
} catch (err) { } catch (err) {
this.log.error(`Error connecting to MOCK USB serial device "/dev/fake"`, err); this.log.error(this.prefix + `Error connecting to MOCK USB serial device "/dev/fake"`, err);
} }
} }
await delay(3000); await delay(3000);
@ -132,7 +133,7 @@ export class Camera {
try { try {
listed = await SerialPort.list(); listed = await SerialPort.list();
} catch (err) { } catch (err) {
this.log.error('Error listing serial ports', err); this.log.error(this.prefix + 'Error listing serial ports', err);
} }
return listed.filter(this.filter).map((port : PortInfo) => port.path); return listed.filter(this.filter).map((port : PortInfo) => port.path);
} }
@ -145,7 +146,7 @@ export class Camera {
baudRate: this.baud, baudRate: this.baud,
}); });
} catch (err) { } catch (err) {
this.log.error('Error creating SerialPort object', err); this.log.error(this.prefix + 'Error creating SerialPort object', err);
return; return;
} }
if (this.serial !== null) { if (this.serial !== null) {
@ -155,7 +156,7 @@ export class Camera {
return new Promise(function (resolve : Function, reject : Function) { return new Promise(function (resolve : Function, reject : Function) {
this.serial.on('open', () => { this.serial.on('open', () => {
this.log.info(`Connected to USB serial device ${this.port} @ ${this.baud} baud`); this.log.info(this.prefix + `Connected to USB serial device ${this.port} @ ${this.baud} baud`);
this.connected = true; this.connected = true;
return resolve(true); return resolve(true);
}); });
@ -171,7 +172,7 @@ export class Camera {
baudRate: this.baud baudRate: this.baud
}, null, this.parser); }, null, this.parser);
} catch (err) { } catch (err) {
this.log.error('Error creating SerialPortMock object', err); this.log.error(this.prefix + 'Error creating SerialPortMock object', err);
return; return;
} }
if (this.serial !== null) { if (this.serial !== null) {
@ -180,7 +181,8 @@ export class Camera {
} }
return new Promise(function (resolve : Function, reject : Function) { return new Promise(function (resolve : Function, reject : Function) {
this.serial.on('open', () => { this.serial.on('open', () => {
this.log.info(`Connected to MOCK USB serial device ${this.port} @ ${this.baud} baud`); this.prefix = '[MOCK] ';
this.log.info(this.prefix + `Connected to MOCK USB serial device ${this.port} @ ${this.baud} baud`);
this.connected = true; this.connected = true;
return resolve(true); return resolve(true);
}); });
@ -188,7 +190,7 @@ export class Camera {
} }
private onData (data : string) { private onData (data : string) {
this.log.info(`Received data: "${data}"`); this.log.info(this.prefix + `Received data: "${data}"`);
if (this.next !== null) { if (this.next !== null) {
this.next(data); this.next(data);
} }
@ -197,20 +199,20 @@ export class Camera {
private async verify () { private async verify () {
try { try {
await this.confirm(Commands.CONNECT, Commands.CONNECT); await this.confirm(Commands.CONNECT, Commands.CONNECT);
this.log.info(`Confirmed mcopy device`); this.log.info(this.prefix + `Confirmed mcopy device`);
} catch (err) { } catch (err) {
this.log.error(`Error connecting to mcopy device`, err); this.log.error(this.prefix + `Error connecting to mcopy device`, err);
return; return;
} }
try { try {
await this.confirm(Commands.MCOPY_IDENTIFIER, Commands.CAMERA_IDENTIFIER); await this.confirm(Commands.MCOPY_IDENTIFIER, Commands.CAMERA_IDENTIFIER);
this.log.info(`Confirmed mcopy camera`); this.log.info(this.prefix + `Confirmed mcopy camera`);
} catch (err) { } catch (err) {
this.log.error(`Error identifying device`, err); this.log.error(this.prefix + `Error identifying device`, err);
return; return;
} }
this.ready = true; this.ready = true;
this.log.info(`Camera connected and ready`); this.log.info(this.prefix + `Camera connected and ready`);
} }
private async confirm (cmd : string, res : string) : Promise<boolean> { private async confirm (cmd : string, res : string) : Promise<boolean> {
@ -223,10 +225,10 @@ export class Camera {
return reject(new Error(`Response ${data} !== ${res}`)); return reject(new Error(`Response ${data} !== ${res}`));
} }
}.bind(this); }.bind(this);
this.log.info(`Send data: "${cmd}"`); this.log.info(this.prefix + `Send data: "${cmd}"`);
this.serial.write(cmd, (err : any, results : any) => { this.serial.write(cmd, (err : any, results : any) => {
if (err) { if (err) {
this.log.error('Error writing to device', err); this.log.error(this.prefix + 'Error writing to device', err);
return reject(err); return reject(err);
} }
}); });
@ -238,7 +240,7 @@ export class Camera {
let ms : number; let ms : number;
await this.confirm(Commands.CAMERA, Commands.CAMERA); await this.confirm(Commands.CAMERA, Commands.CAMERA);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`frame() - ${ms}ms`); this.log.info(this.prefix + `frame() - ${ms}ms`);
return ms; return ms;
} }
@ -247,7 +249,7 @@ export class Camera {
let ms : number; let ms : number;
await this.confirm(Commands.CAMERA_OPEN, Commands.CAMERA_OPEN); await this.confirm(Commands.CAMERA_OPEN, Commands.CAMERA_OPEN);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`open() - ${ms}ms`); this.log.info(this.prefix + `open() - ${ms}ms`);
return ms; return ms;
} }
@ -256,7 +258,7 @@ export class Camera {
let ms : number; let ms : number;
await this.confirm(Commands.CAMERA_CLOSE, Commands.CAMERA_CLOSE); await this.confirm(Commands.CAMERA_CLOSE, Commands.CAMERA_CLOSE);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`close() - ${ms}ms`); this.log.info(this.prefix + `close() - ${ms}ms`);
return ms; return ms;
} }
@ -266,7 +268,7 @@ export class Camera {
const cmd : string = dir ? Commands.CAMERA_FORWARD : Commands.CAMERA_BACKWARD; const cmd : string = dir ? Commands.CAMERA_FORWARD : Commands.CAMERA_BACKWARD;
await this.confirm(cmd, cmd); await this.confirm(cmd, cmd);
ms = (+new Date()) - start; ms = (+new Date()) - start;
this.log.info(`direction(${dir}) - ${ms}ms`); this.log.info(this.prefix + `direction(${dir}) - ${ms}ms`);
return ms; return ms;
} }
} }

2
static/css/98.min.css vendored Normal file

File diff suppressed because one or more lines are too long

10
static/css/style.css Normal file
View File

@ -0,0 +1,10 @@
html, body{
margin: 0px;
padding: 0px;
background: black;
}
#main{
width: 99vw;
height: 99vh;
}

View File

@ -2,8 +2,22 @@
<html> <html>
<head> <head>
<title>Filmout Manager</title> <title>Filmout Manager</title>
<link rel="stylesheet" href="/static/css/98.min.css" />
<link rel="stylesheet" href="/static/css/style.css" />
</head> </head>
<body> <body>
<div class="window" id="main">
<div class="title-bar">
<div class="title-bar-text">
Filmout Manager
</div>
<div class="title-bar-controls">
<button aria-label="Minimize"></button>
<button aria-label="Maximize"></button>
<button aria-label="Close"></button>
</div>
</div>
<div class="window-body">
<div>Screen Resolution : {{width}}x{{height}}</div> <div>Screen Resolution : {{width}}x{{height}}</div>
<!-- <!--
<select name="video" id="video"> <select name="video" id="video">
@ -20,6 +34,8 @@
{{/each}} {{/each}}
</select> </select>
<button id="open" onclick="client.cameraOpen()">Open Gate</button> <button id="open" onclick="client.cameraOpen()">Open Gate</button>
</div>
</div>
<script src="/static/js/index.js"></script> <script src="/static/js/index.js"></script>
</body> </body>
</html> </html>