Methods for extendTrace and extendLayout

Author: rreusser

src/lib/index.js

@@ -594,13 +594,15 @@ lib.objectFromPath = function(path, value) {
  * // returns { nested: { test: {path: 'value'}}}
  */
 
-// Store this to avoid recompiling regex on every prop since this may happen many
-// many times for animations.
-// TODO: Premature optimization? Remove?
-var dottedPropertyRegex = /^([^\.]*)\../;
+// Store this to avoid recompiling regex on *every* prop since this may happen many
+// many times for animations. Could maybe be inside the function. Not sure about
+// scoping vs. recompilation tradeoff, but at least it's not just inlining it into
+// the inner loop.
+var dottedPropertyRegex = /^([^\[\.]+)\.(.+)?/;
+var indexedPropertyRegex = /^([^\.]+)\[([0-9]+)\](\.)?(.+)?/;
 
 lib.expandObjectPaths = function(data) {
-    var match, key, prop, datum;
+    var match, key, prop, datum, idx, dest, trailingPath;
     if(typeof data === 'object' && !Array.isArray(data)) {
         for(key in data) {
             if(data.hasOwnProperty(key)) {
@@ -611,12 +613,30 @@ lib.expandObjectPaths = function(data) {
                     delete data[key];
 
                     data[prop] = lib.extendDeepNoArrays(data[prop] || {}, lib.objectFromPath(key, lib.expandObjectPaths(datum))[prop]);
+                } else if((match = key.match(indexedPropertyRegex))) {
+                    datum = data[key];
+
+                    prop = match[1];
+                    idx = parseInt(match[2]);
+
+                    delete data[key];
+
+                    data[prop] = data[prop] || [];
+
+                    if(match[3] === '.') {
+                        trailingPath = match[4];
+                        dest = data[prop][idx] = data[prop][idx] || {};
+                        lib.extendDeepNoArrays(dest, lib.objectFromPath(trailingPath, lib.expandObjectPaths(datum)));
+                    } else {
+                        data[prop][idx] = lib.expandObjectPaths(datum);
+                    }
                 } else {
                     data[key] = lib.expandObjectPaths(data[key]);
                 }
             }
         }
     }
+
     return data;
 };
 

src/plots/plots.js

@@ -1299,7 +1299,7 @@ plots.modifyFrames = function(gd, operations) {
  */
 plots.computeFrame = function(gd, frameName) {
     var frameLookup = gd._transitionData._frameHash;
-    var i, traceIndices, traceIndex, expandedObj, destIndex, copy;
+    var i, traceIndices, traceIndex, destIndex;
 
     var framePtr = frameLookup[frameName];
 
@@ -1361,49 +1361,94 @@ plots.computeFrame = function(gd, frameName) {
                     result.traces[destIndex] = traceIndex;
                 }
 
-                try {
-                    result.data[destIndex] = plots.extendTrace(result.data[destIndex], framePtr.data[i]);
-                } catch (e) {
-                    console.error(e);
-                }
+                result.data[destIndex] = plots.extendTrace(result.data[destIndex], framePtr.data[i]);
             }
         }
     }
 
     return result;
 };
 
-plots.extendObjectWithContainers = function (dest, src, containerPaths) {
+/**
+ * Extend an object, treating container arrays very differently by extracting
+ * their contents and merging them separately.
+ *
+ * This exists so that we can extendDeepNoArrays and avoid stepping into data
+ * arrays without knowledge of the plot schema, but so that we may also manually
+ * recurse into known container arrays, such as transforms.
+ *
+ * See extendTrace and extendLayout below for usage.
+ */
+plots.extendObjectWithContainers = function(dest, src, containerPaths) {
+    var containerProp, containerVal, i, j, srcProp, destProp, srcContainer, destContainer;
     var copy = Lib.extendDeepNoArrays({}, src || {});
     var expandedObj = Lib.expandObjectPaths(copy);
+    var containerObj = {};
+
+    // Step through and extract any container properties. Otherwise extendDeepNoArrays
+    // will clobber any existing properties with an empty array and then supplyDefaults
+    // will reset everything to defaults.
+    if(containerPaths && containerPaths.length) {
+        for(i = 0; i < containerPaths.length; i++) {
+            containerProp = Lib.nestedProperty(expandedObj, containerPaths[i]);
+            containerVal = containerProp.get();
+            containerProp.set(null);
+            Lib.nestedProperty(containerObj, containerPaths[i]).set(containerVal);
+        }
+    }
 
-    if (containerPaths && containerPaths.length) {
-        for (var i = 0; i < containerPaths.length; i++) {
-            var srcProp = Lib.nestedProperty(src, containerPaths[i]);
-            var srcVal = srcProp.get();
-
-            console.log('src, containerPaths[i], srcVal:', src, containerPaths[i], srcVal);
-
+    dest = Lib.extendDeepNoArrays(dest || {}, expandedObj);
 
-            if (!srcVal) continue;
+    if(containerPaths && containerPaths.length) {
+        for(i = 0; i < containerPaths.length; i++) {
+            srcProp = Lib.nestedProperty(containerObj, containerPaths[i]);
+            srcContainer = srcProp.get();
 
-            var destProp = Lib.nestedProperty(src, containerPaths[i]);
-            var destVal = destProp.get();
+            if(!srcContainer) continue;
 
+            destProp = Lib.nestedProperty(dest, containerPaths[i]);
 
+            destContainer = destProp.get();
+            if(!Array.isArray(destContainer)) {
+                destContainer = [];
+                destProp.set(destContainer);
+            }
 
+            for(j = 0; j < srcContainer.length; j++) {
+                destContainer[j] = plots.extendObjectWithContainers(destContainer[j], srcContainer[j]);
+            }
         }
     }
 
-    return Lib.extendDeepNoArrays(dest || {}, expandedObj);
+    return dest;
 };
 
-plots.extendTrace = function (destTrace, srcTrace) {
+/*
+ * Extend a trace definition. This method:
+ *
+ *  1. directly transfers any array references
+ *  2. manually recurses into container arrays like transforms
+ *
+ * The result is the original object reference with the new contents merged in.
+ */
+plots.extendTrace = function(destTrace, srcTrace) {
     return plots.extendObjectWithContainers(destTrace, srcTrace, ['transforms']);
 };
 
-plots.extendLayout = function (destLayout, srcLayout) {
-    return plots.extendObjectWithContainers(destLayout, srcLayout, []);
+/*
+ * Extend a layout definition. This method:
+ *
+ *  1. directly transfers any array references (not critically important for
+ *     layout since there aren't really data arrays)
+ *  2. manually recurses into container arrays like annotations
+ *
+ * The result is the original object reference with the new contents merged in.
+ */
+plots.extendLayout = function(destLayout, srcLayout) {
+    return plots.extendObjectWithContainers(destLayout, srcLayout, [
+        'annotations',
+        'shapes'
+    ]);
 };
 
 /**

test/jasmine/tests/lib_test.js

@@ -537,6 +537,54 @@ describe('Test lib.js:', function() {
             expect(input).toBe(expanded);
             expect(origArray).toBe(newArray);
         });
+
+        it('expands bracketed array notation', function() {
+            var input = {'marker[1]': {color: 'red'}};
+            var expected = {marker: [undefined, {color: 'red'}]};
+            expect(Lib.expandObjectPaths(input)).toEqual(expected);
+        });
+
+        it('expands nested arrays', function() {
+            var input = {'marker[1].range[1]': 5};
+            var expected = {marker: [undefined, {range: [undefined, 5]}]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
+
+        it('expands bracketed array with more nested attributes', function() {
+            var input = {'marker[1]': {'color.alpha': 2}};
+            var expected = {marker: [undefined, {color: {alpha: 2}}]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
+
+        it('expands bracketed array notation without further nesting', function() {
+            var input = {'marker[1]': 8};
+            var expected = {marker: [undefined, 8]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
+
+        it('expands bracketed array notation with further nesting', function() {
+            var input = {'marker[1].size': 8};
+            var expected = {marker: [undefined, {size: 8}]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
+
+        it('expands bracketed array notation with further nesting', function() {
+            var input = {'marker[1].size.magnitude': 8};
+            var expected = {marker: [undefined, {size: {magnitude: 8}}]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
+
+        it('combines changes', function() {
+            var input = {'marker[1].range[1]': 5, 'marker[1].range[0]': 4};
+            var expected = {marker: [undefined, {range: [4, 5]}]};
+            var computed = Lib.expandObjectPaths(input);
+            expect(computed).toEqual(expected);
+        });
     });
 
     describe('coerce', function() {

test/jasmine/tests/transition_test.js

@@ -28,7 +28,7 @@ function runTests(transitionDuration) {
             destroyGraphDiv();
         });
 
-        /*it('resolves only once the transition has completed', function(done) {
+        it('resolves only once the transition has completed', function(done) {
             var t1 = Date.now();
             var traces = plotApiHelpers.coerceTraceIndices(gd, null);
 
@@ -63,7 +63,7 @@ function runTests(transitionDuration) {
                 .then(function() {
                     expect(trEndCnt).toEqual(1);
                 }).catch(fail).then(done);
-        });*/
+        });
 
         it('transitions a transform', function(done) {
             Plotly.restyle(gd, {
@@ -99,7 +99,6 @@ function runTests(transitionDuration) {
                 }]);
             }).catch(fail).then(done);
         });
-        return;
 
         // This doesn't really test anything that the above tests don't cover, but it combines
         // the behavior and attempts to ensure chaining and events happen in the correct order.