From 3aa211a35d4c7f570eba94de64b697dacfb86bf0 Mon Sep 17 00:00:00 2001 From: Samuel Andert Date: Thu, 3 Aug 2023 12:25:55 +0200 Subject: [PATCH] Added dynamic instantiation of machines in composite --- src/lib/components/Recipies/LearnColor.svelte | 41 ++++--------------- src/lib/components/Recipies/LearnReady.svelte | 9 ++-- .../Recipies/machines/toggleMachine.ts | 14 +++++++ src/lib/components/Recipies/oRecipe.svelte | 25 +++++++++-- src/lib/core/Composite.svelte | 30 +++++++++++++- src/lib/core/coreServices.ts | 32 ++++++++++----- 6 files changed, 97 insertions(+), 54 deletions(-) create mode 100644 src/lib/components/Recipies/machines/toggleMachine.ts diff --git a/src/lib/components/Recipies/LearnColor.svelte b/src/lib/components/Recipies/LearnColor.svelte index 1dd9300..65e7694 100644 --- a/src/lib/components/Recipies/LearnColor.svelte +++ b/src/lib/components/Recipies/LearnColor.svelte @@ -1,7 +1,6 @@ -
I am the parent, this is my state: {current}
+
+ I am the parent, this is my state: {$store.machine.state} +

The child state: {JSON.stringify($childStore)}

diff --git a/src/lib/components/Recipies/LearnReady.svelte b/src/lib/components/Recipies/LearnReady.svelte index f86dc32..a46716f 100644 --- a/src/lib/components/Recipies/LearnReady.svelte +++ b/src/lib/components/Recipies/LearnReady.svelte @@ -11,10 +11,9 @@ $: if (machine) { compositeMachine = Machine(machine); - current = compositeMachine.initialState.value; // remove let + current = compositeMachine.initialState.value; service = interpret(compositeMachine).onTransition((state) => { - current = state.value; - $store.xstate = state.value; + $store.machine.state = state.value; }); service.start(); @@ -22,9 +21,7 @@
- {#if machine} - i am the child and this is my state: {current} - {/if} + i am the child and this is my state: {$store.machine.state} { + getCompositeStore(composite.id).update((storeValue) => ({ + ...storeValue, + machine: { state: state.value } + })); + }); + machineService.start(); + loadedServices.machine = machineService; + } + + if (composite?.children) { + composite.children.forEach((child) => { + if (child.machine) { + const childMachine = Machine(child.machine); + machineService = interpret(childMachine).onTransition((state) => { + getCompositeStore(child.id).update((storeValue) => ({ + ...storeValue, + machine: { state: state.value } + })); + }); + machineService.start(); + loadedServices.machine = machineService; + } + }); + } } function computeLayoutStyle(layout?: ICompositeLayout): string { diff --git a/src/lib/core/coreServices.ts b/src/lib/core/coreServices.ts index f5aee87..64d9d17 100644 --- a/src/lib/core/coreServices.ts +++ b/src/lib/core/coreServices.ts @@ -1,17 +1,18 @@ // coreServices.ts import { getCompositeStore } from './compositeStores'; +import { interpret, Machine } from 'xstate'; export const coreServices = { - // updateComposite: (mappings: Record) => { - // for (const [mappingString, value] of Object.entries(mappings)) { - // const [storeID, key] = mappingString.replace('@', '').split(':'); - // const store = getCompositeStore(storeID); - // store.update(storeData => { - // storeData[key] = value; - // return storeData; - // }); - // } - // }, + updateComposite: (mappings: Record) => { + for (const [mappingString, value] of Object.entries(mappings)) { + const [storeID, key] = mappingString.replace('@', '').split(':'); + const store = getCompositeStore(storeID); + store.update(storeData => { + storeData[key] = value; + return storeData; + }); + } + }, subscribeComposite: (mappingString: string) => { const [storeID] = mappingString.replace('@', '').split(':'); const store = getCompositeStore(storeID); @@ -19,5 +20,16 @@ export const coreServices = { }, testAlert: () => { alert("core service alert") + }, + machine: { + service: null, + send: (event) => coreServices.machine.service.send(event), + initialize: (machineDefinition, store) => { + const machine = Machine(machineDefinition); + coreServices.machine.service = interpret(machine).onTransition((state) => { + store.update(storeValue => ({ ...storeValue, machine: { state: state.value } })); + }); + coreServices.machine.service.start(); + } } };