From a04bfd509b0fca0f7ec295f08e1aa7f86cbef9ab Mon Sep 17 00:00:00 2001 From: Rachel <508861+Ryex@users.noreply.github.com> Date: Mon, 1 Apr 2024 00:09:41 -0700 Subject: [PATCH] Device card start Signed-off-by: Rachel <508861+Ryex@users.noreply.github.com> --- .editorconfig | 14 +++++++++ .gitattributes | 1 + www/cspell.json | 2 +- www/src/index.html | 2 +- www/src/js/virtual_machine/device.ts | 47 +++++++++++++++++++++++----- 5 files changed, 57 insertions(+), 9 deletions(-) create mode 100644 .editorconfig create mode 100644 .gitattributes diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..9466f52 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,14 @@ +root = true + +[*] +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.rs] +indent_style = space +tab_width = 4 + +[*.{js,ts,css,scss,html}] +indent_style = space +indent_size = 2 diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..176a458 --- /dev/null +++ b/.gitattributes @@ -0,0 +1 @@ +* text=auto diff --git a/www/cspell.json b/www/cspell.json index 7c986dc..98eb47c 100644 --- a/www/cspell.json +++ b/www/cspell.json @@ -1 +1 @@ -{"flagWords":[],"words":["Astroloy","Autolathe","bapal","bapz","bapzal","batchmode","batchmodes","bdns","bdnsal","bdse","bdseal","beqal","beqz","beqzal","bgeal","bgez","bgezal","bgtal","bgtz","bgtzal","bleal","blez","blezal","bltal","bltz","bltzal","bnaal","bnan","bnaz","bnazal","bneal","bnez","bnezal","brap","brapz","brdns","brdse","breq","breqz","brge","brgez","brgt","brgtz","brle","brlez","brlt","brltz","brna","brnan","brnaz","brne","brnez","Circuitboard","codegen","Depressurising","endpos","getd","Hardsuit","hardwrap","hashables","hstack","infile","jetpack","Keybind","lbns","logicable","logicslottypes","logictype","logictypes","lparen","Mineables","modelist","ninf","noconflict","offcanvas","overcolumn","Overlength","pedia","pinf","popperjs","preproc","Pressurising","putd","QUICKFIX","reagentmode","reagentmodes","rocketstation","rparen","sapz","sattellite","sdns","sdse","seqz","serde","sgez","sgtz","slez","slotlogic","slotlogicable","slotlogictype","slotlogictypes","slottype","sltz","snan","snanz","snaz","snez","splitn","Stationeers","stationpedia","themelist","tokentype","trunc","whos","regen"],"language":"en","version":"0.2"} +{"words":["Astroloy","Autolathe","bapal","bapz","bapzal","batchmode","batchmodes","bdns","bdnsal","bdse","bdseal","beqal","beqz","beqzal","bgeal","bgez","bgezal","bgtal","bgtz","bgtzal","bleal","blez","blezal","bltal","bltz","bltzal","bnaal","bnan","bnaz","bnazal","bneal","bnez","bnezal","brap","brapz","brdns","brdse","breq","breqz","brge","brgez","brgt","brgtz","brle","brlez","brlt","brltz","brna","brnan","brnaz","brne","brnez","Circuitboard","codegen","Depressurising","endpos","getd","Hardsuit","hardwrap","hashables","hstack","infile","jetpack","Keybind","lbns","logicable","logicslottypes","logictype","logictypes","lparen","Mineables","modelist","ninf","noconflict","offcanvas","overcolumn","Overlength","pedia","pinf","popperjs","preproc","Pressurising","putd","QUICKFIX","reagentmode","reagentmodes","rocketstation","rparen","sapz","sattellite","sdns","sdse","seqz","serde","sgez","sgtz","slez","slotlogic","slotlogicable","slotlogictype","slotlogictypes","slottype","sltz","snan","snanz","snaz","snez","splitn","Stationeers","stationpedia","themelist","tokentype","trunc","whos","regen","regen"],"language":"en","version":"0.2","flagWords":[]} diff --git a/www/src/index.html b/www/src/index.html index 10a9162..8538a9c 100644 --- a/www/src/index.html +++ b/www/src/index.html @@ -207,7 +207,7 @@
Editor Cursor Style

-
Last Run Operations
+
Last Run Operations Count

diff --git a/www/src/js/virtual_machine/device.ts b/www/src/js/virtual_machine/device.ts index 042138f..ac4e7f1 100644 --- a/www/src/js/virtual_machine/device.ts +++ b/www/src/js/virtual_machine/device.ts @@ -9,7 +9,7 @@ class VMDeviceUI { canvasEl: HTMLDivElement; deviceCountEl: HTMLElement; canvas: Offcanvas; - private _deviceCards: Map; + private _deviceSummaryCards: Map; constructor(ui: VirtualMachineUI) { const that = this; @@ -18,23 +18,23 @@ class VMDeviceUI { this.canvasEl = document.getElementById('vmDevicesOCBody') as HTMLDivElement; this.deviceCountEl = document.getElementById('vmViewDeviceCount'); this.canvas = new Offcanvas(this.canvasEl); - this._deviceCards = new Map(); + this._deviceSummaryCards = new Map(); } update(active_ic: DeviceRef) { const devices = window.VM.devices; this.deviceCountEl.innerText = `(${devices.size})` for (const [id, device] of devices) { - if (!this._deviceCards.has(id)) { - this._deviceCards.set(id, new VMDeviceCard(this, device)); + if (!this._deviceSummaryCards.has(id)) { + this._deviceSummaryCards.set(id, new VMDeviceSummaryCard(this, device)); } } - this._deviceCards.forEach((card, _id) => { card.update(active_ic)}); + this._deviceSummaryCards.forEach((card, _id) => { card.update(active_ic)}); } } -class VMDeviceCard { +class VMDeviceSummaryCard { root: HTMLDivElement; viewBtn: HTMLButtonElement; deviceUI: VMDeviceUI; @@ -71,7 +71,7 @@ class VMDeviceCard { const btnTxt = `Device ${this.device.id}${deviceName}` this.viewBtn.innerText = btnTxt; - // regen badges + // regenerate badges this.device.connections.forEach((conn, index) => { if ( typeof conn === "object") { var badge = document.createElement('span'); @@ -109,4 +109,37 @@ class VMDeviceCard { } +class VMDeviceCard { + ui: VMDeviceUI; + container: HTMLElement; + root: HTMLDivElement; + + header: HTMLHeadingElement; + device: DeviceRef; + nameInput: HTMLInputElement; + nameHash: HTMLSpanElement; + badges: HTMLSpanElement[]; + fieldsContainer: HTMLDivElement; + slotsContainer: HTMLDivElement; + pinsContainer: HTMLDivElement; + networksContainer: HTMLDivElement; + + constructor(ui: VMDeviceUI, container: HTMLElement, device: DeviceRef) { + this.ui = ui; + this.container = container; + this.device = device; + + this.root = document.createElement('div'); + + this.header = document.createElement('h5'); + this.nameInput = document.createElement('input'); + this.nameHash = document.createElement('span'); + this.badges = []; + this.fieldsContainer = document.createElement('div'); + this.slotsContainer = document.createElement('div'); + this.pinsContainer = document.createElement('div'); + this.networksContainer = document.createElement('div'); + } +} + export { VMDeviceUI }