link error field, enhance networks, improve device update envents

This commit is contained in:
Rachel Powers
2024-04-13 21:44:59 -07:00
parent d50eabe594
commit fb192fbbe6
7 changed files with 236 additions and 184 deletions

View File

@@ -24,7 +24,6 @@ import "@shoelace-style/shoelace/dist/components/icon/icon.js";
import SlInput from "@shoelace-style/shoelace/dist/components/input/input.js";
import { parseNumber, structuralEqual } from "../utils";
import SlSelect from "@shoelace-style/shoelace/dist/components/select/select.js";
import SlDetails from "@shoelace-style/shoelace/dist/components/details/details.js";
import SlDrawer from "@shoelace-style/shoelace/dist/components/drawer/drawer.js";
import { DeviceDB, DeviceDBEntry } from "./device_db";
@@ -250,15 +249,16 @@ export class VMDeviceCard extends VMDeviceMixin(BaseElement) {
placement="top"
clearable
key=${index}
value=${conn}
value=${conn?.net}
?disabled=${conn === null}
@sl-change=${this._handleChangeConnection}
>
<span slot="prefix">Connection:${index}</span>
<span slot="prefix">Connection:${index} </span>
${vmNetworks.map(
(net) =>
html`<sl-option value=${net}>Network ${net}</sl-option>`,
)}
<span slot="prefix"> ${conn?.typ} </span>
</sl-select>
`;
})}
@@ -340,23 +340,8 @@ export class VMDeviceCard extends VMDeviceMixin(BaseElement) {
_handleChangeConnection(e: CustomEvent) {
const select = e.target as SlSelect;
const conn = parseInt(select.getAttribute("key")!);
const last = this.device.connections[conn];
const val = select.value ? parseInt(select.value as string) : undefined;
if (typeof last === "object" && typeof last.CableNetwork === "number") {
// is there no other connection to the previous network?
if (
!this.device.connections.some((other_conn, index) => {
structuralEqual(last, other_conn) && index !== conn;
})
) {
this.device.removeDeviceFromNetwork(last.CableNetwork);
}
}
if (typeof val !== "undefined") {
this.device.addDeviceToNetwork(conn, val);
} else {
this.device.setConnection(conn, val);
}
this.device.setConnection(conn, val);
this.updateDevice();
}
@@ -378,7 +363,7 @@ export class VMDeviceList extends BaseElement {
...defaultCss,
css`
.header {
margin-botton: 1rem;
margin-bottom: 1rem;
margin-right: 2rem;
padding: 0.25rem 0.25rem;
align-items: center;
@@ -686,11 +671,11 @@ export class VmDeviceTemplate extends BaseElement {
}
renderSlot(slot: Slot, slotIndex: number): HTMLTemplateResult {
return html` <sl-card class="slot-card"> </sl-card> `;
return html`<sl-card class="slot-card"> </sl-card>`;
}
renderSlots(): HTMLTemplateResult {
return html` <div clas="slots"></div> `;
return html`<div clas="slots"></div>`;
}
renderReagents(): HTMLTemplateResult {
@@ -699,12 +684,12 @@ export class VmDeviceTemplate extends BaseElement {
renderNetworks(): HTMLTemplateResult {
const vmNetworks = window.VM!.networks;
return html` <div class="networks"></div> `;
return html`<div class="networks"></div>`;
}
renderPins(): HTMLTemplateResult {
const device = this.deviceDB.db[this.name];
return html` <div class="pins"></div> `;
return html`<div class="pins"></div>`;
}
render() {
@@ -724,8 +709,8 @@ export class VmDeviceTemplate extends BaseElement {
<span class="prefab-hash">${device.hash}</span>
</div>
<sl-button class="ms-auto" pill variant="success"
>Add <sl-icon slot="prefix" name="plus-lg"></sl-icon
></sl-button>
>Add <sl-icon slot="prefix" name="plus-lg"></sl-icon>
</sl-button>
</div>
<div class="card-body">
<sl-tab-group>

View File

@@ -1,5 +1,5 @@
import { DeviceRef, VM, init } from "ic10emu_wasm";
import { DeviceDB } from "./device_db"
import { DeviceDB } from "./device_db";
import "./base_device";
declare global {
@@ -8,14 +8,13 @@ declare global {
}
}
class VirtualMachine extends EventTarget {
ic10vm: VM;
_devices: Map<number, DeviceRef>;
_ics: Map<number, DeviceRef>;
accessor db: DeviceDB;
dbPromise: Promise<{ default: DeviceDB }>
dbPromise: Promise<{ default: DeviceDB }>;
constructor() {
super();
@@ -29,7 +28,7 @@ class VirtualMachine extends EventTarget {
this._ics = new Map();
this.dbPromise = import("../../../data/database.json");
this.dbPromise.then((module) => this.setupDeviceDatabase(module.default))
this.dbPromise.then((module) => this.setupDeviceDatabase(module.default));
this.updateDevices();
this.updateCode();
@@ -179,17 +178,23 @@ class VirtualMachine extends EventTarget {
);
}
}, this);
const ic = this.activeIC!;
window.App!.session.setActiveLine(window.App!.session.activeIC, ic.ip!);
this.updateDevice(this.activeIC)
}
updateDevice(device: DeviceRef) {
this.dispatchEvent(
new CustomEvent("vm-device-modified", { detail: device.id }),
);
if (typeof device.ic !== "undefined") {
window.App!.session.setActiveLine(device.id, device.ip!);
}
}
setRegister(index: number, val: number) {
const ic = this.activeIC!;
try {
ic.setRegister(index, val);
this.dispatchEvent(
new CustomEvent("vm-device-modified", { detail: ic.id }),
);
this.updateDevice(ic);
} catch (e) {
console.log(e);
}
@@ -199,9 +204,7 @@ class VirtualMachine extends EventTarget {
const ic = this.activeIC!;
try {
ic!.setStack(addr, val);
this.dispatchEvent(
new CustomEvent("vm-device-modified", { detail: ic.id }),
);
this.updateDevice(ic);
} catch (e) {
console.log(e);
}
@@ -222,9 +225,7 @@ class VirtualMachine extends EventTarget {
if (device) {
try {
device.setField(field, val);
this.dispatchEvent(
new CustomEvent("vm-device-modified", { detail: id }),
);
this.updateDevice(device);
return true;
} catch (e) {
console.log(e);
@@ -238,9 +239,7 @@ class VirtualMachine extends EventTarget {
if (device) {
try {
device.setSlotField(slot, field, val);
this.dispatchEvent(
new CustomEvent("vm-device-modified", { detail: id }),
);
this.updateDevice(device);
return true;
} catch (e) {
console.log(e);