Add changes from laptop, conflicted work

browser/index.ts

@@ -1,21 +1,45 @@
+interface SequenceState {
+  name : string,
+  hash : string,
+  progress : number
+}
+
+interface State {
+  width? : number,
+  height? : number,
+  sequence? : SequenceState
+}
+
 class Client {
   private client : WebSocket;
   private connected : boolean = false;
+  private progress : HTMLProgressElement;
+
   constructor () {
     let uri : string = 'ws://localhost:8082';
+    this.progress = document.getElementById('progress') as HTMLProgressElement;
     this.client = new WebSocket(uri);
     this.client.onopen = this.onOpen.bind(this);
     this.client.onmessage = this.onMessage.bind(this);
   }
 
   private onMessage (event : any) {
-    console.log(event.data);
+    const state : State = JSON.parse(event.data) as State;
+    if (typeof state.sequence !== 'undefined' && state.sequence !== null) {
+      this.setSequence(state.sequence);
+    }
   }
 
   private onOpen (event : any) {
     console.log('Connected');
     this.connected = true;
   }
+
+  private setSequence(sequence : SequenceState) {
+    const percent : number = sequence.progress * 100.0;
+    this.progress.value = percent;
+    this.progress.innerText = `${Math.floor(percent)}%`;
+  }
 }
 
 new Client();

dist/display/index.d.ts

@@ -0,0 +1,10 @@
+import type { fdOutgoingPosition } from '../fd';
+export declare class Display {
+    private screen;
+    private source;
+    private display;
+    private offset;
+    constructor(width: number, height: number);
+    setSource(width: number, height: number): void;
+    getDimensions(): fdOutgoingPosition;
+}

dist/display/index.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Display = void 0;
+class Dimensions {
+    constructor(width, height) {
+        this.width = width;
+        this.height = height;
+    }
+    getRatio() {
+        return this.width / this.height;
+    }
+}
+class Display {
+    constructor(width, height) {
+        this.screen = new Dimensions(width, height);
+        this.offset = { x: 0, y: 0 };
+    }
+    setSource(width, height) {
+        this.source = new Dimensions(width, height);
+        if (this.source.getRatio() > this.screen.getRatio()) {
+            this.display = new Dimensions(this.source.getRatio() * this.screen.height, this.screen.height);
+        }
+        else {
+            this.display = new Dimensions(this.screen.width, this.source.width / this.source.getRatio());
+        }
+        this.offset = { x: Math.round(this.display.width), y: 0 };
+    }
+    getDimensions() {
+        return {
+            w: this.display.width,
+            h: this.display.height,
+            x: this.offset.x,
+            y: this.offset.y
+        };
+    }
+}
+exports.Display = Display;
+module.exports = { Display };
+//# sourceMappingURL=index.js.map

dist/display/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/display/index.ts"],"names":[],"mappings":";;;AAEA,MAAM,UAAU;IAIf,YAAa,KAAc,EAAE,MAAe;QAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACtB,CAAC;IAEM,QAAQ;QACd,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC;IACjC,CAAC;CACD;AAOD,MAAa,OAAO;IAQnB,YAAa,KAAc,EAAE,MAAe;QAC3C,IAAI,CAAC,MAAM,GAAG,IAAI,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAC5C,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAG,CAAC,EAAE,CAAA;IAC9B,CAAC;IAEM,SAAS,CAAE,KAAc,EAAE,MAAe;QAChD,IAAI,CAAC,MAAM,GAAG,IAAI,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAC5C,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,CAAC;YACrD,IAAI,CAAC,OAAO,GAAG,IAAI,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAChG,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,OAAO,GAAG,IAAI,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC9F,CAAC;QAEE,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAG,CAAC,EAAG,CAAC,EAAE,CAAA;IAC/D,CAAC;IAEM,aAAa;QACnB,OAAO;YACN,CAAC,EAAG,IAAI,CAAC,OAAO,CAAC,KAAK;YACtB,CAAC,EAAG,IAAI,CAAC,OAAO,CAAC,MAAM;YACvB,CAAC,EAAG,IAAI,CAAC,MAAM,CAAC,CAAC;YACjB,CAAC,EAAG,IAAI,CAAC,MAAM,CAAC,CAAC;SACjB,CAAA;IACF,CAAC;CACD;AAhCD,0BAgCC;AAED,MAAM,CAAC,OAAO,GAAG,EAAE,OAAO,EAAE,CAAC"}

dist/fd/index.d.ts

@@ -12,25 +12,25 @@ declare enum Mode {
     RGB_CHANNELS = 4,
     INVERT_CHANNELS = 5
 }
-export interface fdOutgoingPosition {
+interface fdOutgoingPosition {
     x: number;
     y: number;
     w: number;
     h: number;
 }
-export interface fdOutgoingMessage {
+interface fdOutgoingMessage {
     action: Action;
     image: string;
     mode?: Mode;
     position?: fdOutgoingPosition;
     exposure?: number[];
 }
-export interface fdIncomingMessage {
+interface fdIncomingMessage {
     action: Action;
     success: boolean;
     error?: string;
 }
-export interface fdResult {
+interface fdResult {
     action: Action;
     image: string;
     time: number;
@@ -60,4 +60,4 @@ export declare class FD {
     isConnected(): boolean;
     private test;
 }
-export {};
+export type { Action, Mode, fdOutgoingPosition, fdOutgoingMessage, fdIncomingMessage, fdResult };

dist/fd/index.js

@@ -198,4 +198,5 @@ class FD {
     }
 }
 exports.FD = FD;
+module.exports = { FD };
 //# sourceMappingURL=index.js.map

dist/sequence/index.d.ts

@@ -0,0 +1,17 @@
+interface SequenceState {
+    hash: string;
+    name: string;
+    progress: number;
+}
+export declare class Sequence {
+    private current;
+    private running;
+    private progress;
+    private frames;
+    constructor();
+    start(): void;
+    stop(): void;
+    isRunning(): boolean;
+    getState(): SequenceState;
+}
+export type { SequenceState };

dist/sequence/index.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Sequence = void 0;
+class Sequence {
+    constructor() {
+        this.current = null;
+    }
+    start() {
+        this.running = true;
+    }
+    stop() {
+        this.running = false;
+    }
+    isRunning() {
+        return this.running;
+    }
+    getState() {
+        return {
+            hash: this.current.hash,
+            name: this.current.name,
+            progress: this.progress
+        };
+    }
+}
+exports.Sequence = Sequence;
+//# sourceMappingURL=index.js.map

dist/sequence/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/sequence/index.ts"],"names":[],"mappings":";;;AAQA,MAAa,QAAQ;IAMpB;QALQ,YAAO,GAAoB,IAAI,CAAC;IAKxB,CAAC;IAEV,KAAK;QACX,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACrB,CAAC;IAEM,IAAI;QACV,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACtB,CAAC;IAEM,SAAS;QACf,OAAO,IAAI,CAAC,OAAO,CAAC;IACrB,CAAC;IAEM,QAAQ;QACd,OAAO;YACN,IAAI,EAAG,IAAI,CAAC,OAAO,CAAC,IAAI;YACxB,IAAI,EAAG,IAAI,CAAC,OAAO,CAAC,IAAI;YACxB,QAAQ,EAAG,IAAI,CAAC,QAAQ;SACxB,CAAA;IACF,CAAC;CACD;AA3BD,4BA2BC"}

src/display/index.ts

@@ -0,0 +1,55 @@
+import type { fdOutgoingPosition } from '../fd';
+
+class Dimensions {
+	public width : number;
+	public height : number;
+
+	constructor (width : number, height : number) {
+		this.width = width;
+		this.height = height;
+	}
+
+	public getRatio () : number {
+		return this.width / this.height;
+	}
+}
+
+interface Offset {
+	x : number;
+	y : number;
+}
+
+export class Display {
+
+	private screen : Dimensions;
+	private source : Dimensions;
+
+	private display : Dimensions;
+	private offset : Offset;
+
+	constructor (width : number, height : number) {
+		this.screen = new Dimensions(width, height);
+		this.offset = { x: 0, y : 0 }
+	}
+
+	public setSource (width : number, height : number) {
+		this.source = new Dimensions(width, height);
+		if (this.source.getRatio() > this.screen.getRatio()) {
+			this.display = new Dimensions(this.source.getRatio() * this.screen.height, this.screen.height);
+		} else {
+			this.display = new Dimensions(this.screen.width, this.source.width / this.source.getRatio());
+		}
+		this.offset = { x: Math.round(this.display.width),  y : 0 }
+	}
+
+	public getDimensions () : fdOutgoingPosition {
+		return {
+			w : this.display.width,
+			h : this.display.height,
+			x : this.offset.x,
+			y : this.offset.y
+		}
+	}
+}
+
+module.exports = { Display };

src/fd/index.ts

@@ -21,14 +21,14 @@ enum Mode {
 	INVERT_CHANNELS
 }
 
-export interface fdOutgoingPosition {
+interface fdOutgoingPosition {
 	x : number,
 	y : number,
 	w : number,
 	h : number
 }
 
-export interface fdOutgoingMessage {
+interface fdOutgoingMessage {
 	action : Action,
 	image : string,
 	mode? : Mode,
@@ -36,13 +36,13 @@ export interface fdOutgoingMessage {
 	exposure? : number[]
 }
 
-export interface fdIncomingMessage {
+interface fdIncomingMessage {
 	action : Action,
 	success : boolean,
 	error? : string
 }
 
-export interface fdResult {
+interface fdResult {
 	action : Action,
 	image : string,
 	time : number
@@ -248,3 +248,6 @@ export class FD {
 	}
 }
 
+module.exports = { FD };
+
+export type { Action, Mode, fdOutgoingPosition, fdOutgoingMessage, fdIncomingMessage, fdResult };

src/sequence/index.ts

@@ -0,0 +1,38 @@
+import type { SequenceObject } from '../files';
+
+interface SequenceState {
+	hash : string,
+	name : string,
+	progress : number
+}
+
+export class Sequence {
+	private current : SequenceObject = null;
+	private running : boolean;
+	private progress : number;
+	private frames : number;
+
+	constructor () {}
+
+	public start () {
+		this.running = true;
+	}
+
+	public stop () {
+		this.running = false;
+	}
+
+	public isRunning () {
+		return this.running;
+	}
+
+	public getState () : SequenceState {
+		return {
+			hash : this.current.hash,
+			name : this.current.name,
+			progress : this.progress
+		}
+	}
+}
+
+export type { SequenceState };

static/js/index.d.ts

@@ -1,7 +1,19 @@
+interface SequenceState {
+    name: string;
+    hash: string;
+    progress: number;
+}
+interface State {
+    width?: number;
+    height?: number;
+    sequence?: SequenceState;
+}
 declare class Client {
     private client;
     private connected;
+    private progress;
     constructor();
     private onMessage;
     private onOpen;
+    private setSequence;
 }

static/js/index.js

@@ -2,17 +2,26 @@ class Client {
     constructor() {
         this.connected = false;
         let uri = 'ws://localhost:8082';
+        this.progress = document.getElementById('progress');
         this.client = new WebSocket(uri);
         this.client.onopen = this.onOpen.bind(this);
         this.client.onmessage = this.onMessage.bind(this);
     }
     onMessage(event) {
-        console.log(event.data);
+        const state = JSON.parse(event.data);
+        if (typeof state.sequence !== 'undefined' && state.sequence !== null) {
+            this.setSequence(state.sequence);
+        }
     }
     onOpen(event) {
         console.log('Connected');
         this.connected = true;
     }
+    setSequence(sequence) {
+        const percent = sequence.progress * 100.0;
+        this.progress.value = percent;
+        this.progress.innerText = `${Math.floor(percent)}%`;
+    }
 }
 new Client();
 //# sourceMappingURL=index.js.map

static/js/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../browser/index.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM;IAGV;QADQ,cAAS,GAAa,KAAK,CAAC;QAElC,IAAI,GAAG,GAAY,qBAAqB,CAAC;QACzC,IAAI,CAAC,MAAM,GAAG,IAAI,SAAS,CAAC,GAAG,CAAC,CAAC;QACjC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5C,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACpD,CAAC;IAEO,SAAS,CAAE,KAAW;QAC5B,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAEO,MAAM,CAAE,KAAW;QACzB,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QACzB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IACxB,CAAC;CACF;AAED,IAAI,MAAM,EAAE,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../browser/index.ts"],"names":[],"mappings":"AAYA,MAAM,MAAM;IAKV;QAHQ,cAAS,GAAa,KAAK,CAAC;QAIlC,IAAI,GAAG,GAAY,qBAAqB,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAwB,CAAC;QAC3E,IAAI,CAAC,MAAM,GAAG,IAAI,SAAS,CAAC,GAAG,CAAC,CAAC;QACjC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5C,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACpD,CAAC;IAEO,SAAS,CAAE,KAAW;QAC5B,MAAM,KAAK,GAAW,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAU,CAAC;QACtD,IAAI,OAAO,KAAK,CAAC,QAAQ,KAAK,WAAW,IAAI,KAAK,CAAC,QAAQ,KAAK,IAAI,EAAE,CAAC;YACrE,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAEO,MAAM,CAAE,KAAW;QACzB,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QACzB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IACxB,CAAC;IAEO,WAAW,CAAC,QAAwB;QAC1C,MAAM,OAAO,GAAY,QAAQ,CAAC,QAAQ,GAAG,KAAK,CAAC;QACnD,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,OAAO,CAAC;QAC9B,IAAI,CAAC,QAAQ,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;IACtD,CAAC;CACF;AAED,IAAI,MAAM,EAAE,CAAC"}