carrier

src/lib/components/ShipEdit/Carrier/Carrier.stories.svelte

@@ -0,0 +1,33 @@
+<Meta title="ShipEdit/Carrier" component={Carrier} argTypes={{}} />
+
+<Story name="Primary" args={{}} />
+
+<Template let:args>
+  <div style="width: 50em">
+    <Carrier {...args} {...$state}/>
+  </div>
+</Template>
+
+<script>
+  import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
+  import { action } from "@storybook/addon-actions";
+
+  import { setContext } from "svelte";
+import { readable, get, derived } from "svelte/store";
+
+  import Carrier from "./index.svelte";
+  import carrierDux from '$lib/shipDux/carrier.js'
+
+  const carrierStore = carrierDux.createStore();
+  const state = readable(carrierStore.getState(), (set) => {
+    carrierStore.subscribe(() => {
+      set(carrierStore.getState());
+    });
+  });
+
+  setContext("ship", {
+      dispatch: carrierStore.dispatch,
+      shipMass: readable(50),
+      state,
+  });
+</script>

src/lib/components/ShipEdit/Carrier/Squadron.svelte

@@ -1,4 +1,4 @@
-<ShipItem {cost} {mass}>
+<ShipItem {...reqs}>
   <Field label={`squadron ${id}`}>
     <select bind:value={type}>
       {#each types as type (type)}
@@ -14,24 +14,20 @@
   import Section from "$lib/components/Section/index.svelte";
   import Field from "$lib/components/Field/index.svelte";
   import ShipItem from "$lib/components/ShipItem/index.svelte";
-  import dux from "$lib/dux/carrier";
+  import { squadronTypes } from "$lib/shipDux/carrier.js";
-  import squadron_types from "$lib/dux/carrier/squadron_types";
 
-  const types = squadron_types.map(({ type }) => type);
+  const types = squadronTypes.map(({ type }) => type);
 
   export let id = 1;
-  export let type = "standard";
+  export let type = types[0].type;
-  export let ftl = false;
+  export let reqs= {};
-  export let cost = 0;
-  export let mass = 0;
 
-  export let ship = getContext("ship");
+  export let { dispatch } = getContext("ship");
+
+  $: console.log(type)
+$: dispatch.setSquadronType({type, id});
 
-  $: ship?.dispatch_action("set_squadron", { id, type });
 </script>
 
 <style>
-  div {
-    background-color: red;
-  }
 </style>

src/lib/components/ShipEdit/Carrier/index.svelte

@@ -0,0 +1,35 @@
+<Section label="carrier">
+  <ShipItem {...reqs}>
+    <Field label="bays">
+      <input type="number" min="0" bind:value={bays} />
+    </Field>
+  </ShipItem>
+
+  {#each squadrons as squadron,id (id)}
+    <Squadron {...squadron} id={id+1} />
+  {/each}
+</Section>
+
+<script>
+import { getContext } from 'svelte';
+    import Field from '$lib/components/Field/index.svelte';
+    import ShipItem from '$lib/components/ShipItem/index.svelte';
+    import Section from '$lib/components/Section/index.svelte';
+    import Squadron from './Squadron.svelte';
+
+    export let bays = 0;
+    export let reqs = {};
+export let squadrons = [];
+
+$: console.log({squadrons})
+const { dispatch } = getContext('ship');
+
+$: dispatch.setCarrierBays(bays);
+
+</script>
+
+<style>
+input {
+    width: 5em;
+}
+</style>

src/lib/components/ShipEdit/Identification/Identification.stories.svelte

@@ -1,4 +1,4 @@
-<Meta title="Identification" component={Identification} argTypes={{}} />
+<Meta title="ShipEdit/Identification" component={Identification} argTypes={{}} />
 
 <Story name="Primary" args={{}} />
 

src/lib/shipDux/carrier.js

@@ -0,0 +1,76 @@
+import { Updux } from "updux";
+import u from "updeep";
+import _ from 'lodash';
+
+import reqs from "./reqs.js";
+
+const dux = new Updux({
+  subduxes: { reqs },
+  initial: {
+    bays: 0,
+    squadrons: [],
+  },
+    actions: {
+        setCarrierBays: null,
+        setSquadronType: null,
+    }
+});
+
+dux.setMutation( 'setCarrierBays', bays => u({bays, reqs:
+    calcBaysReqs(bays),
+    squadrons: adjustSquadrons(bays),
+}) );
+
+dux.setMutation('setSquadronType', ({type, id}) => state => {
+
+    return u.updateIn(['squadrons', id-1], {
+        type,
+        reqs: squadronReqs(type)
+    }, state )
+
+} );
+
+export const squadronTypes= [
+  { type: "standard", cost: 3 },
+  { type: "fast", cost: 4 },
+  { type: "heavy", cost: 5 },
+  { type: "interceptor", cost: 3 },
+  { type: "attack", cost: 4 },
+  { type: "long range", cost: 4 },
+  { type: "torpedo", cost: 6 },
+];
+
+function squadronReqs(type) {
+    return { mass: 6, cost: 6 * squadronTypes.find( s => s.type === type )?.cost }
+}
+
+
+const adjustSquadrons = bays => squadrons => {
+    if( squadrons.length > bays ) {
+        squadrons = squadrons.slice(0,bays);
+    }
+
+    if( squadrons.length < bays ) {
+            squadrons = [ ...squadrons, ..._.times(
+                bays - squadrons.length, () => ({
+                    type: squadronTypes[0].type,
+                reqs: {
+                    cost: 6 * squadronTypes[0].cost,
+                    mass: 6,
+                },
+                })
+            )];
+    }
+
+    return squadrons;
+
+}
+
+function calcBaysReqs(bays) {
+    return {
+        mass: 9 * bays,
+        cost: 18 * bays,
+    }
+}
+
+export default dux;

src/lib/store/ship.js

@@ -20,7 +20,6 @@ export default () => {
     duxStore.subscribe(() => {
       if (previous === duxStore.getState()) return;
       previous = duxStore.getState();
-      console.log("Setting!", previous);
       set(previous);
     });
   });