Merge pull request #3374 from plotly/new-eslint-rules

New eslint rules

Author: etpinard

.eslintrc

@@ -29,7 +29,7 @@
     "max-len": [0, 80],
     "brace-style": [0, "stroustrup", {"allowSingleLine": true}],
     "curly": [2, "multi-line"],
-    "camelcase": [0, {"properties": "never"}],
+    "camelcase": [2, {"properties": "never"}],
     "comma-spacing": [2, {"before": false, "after": true}],
     "comma-style": [2, "last"],
     "semi": [2],
@@ -63,6 +63,7 @@
     "no-shadow": [0, {"builtinGlobals": true}],
     "block-scoped-var": [2],
     "no-unused-vars": [2],
+    "one-var": [2, {"initialized": "never"}],
     "no-undef-init": [2],
     "no-use-before-define": [2, "nofunc"],
     "no-loop-func": [2],

devtools/image_viewer/viewer.js

@@ -3,16 +3,16 @@ var path = require('path');
 
 var d3 = require('d3');
 
-var $plotlist = document.getElementById('plot-list'),
-    $toggles = document.getElementById('plot-toggles'),
-    $images = document.getElementById('plot-images'),
-    $mock = document.getElementById('plot-mock'),
-    $toggleBaseline = document.createElement('button'),
-    $toggleTest = document.createElement('button'),
-    $toggleDiff = document.createElement('button'),
-    $imgBaseline = document.createElement('img'),
-    $imgTest = document.createElement('img'),
-    $imgDiff = document.createElement('img');
+var $plotlist = document.getElementById('plot-list');
+var $toggles = document.getElementById('plot-toggles');
+var $images = document.getElementById('plot-images');
+var $mock = document.getElementById('plot-mock');
+var $toggleBaseline = document.createElement('button');
+var $toggleTest = document.createElement('button');
+var $toggleDiff = document.createElement('button');
+var $imgBaseline = document.createElement('img');
+var $imgTest = document.createElement('img');
+var $imgDiff = document.createElement('img');
 
 $toggles.style.display = 'none';
 $images.style.display = 'none';
@@ -21,13 +21,13 @@ setupToggle($toggleBaseline, $imgBaseline, 'Baseline');
 setupToggle($toggleTest, $imgTest, 'Test');
 setupToggle($toggleDiff, $imgDiff, 'Diff');
 
-var pathToRoot = path.join(__dirname, '../../'),
-    pathToImageTest = path.join(pathToRoot, 'test/image'),
-    pathToBuild = path.join(pathToRoot, 'build/'),
-    dirMocks = path.join(pathToImageTest, 'mocks/'),
-    dirBaseline = path.join(pathToImageTest, 'baselines/'),
-    dirTest = path.join(pathToBuild, 'test_images/'),
-    dirDiff = path.join(pathToBuild, 'test_images_diff/');
+var pathToRoot = path.join(__dirname, '../../');
+var pathToImageTest = path.join(pathToRoot, 'test/image');
+var pathToBuild = path.join(pathToRoot, 'build/');
+var dirMocks = path.join(pathToImageTest, 'mocks/');
+var dirBaseline = path.join(pathToImageTest, 'baselines/');
+var dirTest = path.join(pathToBuild, 'test_images/');
+var dirDiff = path.join(pathToBuild, 'test_images_diff/');
 
 // N.B. brfs only understand hard-coded paths
 var imageNames = fs.readFileSync(

devtools/test_dashboard/devtools.js

@@ -179,7 +179,8 @@ searchBar.addEventListener('keyup', debounce(searchMocks, 250));
 function debounce(func, wait, immediate) {
     var timeout;
     return function() {
-        var context = this, args = arguments;
+        var context = this;
+        var args = arguments;
         var later = function() {
             timeout = null;
             if(!immediate) func.apply(context, args);

package-lock.json

@@ -123,7 +123,7 @@
     "deep-equal": "^1.0.1",
     "derequire": "^2.0.6",
     "ecstatic": "^3.3.0",
-    "eslint": "^5.10.0",
+    "eslint": "^5.11.0",
     "falafel": "^2.0.0",
     "fs-extra": "^2.0.0",
     "fuse.js": "^3.3.0",

package.json

@@ -82,11 +82,11 @@ function onClick(gd, hoverData) {
  * }
  */
 function getToggleSets(gd, hoverData) {
-    var annotations = gd._fullLayout.annotations,
-        onSet = [],
-        offSet = [],
-        explicitOffSet = [],
-        hoverLen = (hoverData || []).length;
+    var annotations = gd._fullLayout.annotations;
+    var onSet = [];
+    var offSet = [];
+    var explicitOffSet = [];
+    var hoverLen = (hoverData || []).length;
 
     var i, j, anni, showMode, pointj, xa, ya, toggleType;
 

src/components/annotations/click.js

@@ -28,19 +28,19 @@ var toLogRange = require('../../lib/to_log_range');
 module.exports = function convertCoords(gd, ax, newType, doExtra) {
     ax = ax || {};
 
-    var toLog = (newType === 'log') && (ax.type === 'linear'),
-        fromLog = (newType === 'linear') && (ax.type === 'log');
+    var toLog = (newType === 'log') && (ax.type === 'linear');
+    var fromLog = (newType === 'linear') && (ax.type === 'log');
 
     if(!(toLog || fromLog)) return;
 
-    var annotations = gd._fullLayout.annotations,
-        axLetter = ax._id.charAt(0),
-        ann,
-        attrPrefix;
+    var annotations = gd._fullLayout.annotations;
+    var axLetter = ax._id.charAt(0);
+    var ann;
+    var attrPrefix;
 
     function convert(attr) {
-        var currentVal = ann[attr],
-            newVal = null;
+        var currentVal = ann[attr];
+        var newVal = null;
 
         if(toLog) newVal = toLogRange(currentVal, ax.range);
         else newVal = Math.pow(10, currentVal);

src/components/annotations/convert_coords.js

@@ -39,9 +39,10 @@ function handleAnnotationDefaults(annIn, annOut, fullLayout) {
     var showArrow = annOut.showarrow;
 
     // positioning
-    var axLetters = ['x', 'y'],
-        arrowPosDflt = [-10, -30],
-        gdMock = {_fullLayout: fullLayout};
+    var axLetters = ['x', 'y'];
+    var arrowPosDflt = [-10, -30];
+    var gdMock = {_fullLayout: fullLayout};
+
     for(var i = 0; i < 2; i++) {
         var axLetter = axLetters[i];
 
@@ -57,9 +58,9 @@ function handleAnnotationDefaults(annIn, annOut, fullLayout) {
         Axes.coercePosition(annOut, gdMock, coerce, axRef, axLetter, 0.5);
 
         if(showArrow) {
-            var arrowPosAttr = 'a' + axLetter,
-                // axref, ayref
-                aaxRef = Axes.coerceRef(annIn, annOut, gdMock, arrowPosAttr, 'pixel');
+            var arrowPosAttr = 'a' + axLetter;
+            // axref, ayref
+            var aaxRef = Axes.coerceRef(annIn, annOut, gdMock, arrowPosAttr, 'pixel');
 
             // for now the arrow can only be on the same axis or specified as pixels
             // TODO: sometime it might be interesting to allow it to be on *any* axis

src/components/annotations/defaults.js

@@ -117,8 +117,8 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
 
     // calculated pixel positions
     // x & y each will get text, head, and tail as appropriate
-    var annPosPx = {x: {}, y: {}},
-        textangle = +options.textangle || 0;
+    var annPosPx = {x: {}, y: {}};
+    var textangle = +options.textangle || 0;
 
     // create the components
     // made a single group to contain all, so opacity can work right
@@ -185,9 +185,9 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
         });
     }
 
-    var borderwidth = options.borderwidth,
-        borderpad = options.borderpad,
-        borderfull = borderwidth + borderpad;
+    var borderwidth = options.borderwidth;
+    var borderpad = options.borderpad;
+    var borderfull = borderwidth + borderpad;
 
     var annTextBG = annTextGroupInner.append('rect')
         .attr('class', 'bg')
@@ -270,24 +270,24 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
         var letters = ['x', 'y'];
 
         for(var i = 0; i < letters.length; i++) {
-            var axLetter = letters[i],
-                axRef = options[axLetter + 'ref'] || axLetter,
-                tailRef = options['a' + axLetter + 'ref'],
-                ax = {x: xa, y: ya}[axLetter],
-                dimAngle = (textangle + (axLetter === 'x' ? 0 : -90)) * Math.PI / 180,
-                // note that these two can be either positive or negative
-                annSizeFromWidth = outerWidth * Math.cos(dimAngle),
-                annSizeFromHeight = outerHeight * Math.sin(dimAngle),
-                // but this one is the positive total size
-                annSize = Math.abs(annSizeFromWidth) + Math.abs(annSizeFromHeight),
-                anchor = options[axLetter + 'anchor'],
-                overallShift = options[axLetter + 'shift'] * (axLetter === 'x' ? 1 : -1),
-                posPx = annPosPx[axLetter],
-                basePx,
-                textPadShift,
-                alignPosition,
-                autoAlignFraction,
-                textShift;
+            var axLetter = letters[i];
+            var axRef = options[axLetter + 'ref'] || axLetter;
+            var tailRef = options['a' + axLetter + 'ref'];
+            var ax = {x: xa, y: ya}[axLetter];
+            var dimAngle = (textangle + (axLetter === 'x' ? 0 : -90)) * Math.PI / 180;
+            // note that these two can be either positive or negative
+            var annSizeFromWidth = outerWidth * Math.cos(dimAngle);
+            var annSizeFromHeight = outerHeight * Math.sin(dimAngle);
+            // but this one is the positive total size
+            var annSize = Math.abs(annSizeFromWidth) + Math.abs(annSizeFromHeight);
+            var anchor = options[axLetter + 'anchor'];
+            var overallShift = options[axLetter + 'shift'] * (axLetter === 'x' ? 1 : -1);
+            var posPx = annPosPx[axLetter];
+            var basePx;
+            var textPadShift;
+            var alignPosition;
+            var autoAlignFraction;
+            var textShift;
 
             /*
              * calculate the *primary* pixel position
@@ -353,8 +353,8 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                     posPx.head = Lib.constrain(posPx.head, 1, maxPx - 1);
                 }
                 if(tailRef === 'pixel') {
-                    var shiftPlus = -Math.max(posPx.tail - 3, posPx.text),
-                        shiftMinus = Math.min(posPx.tail + 3, posPx.text) - maxPx;
+                    var shiftPlus = -Math.max(posPx.tail - 3, posPx.text);
+                    var shiftMinus = Math.min(posPx.tail + 3, posPx.text) - maxPx;
                     if(shiftPlus > 0) {
                         posPx.tail += shiftPlus;
                         posPx.text += shiftPlus;
@@ -451,32 +451,32 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                 .selectAll('.annotation-arrow-g')
                 .remove();
 
-            var headX = annPosPx.x.head,
-                headY = annPosPx.y.head,
-                tailX = annPosPx.x.tail + dx,
-                tailY = annPosPx.y.tail + dy,
-                textX = annPosPx.x.text + dx,
-                textY = annPosPx.y.text + dy,
-
-                // find the edge of the text box, where we'll start the arrow:
-                // create transform matrix to rotate the text box corners
-                transform = Lib.rotationXYMatrix(textangle, textX, textY),
-                applyTransform = Lib.apply2DTransform(transform),
-                applyTransform2 = Lib.apply2DTransform2(transform),
-
-                // calculate and transform bounding box
-                width = +annTextBG.attr('width'),
-                height = +annTextBG.attr('height'),
-                xLeft = textX - 0.5 * width,
-                xRight = xLeft + width,
-                yTop = textY - 0.5 * height,
-                yBottom = yTop + height,
-                edges = [
-                    [xLeft, yTop, xLeft, yBottom],
-                    [xLeft, yBottom, xRight, yBottom],
-                    [xRight, yBottom, xRight, yTop],
-                    [xRight, yTop, xLeft, yTop]
-                ].map(applyTransform2);
+            var headX = annPosPx.x.head;
+            var headY = annPosPx.y.head;
+            var tailX = annPosPx.x.tail + dx;
+            var tailY = annPosPx.y.tail + dy;
+            var textX = annPosPx.x.text + dx;
+            var textY = annPosPx.y.text + dy;
+
+            // find the edge of the text box, where we'll start the arrow:
+            // create transform matrix to rotate the text box corners
+            var transform = Lib.rotationXYMatrix(textangle, textX, textY);
+            var applyTransform = Lib.apply2DTransform(transform);
+            var applyTransform2 = Lib.apply2DTransform2(transform);
+
+            // calculate and transform bounding box
+            var width = +annTextBG.attr('width');
+            var height = +annTextBG.attr('height');
+            var xLeft = textX - 0.5 * width;
+            var xRight = xLeft + width;
+            var yTop = textY - 0.5 * height;
+            var yBottom = yTop + height;
+            var edges = [
+                [xLeft, yTop, xLeft, yBottom],
+                [xLeft, yBottom, xRight, yBottom],
+                [xRight, yBottom, xRight, yTop],
+                [xRight, yTop, xLeft, yTop]
+            ].map(applyTransform2);
 
             // Remove the line if it ends inside the box.  Use ray
             // casting for rotated boxes: see which edges intersect a
@@ -500,9 +500,9 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                 }
             });
 
-            var strokewidth = options.arrowwidth,
-                arrowColor = options.arrowcolor,
-                arrowSide = options.arrowside;
+            var strokewidth = options.arrowwidth;
+            var arrowColor = options.arrowcolor;
+            var arrowSide = options.arrowside;
 
             var arrowGroup = annGroup.append('g')
                 .style({opacity: Color.opacity(arrowColor)})
@@ -557,9 +557,9 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                         }
                     },
                     moveFn: function(dx, dy) {
-                        var annxy0 = applyTransform(annx0, anny0),
-                            xcenter = annxy0[0] + dx,
-                            ycenter = annxy0[1] + dy;
+                        var annxy0 = applyTransform(annx0, anny0);
+                        var xcenter = annxy0[0] + dx;
+                        var ycenter = annxy0[1] + dy;
                         annTextGroupInner.call(Drawing.setTranslate, xcenter, ycenter);
 
                         modifyItem('x', xa ?
@@ -629,9 +629,8 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                             xUpdate = xa.p2r(xa.r2p(options.x) + dx);
 
                         } else {
-                            var widthFraction = options._xsize / gs.w,
-                                xLeft = options.x + (options._xshift - options.xshift) / gs.w -
-                                    widthFraction / 2;
+                            var widthFraction = options._xsize / gs.w;
+                            var xLeft = options.x + (options._xshift - options.xshift) / gs.w - widthFraction / 2;
 
                             xUpdate = dragElement.align(xLeft + dx / gs.w,
                                 widthFraction, 0, 1, options.xanchor);
@@ -640,9 +639,8 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
                         if(ya) {
                             yUpdate = ya.p2r(ya.r2p(options.y) + dy);
                         } else {
-                            var heightFraction = options._ysize / gs.h,
-                                yBottom = options.y - (options._yshift + options.yshift) / gs.h -
-                                    heightFraction / 2;
+                            var heightFraction = options._ysize / gs.h;
+                            var yBottom = options.y - (options._yshift + options.yshift) / gs.h - heightFraction / 2;
 
                             yUpdate = dragElement.align(yBottom - dy / gs.h,
                                 heightFraction, 0, 1, options.yanchor);