V 2.1.0 Linting & codestyle (#34)

* v 2.0.2 - Lint js & use strict - Set all Gulp tasks to run in strict mode - Set all js files to run in strict mode - Updated all Gulp tasks to use 'const' instead of 'var' - Added a reporter to jsHint - Linted all js files * v. 2.1.0 - Linting & codestyle - Set all Gulp tasks to run in strict mode - Set all js files to run in strict mode - Updated all Gulp tasks to use 'const' instead of 'var' - Added a reporter to jsHint - Linted all js files - Added a reporter to jscs - Re-indented all js files to follow jscs - Added jscs rules - Standardisation of js files
Novicell · Jul 26, 2016 · 34e9a2b · 34e9a2b
1 parent a83ae85
commit 34e9a2b
Show file tree

Hide file tree

Showing 30 changed files with 651 additions and 576 deletions.
diff --git a/.gitignore b/.gitignore
@@ -4,3 +4,4 @@ vendor/
 
 *.log
 .vscode/
+web.config
diff --git a/.jscsrc b/.jscsrc
@@ -1,3 +1,6 @@
 {
-    "requireCurlyBraces": ["if", "else", "for", "while", "do", "try", "catch", "case", "default"]
+    "requireCurlyBraces": ["if", "else", "for", "while", "do", "try", "catch", "case", "default"],
+    "disallowMultipleSpaces": {"allowEOLComments": true},
+    "requireAlignedMultilineParams": true,
+    "validateIndentation": { "value": "\t", "allExcept": ["comments", "emptyLines"] }
 }
diff --git a/.jshintrc b/.jshintrc
@@ -0,0 +1,10 @@
+{
+    "globals": {
+        "$": false,
+        "jQuery": false,
+        "svg4everybody": false,
+        "google": false
+    },
+    "globalstrict": true,
+    "browser": true
+}
diff --git a/CHANGES b/CHANGES
@@ -1,3 +1,14 @@
+[2.1.0]
+- Set all Gulp tasks to run in strict mode
+- Set all js files to run in strict mode
+- Updated all Gulp tasks to use 'const' instead of 'var'
+- Added a reporter to jsHint
+- Linted all js files
+- Added a reporter to jscs
+- Re-indented all js files to follow jscs
+- Added jscs rules
+- Standardisation of js files
+
 [2.0.1]
 - Updated node modules
 

diff --git a/examples/index.html b/examples/index.html
@@ -82,8 +82,8 @@ <h2>Lazyload image demo</h2>
                         <article>
                             <h2>SVG Demo</h2>
                             <h3>Use SVG's like this</h3>
-                            <p>Use SVG's from the SVG sprite generated by GULP like the following. The <em>#lock</em> is the ID of the current SVG in the sprite. This is based on the name of the original SVG in the <em>/images/icons/</em>-directory.</p>
-                            <p>So <em>/images/icons/lock.svg</em> are referenced like this:</p>
+                            <p>Use SVG's from the SVG sprite generated by GULP like the following. The <em>#lock</em> is the ID of the current SVG in the sprite. This is based on the name of the original SVG in the <em>/icons/</em>-directory.</p>
+                            <p>So <em>/icons/lock.svg</em> are referenced like this:</p>
                             <code>&lt;svg&gt;
     &lt;use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="<em>../dist/icons/icons.svg#lock"</em>&gt;&lt;/use&gt;
 &lt;/svg&gt;</code>
@@ -99,7 +99,7 @@ <h3>Change color and size like this</h3>
     &lt;use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../dist/icons/icons.svg#search"&gt;&lt;/use&gt;
 &lt;/svg&gt;</code>
                             <strong>This will output:</strong>
-                            <svg class="icon icon-lock" style="width:45px; height:45px; fill:aqua;">
+                            <svg class="icon icon-lock" style="width:45px; height:45px; fill:red;">
                                 <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../dist/icons/icons.svg#icon-search"></use>
                             </svg>
                         </article>
@@ -111,18 +111,19 @@ <h2>Simple map Demo</h2>
             </div>
         </div>
 
-        <button class="cookie-info-open" id="cookie-info-open">
+        <button class="cookie-info__open" id="cookie-info-open">
             Cookies?
         </button>
         <section class="cookie-info" id="cookie-info">
-            <div class="cookie-text">
-                <p><span>Vi bruger&nbsp;</span><a data-id="1146" href="/text-page/vores-misson/" title="Vores misson">cookies&nbsp;</a><span>på dette website&nbsp;til trafikmåling og optimering af sitet – er det fint med dig?</span></p>
-                <button class="cookie-info-close" id="cookie-info-close">
+            <div class="cookie-info__text">
+                <p><span>Vi bruger </span><a href="#" title="Cookie information">cookies </a><span>på dette website til trafikmåling og optimering af sitet – er det fint med dig?</span></p>
+                <button class="cookie-info__close" id="cookie-info-close">
                     Det er OK!
                 </button>
             </div>
         </section>
 
+
         <script src="../dist/scripts/vendor.min.js"></script>
         <script src="../dist/scripts/master.min.js"></script>
     </body>

diff --git a/gulp/config.js b/gulp/config.js
@@ -1,4 +1,6 @@
-var notifier = require('node-notifier');
+'use strict';
+
+var notifier = require('node-notifier');
 var argv = require('yargs').argv;
 
 module.exports = (function () {
@@ -34,14 +36,13 @@ module.exports = (function () {
             },
             {
                 name: "master",
-                ignorePlugins: ["jscs"],
                 scripts: [
                     projectPath + "scripts/components/novicell.js",
                     projectPath + "scripts/components/novicell.debounce.js",
                     projectPath + "scripts/components/novicell.visible.js",
                     projectPath + "scripts/components/novicell.lazyloadResponsive.js",
                     projectPath + "scripts/components/novicell.embed.js",
-                    // projectPath + "scripts/components/novicell.overlay.js",
+                    projectPath + "scripts/components/novicell.overlay.js",
                     projectPath + "scripts/components/novicell.cookieinfo.js",
                     projectPath + "scripts/components/novicell.map.js",
                     projectPath + "scripts/master.js"

diff --git a/gulp/index.js b/gulp/index.js
@@ -1,5 +1,6 @@
+'use strict';
 var config = require('./config.js');
 
-config.loadTasks.forEach(function (x) { 
+config.loadTasks.forEach(function (x) {
     require('./tasks/' + x);
 });
diff --git a/gulp/tasks/bower.js b/gulp/tasks/bower.js
@@ -1,5 +1,7 @@
-var gulp = require('gulp');
-var config = require('../config.js');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task("bower", function () {

diff --git a/gulp/tasks/build.js b/gulp/tasks/build.js
@@ -1,6 +1,8 @@
-var gulp = require('gulp');
-var config = require('../config.js');
-var del = require('del');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const del = require('del');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task('clean', function () {

diff --git a/gulp/tasks/copy.js b/gulp/tasks/copy.js
@@ -1,6 +1,8 @@
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task("copy", function () {

diff --git a/gulp/tasks/html.js b/gulp/tasks/html.js
@@ -1,3 +1,5 @@
+'use strict';
+
 /*
     the html task looks through the html files in the html folder, after the prefix @@.
     This makes it possible to include "partial" html pieces like
@@ -7,9 +9,9 @@
     </body>
 */
 
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task('html', function() {

diff --git a/gulp/tasks/icons.js b/gulp/tasks/icons.js
@@ -1,21 +1,23 @@
+'use strict';
+
 /*
     Use icons like:
-    <svg class="icon-search">
+    <svg class="icon icon--search">
         <use xlink:href="/dist/icons/icons.svg#icon-search"></use>
     </svg>
 */
 
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
+const fs = require('fs');
+const rsp = require('remove-svg-properties').stream;
 var plugins = require('gulp-load-plugins')();
-var svgSprite = require('gulp-svg-sprite');
-var fs = require('fs');
-var rsp = require('remove-svg-properties').stream;
 
 function writeFile(file, content) {
     try {
         fs.writeFileSync(file, content);
+        console.log("icons.json is being generated.");
         return file;
     } catch (e) {
         console.log(e);
@@ -39,7 +41,6 @@ function genereateIconJsonLibrary(err, files) {
     };
 
     writeFile(config.jsonIconPath, JSON.stringify(dataObject));
-    console.log("NC - 'icons.json' generated.");
 }
 
 gulp.task('icons-json', function () {
@@ -81,7 +82,7 @@ gulp.task('icons', function () {
             .pipe(rsp.remove({
                 properties: [rsp.PROPS_FILL, rsp.PROPS_STROKE, ]
             }))
-            .pipe(svgSprite(config.spriteConfig))
+            .pipe(plugins.svgSprite(config.spriteConfig))
             .pipe(gulp.dest(config.iconsDist));
     });
 

diff --git a/gulp/tasks/images.js b/gulp/tasks/images.js
@@ -1,6 +1,8 @@
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task('images', function () {

diff --git a/gulp/tasks/scripts.js b/gulp/tasks/scripts.js
@@ -1,6 +1,8 @@
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
 var plugins = require('gulp-load-plugins')();
 
 // Tasks
@@ -43,7 +45,9 @@ var compileScripts = function(isWatchTask){
         .pipe(plugins.resolveDependencies({ pattern: /\* @require [\s-]*(.*?\.js)/g }))
         .pipe(plugins.plumber(config.errorHandler("scripts")))
         .pipe(plugins.if(useJshint, plugins.jshint()))
+        .pipe(plugins.if(useJshint, plugins.jshint.reporter('jshint-stylish')))
         .pipe(plugins.if(useJscs, plugins.jscs()))
+        .pipe(plugins.if(useJscs, plugins.jscsStylish()))
         .pipe(plugins.if(useSourcemaps, plugins.sourcemaps.init({ loadMaps: true })))
         .pipe(plugins.concat(b.name + ".min.js"))
         .pipe(plugins.if(useMinify, plugins.uglify()))

diff --git a/gulp/tasks/styles.js b/gulp/tasks/styles.js
@@ -1,6 +1,8 @@
-var gulp = require('gulp');
-var config = require('../config.js');
-var mergeStream = require('merge-stream');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const mergeStream = require('merge-stream');
 var plugins = require('gulp-load-plugins')();
 
 gulp.task('styles', function () {

diff --git a/gulp/tasks/typescript.js b/gulp/tasks/typescript.js
@@ -1,3 +1,5 @@
+'use strict';
+
 const gulp = require('gulp');
 const typescript = require('gulp-typescript');
 const tscConfig = require('../../tsconfig.json');

diff --git a/gulp/tasks/watch.js b/gulp/tasks/watch.js
@@ -1,7 +1,9 @@
-var gulp = require('gulp');
-var config = require('../config.js');
+'use strict';
+
+const gulp = require('gulp');
+const config = require('../config.js');
+const spawn = require('child_process').spawn;
 var plugins = require('gulp-load-plugins')();
-var spawn = require('child_process').spawn;
 
 gulp.task("livereload", function () {
     plugins.livereload.listen(config.livereloadPort);

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "novicell-frontend",
   "description": "Novicells Default Frontend Package - used in all Novicell related projects as a base framework.",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "homepage": "http://www.novicell.dk",
   "author": {
     "name": "Novicell"
@@ -36,8 +36,8 @@
       "email": "era@novicell.dk"
     },
     {
-    	"name": "Mark Arndt Lønquist",
-    	"email": "mlo@novicell.dk"
+      "name": "Mark Arndt Lønquist",
+      "email": "mlo@novicell.dk"
     },
     {
       "name": "Adam Peter Nielsen",
@@ -53,11 +53,12 @@
     "gulp-bower": "0.0.13",
     "gulp-concat": "^2.6.0",
     "gulp-cssnano": "^2.1.2",
+    "gulp-file-include": "^0.13.7",
     "gulp-if": "^2.0.1",
     "gulp-imagemin": "^3.0.2",
-    "gulp-file-include": "^0.13.7",
     "gulp-jscs": "^4.0.0",
-    "gulp-jshint": "~2.0.1",
+    "gulp-jscs-stylish": "^1.4.0",
+    "gulp-jshint": "^2.0.1",
     "gulp-less": "~3.1.0",
     "gulp-livereload": "^3.8.1",
     "gulp-load-plugins": "~1.2.4",
@@ -67,16 +68,18 @@
     "gulp-sass": "^2.3.2",
     "gulp-sourcemaps": "^1.6.0",
     "gulp-svg-sprite": "~1.3.3",
+    "gulp-tslint": "^6.0.1",
+    "gulp-typescript": "^2.13.6",
     "gulp-uglify": "^1.5.4",
     "jshint": "^2.9.2",
+    "jshint-stylish": "^2.2.0",
+    "jshint-stylish-cool": "^2.0.2",
     "merge-stream": "~1.0.0",
     "node-notifier": "^4.6.0",
-    "yargs": "~4.8.1",
-    "gulp-tslint": "^6.0.1",
-    "gulp-typescript": "^2.13.6",
+    "remove-svg-properties": "^0.3.2",
     "tslint": "^3.13.0",
     "typescript": "^1.8.10",
-    "remove-svg-properties": "^0.3.2"
+    "yargs": "~4.8.1"
   },
   "files": [
     "examples/**/*",

diff --git a/scripts/base/validation.js b/scripts/base/validation.js