Retain click-selected points in box or lasso select mode [1852]

- If the Shift key is down, data points previously selected by a click
  are now retained when user adds to a selection through box or lasso
  select mode.

Author: rmoestl

src/plots/cartesian/select.js

@@ -71,7 +71,7 @@ function prepSelect(e, startX, startY, dragOptions, mode) {
         (!e.shiftKey && !e.altKey) ||
         ((e.shiftKey || e.altKey) && !plotinfo.selection)
     ) {
-        // create new polygons, if shift mode or selecting across different subplots
+        // create new polygons, if not shift mode or selecting across different subplots
         plotinfo.selection = {};
         plotinfo.selection.polygons = dragOptions.polygons = [];
         plotinfo.selection.mergedPolygons = dragOptions.mergedPolygons = [];
@@ -283,7 +283,7 @@ function prepSelect(e, startX, startY, dragOptions, mode) {
                 for(i = 0; i < searchTraces.length; i++) {
                     searchInfo = searchTraces[i];
 
-                    traceSelection = searchInfo._module.selectPoints(searchInfo, testPoly);
+                    traceSelection = searchInfo._module.selectPoints(searchInfo, testPoly, shouldRetainSelection(e));
                     traceSelections.push(traceSelection);
 
                     thisSelection = fillSelectionItem(traceSelection, searchInfo);
@@ -310,8 +310,6 @@ function prepSelect(e, startX, startY, dragOptions, mode) {
         throttle.done(throttleID).then(function() {
             throttle.clear(throttleID);
 
-            // clear visual boundaries of selection area if displayed
-            outlines.remove();
             if(numClicks === 2) {
                 for(i = 0; i < searchTraces.length; i++) {
                     searchInfo = searchTraces[i];
@@ -320,6 +318,9 @@ function prepSelect(e, startX, startY, dragOptions, mode) {
 
                 updateSelectedState(gd, searchTraces);
                 gd.emit('plotly_deselect', null);
+
+                // clear visual boundaries of selection area if displayed
+                outlines.remove();
             }
             else {
                 // TODO What to do with the code below because we now have behavior for a single click
@@ -358,7 +359,6 @@ function prepSelect(e, startX, startY, dragOptions, mode) {
 // ----------------
 // TODO handle clearing selection when no point is clicked (based on hoverData)
 // TODO do we have to consider multiple traces?
-// TODO implement selection retention (Shift key) for lasso and box
 function selectOnClick(gd, numClicks, evt) {
     var calcData = gd.calcdata[0];
 
@@ -374,7 +374,7 @@ function selectOnClick(gd, numClicks, evt) {
             module = trace._module;
 
         // Execute selection by delegating to respective module
-        var retainSelection = evt.shiftKey,
+        var retainSelection = shouldRetainSelection(evt),
             pointSelected = isPointSelected(trace, hoverDatum.pointNumber),
             onePointSelectedOnly = isOnePointSelectedOnly(trace);
 
@@ -395,6 +395,10 @@ function selectOnClick(gd, numClicks, evt) {
     }
 }
 
+function shouldRetainSelection(evt) {
+    return evt.shiftKey;
+}
+
 function isPointSelected(trace, pointNumber) {
     if(!trace.selectedpoints && !Array.isArray(trace.selectedpoints)) return false;
     return trace.selectedpoints.indexOf(pointNumber) > -1;

src/traces/scatter/select.js

@@ -11,7 +11,7 @@
 
 var subtypes = require('./subtypes');
 
-function selectPoints(searchInfo, polygon) {
+function selectPoints(searchInfo, polygon, retainOtherSelectModesState) {
     var cd = searchInfo.cd,
         xa = searchInfo.xaxis,
         ya = searchInfo.yaxis,
@@ -37,8 +37,13 @@ function selectPoints(searchInfo, polygon) {
             if(polygon.contains([x, y])) {
                 selection.push(_newSelectionItem(i, xa.c2d(di.x), ya.c2d(di.y)));
                 di.selected = 1;
+                di.selectedByPolygon = true;
             } else {
+                if(retainOtherSelectModesState && !di.selectedByPolygon && di.selected === 1) {
+                    continue;
+                }
                 di.selected = 0;
+                delete di.selectedByPolygon;
             }
         }
     }