Switch return format of bindings to structured output

Author: rreusser

src/components/updatemenus/draw.js

@@ -21,6 +21,28 @@ var anchorUtils = require('../legend/anchor_utils');
 
 var constants = require('./constants');
 
+function computeBindings(gd, menuOpts) {
+    var bindings = [], newBindings;
+    var buttons = menuOpts.buttons;
+    for(var i = 0; i < buttons.length; i++) {
+        newBindings = Plots.computeAPICommandBindings(gd, buttons[i].method, buttons[i].args);
+
+        if(i > 0 && !Plots.bindingsAreConsistent(bindings, newBindings)) {
+            bindings = null;
+            break;
+        }
+
+        for(var j = 0; j < newBindings.length; j++) {
+            var b = newBindings[j];
+
+            if(bindings.indexOf(b) === -1) {
+                bindings.push(b);
+            }
+        }
+    }
+
+    return bindings;
+}
 
 module.exports = function draw(gd) {
     var fullLayout = gd._fullLayout,
@@ -115,6 +137,8 @@ module.exports = function draw(gd) {
     headerGroups.each(function(menuOpts) {
         var gHeader = d3.select(this);
 
+        computeBindings(gd, menuOpts);
+
         if(menuOpts.type === 'dropdown') {
             drawHeader(gd, gHeader, gButton, menuOpts);
 

src/plots/command.js

@@ -12,6 +12,60 @@
 var Plotly = require('../plotly');
 var Lib = require('../lib');
 
+var attrPrefixRegex = /^(data|layout)(\[(-?[0-9]*)\])?\.(.*)$/;
+
+/*
+ * This function checks to see if a set of bindings is compatible
+ * with automatic two-way binding. The criteria right now are that
+ *
+ *   1. multiple traces may be affected
+ *   2. only one property may be affected
+ */
+exports.bindingsAreConsistent = function(currentBindings, newBindings) {
+    // If they're not both arrays of equal length, return false:
+    if(!newBindings || !currentBindings || currentBindings.length !== newBindings.length) {
+        return false;
+    }
+
+    var n = currentBindings.length;
+
+    for(var i = 0; i < n; i++) {
+        // This is not the most efficient check, but the pathological case where there
+        // are an excessive number of bindings should be rare, and at any rate we really
+        // try to bail out early at every opportunity.
+        if(currentBindings.indexOf(newBindings[i]) === -1) {
+            return false;
+        }
+    }
+
+    return true;
+};
+
+exports.evaluateAPICommandBinding = function(gd, attrName) {
+    var match = attrName.match(attrPrefixRegex);
+
+    if(!match) {
+        return null;
+    }
+
+    var group = match[1];
+    var propStr = match[4];
+    var container;
+
+    switch(group) {
+        case 'data':
+            container = gd._fullData[parseInt(match[3])];
+            break;
+        case 'layout':
+            container = gd._fullLayout;
+            break;
+        default:
+            return null;
+    }
+
+    return Lib.nestedProperty(container, propStr).get();
+};
+
 exports.executeAPICommand = function(gd, method, args) {
     var apiMethod = Plotly[method];
 
@@ -44,7 +98,7 @@ exports.computeAPICommandBindings = function(gd, method, args) {
             // This case could be analyzed more in-depth, but for a start,
             // we'll assume that the only relevant modification an animation
             // makes that's meaningfully tracked is the frame:
-            bindings = ['layout._currentFrame'];
+            bindings = [{type: 'layout', prop: '_currentFrame'}];
             break;
         default:
             // We'll elect to fail-non-fatal since this is a correct
@@ -68,14 +122,14 @@ function computeLayoutBindings(gd, args) {
     }
 
     crawl(aobj, function(path) {
-        bindings.push('layout' + path);
-    });
+        bindings.push({type: 'layout', prop: path});
+    }, '', 0);
 
     return bindings;
 }
 
 function computeDataBindings(gd, args) {
-    var i, traces, astr, val, aobj;
+    var traces, astr, val, aobj;
     var bindings = [];
 
     // Logic copied from Plotly.restyle:
@@ -97,41 +151,45 @@ function computeDataBindings(gd, args) {
     }
 
     if(traces === undefined) {
-        traces = [];
-        for(i = 0; i < gd.data.length; i++) {
-            traces.push(i);
-        }
+        // Explicitly assign this to null instead of undefined:
+        traces = null;
     }
 
     crawl(aobj, function(path, attrName, attr) {
-        var nAttr;
+        var thisTraces;
         if(Array.isArray(attr)) {
-            nAttr = Math.min(attr.length, traces.length);
+            var nAttr = Math.min(attr.length, gd.data.length);
+            if(traces) {
+                nAttr = Math.min(nAttr, traces.length);
+            }
+            thisTraces = [];
+            for(var j = 0; j < nAttr; j++) {
+                thisTraces[j] = traces ? traces[j] : j;
+            }
         } else {
-            nAttr = traces.length;
-        }
-        for(var j = 0; j < nAttr; j++) {
-            bindings.push('data[' + traces[j] + ']' + path);
+            thisTraces = traces ? traces.slice(0) : null;
         }
-    });
+
+        bindings.push({
+            type: 'data',
+            prop: path,
+            traces: thisTraces
+        });
+    }, '', 0);
 
     return bindings;
 }
 
-function crawl(attrs, callback, path) {
-    if(path === undefined) {
-        path = '';
-    }
-
+function crawl(attrs, callback, path, depth) {
     Object.keys(attrs).forEach(function(attrName) {
         var attr = attrs[attrName];
 
         if(attrName[0] === '_') return;
 
-        var thisPath = path + '.' + attrName;
+        var thisPath = path + (depth > 0 ? '.' : '') + attrName;
 
         if(Lib.isPlainObject(attr)) {
-            crawl(attr, callback, thisPath);
+            crawl(attr, callback, thisPath, depth + 1);
         } else {
             // Only execute the callback on leaf nodes:
             callback(thisPath, attrName, attr);

src/plots/plots.js

@@ -39,6 +39,8 @@ var ErrorBars = require('../components/errorbars');
 var commandModule = require('./command');
 plots.executeAPICommand = commandModule.executeAPICommand;
 plots.computeAPICommandBindings = commandModule.computeAPICommandBindings;
+plots.evaluateAPICommandBinding = commandModule.evaluateAPICommandBinding;
+plots.bindingsAreConsistent = commandModule.bindingsAreConsistent;
 
 /**
  * Find subplot ids in data.

test/jasmine/tests/binding_test.js

@@ -0,0 +1,27 @@
+var Lib = require('@src/lib/index');
+var Plotly = require('@lib/index');
+var createGraphDiv = require('../assets/create_graph_div');
+var destroyGraphDiv = require('../assets/destroy_graph_div');
+var fail = require('../assets/fail_test');
+
+describe('updateBindings', function() {
+    'use strict';
+
+    var gd;
+    var mock = require('@mocks/updatemenus.json');
+
+    beforeEach(function(done) {
+        gd = createGraphDiv();
+
+        var mockCopy = Lib.extendDeep({}, mock);
+        Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+    });
+
+    afterEach(function() {
+        destroyGraphDiv(gd);
+    });
+
+    it('updates bindings on plot', function(done) {
+        Plotly.restyle(gd, 'marker.size', 10).catch(fail).then(done);
+    });
+});