Added JSHint and JSXHint for linting the code.

.jshintignore

@@ -0,0 +1,4 @@
+node_modules/
+public/
+vendor/
+tests/

README.md

@@ -54,6 +54,12 @@ Run tests:
 npm test
 ```
 
+Lint code:
+
+```
+jsxhint --jsx-only .
+```
+
 ### Load unpacked in Chrome
 
 1. Clone repository to disk

assets/js/app.jsx

@@ -5,7 +5,7 @@ require('bootstrap');
 var React = require('react');
 
 // React components
-var WakaTime = require('./components/WakaTime.react');
+var WakaTime = require('./components/WakaTime.jsx');
 
 React.render(
     <WakaTime />,

assets/js/components/MainList.jsx

@@ -1,3 +1,5 @@
+/* global chrome */
+
 var React = require('react');
 
 var MainList = React.createClass({

assets/js/components/Options.jsx

@@ -1,3 +1,5 @@
+/* global chrome */
+
 var React = require('react');
 var ReactAddons = require('react/addons');
 var ReactCSSTransitionGroup = ReactAddons.addons.CSSTransitionGroup;
@@ -5,8 +7,8 @@ var ReactCSSTransitionGroup = ReactAddons.addons.CSSTransitionGroup;
 var config = require('../config');
 
 // React components
-var Alert = require('./Alert.react');
+var Alert = require('./Alert.jsx');
-var SitesList = require('./SitesList.react');
+var SitesList = require('./SitesList.jsx');
 
 /**
  * One thing to keep in  mind is that you cannot use this.refs.blacklist if
@@ -113,7 +115,7 @@ var Options = React.createClass({
         var that = this;
 
         var alert = function() {
-            if(that.state.displayAlert == true){
+            if(that.state.displayAlert === true){
 
                 setTimeout(function () {
                     that.setState({displayAlert:false});

assets/js/components/WakaTime.jsx

@@ -1,11 +1,13 @@
+/* global chrome */
+
 var React = require("react");
 var $ = require('jquery');
 
 var config = require('../config');
 
 // React components
-var NavBar = require('./NavBar.react');
+var NavBar = require('./NavBar.jsx');
-var MainList = require('./MainList.react');
+var MainList = require('./MainList.jsx');
 
 // Core
 var WakaTimeOriginal = require('../core/WakaTime');
@@ -30,7 +32,7 @@ var WakaTime = React.createClass({
 
     componentDidMount: function() {
 
-        var wakatime = new WakaTimeOriginal;
+        var wakatime = new WakaTimeOriginal();
 
         var that = this;
 
@@ -62,7 +64,7 @@ var WakaTime = React.createClass({
 
                 wakatime.getTotalTimeLoggedToday().done(function(grand_total) {
                     that.setState({
-                        totalTimeLoggedToday: grand_total['text']
+                        totalTimeLoggedToday: grand_total.text
                     });
                 });
             }
@@ -86,7 +88,7 @@ var WakaTime = React.createClass({
                 deferredObject.resolve(that);
 
             },
-            error: (xhr, status, err) => {
+            error: function(xhr, status, err) {
 
                 console.error(config.logoutUserUrl, status, err.toString());
 

assets/js/config.js

@@ -57,4 +57,4 @@ var config = {
     }
 };
 
-export default config;
+module.exports = config;

assets/js/core/WakaTime.js

@@ -1,3 +1,6 @@
+/* global chrome */
+//jshint esnext:true
+
 var $ = require('jquery');
 var moment = require('moment');
 
@@ -34,7 +37,7 @@ class WakaTime {
             dataType: 'json',
             success: (data) => {
 
-                deferredObject.resolve(data.data[0]['grand_total']);
+                deferredObject.resolve(data.data[0].grand_total);
 
             },
             error: (xhr, status, err) => {

assets/js/devtools.js

@@ -1,3 +1,5 @@
+/* global chrome */
+
 // Create a connection to the background page
 var backgroundPageConnection = chrome.runtime.connect({
     name: "devtools-page"

assets/js/events.js

@@ -1,8 +1,10 @@
+/* global chrome */
+
 // Core
 var WakaTime = require("./core/WakaTime");
 
 // initialize class
-var wakatime = new WakaTime;
+var wakatime = new WakaTime();
 
 // Holds currently open connections (ports) with devtools
 // Uses tabId as index key.

assets/js/helpers/changeExtensionIcon.js

@@ -1,3 +1,5 @@
+/* global chrome */
+
 var config = require('../config');
 
 /**
@@ -6,7 +8,9 @@ var config = require('../config');
  *
  * @param color
  */
-function changeExtensionIcon(color = '') {
+function changeExtensionIcon(color) {
+
+    color = color ? color : '';
 
     var path = null;
 
@@ -43,4 +47,4 @@ function changeExtensionIcon(color = '') {
 
 }
 
-export default changeExtensionIcon;
+module.exports = changeExtensionIcon;

assets/js/helpers/changeExtensionState.js

@@ -10,7 +10,7 @@ var in_array = require('./in_array');
  *
  * @param state
  */
-function changeExtensionState(state){
+function changeExtensionState(state) {
     if (! in_array(state, config.states)) {
         throw new Error('Not a valid state!');
     }
@@ -31,4 +31,4 @@ function changeExtensionState(state){
     }
 }
 
-export default changeExtensionState;
+module.exports = changeExtensionState;

assets/js/helpers/changeExtensionTooltip.js

@@ -1,3 +1,5 @@
+/* global chrome */
+
 var config = require('../config');
 
 /**
@@ -17,4 +19,4 @@ function changeExtensionTooltip(text) {
     chrome.browserAction.setTitle({title: text});
 }
 
-export default changeExtensionTooltip;
+module.exports = changeExtensionTooltip;

assets/js/helpers/currentTimestamp.js

@@ -3,8 +3,8 @@
  *
  * @returns {number}
  */
-function currentTimestamp(){
+function currentTimestamp() {
     return Math.round((new Date()).getTime() / 1000);
 }
 
-export default currentTimestamp;
+module.exports = currentTimestamp;

assets/js/helpers/getDomainFromUrl.js

@@ -10,4 +10,4 @@ function getDomainFromUrl(url) {
     return parts[0] + "//" + parts[2];
 }
 
-export default getDomainFromUrl;
+module.exports = getDomainFromUrl;

assets/js/helpers/in_array.js

@@ -9,11 +9,10 @@ function in_array(needle, haystack) {
     for (var i = 0; i < haystack.length; i ++) {
         if (needle == haystack[i]) {
             return true;
-            break;
         }
     }
 
     return false;
 }
 
-export default in_array;
+module.exports = in_array;

assets/js/options.jsx

@@ -5,7 +5,7 @@ require('bootstrap');
 var React = require('react');
 
 // React components
-var Options = require('./components/Options.react');
+var Options = require('./components/Options.jsx');
 
 React.render(
     <Options />,

gulpfile.js

@@ -19,8 +19,8 @@ elixir(function (mix) {
     mix.copy('vendor/bower_components/font-awesome/less', 'assets/less/font-awesome');
     mix.copy('vendor/bower_components/font-awesome/fonts', 'public/fonts');
     mix.less('app.less');
-    mix.browserify('app.js', null, 'assets/js');
+    mix.browserify('app.jsx', 'public/js/app.js', 'assets/js');
     mix.browserify('events.js', 'public/js/events.js', 'assets/js');
-    mix.browserify('options.js', 'public/js/options.js', 'assets/js');
+    mix.browserify('options.jsx', 'public/js/options.js', 'assets/js');
     mix.browserify('devtools.js', 'public/js/devtools.js', 'assets/js');
 });

package.json

@@ -1,6 +1,6 @@
 {
   "scripts": {
-    "test": "jest && mocha --compilers js:mocha-traceur tests/**/*.spec.js",
+    "test": "jest && mocha --compilers js:mocha-traceur tests/**/*.spec.js && jsxhint --jsx-only .",
     "start": "npm install && bower install && gulp"
   },
   "jest": {
@@ -8,24 +8,23 @@
       "jest.js"
     ],
     "testDirectoryName": "tests",
-    "scriptPreprocessor": "<rootDir>/node_modules/babel-jest",
     "unmockedModulePathPatterns": [
       "<rootDir>/node_modules/react"
     ]
   },
   "private": true,
   "devDependencies": {
-    "babel-jest": "^5.3.0",
+    "chai": "^3.0.0",
     "gulp": "^3.8.8",
     "jest-cli": "^0.4.12",
+    "jshint": "^2.8.0",
+    "jsxhint": "^0.15.1",
     "laravel-elixir": "*",
-    "react-tools": "^0.13.3",
     "mocha": "^2.2.5",
     "mocha-sinon": "^1.1.4",
     "mocha-traceur": "^2.1.0",
-    "sinon": "^1.14.1",
+    "react-tools": "^0.13.3",
-    "babel": "^5.5.6",
+    "sinon": "^1.14.1"
-    "chai": "^3.0.0"
   },
   "dependencies": {
     "bootstrap": "^3.3.4",
@@ -33,5 +32,17 @@
     "jquery": "^2.1.3",
     "moment": "^2.10.3",
     "react": "^0.13.3"
+  },
+  "jshintConfig": {
+    "asi": false,
+    "browser": true,
+    "curly": false,
+    "expr": true,
+    "indent": 4,
+    "loopfunc": true,
+    "node": true,
+    "trailing": true,
+    "undef": true,
+    "white": true
   }
 }

public/js/bundle.js

@@ -9,12 +9,12 @@ require('bootstrap');
 var React = require('react');
 
 // React components
-var WakaTime = require('./components/WakaTime.react');
+var WakaTime = require('./components/WakaTime.jsx');
 
 React.render(React.createElement(WakaTime, null), document.getElementById('wakatime'));
 
 }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
-},{"./components/WakaTime.react":4,"bootstrap":13,"jquery":26,"react":183}],2:[function(require,module,exports){
+},{"./components/WakaTime.jsx":4,"bootstrap":13,"jquery":26,"react":183}],2:[function(require,module,exports){
 'use strict';
 
 var React = require('react');
@@ -299,8 +299,8 @@ var $ = require('jquery');
 var config = require('../config');
 
 // React components
-var NavBar = require('./NavBar.react');
+var NavBar = require('./NavBar.jsx');
-var MainList = require('./MainList.react');
+var MainList = require('./MainList.jsx');
 
 // Core
 var WakaTimeOriginal = require('../core/WakaTime');
@@ -357,7 +357,7 @@ var WakaTime = React.createClass({
 
                 wakatime.getTotalTimeLoggedToday().done(function (grand_total) {
                     that.setState({
-                        totalTimeLoggedToday: grand_total['text']
+                        totalTimeLoggedToday: grand_total.text
                     });
                 });
             } else {
@@ -467,12 +467,9 @@ var WakaTime = React.createClass({
 
 module.exports = WakaTime;
 
-},{"../config":5,"../core/WakaTime":6,"../helpers/changeExtensionState":8,"./MainList.react":2,"./NavBar.react":3,"jquery":26,"react":183}],5:[function(require,module,exports){
+},{"../config":5,"../core/WakaTime":6,"../helpers/changeExtensionState":8,"./MainList.jsx":2,"./NavBar.jsx":3,"jquery":26,"react":183}],5:[function(require,module,exports){
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = {
     // Extension name
     name: 'WakaTime',
@@ -526,10 +523,12 @@ var config = {
     }
 };
 
-exports['default'] = config;
+module.exports = config;
-module.exports = exports['default'];
 
 },{}],6:[function(require,module,exports){
+/* global chrome */
+//jshint esnext:true
+
 'use strict';
 
 Object.defineProperty(exports, '__esModule', {
@@ -581,7 +580,7 @@ var WakaTime = (function () {
                 dataType: 'json',
                 success: function success(data) {
 
-                    deferredObject.resolve(data.data[0]['grand_total']);
+                    deferredObject.resolve(data.data[0].grand_total);
                 },
                 error: function error(xhr, status, err) {
 
@@ -794,11 +793,10 @@ exports['default'] = WakaTime;
 module.exports = exports['default'];
 
 },{"../helpers/changeExtensionState":8,"./../config":5,"./../helpers/currentTimestamp":10,"./../helpers/getDomainFromUrl":11,"./../helpers/in_array":12,"jquery":26,"moment":28}],7:[function(require,module,exports){
+/* global chrome */
+
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 /**
@@ -807,8 +805,9 @@ var config = require('../config');
  *
  * @param color
  */
-function changeExtensionIcon() {
+function changeExtensionIcon(color) {
-    var color = arguments[0] === undefined ? '' : arguments[0];
+
+    color = color ? color : '';
 
     var path = null;
 
@@ -843,15 +842,11 @@ function changeExtensionIcon() {
     }
 }
 
-exports['default'] = changeExtensionIcon;
+module.exports = changeExtensionIcon;
-module.exports = exports['default'];
 
 },{"../config":5}],8:[function(require,module,exports){
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 // Helpers
@@ -885,15 +880,13 @@ function changeExtensionState(state) {
     }
 }
 
-exports['default'] = changeExtensionState;
+module.exports = changeExtensionState;
-module.exports = exports['default'];
 
 },{"../config":5,"./changeExtensionIcon":7,"./changeExtensionTooltip":9,"./in_array":12}],9:[function(require,module,exports){
+/* global chrome */
+
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 /**
@@ -912,8 +905,7 @@ function changeExtensionTooltip(text) {
     chrome.browserAction.setTitle({ title: text });
 }
 
-exports['default'] = changeExtensionTooltip;
+module.exports = changeExtensionTooltip;
-module.exports = exports['default'];
 
 },{"../config":5}],10:[function(require,module,exports){
 /**
@@ -923,15 +915,11 @@ module.exports = exports['default'];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
 function currentTimestamp() {
   return Math.round(new Date().getTime() / 1000);
 }
 
-exports["default"] = currentTimestamp;
+module.exports = currentTimestamp;
-module.exports = exports["default"];
 
 },{}],11:[function(require,module,exports){
 /**
@@ -942,17 +930,13 @@ module.exports = exports["default"];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
 function getDomainFromUrl(url) {
     var parts = url.split("/");
 
     return parts[0] + "//" + parts[2];
 }
 
-exports["default"] = getDomainFromUrl;
+module.exports = getDomainFromUrl;
-module.exports = exports["default"];
 
 },{}],12:[function(require,module,exports){
 /**
@@ -964,22 +948,17 @@ module.exports = exports["default"];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
 function in_array(needle, haystack) {
     for (var i = 0; i < haystack.length; i++) {
         if (needle == haystack[i]) {
             return true;
-            break;
         }
     }
 
     return false;
 }
 
-exports["default"] = in_array;
+module.exports = in_array;
-module.exports = exports["default"];
 
 },{}],13:[function(require,module,exports){
 // This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.

public/js/devtools.js

@@ -1,4 +1,6 @@
 (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+/* global chrome */
+
 // Create a connection to the background page
 "use strict";
 

public/js/events.js

@@ -1,4 +1,6 @@
 (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+/* global chrome */
+
 // Core
 'use strict';
 
@@ -99,9 +101,6 @@ chrome.runtime.onConnect.addListener(function (port) {
 },{"./core/WakaTime":3}],2:[function(require,module,exports){
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = {
     // Extension name
     name: 'WakaTime',
@@ -155,10 +154,12 @@ var config = {
     }
 };
 
-exports['default'] = config;
+module.exports = config;
-module.exports = exports['default'];
 
 },{}],3:[function(require,module,exports){
+/* global chrome */
+//jshint esnext:true
+
 'use strict';
 
 Object.defineProperty(exports, '__esModule', {
@@ -210,7 +211,7 @@ var WakaTime = (function () {
                 dataType: 'json',
                 success: function success(data) {
 
-                    deferredObject.resolve(data.data[0]['grand_total']);
+                    deferredObject.resolve(data.data[0].grand_total);
                 },
                 error: function error(xhr, status, err) {
 
@@ -423,11 +424,10 @@ exports['default'] = WakaTime;
 module.exports = exports['default'];
 
 },{"../helpers/changeExtensionState":5,"./../config":2,"./../helpers/currentTimestamp":7,"./../helpers/getDomainFromUrl":8,"./../helpers/in_array":9,"jquery":10,"moment":11}],4:[function(require,module,exports){
+/* global chrome */
+
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 /**
@@ -436,8 +436,9 @@ var config = require('../config');
  *
  * @param color
  */
-function changeExtensionIcon() {
+function changeExtensionIcon(color) {
-    var color = arguments[0] === undefined ? '' : arguments[0];
+
+    color = color ? color : '';
 
     var path = null;
 
@@ -472,15 +473,11 @@ function changeExtensionIcon() {
     }
 }
 
-exports['default'] = changeExtensionIcon;
+module.exports = changeExtensionIcon;
-module.exports = exports['default'];
 
 },{"../config":2}],5:[function(require,module,exports){
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 // Helpers
@@ -514,15 +511,13 @@ function changeExtensionState(state) {
     }
 }
 
-exports['default'] = changeExtensionState;
+module.exports = changeExtensionState;
-module.exports = exports['default'];
 
 },{"../config":2,"./changeExtensionIcon":4,"./changeExtensionTooltip":6,"./in_array":9}],6:[function(require,module,exports){
+/* global chrome */
+
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = require('../config');
 
 /**
@@ -541,8 +536,7 @@ function changeExtensionTooltip(text) {
     chrome.browserAction.setTitle({ title: text });
 }
 
-exports['default'] = changeExtensionTooltip;
+module.exports = changeExtensionTooltip;
-module.exports = exports['default'];
 
 },{"../config":2}],7:[function(require,module,exports){
 /**
@@ -552,15 +546,11 @@ module.exports = exports['default'];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
 function currentTimestamp() {
   return Math.round(new Date().getTime() / 1000);
 }
 
-exports["default"] = currentTimestamp;
+module.exports = currentTimestamp;
-module.exports = exports["default"];
 
 },{}],8:[function(require,module,exports){
 /**
@@ -571,17 +561,13 @@ module.exports = exports["default"];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
 function getDomainFromUrl(url) {
     var parts = url.split("/");
 
     return parts[0] + "//" + parts[2];
 }
 
-exports["default"] = getDomainFromUrl;
+module.exports = getDomainFromUrl;
-module.exports = exports["default"];
 
 },{}],9:[function(require,module,exports){
 /**
@@ -593,22 +579,17 @@ module.exports = exports["default"];
  */
 "use strict";
 
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
 function in_array(needle, haystack) {
     for (var i = 0; i < haystack.length; i++) {
         if (needle == haystack[i]) {
             return true;
-            break;
         }
     }
 
     return false;
 }
 
-exports["default"] = in_array;
+module.exports = in_array;
-module.exports = exports["default"];
 
 },{}],10:[function(require,module,exports){
 /*!

public/js/options.js

@@ -9,12 +9,12 @@ require('bootstrap');
 var React = require('react');
 
 // React components
-var Options = require('./components/Options.react');
+var Options = require('./components/Options.jsx');
 
 React.render(React.createElement(Options, null), document.getElementById('wakatime-options'));
 
 }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
-},{"./components/Options.react":3,"bootstrap":6,"jquery":20,"react":194}],2:[function(require,module,exports){
+},{"./components/Options.jsx":3,"bootstrap":6,"jquery":20,"react":194}],2:[function(require,module,exports){
 'use strict';
 
 var React = require('react');
@@ -41,6 +41,8 @@ var Alert = React.createClass({
 module.exports = Alert;
 
 },{"classnames":19,"react":194}],3:[function(require,module,exports){
+/* global chrome */
+
 'use strict';
 
 var React = require('react');
@@ -50,8 +52,8 @@ var ReactCSSTransitionGroup = ReactAddons.addons.CSSTransitionGroup;
 var config = require('../config');
 
 // React components
-var Alert = require('./Alert.react');
+var Alert = require('./Alert.jsx');
-var SitesList = require('./SitesList.react');
+var SitesList = require('./SitesList.jsx');
 
 /**
  * One thing to keep in  mind is that you cannot use this.refs.blacklist if
@@ -159,7 +161,7 @@ var Options = React.createClass({
         var that = this;
 
         var alert = function alert() {
-            if (that.state.displayAlert == true) {
+            if (that.state.displayAlert === true) {
 
                 setTimeout(function () {
                     that.setState({ displayAlert: false });
@@ -307,7 +309,7 @@ var Options = React.createClass({
 
 module.exports = Options;
 
-},{"../config":5,"./Alert.react":2,"./SitesList.react":4,"react":194,"react/addons":22}],4:[function(require,module,exports){
+},{"../config":5,"./Alert.jsx":2,"./SitesList.jsx":4,"react":194,"react/addons":22}],4:[function(require,module,exports){
 'use strict';
 
 var React = require('react');
@@ -359,9 +361,6 @@ module.exports = SitesList;
 },{"react":194}],5:[function(require,module,exports){
 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
 var config = {
     // Extension name
     name: 'WakaTime',
@@ -415,8 +414,7 @@ var config = {
     }
 };
 
-exports['default'] = config;
+module.exports = config;
-module.exports = exports['default'];
 
 },{}],6:[function(require,module,exports){
 // This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.