fix: device id change UI event chain fixed; changing the Active IC's ID no longer breaks the UI

This commit is contained in:
Rachel Powers
2024-04-28 10:56:45 -07:00
parent f580cb2c53
commit 4ac823a1bc
6 changed files with 139 additions and 88 deletions

View File

@@ -111,60 +111,80 @@ export const VMDeviceMixin = <T extends Constructor<LitElement>>(
connectedCallback(): void {
const root = super.connectedCallback();
window.VM.get().then((vm) =>
window.VM.get().then((vm) => {
vm.addEventListener(
"vm-device-modified",
this._handleDeviceModified.bind(this),
),
);
window.VM.get().then((vm) =>
);
vm.addEventListener(
"vm-devices-update",
this._handleDevicesModified.bind(this),
),
);
);
vm.addEventListener(
"vm-device-id-change",
this._handleDeviceIdChange.bind(this),
);
});
this.updateDevice();
return root;
}
disconnectedCallback(): void {
window.VM.get().then((vm) =>
window.VM.get().then((vm) => {
vm.removeEventListener(
"vm-device-modified",
this._handleDeviceModified.bind(this),
),
);
window.VM.get().then((vm) =>
);
vm.removeEventListener(
"vm-devices-update",
this._handleDevicesModified.bind(this),
),
);
);
vm.removeEventListener(
"vm-device-id-change",
this._handleDeviceIdChange.bind(this),
);
});
}
_handleDeviceModified(e: CustomEvent) {
const id = e.detail;
const activeIc = window.VM.vm.activeIC;
const activeIcId = window.App.app.session.activeIC;
if (this.deviceID === id) {
this.updateDevice();
} else if (id === activeIc.id && this.deviceSubscriptions.includes("active-ic")) {
} else if (
id === activeIcId &&
this.deviceSubscriptions.includes("active-ic")
) {
this.updateDevice();
}
}
_handleDevicesModified(e: CustomEvent<number[]>) {
const activeIc = window.VM.vm.activeIC;
const activeIcId = window.App.app.session.activeIC;
const ids = e.detail;
if (ids.includes(this.deviceID)) {
this.updateDevice()
} else if (ids.includes(activeIc.id) && this.deviceSubscriptions.includes("active-ic")) {
this.updateDevice();
} else if (
ids.includes(activeIcId) &&
this.deviceSubscriptions.includes("active-ic")
) {
this.updateDevice();
}
}
_handleDeviceIdChange(e: CustomEvent<{ old: number; new: number }>) {
if (this.deviceID === e.detail.old) {
this.deviceID = e.detail.new;
}
}
updateDevice() {
this.device = window.VM.vm.devices.get(this.deviceID)!;
if (typeof this.device === "undefined") {
return;
}
for (const sub of this.deviceSubscriptions) {
if (typeof sub === "string") {
if (sub == "name") {
@@ -220,16 +240,21 @@ export const VMDeviceMixin = <T extends Constructor<LitElement>>(
}
}
} else {
if ( "field" in sub ) {
if ("field" in sub) {
const fields = this.device.fields;
if (this.fields.get(sub.field) !== fields.get(sub.field)) {
this.fields = fields;
}
} else if ( "slot" in sub) {
} else if ("slot" in sub) {
const slots = this.device.slots;
if (typeof this.slots === "undefined" || this.slots.length < sub.slot) {
if (
typeof this.slots === "undefined" ||
this.slots.length < sub.slot
) {
this.slots = slots;
} else if (!structuralEqual(this.slots[sub.slot], slots[sub.slot])) {
} else if (
!structuralEqual(this.slots[sub.slot], slots[sub.slot])
) {
this.slots = slots;
}
}

View File

@@ -361,7 +361,7 @@ export class VMDeviceCard extends VMDeviceDBMixin(VMDeviceMixin(BaseElement)) {
const val = parseIntWithHexOrBinary(input.value);
if (!isNaN(val)) {
window.VM.get().then((vm) => {
if (!vm.changeDeviceId(this.deviceID, val)) {
if (!vm.changeDeviceID(this.deviceID, val)) {
input.value = this.deviceID.toString();
}
});

View File

@@ -22,7 +22,7 @@ export interface ToastMessage {
}
export interface CacheDeviceRef extends DeviceRef {
dirty: boolean
dirty: boolean;
}
function cachedDeviceRef(ref: DeviceRef) {
@@ -43,12 +43,12 @@ function cachedDeviceRef(ref: DeviceRef) {
},
set(target, prop, value) {
if (prop === "dirty") {
slotsDirty = value
slotsDirty = value;
return true;
}
return Reflect.set(target, prop, value)
}
}) as CacheDeviceRef
return Reflect.set(target, prop, value);
},
}) as CacheDeviceRef;
}
class VirtualMachine extends EventTarget {
@@ -264,13 +264,22 @@ class VirtualMachine extends EventTarget {
this.dispatchEvent(new CustomEvent("vm-message", { detail: message }));
}
changeDeviceId(old_id: number, new_id: number): boolean {
changeDeviceID(oldID: number, newID: number): boolean {
try {
this.ic10vm.changeDeviceId(old_id, new_id);
this.updateDevices();
if (this.app.session.activeIC === old_id) {
this.app.session.activeIC = new_id;
this.ic10vm.changeDeviceId(oldID, newID);
if (this.app.session.activeIC === oldID) {
this.app.session.activeIC = newID;
}
this.updateDevices();
this.dispatchEvent(
new CustomEvent("vm-device-id-change", {
detail: {
old: oldID,
new: newID,
},
}),
);
this.app.session.changeID(oldID, newID);
return true;
} catch (err) {
this.handleVmError(err);
@@ -430,7 +439,11 @@ class VirtualMachine extends EventTarget {
}
}
setDeviceSlotOccupant(id: number, index: number, template: SlotOccupantTemplate): boolean {
setDeviceSlotOccupant(
id: number,
index: number,
template: SlotOccupantTemplate,
): boolean {
const device = this._devices.get(id);
if (typeof device !== "undefined") {
try {