connect several update dependencies for axis tracks, for added blocks…

… and received features. request features of block initially without brush required. This is focused on displaying tracks when blocks are added to the axis, and features are received. axis-2d.js : dataBlocks() : depend on blockService.viewed.[] axis-tracks.js : merge(gpS) so that existing g.tracks are updated, and .exit().remove() for gpS and clipRectS. showTrackBlocks() : depend on axis1d.featureLength. axis-1d.js : featureLength() : depend on featuresForAxis. models/block.js : add featuresForAxis(). data/block.js : add dataAndReferences : add blockIds to blocksToView, for receivedBlocks(). paths-progressive.js : requestBlockFeaturesInterval() : there may not be a brush (handle axisBrush === null). frontend/app/ : ce195b1 10637 Sep 13 19:59 components/axis-2d.js 773885e 24888 Sep 17 10:52 components/axis-tracks.js c517d5d 22637 Sep 17 11:18 components/draw/axis-1d.js 5cadd92 1188 Sep 16 17:01 models/axis-brush.js 4b2106c 13417 Sep 16 17:01 models/block-adj.js 7564ed2 8048 Sep 16 17:01 models/block.js 50ef5be 15793 Sep 16 18:24 services/data/block.js 5e7159e 23626 Sep 17 10:31 services/data/paths-progressive.js
plantinformatics · Sep 17, 2019 · a0b873c · a0b873c
1 parent 2c5f1c9
commit a0b873c
Show file tree

Hide file tree

Showing 8 changed files with 93 additions and 25 deletions.
diff --git a/frontend/app/components/axis-2d.js b/frontend/app/components/axis-2d.js
@@ -54,15 +54,17 @@ export default Ember.Component.extend(Ember.Evented, AxisEvents, {
   /** The above dataBlocksS() is based on stacks.js data structure for axes and blocks;
    * this function instead is based on the Ember store blocks, via the ComputedProperty axesBlocks.
    * This can replace dataBlocksS(), which may be updated after a delay.
+   * @return [] if there are no blocks with data in the axis.
    */
   dataBlocks : Ember.computed(
     'axisID',  'blockService.dataBlocks.@each.{isViewed,hasFeatures}',
+    'blockService.viewed.[]',
     function () {
       let
         /** related : blockService.axesBlocks, axis1d.dataBlocks */
         dataBlocksMap = this.get('blockService.dataBlocks'),
       id = this.get('axisID'),
-      dataBlocks = dataBlocksMap && dataBlocksMap.get(id);
+      dataBlocks = (dataBlocksMap && dataBlocksMap.get(id)) || [];
       console.log('dataBlocksMap', id, dataBlocksMap, dataBlocks);
       return dataBlocks;
     }),

diff --git a/frontend/app/components/axis-tracks.js b/frontend/app/components/axis-tracks.js
@@ -364,7 +364,7 @@ export default InAxis.extend({
       data = tracksLayout.intervals;
       if (false)  // actually need to sum the .layoutWidth for all blockId-s, plus the block offsets which are calculated below
       setClipWidth(axisID, tracksLayout.layoutWidth);
-      console.log('trackBlocksData', blockId, data.length, (data.length == 0) || y(data[0][0]));
+      console.log('trackBlocksData', blockId, data.length, (data.length == 0) ? '' : y(data[0][0]));
       return data;
     };
     // a block with 1 feature will have pxSize == 0.  perhaps just skip the filter.
@@ -394,14 +394,17 @@ export default InAxis.extend({
       return 'translate(' + xOffset + ',0)';
     }
     /** parent; contains g > rect, maybe later a text.resizer.  */
-    let gp =   gAxis
+    let gpS =   gAxis
       .selectAll("g.tracks")
-      .data(blockIds)
+      .data(blockIds),
+    gp = gpS
       .enter()
       .append("g")  // .insert(, ":last-child")
-      .attr('id', function (blockId) { return blockId; })
-      .attr('transform', blockTransform)
-      .attr('class', 'tracks');
+      .attr('class', 'tracks')
+      .merge(gpS)
+      .attr('id', function (blockId) { console.log('', this, blockId); return blockId; })
+      .attr('transform', blockTransform);
+    gpS.exit().remove();
     /* this is for resizing the width of axis-tracks; may instead scale width of
      * rectangles to fit available width. */
     if (false) { // not completed.  Can base resizedParentElt() on axis-2d.js : resized()
@@ -414,14 +417,17 @@ export default InAxis.extend({
       eltWidthResizable("g.axis-use > g.tracks > text.resizer", resizedParentElt);
   }
     /** define the clipPath.  1 clipPath per axis. */
-    let clipRect =
+    let clipRectS =
       gAxis.selectAll('clipPath')
-      .data([axisID])
+      .data([axisID]),
+    clipRect = clipRectS
       .enter()
       .append("clipPath")       // define a clip path
       .attr("id", axisEltIdClipPath) // give the clipPath an ID
       .append("rect")          // shape it as a rect
     ;
+    clipRectS
+      .exit().remove();
     /* During zoom calcs, axis-ticks positions elements before the data is
      * re-filtered, causing gAxis bbox to be large.  Don't resize to that.
      * No longer using bbox.height anyway
@@ -483,7 +489,7 @@ export default InAxis.extend({
         return axisTitleColour(blockId, i+1) || 'black';
       })
     ;
-    console.log(gAxis.node(), rs.nodes(), re.nodes(), 'ra', ra.nodes(), ra.node(), 'rx', rx.size());
+    console.log(gAxis.node(), rs.size(), re.size(), 'ra', ra.size(), ra.node(), 'rx', rx.size());
     rx.remove();
 
     /** record the positions (index) of the elements g.selector
@@ -611,14 +617,15 @@ export default InAxis.extend({
     return width;
   }),
   showTrackBlocks: Ember.computed(
-    'tracksTree', 'yDomain.0', 'yDomain.1', 'axis1d.zoomed', 'axis1d.extended',
+    'tracksTree', 'yDomain.0', 'yDomain.1', 'axis1d.zoomed', 'axis1d.extended', 'axis1d.featureLength',
     function() {
       let tracks = this.get('tracksTree');
       let axis1d = this.get('axis1d'),
       zoomed = this.get('axis1d.zoomed'),
       extended = this.get('axis1d.extended'),
+      featureLength = this.get('axis1d.featureLength'),
       yDomain = this.get('yDomain');
-      console.log('showTrackBlocks', this, tracks, axis1d, yDomain, 'axis1d.zoomed', zoomed, extended);
+      console.log('showTrackBlocks', this, tracks, axis1d, yDomain, 'axis1d.zoomed', zoomed, extended, featureLength);
     let blockIds = d3.keys(tracks.intervalTree);
     if (false) {
       let blockId = blockIds[0];

diff --git a/frontend/app/components/draw/axis-1d.js b/frontend/app/components/draw/axis-1d.js
@@ -30,6 +30,8 @@ import { updateDomain } from '../../utils/stacksLayout';
  */
 const axisTickTransitionTime = 750;
 
+
+
 function blockKeyFn(block) { return block.axisName; }
 
 
@@ -382,12 +384,16 @@ export default Ember.Component.extend(Ember.Evented, AxisEvents, AxisPosition, {
     return domain;
   }),
 
-  /** count of features of .dataBlocks */
-  featureLength : Ember.computed('[email protected]', function () {
+  /** count of features of .dataBlocks
+   * Also depend on block.featuresForAxis, to trigger a request for features of
+   * a block when it is added to an axis.
+   */
+  featureLength : Ember.computed('dataBlocks.@each.{featuresLength,featuresForAxis}', function () {
     let dataBlocks = this.get('dataBlocks'),
     featureLengths = dataBlocks.map(function (b) { return b.get('featuresLength'); } ),
     featureLength = sum(featureLengths);
-    console.log(this, dataBlocks, featureLengths, 'featureLength', featureLength);
+    let featuresForAxis = dataBlocks.map(function (b) { return b.get('featuresForAxis'); } );
+    console.log(this, dataBlocks, featureLengths, 'featureLength', featureLength, featuresForAxis /*.length*/);
     let axisS = this.get('axisS'); if (axisS) axisS.log();
     return featureLength;
   }),

diff --git a/frontend/app/models/axis-brush.js b/frontend/app/models/axis-brush.js
@@ -27,7 +27,6 @@ export default DS.Model.extend({
     if (blockId === undefined)
       blockId = this.id;
     let
-      // getPathsProgressive() expects an array of 2 (string) blockIds.
       features = this.get('pathsP').getBlockFeaturesInterval(blockId);
     let me = this;
     features.then(function (result) {

diff --git a/frontend/app/models/block-adj.js b/frontend/app/models/block-adj.js
@@ -273,7 +273,6 @@ export default DS.Model.extend(Ember.Evented, {
 
     if (flows.direct.visible) {
       let
-        // getPathsProgressive() expects an array of 2 (string) blockIds.
         paths = this.get('pathsPro').getPathsProgressive(this, blockAdjId, taskInstance);
       paths.then(
         function (result) {
@@ -287,7 +286,6 @@ export default DS.Model.extend(Ember.Evented, {
 
     if (flows.alias.visible) {
       let
-        // getPathsProgressive() expects an array of 2 (string) blockIds.
         pathsAliases = this.get('pathsPro').getPathsAliasesProgressive(this, blockAdjId, taskInstance);
       pathsAliases.then(
         function (result) {

diff --git a/frontend/app/models/block.js b/frontend/app/models/block.js
@@ -2,11 +2,17 @@ import Ember from 'ember';
 import DS from 'ember-data';
 import attr from 'ember-data/attr';
 // import { PartialModel, partial } from 'ember-data-partial-model/utils/model';
+const { inject: { service } } = Ember;
+
 
 import { intervalMerge }  from '../utils/interval-calcs';
 
+const moduleName = 'models/block';
+
 
 export default DS.Model.extend({
+  pathsP : service('data/paths-progressive'), // for getBlockFeaturesInterval()
+
   datasetId: DS.belongsTo('dataset'),
   annotations: DS.hasMany('annotation', { async: false }),
   intervals: DS.hasMany('interval', { async: false }),
@@ -178,8 +184,38 @@ export default DS.Model.extend({
     }
     if (! axis)
       console.log('block axis', this.get('id'), this.get('view'), 'no view.axis for block or referenceBlock', referenceBlock);
-  })
+  }),
 
   /*--------------------------------------------------------------------------*/
 
+  /** When block is added to an axis, request features, scoped by the axis
+   * current position.
+   */
+  featuresForAxis : Ember.computed('axis', function () {
+    /** This could be split out into a separate layer, concerned with reactively
+     * requesting data; the layers are : core attributes (of block); derived
+     * attributes (these first 2 are the above functions); actions based on
+     * those other attributes (e.g. this function), similar to
+     * services/data/block.js but for single-block requests.
+     * models/axis-brush.js is part of this, and can be renamed to suit;
+     * this function is equivalent to axis-brush.js : features().
+     */
+    const fnName = 'featuresForAxis';
+    let blockId = this.get('id');
+    let
+      features = this.get('pathsP').getBlockFeaturesInterval(blockId);
+
+    features.then(
+      (result) => {
+        console.log(moduleName, fnName, result.length, blockId, this);
+      },
+      function (err) {
+        console.log(moduleName, fnName, 'reject', err);
+      }
+    );
+
+    return features;
+  })
+
+
 });
diff --git a/frontend/app/services/data/block.js b/frontend/app/services/data/block.js
@@ -100,7 +100,10 @@ export default Service.extend(Ember.Evented, {
     });
     let blocksToView = this.blocksReferences(blockIds);
     this.viewReferences(blocksToView);
-    this.receivedBlocks(blocksToView);
+    let dataAndReferences = blocksToView.concat(
+      blockIds.map((blockId) => { return {id : blockId, obj : this.peekBlock(blockId)}; }));
+      console.log('taskGetSummary dataAndReferences', dataAndReferences);
+    this.receivedBlocks(dataAndReferences);
 
     return blockFeatureCounts;
   }),
@@ -373,7 +376,7 @@ export default Service.extend(Ember.Evented, {
    */
   loadedViewedChildBlocks: Ember.computed(
     'viewed.[]',
-    'blockValues.@each.{isViewed,isLoaded}',
+    'blockValues.@each.{isViewed,isLoaded,hasFeatures}',
     function() {
       let records =
         this.get('viewed')
@@ -393,6 +396,7 @@ export default Service.extend(Ember.Evented, {
   /** @return Map of axes to loaded viewed child blocks */
   axesBlocks : Ember.computed(
     'loadedViewedChildBlocks.[]',
+    '[email protected]',
     function () {
       let records = this.get('loadedViewedChildBlocks'),
       map = records.reduce(
@@ -408,7 +412,7 @@ export default Service.extend(Ember.Evented, {
         new Map()
       );
 
-      console.log('axesBlocks', map);
+      console.log('axesBlocks', map, records);
       return map;
     }),
   /** Lookup the axis of block, and if none then use ensureAxis().

diff --git a/frontend/app/services/data/paths-progressive.js b/frontend/app/services/data/paths-progressive.js
@@ -98,6 +98,11 @@ export default Service.extend({
    * are stored in ember data store, as block-adj.
    * Initially just a single result for each blockID pair,
    * but will later hold results for sub-ranges of each block, at different resolutions.
+   *
+   * @param blockAdj  block-adj which owns the request and the result.
+   * If undefined then the value is looked up from blockAdjId
+   * @param blockAdjId  an array of 2 (string) blockIds.
+   * Used when blockAdj===undefined, and also passed to blocksUpdateDomain().
    */
   getPathsProgressive(blockAdj, blockAdjId, taskInstance) {
     console.log('getPathsProgressive', blockAdj, blockAdjId);
@@ -175,7 +180,8 @@ export default Service.extend({
   },
   /**
    * @param blockAdj  defines the scope of the request; result is stored here.
-   * @param blockAdjId  array of 2 blockIDs which identify blockAdj
+   * @param blockAdjId  array of 2 blockIDs which identify blockAdj,
+   * also used as param to blocksUpdateDomain().
    * @return  promise yielding paths result
    */
   requestPathsProgressive(blockAdj, blockAdjId, taskInstance) {
@@ -340,6 +346,13 @@ export default Service.extend({
   /*--------------------------------------------------------------------------*/
   /* aliases */
 
+  /** 
+   * @param blockAdj  block-adj which owns the request and the result.
+   * If undefined then the value is looked up from blockAdjId
+   * @param blockAdjId  an array of 2 (string) blockIds.
+   * Used when blockAdj===undefined,
+   * and may be passed to blocksUpdateDomain() when that call is added.
+   */
   getPathsAliasesProgressive(blockAdj, blockAdjId, taskInstance) {
     console.log('getPathsAliasesProgressive', blockAdj, blockAdjId);
     let pathsAliases;
@@ -551,14 +564,17 @@ export default Service.extend({
     let pathsViaStream = drawMap.get('controls').view.pathsViaStream;
     let axis = Stacked.getAxis(blockA),
     axisBrush = me.get('store').peekRecord('axis-brush', blockA),
-    brushedDomain = axisBrush.brushedDomain,
+    /** There may not be an axis brush, e.g. when triggered by
+     * featuresForAxis(); in this case : axisBrush is null; don't set
+     * paramAxis.domain. */
+    brushedDomain = axisBrush && axisBrush.brushedDomain,
     paramAxis = intervalParams.axes[0];
     console.log('domain', paramAxis.domain, '-> brushedDomain', brushedDomain);
     /* When the block is first viewed, if it does not have a reference which
      * defines the range then the domain of the block's features is not known,
      * and the axis.domain[] will be [0, 0].
      */
-    if ((brushedDomain[0] === 0) && (brushedDomain[1] === 0))
+    if (! brushedDomain  || ((brushedDomain[0] === 0) && (brushedDomain[1] === 0)))
       delete paramAxis.domain;
     else
       paramAxis.domain = brushedDomain;