Merge pull request #3394 from plotly/uirevision-fixes

React + uirevision fixes

Author: etpinard

src/plots/geo/zoom.js

@@ -53,11 +53,14 @@ function sync(geo, projection, cb) {
     var fullLayout = gd._fullLayout;
     var fullOpts = fullLayout[id];
 
+    var preGUI = {};
     var eventData = {};
 
     function set(propStr, val) {
-        var fullNp = Lib.nestedProperty(fullOpts, propStr);
+        preGUI[id + '.' + propStr] = Lib.nestedProperty(userOpts, propStr).get();
+        Registry.call('_storeDirectGUIEdit', layout, fullLayout._preGUI, preGUI);
 
+        var fullNp = Lib.nestedProperty(fullOpts, propStr);
         if(fullNp.get() !== val) {
             fullNp.set(val);
             Lib.nestedProperty(userOpts, propStr).set(val);
@@ -67,7 +70,6 @@ function sync(geo, projection, cb) {
 
     cb(set);
     set('projection.scale', projection.scale() / geo.fitScale);
-    Registry.call('_storeDirectGUIEdit', layout, fullLayout._preGUI, eventData);
     gd.emit('plotly_relayout', eventData);
 }
 

src/plots/gl3d/scene.js

@@ -702,6 +702,7 @@ proto.setCamera = function setCamera(cameraData) {
 
 // save camera to user layout (i.e. gd.layout)
 proto.saveCamera = function saveCamera(layout) {
+    var fullLayout = this.fullLayout;
     var cameraData = this.getCamera();
     var cameraNestedProp = Lib.nestedProperty(layout, this.id + '.camera');
     var cameraDataLastSave = cameraNestedProp.get();
@@ -713,8 +714,9 @@ proto.saveCamera = function saveCamera(layout) {
         return y[vectors[i]] && (x[vectors[i]][components[j]] === y[vectors[i]][components[j]]);
     }
 
-    if(cameraDataLastSave === undefined) hasChanged = true;
-    else {
+    if(cameraDataLastSave === undefined) {
+        hasChanged = true;
+    } else {
         for(var i = 0; i < 3; i++) {
             for(var j = 0; j < 3; j++) {
                 if(!same(cameraData, cameraDataLastSave, i, j)) {
@@ -726,12 +728,14 @@ proto.saveCamera = function saveCamera(layout) {
     }
 
     if(hasChanged) {
+        var preGUI = {};
+        preGUI[this.id + '.camera'] = cameraDataLastSave;
+        Registry.call('_storeDirectGUIEdit', layout, fullLayout._preGUI, preGUI);
+
         cameraNestedProp.set(cameraData);
 
-        var fullLayout = this.fullLayout;
         var cameraFullNP = Lib.nestedProperty(fullLayout, this.id + '.camera');
         cameraFullNP.set(cameraData);
-        Registry.call('_storeDirectGUIEdit', layout, fullLayout._preGUI, cameraData);
     }
 
     return hasChanged;

src/plots/mapbox/mapbox.js

@@ -32,9 +32,6 @@ function Mapbox(opts) {
     // unique id for this Mapbox instance
     this.uid = fullLayout._uid + '-' + this.id;
 
-    // full mapbox options (N.B. needs to be updated on every updates)
-    this.opts = fullLayout[this.id];
-
     // create framework on instantiation for a smoother first plot call
     this.div = null;
     this.xaxis = null;
@@ -57,9 +54,7 @@ module.exports = function createMapbox(opts) {
 
 proto.plot = function(calcData, fullLayout, promises) {
     var self = this;
-
-    // feed in new mapbox options
-    var opts = self.opts = fullLayout[this.id];
+    var opts = fullLayout[self.id];
 
     // remove map and create a new map if access token has change
     if(self.map && (opts.accesstoken !== self.accessToken)) {
@@ -88,7 +83,7 @@ proto.plot = function(calcData, fullLayout, promises) {
 proto.createMap = function(calcData, fullLayout, resolve, reject) {
     var self = this;
     var gd = self.gd;
-    var opts = self.opts;
+    var opts = fullLayout[self.id];
 
     // store style id and URL or object
     var styleObj = self.styleObj = getStyleObj(opts.style);
@@ -147,14 +142,16 @@ proto.createMap = function(calcData, fullLayout, resolve, reject) {
         // duplicate 'plotly_relayout' events.
 
         if(eventData.originalEvent || wheeling) {
-            var view = self.getView();
+            var optsNow = gd._fullLayout[self.id];
+            Registry.call('_storeDirectGUIEdit', gd.layout, gd._fullLayout._preGUI, self.getViewEdits(optsNow));
 
-            opts._input.center = opts.center = view.center;
-            opts._input.zoom = opts.zoom = view.zoom;
-            opts._input.bearing = opts.bearing = view.bearing;
-            opts._input.pitch = opts.pitch = view.pitch;
+            var viewNow = self.getView();
+            optsNow._input.center = optsNow.center = viewNow.center;
+            optsNow._input.zoom = optsNow.zoom = viewNow.zoom;
+            optsNow._input.bearing = optsNow.bearing = viewNow.bearing;
+            optsNow._input.pitch = optsNow.pitch = viewNow.pitch;
 
-            emitRelayoutFromView(view);
+            gd.emit('plotly_relayout', self.getViewEdits(viewNow));
         }
         wheeling = false;
     });
@@ -186,35 +183,25 @@ proto.createMap = function(calcData, fullLayout, resolve, reject) {
     map.on('zoomstart', unhover);
 
     map.on('dblclick', function() {
-        gd.emit('plotly_doubleclick', null);
+        var optsNow = gd._fullLayout[self.id];
+        Registry.call('_storeDirectGUIEdit', gd.layout, gd._fullLayout._preGUI, self.getViewEdits(optsNow));
 
         var viewInitial = self.viewInitial;
-
         map.setCenter(convertCenter(viewInitial.center));
         map.setZoom(viewInitial.zoom);
         map.setBearing(viewInitial.bearing);
         map.setPitch(viewInitial.pitch);
 
         var viewNow = self.getView();
+        optsNow._input.center = optsNow.center = viewNow.center;
+        optsNow._input.zoom = optsNow.zoom = viewNow.zoom;
+        optsNow._input.bearing = optsNow.bearing = viewNow.bearing;
+        optsNow._input.pitch = optsNow.pitch = viewNow.pitch;
 
-        opts._input.center = opts.center = viewNow.center;
-        opts._input.zoom = opts.zoom = viewNow.zoom;
-        opts._input.bearing = opts.bearing = viewNow.bearing;
-        opts._input.pitch = opts.pitch = viewNow.pitch;
-
-        emitRelayoutFromView(viewNow);
+        gd.emit('plotly_doubleclick', null);
+        gd.emit('plotly_relayout', self.getViewEdits(viewNow));
     });
 
-    function emitRelayoutFromView(view) {
-        var id = self.id;
-        var evtData = {};
-        for(var k in view) {
-            evtData[id + '.' + k] = view[k];
-        }
-        Registry.call('_storeDirectGUIEdit', gd.layout, gd._fullLayout._preGUI, evtData);
-        gd.emit('plotly_relayout', evtData);
-    }
-
     // define event handlers on map creation, to keep one ref per map,
     // so that map.on / map.off in updateFx works as expected
     self.clearSelect = function() {
@@ -248,10 +235,11 @@ proto.createMap = function(calcData, fullLayout, resolve, reject) {
 proto.updateMap = function(calcData, fullLayout, resolve, reject) {
     var self = this;
     var map = self.map;
+    var opts = fullLayout[this.id];
 
     self.rejectOnError(reject);
 
-    var styleObj = getStyleObj(self.opts.style);
+    var styleObj = getStyleObj(opts.style);
 
     if(self.styleObj.id !== styleObj.id) {
         self.styleObj = styleObj;
@@ -309,14 +297,14 @@ proto.updateData = function(calcData) {
 
 proto.updateLayout = function(fullLayout) {
     var map = this.map;
-    var opts = this.opts;
+    var opts = fullLayout[this.id];
 
     map.setCenter(convertCenter(opts.center));
     map.setZoom(opts.zoom);
     map.setBearing(opts.bearing);
     map.setPitch(opts.pitch);
 
-    this.updateLayers();
+    this.updateLayers(fullLayout);
     this.updateFramework(fullLayout);
     this.updateFx(fullLayout);
     this.map.resize();
@@ -463,8 +451,8 @@ proto.updateFramework = function(fullLayout) {
     this.yaxis._length = size.h * (domain.y[1] - domain.y[0]);
 };
 
-proto.updateLayers = function() {
-    var opts = this.opts;
+proto.updateLayers = function(fullLayout) {
+    var opts = fullLayout[this.id];
     var layers = opts.layers;
     var layerList = this.layerList;
     var i;
@@ -519,7 +507,6 @@ proto.project = function(v) {
 // get map's current view values in plotly.js notation
 proto.getView = function() {
     var map = this.map;
-
     var mapCenter = map.getCenter();
     var center = { lon: mapCenter.lng, lat: mapCenter.lat };
 
@@ -531,6 +518,19 @@ proto.getView = function() {
     };
 };
 
+proto.getViewEdits = function(cont) {
+    var id = this.id;
+    var keys = ['center', 'zoom', 'bearing', 'pitch'];
+    var obj = {};
+
+    for(var i = 0; i < keys.length; i++) {
+        var k = keys[i];
+        obj[id + '.' + k] = cont[k];
+    }
+
+    return obj;
+};
+
 function getStyleObj(val) {
     var styleValues = layoutAttributes.style.values;
     var styleDflt = layoutAttributes.style.dflt;