add carrier

.storybook/main.js

@@ -1,6 +1,7 @@
 const path = require('path');
 
 module.exports = {
+    addons: ['@storybook/addon-actions/register'],
     stories: [ '../src/**/*stories.js' ],
     webpackFinal: (config) => {
         config.resolve.alias['~'] = path.resolve(__dirname, '../src/');

package.json

@@ -53,6 +53,7 @@
       "@rollup/plugin-alias": "^3.1.1",
       "@rollup/plugin-commonjs": "^12.0.0",
       "@rollup/plugin-node-resolve": "^8.0.0",
+      "@storybook/addon-actions": "^5.3.19",
       "eslint": "7.4.0",
       "eslint-config-prettier": "6.11.0",
       "eslint-plugin-babel": "5.3.1",

src/App.svelte

@@ -15,6 +15,7 @@
   import Weapon from '~C/Weapon';
   import Cargo from '~C/Cargo/index.svelte';
   import Streamlining from '~C/Streamlining/index.svelte';
+  import Carrier from '~C/Carrier';
 
     const ship = shipStore();
 
@@ -93,6 +94,7 @@
       <Streamlining {...$ship.streamlining} />
     </Section>
 
+    <Carrier {...$ship.carrier} />
 
 </main>
 

src/components/Carrier/Squadron/index.svelte

@@ -0,0 +1,38 @@
+<ShipItem {cost} {mass} >
+  <Field label={`squadron ${id}`}>
+    <select bind:value={type}>
+      {#each types as type (type)}
+        <option>{type}</option> 
+      {/each}
+    </select>
+  </Field>
+</ShipItem>
+
+<script>
+  import {getContext } from 'svelte';
+
+  import Section from "~C/Section/index.svelte";
+  import Field from "~C/Field/index.svelte";
+  import ShipItem from "~C/ShipItem/index.svelte";
+  import dux from '~/dux/carrier';
+  import squadron_types from '~/dux/carrier/squadron_types';
+
+  const types = squadron_types.map( ({type}) => type );
+
+  export let id = 1;
+  export let type = "standard";
+  export let ftl = false; 
+  export let cost =0;
+  export let mass = 0;
+
+  export let ship_change = getContext('ship_change') || ( () => {} );
+
+  $: ship_change( dux.actions.set_squadron({ id, type, }) );
+
+</script>
+
+<style>
+div {
+  background-color: red;
+}
+</style>

src/components/Carrier/index.svelte

@@ -0,0 +1,37 @@
+<Section label="carrier">
+  <ShipItem {cost} {mass} >
+    <Field label="bays">
+      <input type="number" min="0" bind:value={bays} />
+    </Field>
+  </ShipItem>
+
+  {#each squadrons as squad (squad.id)}
+    <Squadron {...squad} />  
+  {/each}
+
+</Section>
+
+<script>
+  import {getContext } from 'svelte';
+
+  import Section from "~C/Section/index.svelte";
+  import Field from "~C/Field/index.svelte";
+  import ShipItem from "~C/ShipItem/index.svelte";
+  import Squadron from './Squadron';
+  import dux from '~/dux/carrier';
+
+  export let bays = 0; 
+  export let squadrons = [];
+  export let cost = 0;
+  export let mass = 0;
+  export let ship_change = getContext('ship_change') || ( () => {} );
+
+  $: ship_change( dux.actions.set_carrier_bays(bays) );
+
+</script>
+
+<style>
+div {
+  background-color: red;
+}
+</style>

src/components/Carrier/stories.js

@@ -0,0 +1,20 @@
+import { action } from '@storybook/addon-actions';
+
+import Carrier from './index.svelte';
+
+export default {
+    title: 'Carrier',
+};
+
+export const basic = () => ({
+    Component: Carrier,
+    props: {
+        bays: 3,
+        squadrons: [
+            { id: 1, type: "standard", ftl: false, nbr_fighters: 6 },
+            { id: 2, type: "fast", ftl: false, nbr_fighters: 6 },
+            { id: 3, type: "none", ftl: false, nbr_fighters: 6 },
+        ],
+        ship_change: action('ship_change'),
+    },
+})

src/components/Identification.svelte

@@ -34,7 +34,7 @@
         ship.dispatch.set_ship_type(value);
 
   let ship_types;
-  $: ship_types = candidate_ship_types($ship.general.mass,false).map(
+  $: ship_types = candidate_ship_types($ship.general.mass,$ship.carrier.bays>0).map(
     ({name}) => name
   );
 

src/components/Streamlining/index.svelte

@@ -19,7 +19,6 @@
 
   import {getContext } from 'svelte';
 
-
   export let type = 'none';
   export let cost = 0;
   export let mass = 0;

src/dux/carrier/index.js

@@ -0,0 +1,58 @@
+import Updux from "updux";
+import { action, payload } from "ts-action";
+import u from "updeep";
+import _ from 'lodash';
+import { createSelector } from "reselect";
+
+import squadron_types from './squadron_types';
+
+const uu = transform => state => transform(state)(state);
+
+const dux = new Updux({
+    initial: {
+        bays: 0,
+        cost: 0,
+        mass: 0,
+        squadrons: [],
+    },
+});
+
+const set_squadron = action('set_squadron',payload());
+
+dux.addMutation(set_squadron, ({id,type}) => u({ squadrons: u.map(
+    u.if(_.matches({id}), u({type, cost: 6 * _.find(squadron_types,{type}).cost, mass: 6 }))
+)}));
+
+const set_carrier_bays = action('set_carrier_bays', payload() );
+
+dux.addMutation( set_carrier_bays, bays => state => {
+    state = u({ 
+        bays, 
+        mass: 1.5*6*bays,
+        cost: 3 * 1.5 * 6 * bays,
+    })(state);
+
+    if( state.squadrons.length > bays ) {
+        state = u({
+            squadrons: squadrons => squadrons.slice(0,bays)
+        }, state) 
+    }
+
+    if( state.squadrons.length < bays ) {
+        state = u({
+            squadrons: squadrons => [ ...squadrons, ..._.times(
+                bays - state.squadrons.length, i => ({
+                    id: 1 + i + state.squadrons.length,
+                    cost: 6 * squadron_types[0].cost,
+                    mass: 6,
+                    type: squadron_types[0].type,
+                })
+            )] }, state) 
+    }
+
+    return state;
+
+});
+
+
+export default dux.asDux;

src/dux/carrier/squadron_types.js

@@ -0,0 +1,9 @@
+export default [
+  { 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 },
+];

src/dux/index.js

@@ -12,6 +12,7 @@ import { candidate_ship_types } from './ship_types';
 import structure from './structure';
 import cargo from './cargo';
 import streamlining from './streamlining';
+import carrier from './carrier';
 import { ceil } from '~/dux/utils';
 
 const set_ship_mass = action("set_ship_mass", payload());
@@ -36,7 +37,7 @@ const initial = {
   };
 
 const dux = new Updux({
-  subduxes: { ftl, engine, weaponry, structure, cargo, streamlining },
+  subduxes: { ftl, engine, weaponry, structure, cargo, streamlining, carrier },
   initial
 });
 
@@ -85,8 +86,12 @@ dux.addSubscription((store) =>
     createSelector(
         store => store.general.mass,
         store => store.general.ship_type,
-        (mass,type) => {
+        store => store.carrier.bays,
-            const candidates = candidate_ship_types(mass,false);
+        (mass,type,bays) => {
+            console.log({bays});
+            const candidates = candidate_ship_types(mass,bays > 0);
+
+            console.log({candidates});
             if( candidates.length === 0 ) return;
 
             if( candidates.find( ({name}) => name === type ) ) return;

src/dux/ship_types.js

@@ -21,6 +21,6 @@ const ship_types = [
 ];
 
 export function candidate_ship_types(mass = 0, carrier = false) {
-    console.log(mass);
+    console.log({carrier});
   return ship_types.filter((c) => carrier == !!c.carrier).filter((c) => c.mass[0] <= mass).filter((c) => c.mass[1] >= mass);
 }