Merge pull request #172 from plotly/eslint

Lint with eslint

Author: etpinard

.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]
+  },
+}

.jshintrc

@@ -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.

CONTRIBUTING.md

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

devtools/.eslintrc

@@ -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/image_viewer/viewer.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/buttons.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/server.js

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

devtools/test_dashboard/test_cartesian.js

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