Revise and generalize hand-me-down options

Author: FelixHenninger

packages/library/src/core.js

@@ -14,6 +14,14 @@ export const status = Object.freeze({
   done:         3,
 })
 
+// Default options ----------------------------------------
+// Attributes to pass on to nested items (as names)
+export const handMeDowns = [
+  'debug',
+  'datastore',
+  'el',
+]
+
 // Generic building block for experiment
 export class Component extends EventHandler {
   constructor(options={}) {
@@ -58,6 +66,12 @@ export class Component extends EventHandler {
       // There is no timeout by default
       timeout: null,
 
+      // Setup hand-me-downs
+      // (array is copied on purpose)
+      handMeDowns: [
+        ...handMeDowns,
+      ],
+
       ...options,
 
       // Setup media handling
@@ -150,6 +164,21 @@ export class Component extends EventHandler {
       return
     }
 
+    // Collect options 'handed down' from higher-level components
+    if (this.parent) {
+      const foo = this.parents.reduce(
+        // Accumulate handed down options from parents
+        (acc, cur) => {
+          cur.options.handMeDowns.forEach(o => acc.add(o))
+          return acc
+        },
+        new Set(),
+      ).forEach(
+        // 'inherit' the option from the parent component
+        o => (this.options[o] = this.options[o] || this.parent.options[o])
+      )
+    }
+
     // Direct output to the HTML element with the attribute
     // data-labjs-section="main", unless a different element
     // has been provided explicitly
@@ -410,14 +439,6 @@ Component.metadata = {
   },
 }
 
-// Default options ----------------------------------------
-// Attributes to pass on to nested items (as names)
-export const handMeDowns = [
-  'debug',
-  'datastore',
-  'el',
-]
-
 // Simple components --------------------------------------
 // A Dummy component does nothing but end
 // immediately as soon as it is called

packages/library/src/flow.js

@@ -1,7 +1,7 @@
 // Flow control components for lab.js
 import { shuffle, mean, isFunction } from 'lodash'
 import { entries } from 'core-js/fn/array'
-import { Component, status, handMeDowns } from './core'
+import { Component, status } from './core'
 
 // Helper function to handle nested components
 export const prepareNested = function(nested, parent) {
@@ -19,13 +19,6 @@ export const prepareNested = function(nested, parent) {
     }
   })
 
-  // Pass on specified attributes
-  nested.forEach((c) => {
-    parent.options.handMeDowns.forEach((k) => {
-      c.options[k] = c.options[k] || parent.options[k]
-    })
-  })
-
   // Trigger prepare on all nested components
   return Promise.all(
     nested.map(c => c.prepare(false)), // indicate automated call
@@ -42,10 +35,6 @@ export class Sequence extends Component {
       content: [],
       // Shuffle items, if so desired
       shuffle: false,
-      // Use default hand-me-downs
-      // unless directed otherwise
-      // (note that the hand-me-downs are copied)
-      handMeDowns: [...handMeDowns],
       ...options,
     })
 
@@ -186,7 +175,6 @@ export class Parallel extends Component {
       // that are run in parallel.
       content: [],
       mode: 'race',
-      handMeDowns: [...handMeDowns],
       ...options,
     })
   }

packages/library/src/html.js

@@ -2,7 +2,7 @@
 import { extend } from 'lodash'
 import 'whatwg-fetch'
 
-import { Component, status, handMeDowns } from './core'
+import { Component, status } from './core'
 import { prepareNested } from './flow'
 
 // html.Screens display HTML when run
@@ -180,7 +180,6 @@ export class Frame extends Component {
       content: null,
       context: '',
       contextSelector: '',
-      handMeDowns: [...handMeDowns],
       ...options,
     })
   }