Use eslint & changed layout & tested canvas

.eslintignore

@@ -0,0 +1,3 @@
+dist/*
+public/javascripts/jquery.event.drag-2.0.js
+public/javascripts/jquery-1.6.2.min.js

.eslintrc.json

@@ -0,0 +1,25 @@
+{
+    "env": {
+        "browser": true,
+        "es6": true,
+		"jquery": true
+    },
+    "extends": "eslint:recommended",
+    "parserOptions": {
+        "sourceType": "module"
+    },
+    "rules": {
+        "linebreak-style": [
+            "error",
+            "windows"
+        ],
+        "quotes": [
+            "error",
+            "single"
+        ],
+        "semi": [
+            "error",
+            "always"
+        ]
+    }
+}

app.js

@@ -1,21 +1,22 @@
-var express = require('express');
-var path = require('path');
-var favicon = require('serve-favicon');
-var logger = require('morgan');
-var cookieParser = require('cookie-parser');
-var bodyParser = require('body-parser');
+'use strict';
+const express = require('express');
+const path = require('path');
+const favicon = require('serve-favicon');
+const logger = require('morgan');
+const cookieParser = require('cookie-parser');
+const bodyParser = require('body-parser');
 
-var routes = require('./routes/index');
-var users = require('./routes/users');
-var http = require('http');
-var app = express();
-var server = http.createServer(app);
-var io = require('socket.io').listen(server);
+const routes = require('./routes/index');
+const users = require('./routes/users');
+const http = require('http');
+const app = express();
+const server = http.createServer(app);
+const io = require('socket.io').listen(server);
 
 app.set('views', path.join(__dirname, 'views'));
 app.set('view engine', 'ejs');
 
-server.listen(8085, function(){
+server.listen(8085, function () {
     console.log('App listening at http://localhost:8085');
 });
 
@@ -24,7 +25,7 @@ server.listen(8085, function(){
 //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
 app.use(logger('dev'));
 app.use(bodyParser.json());
-app.use(bodyParser.urlencoded({ extended: false }));
+app.use(bodyParser.urlencoded({extended: false}));
 app.use(cookieParser());
 app.use(express.static(path.join(__dirname, 'public')));
 
@@ -40,43 +41,44 @@ io.on('connection', function (socket) {
             x: data.x,
             y: data.y,
             type: data.type,
+            brushSize: data.brushSize,
             color: data.color
         });
     });
-    socket.on('clearCanvas', function() {
+    socket.on('clearCanvas', function () {
         socket.broadcast.emit('clearCanvas');
     });
 });
 
 // catch 404 and forward to error handler
-app.use(function(req, res, next) {
-  var err = new Error('Not Found');
-  err.status = 404;
-  next(err);
+app.use(function (req, res, next) {
+    let err = new Error('Not Found');
+    err.status = 404;
+    next(err);
 });
 
 // error handlers
 
 // development error handler
 // will print stacktrace
 if (app.get('env') === 'development') {
-  app.use(function(err, req, res, next) {
-    res.status(err.status || 500);
-    res.render('error', {
-      message: err.message,
-      error: err
+    app.use(function (err, req, res, next) {
+        res.status(err.status || 500);
+        res.render('error', {
+            message: err.message,
+            error: err
+        });
     });
-  });
 }
 
 // production error handler
 // no stacktraces leaked to user
-app.use(function(err, req, res, next) {
-  res.status(err.status || 500);
-  res.render('error', {
-    message: err.message,
-    error: {}
-  });
+app.use(function (err, req, res, next) {
+    res.status(err.status || 500);
+    res.render('error', {
+        message: err.message,
+        error: {}
+    });
 });
 
 

gulpfile.js

@@ -1,25 +1,23 @@
-var gulp = require('gulp'),
+'use strict';
+
+const gulp = require('gulp'),
 	gulpLoadPlugins = require('gulp-load-plugins'),
 	plugins = gulpLoadPlugins(),
-	del = require('del');
+	del = require('del'),
+	eslint = require('gulp-eslint');
 
 gulp.task('scripts', function() {
   return gulp.src('public/javascripts/*.js')
-    .pipe(plugins.jshint('.jshintrc'))
-    .pipe(plugins.jshint.reporter('default'))
     .pipe(plugins.concat('main.js'))
     .pipe(gulp.dest('dist/assets/js'))
-    .pipe(plugins.rename({suffix: '.min'}))
-    .pipe(plugins.uglify())
-    .pipe(gulp.dest('dist/assets/js'));
 	console.log("Scripts task complete");
 });
 
 gulp.task('clean', function() {
     return del(['dist/assets/css', 'dist/assets/js', 'dist/assets/img']);
 });
 
-gulp.task('default', ['clean'], function() {
+gulp.task('default', ['clean', 'lint'], function() {
     gulp.start('scripts');
 });
 
@@ -28,4 +26,10 @@ gulp.task('watch', function() {
   gulp.watch('public/javascripts/*.js', ['scripts']);
   plugins.livereload.listen();
   gulp.watch(['./**']).on('change', plugins.livereload.changed);
+});
+
+gulp.task('lint', () => {
+    return gulp.src(['**/*.js','!node_modules/**'])
+        .pipe(eslint('.eslintrc.json'))
+        .pipe(eslint.formatEach());
 });

package.json

@@ -19,18 +19,20 @@
   "homepage": "https://github.com/gevalo1/WebApps3#readme",
   "devDependencies": {
     "del": "^2.2.2",
+    "eslint": "^3.9.0",
+    "eslint-config-standard": "^6.2.1",
+    "eslint-plugin-promise": "^3.3.0",
+    "eslint-plugin-standard": "^2.0.1",
     "gulp": "^3.9.1",
     "gulp-autoprefixer": "^3.1.1",
     "gulp-concat": "^2.6.0",
     "gulp-cssnano": "^2.1.2",
-    "gulp-jshint": "^2.0.1",
     "gulp-livereload": "^3.8.1",
     "gulp-load-plugins": "^1.3.0",
-    "gulp-rename": "^1.2.2",
-    "gulp-uglify": "^2.0.0",
-    "jshint": "^2.9.3"
+    "gulp-rename": "^1.2.2"
   },
-  "dependencies": {"ejs": "2.5.2",
+  "dependencies": {
+    "ejs": "2.5.2",
     "body-parser": "1.15.2",
     "cookie-parser": "1.4.3",
     "express": "4.14.0",