complexdatacollective · bryfox · Aug 1, 2018 · Jul 19, 2018 · Jul 20, 2018 · Jul 20, 2018
diff --git a/public/index.html b/public/index.html
@@ -2,14 +2,17 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
+    <!-- default-src contains `blob:` as worker-src fallback for Android <= 8.0 -->
     <meta http-equiv="Content-Security-Policy" content="
-      default-src gap://ready file://* *;
-      connect-src data: *;
+      default-src gap://ready file://* blob:;
+      connect-src 'self' data: http://localhost:* https://localhost:* ws://localhost:*;
       img-src asset: 'self' android-webview-video-poster: data: cdvfile: file:;
       media-src 'self' asset: cdvfile: file: data:;
-      style-src 'self' http://* https://* 'unsafe-inline';
-      script-src 'self' http://* https://* 'unsafe-inline' 'unsafe-eval';
-      font-src 'self' gap://ready file://* http://* https://* 'unsafe-inline' 'unsafe-eval' data:"
+      style-src 'self' 'unsafe-inline';
+      script-src 'self' 'unsafe-inline' 'unsafe-eval';
+      font-src 'self' data:;
+      worker-src blob:;
+      "
     />
     <meta name="viewport" content="viewport-fit=cover, initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width" />
     <link rel="shortcut icon" href="%PUBLIC_URL%/icons/netCanvas-icon.ico">

diff --git a/public/protocols/development.netcanvas/custom.js b/public/protocols/development.netcanvas/custom.js
diff --git a/public/protocols/development.netcanvas/nodeLabelWorker.js b/public/protocols/development.netcanvas/nodeLabelWorker.js
@@ -0,0 +1,61 @@
+/**
+ * @function
+ * @name nodeLabelWorker
+ * @description Generate a display label for a node.
+ *
+ * You may create any label based on input data; see examples below.
+ * The variable registry is not directly accessible here; any properties should
+ * be in sync with the registry defined in protocol.json.
+ *
+ * Do not change the name of this function.
+ *
+ * @param  {Object} data
+ * @param  {Object} data.node All props for the node requiring a label
+ * @param  {Object} data.network The current state of the network in this session
+ * @param  {Array} data.network.nodes
+ * @param  {Array} data.network.edges
+ *
+ * @return {string|Promise} a label for the input node, or
+ *                          a promise that resolves to the label
+ */
+function nodeLabelWorker({ node, network }) {
+  // Examples:
+  //
+  // 1. Given name, surname initial
+  // const label = `${node.name} ${(node.last_name && `${node.last_name[0]}.`) || ''}`;
+  //
+  // 2. Counter based on data set or subset (here, the network nodes)
+  // const index = network.nodes.findIndex(n => n.uid === node.uid);
+  // const label = index > -1 ? `${node.name} ${index + 1}` : node.name;
+  //
+  // 3. Counter, based on network as well. Access to `externalData` TBD.
+  // const networkNodeIds = {};
+  // network.nodes.forEach((n) => { networkNodeIds[n.uid] = 1; });
+  // const externalNodes = externalData.previousInterview.nodes.filter(n => !networkNodeIds[n.uid]);
+  // const nodes = [...network.nodes, ...externalNodes].sort((a, b) => a.uid.localeCompare(b.uid));
+  // const index = nodes.findIndex(n => n.uid === node.uid);
+  // const label = index > -1 ? `${node.name} ${index + 1}` : node.name;
+  //
+  // 4. Add emoji suffix based on a node property
+  // const label = `${node.name} ${node.close_friend ? '😇' : '😡'}`;
+  // console.log('worker req', label);
+  // setTimeout(() => postMessage({ node, label }), 1000 * Math.random());
+
+  // 5. Add emoji based on an edge or node property
+  let label = node.name;
+  if (network.edges.some(e => e.from === node._uid || e.to === node._uid)) {
+    label += '😎';
+  } else if (node.close_friend) {
+    label += '😇';
+  }
+
+  // To perform async work, return a promise instead.
+  // Use this with care; the most recent response to the client will be used.
+  // return new Promise((resolve, reject) => {
+  //   setTimeout(() => {
+  //     resolve(label);
+  //   }, 100);
+  // });
+
+  return label;
+}
diff --git a/public/protocols/development.netcanvas/protocol.json b/public/protocols/development.netcanvas/protocol.json
@@ -20,6 +20,11 @@
               "maxLength": 24
             }
           },
+          "last_name": {
+            "label": "Last Name",
+            "description": "Human readable description",
+            "type": "text"
+          },
           "age": {
             "label": "Age",
             "description": "Human readable description",
@@ -485,36 +490,49 @@
           "uid": "person_1",
           "type": "person",
           "name": "Anita",
+          "last_name": "Li",
           "nickname": "Annie",
           "age": "23"
         },
         {
           "uid": "person_2",
           "type": "person",
           "name": "Barry",
+          "last_name": "Smith",
           "nickname": "Baz",
           "age": "23"
         },
         {
           "uid": "person_3",
           "type": "person",
           "name": "Carlito",
+          "last_name": "González",
           "nickname": "Carl",
           "age": "23"
         },
         {
           "uid": "person_4",
           "type": "person",
           "name": "Dee",
+          "last_name": "Zhang",
           "nickname": "Dee",
           "age": "23"
         },
         {
           "uid": "person_5",
           "type": "person",
           "name": "Eugine",
+          "last_name": "Müller",
           "nickname": "Eu",
           "age": "23"
+        },
+        {
+          "uid": "previous_6",
+          "type": "person",
+          "name": "Eustace",
+          "last_name": "Nguyễn",
+          "nickname": "Eu",
+          "age": "24"
         }
       ]
     },
@@ -1063,7 +1081,7 @@
       "prompts": [
         {
           "id": "6cl",
-          "text": "This is a _prompt_ containing **markdown**",
+          "text": "Who would _you_ consider to be a **close friend**?",
           "additionalAttributes": {
             "special_category": 46,
             "close_friend": true

diff --git a/public/protocols/education.netcanvas/custom.js b/public/protocols/education.netcanvas/custom.js
diff --git a/src/components/Node.js b/src/components/Node.js
diff --git a/src/components/NodeList.js b/src/components/NodeList.js
@@ -4,7 +4,8 @@ import PropTypes from 'prop-types';
 import { find, get, isEqual } from 'lodash';
 import cx from 'classnames';
 import { TransitionGroup } from 'react-transition-group';
-import { Node } from '../components';
+
+import Node from '../containers/Node';
 import { getCSSVariableAsString, getCSSVariableAsNumber } from '../utils/CSSVariables';
 import { Node as NodeTransition } from './Transition';
 import { scrollable, selectable } from '../behaviours';

diff --git a/src/components/OrdinalBinBucket.js b/src/components/OrdinalBinBucket.js
@@ -4,7 +4,8 @@ import PropTypes from 'prop-types';
 import { find, get, isEqual } from 'lodash';
 import cx from 'classnames';
 import { TransitionGroup } from 'react-transition-group';
-import { Node } from '../components';
+
+import Node from '../containers/Node';
 import { getCSSVariableAsString, getCSSVariableAsNumber } from '../utils/CSSVariables';
 import { Node as NodeTransition } from './Transition';
 import { selectable } from '../behaviours';

diff --git a/src/components/index.js b/src/components/index.js
@@ -7,7 +7,6 @@ export { default as Pips } from './Pips';
 export { default as Prompt } from './Prompt';
 export { default as Dialog } from './Dialog';
 export { default as Modal } from './Modal';
-export { default as Node } from './Node';
 export { default as Edge } from './Edge';
 export { default as MenuItem } from './MenuItem';
 export { default as NodeList } from './NodeList';