update data load to use events.

Author: wildone

src/js/panel._utils.js

@@ -49,12 +49,12 @@ window.Widgets.Panel.Utils = {};
 
     ns.options = {
         tree_data: {
-            sighting: 'data/sightingIndex.json',
-            task: 'data/taskIndex.json',
-            impact: 'data/impactIndex.json',
-            event: 'data/eventIndex.json',
-            me: 'data/meIndex.json',
-            company: 'data/companyIndex.json',
+            sighting: 'sighting',
+            task: 'task',
+            impact: 'impact',
+            event: 'event',
+            me: 'user',
+            company: 'company',
         },    
         tree_data_default: 'sighting',
         duration: 350,

src/js/panel.filter.js

@@ -8,11 +8,11 @@ window.Widgets.Panel.Filter = {};
 
     ns.options = {};
 
-    ns.filterChange = function(url) {
+    ns.filterChange = function(type) {
         console.group(`Widgets.Panel.Filter.filterChange on ${window.location}`);
         console.log('filter change');
         //call update function for tree panel
-        window.Widgets.Panel.Tree.updateTree(url);
+        window.Widgets.Panel.Tree.updateTree(type);
         console.groupEnd();
     }
 
@@ -28,11 +28,11 @@ window.Widgets.Panel.Filter = {};
 
         $filter_options.on('change', function (d) {
             console.group(`Widgets.Panel.Filter filter.change on ${window.location}`);
-            var filterValue = this.value;
-            var url = window.Widgets.Panel.Utils.options.tree_data[filterValue]
-            console.log('source changed to ' + url);
+            let filterValue = this.value;
+            let type = window.Widgets.Panel.Utils.options.tree_data[filterValue]
+            console.log('source changed to ' + type);
 
-            window.Widgets.Panel.Filter.filterChange(url);
+            window.Widgets.Panel.Filter.filterChange(type);
 
             console.groupEnd();
         });
@@ -85,14 +85,16 @@ window.Widgets.Panel.Filter = {};
                 id: id,
                 type: 'button'
             }
-            const eventName = "embed-viz-event-request-data1";
-            const config = "data/scratch.json";
+            const eventName = "embed-viz-event-payload-data-unattached-force-graph";
+            const config = "scratch";
             const action = "DATA_REQUEST";
             const data = eventNs.compileEventData(payload, eventName, action, componentId, config);
 
             eventNs.raiseEvent(eventName, data);
         });
 
+        ns.filterChange(ns.options.tree_data_default);
+
         console.groupEnd();
     }
 

src/js/panel.tree.js

@@ -154,15 +154,23 @@ window.Widgets.Panel.Tree = {}
         console.groupEnd();
     }
 
-    ns.updateTree = function(url) {
+    ns.updateTree = function(type) {
         console.log('window.Widgets.Panel.Tree updated');
+
+        const eventName = `embed-viz-event-payload-data-tree-${type}`;
+        const topics = [`embed-viz-event-payload-data-tree-${type}`];
+
         //call update function for tree panel
-        console.log('loading data from ' + url);
+        console.log(`loading data from type=${type} eventName=${eventName} topics=${topics}`);
 
         //hide tooltip if it is visible
         panelUtilsNs.hideTooltip();  
 
-        ns.loadData(url);
+        //raise event to load data
+        window.Widgets.Widget.raiseEventDataRequest(eventName, topics, "load_data", type, (data) => {
+            console.log(`raiseEventDataRequest callback loadData ${type}=${type}`, data);
+            ns.loadData(data);
+        });
     }
 
 

src/js/widget.js

@@ -10,7 +10,7 @@ window.Widgets.Widget = {};
     ns.selectorTooltipContainer = 'body';
 
 
-    ns.scratch = 'data/scratch.json';
+    ns.scratch = '/viz-data/unattached-force-graph';
 
     ns.raiseEventDataRequest = function(eventName, topics = [], action, id, callbackFn) {      
         console.group(`raiseEventDataRequest on ${window.location}`); 
@@ -62,13 +62,12 @@ window.Widgets.Widget = {};
 
         // request tree data
         console.log("request tree data");
-        ns.raiseEventDataRequest("embed-viz-event-request-datatree", ["embed-viz-event-payload-data-tree"], "load_data", "sighting", (data) => {
-            panelTreeNs.loadData(data);
-        });
+
 
         console.log("request filter data");
         //request panel data
-        ns.raiseEventDataRequest("embed-viz-event-request-data1", ["embed-viz-event-payload-data1"], "load_data", "scratch", (data) => {
+        ns.raiseEventDataRequest("embed-viz-event-payload-data-unattached-force-graph", ["embed-viz-event-payload-data-unattached-force-graph"], "load_data", "scratch", (data) => {
+            console.log("raiseEventDataRequest callback loadData scratch", data);
             ns.loadData(data);
         });
         console.log("requestData done");