Lint with eslint

.eslintignore

@@ -0,0 +1,7 @@
+node_modules
+dist
+build
+
+test/jasmine/assets/jquery-1.8.3.min.js
+src/plots/polar/micropolar.js
+src/plots/geo/projections.js

.eslintrc

@@ -0,0 +1,40 @@
+{
+  "root": true,
+  "extends": [
+    "eslint:recommended",
+  ],
+  "env": {
+    "commonjs": true
+  },
+  "rules": {
+    "no-trailing-spaces": [2],
+    "no-multiple-empty-lines": [2, {"max": 3, "maxEOF": 1}],
+    "linebreak-style": [2, "unix"],
+    "indent": [2, 4, {"SwitchCase": 1}],
+    "max-len": [0, 80],
+    "brace-style": [0, "stroustrup", {"allowSingleLine": true}],
+    "curly": [0, "multi"],
+    "camelcase": [0, {"properties": "never"}],
+    "comma-spacing": [0, {"before": false, "after": true}],
+    "comma-style": [2, "last"],
+    "semi": [2],
+    "semi-spacing": [2, {"before": false, "after": true}],
+    "key-spacing": [0, {"beforeColon": false, "afterColon": true}],
+    "no-spaced-func": [2],
+    "space-in-parens": [2, "never"],
+    "space-before-function-paren": [2, "never"],
+    "no-multi-spaces": [2],
+    "space-infix-ops": [0, {"int32Hint": false}],
+    "quotes": [2, "single"],
+    "dot-notation": [2, {"allowKeywords": false}],
+    "eqeqeq": [2],
+    "new-cap": [0],
+    "no-redeclare": [2, {"builtinGlobals": true}],
+    "no-shadow": [0, {"builtinGlobals": true}],
+    "block-scoped-var": [2],
+    "no-unused-vars": [2],
+    "no-use-before-define": [2, "nofunc"],
+    "no-loop-func": [2],
+    "no-console": [0]
+  },
+}

CONTRIBUTING.md

@@ -116,8 +116,9 @@ To view the results of a run on CircleCI, download the `build/test_images/` and
 
 ### Coding style
 
-- 4-space indentation
-- semi-colons are required
-- trailing commas
-
 Check if ok, with `npm run lint`
+
+- See [eslintrc](https://github.com/plotly/plotly.js/blob/master/.eslintrc) and
+  the eslint [list of rules](http://eslint.org/docs/rules/) for more details.
+- Rules listed in the eslintrc file with the ignore flag `0` are the recommended
+  rules for new code added.

devtools/.eslintrc

@@ -0,0 +1,7 @@
+{
+  "extends": "../.eslintrc",
+  "env": {
+    "node": true,
+    "browser": true
+  }
+}

devtools/image_viewer/viewer.js

@@ -37,7 +37,7 @@ function createButton(imageName) {
     button.style.height = '40px';
     button.innerHTML = imageName;
 
-    button.addEventListener('click', function () {
+    button.addEventListener('click', function() {
         var imgBaseline = createImg(dirBaseline, imageName),
             imgTest = createImg(dirTest, imageName),
             imgDiff = createImg(dirDiff, 'diff-' + imageName);
@@ -50,7 +50,7 @@ function createButton(imageName) {
 
             $mock.innerHTML = '';
             $mock.appendChild(createJSONview(mock));
-       });
+        });
     });
 
     return button;

devtools/test_dashboard/buttons.js

@@ -1,3 +1,5 @@
+/* global Plotly:false Tabs:false */
+
 var plotlist = document.getElementById('plot-list');
 var anchor = document.getElementById('embedded-graph');
 var image = document.getElementById('embedded-image');
@@ -11,7 +13,7 @@ anchor.style.width = '1000px';
 
 function plotButtons(plots, figDir) {
 
-    Object.keys(plots).forEach( function (plotname) {
+    Object.keys(plots).forEach(function(plotname) {
 
         var button = document.createElement('button');
 
@@ -23,7 +25,7 @@ function plotButtons(plots, figDir) {
 
         plotlist.appendChild(button);
 
-        button.addEventListener('click', function () {
+        button.addEventListener('click', function() {
 
             var myImage = new Image();
             myImage.src = figDir + plotname + '.png';
@@ -55,7 +57,7 @@ function plotButtons(plots, figDir) {
 
     plotlist.appendChild(snapshot);
 
-    snapshot.addEventListener('click', function () {
+    snapshot.addEventListener('click', function() {
 
         /*
          * Grab the currently loaded plot and make an image - replacing the plot.
@@ -67,7 +69,7 @@ function plotButtons(plots, figDir) {
 
         if (!layout || !data) return;
 
-        Plotly.Plots.getSubplotIds(gd._fullLayout, 'gl3d').forEach( function (key) {
+        Plotly.Plots.getSubplotIds(gd._fullLayout, 'gl3d').forEach(function(key) {
             var scene = gd._fullLayout[key]._scene;
             scene.destroy();
         });
@@ -80,23 +82,23 @@ function plotButtons(plots, figDir) {
         /*
          * Replot with staticPlot
          */
-        Plotly.plot(gd, data, layout, {staticPlot: true, plotGlPixelRatio: 2}).then( function () {
-            Plotly.Plots.getSubplotIds(gd._fullLayout, 'gl3d').forEach( function (key) {
-                  var scene = gd._fullLayout[key]._scene;
-                  var dataURL = scene.toImage();
-
-                  var myImage = new Image();
-                  myImage.src = dataURL;
-
-                  myImage.onload = function () {
-                      myImage.height = scene.container.clientHeight;
-                      myImage.width = scene.container.clientWidth;
-                  };
-
-                  image.innerHTML = '';
-                  image.appendChild(myImage);
-              });
-        })
+        Plotly.plot(gd, data, layout, {staticPlot: true, plotGlPixelRatio: 2}).then(function() {
+            Plotly.Plots.getSubplotIds(gd._fullLayout, 'gl3d').forEach(function(key) {
+                var scene = gd._fullLayout[key]._scene;
+                var dataURL = scene.toImage();
+
+                var myImage = new Image();
+                myImage.src = dataURL;
+
+                myImage.onload = function() {
+                    myImage.height = scene.container.clientHeight;
+                    myImage.width = scene.container.clientWidth;
+                };
+
+                image.innerHTML = '';
+                image.appendChild(myImage);
+            });
+        });
     });
 
     var pummelButton = document.createElement('button');
@@ -112,17 +114,17 @@ function plotButtons(plots, figDir) {
     var mock = require('@mocks/gl3d_marker-color.json');
     var statusDiv = document.getElementById('status-info');
 
-    pummelButton.addEventListener('click', function () {
-        setInterval(function () {
+    pummelButton.addEventListener('click', function() {
+        setInterval(function() {
             var plotDiv = document.createElement('div');
             window.plotDiv = plotDiv;
 
             plotDiv.id = 'div' + i;
             document.body.appendChild(plotDiv);
 
-            Plotly.plot(plotDiv, mock.data, mock.layout, {staticPlot: true}).then(function () {
+            Plotly.plot(plotDiv, mock.data, mock.layout, {staticPlot: true}).then(function() {
 
-                Plotly.Plots.getSubplotIds(plotDiv._fullLayout, 'gl3d').forEach( function (key) {
+                Plotly.Plots.getSubplotIds(plotDiv._fullLayout, 'gl3d').forEach(function(key) {
                     var scene = plotDiv._fullLayout[key]._scene;
                     scene.destroy();
                     i ++;
@@ -144,7 +146,7 @@ function plotButtons(plots, figDir) {
     scrapeButton.style.background = 'blue';
     plotlist.appendChild(scrapeButton);
 
-    scrapeButton.addEventListener('click', function () {
+    scrapeButton.addEventListener('click', function() {
         Plotly.Snapshot.toSVG(Tabs.get());
         return;
     });

devtools/test_dashboard/server.js

@@ -18,13 +18,13 @@ var testFile;
 switch(process.argv[2]) {
     case 'cartesian':
         testFile = 'test_cartesian';
-    break;
+        break;
     case 'geo':
         testFile = 'test_geo';
-    break;
+        break;
     case 'gl3d':
         testFile = 'test_gl3d';
-    break;
+        break;
     default:
         testFile = 'test_gl2d';
 }

devtools/test_dashboard/test_cartesian.js

@@ -1,3 +1,5 @@
+/*eslint dot-notation: 0*/
+
 var plotButtons = require('./buttons');
 
 var figDir = '../../test/image/baselines/';

devtools/test_dashboard/test_geo.js

@@ -1,3 +1,5 @@
+/*eslint dot-notation: 0*/
+
 var plotButtons = require('./buttons');
 
 var figDir = '../../test/image/baselines/geo_';

devtools/test_dashboard/test_gl2d.js

@@ -1,3 +1,5 @@
+/*eslint dot-notation: 0*/
+
 var plotButtons = require('./buttons');
 
 var figDir = '../../test/image/baselines/gl2d_';

devtools/test_dashboard/test_gl3d.js

@@ -1,3 +1,5 @@
+/*eslint dot-notation: 0*/
+
 var plotButtons = require('./buttons');
 
 var figDir = '../../test/image/baselines/gl3d_';

package.json

@@ -27,7 +27,7 @@
     "build": "npm run preprocess && npm run bundle && npm run header",
     "cibuild": "node tasks/cibundle.js",
     "watch": "node tasks/watch_plotly.js",
-    "lint": "cd src && jshint . || true",
+    "lint": "eslint . || true",
     "test-jasmine": "karma start test/jasmine/karma.conf.js",
     "citest-jasmine": "karma start test/jasmine/karma.ciconf.js",
     "test-image": "./tasks/test_image.sh",
@@ -84,7 +84,6 @@
     "falafel": "^1.2.0",
     "glob": "^6.0.1",
     "jasmine-core": "^2.3.4",
-    "jshint": "^2.8.0",
     "karma": "^0.13.15",
     "karma-browserify": "^4.4.1",
     "karma-chrome-launcher": "^0.2.1",

src/.eslintrc

@@ -0,0 +1,9 @@
+{
+  "extends": "../.eslintrc",
+  "env": {
+    "browser": true
+  },
+  "rules": {
+    "strict": [2, "global"]
+  }
+}

src/assets/geo_assets.js

@@ -6,9 +6,11 @@
 * LICENSE file in the root directory of this source tree.
 */
 
+'use strict';
 
 var saneTopojson = require('sane-topojson');
 
+
 // export the version found in the package.json
 exports.version = require('../../package.json').version;
 

src/components/annotations/arrow_paths.js

@@ -6,6 +6,7 @@
 * LICENSE file in the root directory of this source tree.
 */
 
+'use strict';
 
 /**
  * centerx is a center of scaling tuned for maximum scalability of
@@ -17,6 +18,7 @@
  * TODO: option to have the pointed-to  point a little in front of the
  * end of the line, as people tend to want a bit of a gap there...
  */
+
 module.exports = [
     // no arrow
     '',

src/components/annotations/attributes.js

@@ -6,12 +6,14 @@
 * LICENSE file in the root directory of this source tree.
 */
 
+'use strict';
 
 var Plotly = require('../../plotly');
 var ARROWPATHS = require('./arrow_paths');
 var fontAttrs = require('../../plots/font_attributes');
 var extendFlat = require('../../lib/extend').extendFlat;
 
+
 module.exports = {
     _isLinkedToArray: true,