Added beautifiers, improved linters, improved source code to fit coding standards

cseifert · cseifert · commit c080e4b101ea · 2015-10-19T00:38:05.000+02:00
diff --git a/.jscsrc b/.jscsrc
@@ -0,0 +1,3 @@
+{
+	"preset": "jquery"
+}
diff --git a/.jshintrc b/.jshintrc
@@ -0,0 +1,17 @@
+{
+	"boss": true,
+	"curly": true,
+	"eqeqeq": true,
+	"eqnull": true,
+	"expr": true,
+	"immed": true,
+	"latedef": true,
+	"newcap": true,
+	"noarg": true,
+	"quotmark": "double",
+	"sub": true,
+	"undef": false,
+	"unused": true,
+	"browser": true,
+	"jquery": true
+}
diff --git a/gulpfile.js b/gulpfile.js
@@ -22,8 +22,11 @@ var gulp = require('gulp'),
 	autoprefixer = require('gulp-autoprefixer'),
 	scsslint = require('gulp-scss-lint'),
 	jshint = require('gulp-jshint'),
+	jscs = require('gulp-jscs'),
 	stylish = require('jshint-stylish'),
-	html5Lint = require('gulp-html5-lint');
+	html5Lint = require('gulp-html5-lint'),
+	sassBeautify = require('gulp-sassbeautify'),
+	jsBeautify = require('gulp-js-prettify');
 
 gulp.task('clean', function(callback) {
 	del('../dist');
@@ -40,8 +43,12 @@ gulp.task('html', function() {
 });
 
 gulp.task('compile-sass', function() {
-	return gulp.src('source/scss/**/*.scss')
+	return gulp.src(['source/scss/*.scss', '!source/scss/_sprites.scss'])
 		.pipe(plumber())
+		.pipe(scsslint({
+			bundleExec: false,
+			config: 'scss-lint.yml'
+		}))
 		.pipe(sourcemaps.init())
 		.pipe(sass())
 		.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
@@ -54,15 +61,27 @@ gulp.task('compile-sass', function() {
 		.pipe(gulp.dest('../dist/css'))
 });
 
+gulp.task('beautify-sass', function () {
+  return gulp.src('source/scss/*.scss')
+    .pipe(sassBeautify())
+    .pipe(gulp.dest('source/scss/'));
+});
+
 gulp.task('compile-jquery', function() {
 	return jquery.src({
-		release: 2,
-		flags: ['-deprecated']
+			release: 2,
+			flags: ['-deprecated']
 		})
 		.pipe(gulp.dest('source/js/vendor'));
 });
 
 gulp.task('compile-js', function(){
+	gulp.src('source/js/*.js')
+		.pipe(jshint('.jshintrc'))
+		.pipe(jshint.reporter(stylish))
+		.pipe(jscs())
+		.pipe(jscs.reporter());
+
 	return gulp.src([
 			'source/js/vendor/jquery.custom.js',
 			'bower_components/bootstrap-sass/assets/javascripts/bootstrap.min.js',
@@ -80,6 +99,13 @@ gulp.task('compile-js', function(){
 		.pipe(gulp.dest('../dist/js'))
 });
 
+gulp.task('beautify-js', function() {
+	gulp.src('source/js/*.js')
+		.pipe(jscs({fix:true}))
+		.pipe(jsBeautify({collapseWhitespace: true}))
+		.pipe(gulp.dest('source/js'));
+});
+
 gulp.task('select-icons', function() {
 	return gulp.src('bower_components/Font-Awesome-SVG-PNG/white/svg/*.svg')
 		.pipe(gulp.dest('source/iconfont/icons'));
@@ -126,10 +152,6 @@ gulp.task('optimize-images', function(){
 		.pipe(gulp.dest('../dist/images'))
 });
 
-gulp.task('default', function(callback){
-	runSequence('clean', 'select-icons', 'compile-iconfont', 'compile-sprites', 'optimize-images', 'compile-sass', 'compile-jquery', 'compile-js', 'html', 'screens', callback)
-});
-
 gulp.task('screens', function () {
 	return gulp.src('../dist/*.html')
 		.pipe(localScreenshots({
@@ -139,15 +161,8 @@ gulp.task('screens', function () {
 		}));
 });
 
-gulp.task('lint', function() {
-	gulp.src('source/scss/**/*.scss')
-		.pipe(scsslint({
-			bundleExec: false
-		}));
-
-	gulp.src('source/js/*.js')
-		.pipe(jshint())
-		.pipe(jshint.reporter(stylish));
+gulp.task('default', function(callback){
+	runSequence('clean', 'select-icons', 'compile-iconfont', 'compile-sprites', 'optimize-images', 'compile-sass', 'compile-jquery', 'compile-js', 'html', 'screens', callback)
 });
 
 gulp.task('watch', function(){
diff --git a/package.json b/package.json
@@ -37,7 +37,10 @@
     "gulp-jshint": "~1.11.2",
     "gulp-autoprefixer": "~3.0.2",
     "gulp-html5-lint": "~1.0.1",
-	"gulp-csso": "~1.0.0",
-	"es6-promise": "~3.0.2"
+    "gulp-csso": "~1.0.0",
+    "es6-promise": "~3.0.2",
+    "gulp-sassbeautify": "~0.1.0",
+    "gulp-js-prettify": "~0.1.0",
+    "gulp-jscs": "~3.0.1"
   }
 }
diff --git a/scss-lint.yml b/scss-lint.yml
@@ -0,0 +1,225 @@
+linters:
+  BangFormat:
+    enabled: true
+    space_before_bang: true
+    space_after_bang: false
+
+  BemDepth:
+    enabled: false
+    max_elements: 1
+
+  BorderZero:
+    enabled: true
+    convention: zero # or `none`
+
+  ColorKeyword:
+    enabled: true
+
+  ColorVariable:
+    enabled: true
+
+  Comment:
+    enabled: true
+
+  DebugStatement:
+    enabled: true
+
+  DeclarationOrder:
+    enabled: true
+
+  DisableLinterReason:
+    enabled: false
+
+  DuplicateProperty:
+    enabled: true
+
+  ElsePlacement:
+    enabled: true
+    style: same_line # or 'new_line'
+
+  EmptyLineBetweenBlocks:
+    enabled: true
+    ignore_single_line_blocks: true
+
+  EmptyRule:
+    enabled: true
+
+  ExtendDirective:
+    enabled: false
+
+  FinalNewline:
+    enabled: true
+    present: true
+
+  HexLength:
+    enabled: true
+    style: short # or 'long'
+
+  HexNotation:
+    enabled: true
+    style: lowercase # or 'uppercase'
+
+  HexValidation:
+    enabled: true
+
+  IdSelector:
+    enabled: true
+
+  ImportantRule:
+    enabled: true
+
+  ImportPath:
+    enabled: true
+    leading_underscore: false
+    filename_extension: false
+
+  Indentation:
+    enabled: true
+    allow_non_nested_indentation: false
+    character: space # or 'tab'
+    width: 2
+
+  LeadingZero:
+    enabled: true
+    style: exclude_zero # or 'include_zero'
+
+  MergeableSelector:
+    enabled: true
+    force_nesting: true
+
+  NameFormat:
+    enabled: true
+    allow_leading_underscore: true
+    convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern
+
+  NestingDepth:
+    enabled: true
+    max_depth: 3
+    ignore_parent_selectors: false
+
+  PlaceholderInExtend:
+    enabled: false # true
+
+  PropertyCount:
+    enabled: false
+    include_nested: false
+    max_properties: 10
+
+  PropertySortOrder:
+    enabled: true
+    ignore_unspecified: false
+    min_properties: 2
+    separate_groups: false
+
+  PropertySpelling:
+    enabled: true
+    extra_properties: []
+
+  PropertyUnits:
+    enabled: true
+    global: [
+      'ch', 'em', 'ex', 'rem',                 # Font-relative lengths
+      'cm', 'in', 'mm', 'pc', 'pt', 'px', 'q', # Absolute lengths
+      'vh', 'vw', 'vmin', 'vmax',              # Viewport-percentage lengths
+      'deg', 'grad', 'rad', 'turn',            # Angle
+      'ms', 's',                               # Duration
+      'Hz', 'kHz',                             # Frequency
+      'dpi', 'dpcm', 'dppx',                   # Resolution
+      '%']                                     # Other
+    properties: {}
+
+  QualifyingElement:
+    enabled: true
+    allow_element_with_attribute: false
+    allow_element_with_class: false
+    allow_element_with_id: false
+
+  SelectorDepth:
+    enabled: true
+    max_depth: 3
+
+  SelectorFormat:
+    enabled: true
+    convention: hyphenated_lowercase # or 'strict_BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern
+
+  Shorthand:
+    enabled: true
+    allowed_shorthands: [1, 2, 3]
+
+  SingleLinePerProperty:
+    enabled: true
+    allow_single_line_rule_sets: true
+
+  SingleLinePerSelector:
+    enabled: true
+
+  SpaceAfterComma:
+    enabled: true
+    style: one_space # or 'no_space', or 'at_least_one_space'
+
+  SpaceAfterPropertyColon:
+    enabled: true
+    style: one_space # or 'no_space', or 'at_least_one_space', or 'aligned'
+
+  SpaceAfterPropertyName:
+    enabled: true
+
+  SpaceAfterVariableName:
+    enabled: true
+
+  SpaceAroundOperator:
+    enabled: true
+    style: one_space # or 'no_space'
+
+  SpaceBeforeBrace:
+    enabled: true
+    style: space # or 'new_line'
+    allow_single_line_padding: false
+
+  SpaceBetweenParens:
+    enabled: true
+    spaces: 0
+
+  StringQuotes:
+    enabled: true
+    style: double_quotes # or single_quotes
+
+  TrailingSemicolon:
+    enabled: true
+
+  TrailingWhitespace:
+    enabled: true
+
+  TrailingZero:
+    enabled: false
+
+  TransitionAll:
+    enabled: false
+
+  UnnecessaryMantissa:
+    enabled: true
+
+  UnnecessaryParentReference:
+    enabled: true
+
+  UrlFormat:
+    enabled: true
+
+  UrlQuotes:
+    enabled: true
+
+  VariableForProperty:
+    enabled: false
+    properties: []
+
+  VendorPrefix:
+    enabled: true
+    identifier_list: base
+    additional_identifiers: []
+    excluded_identifiers: []
+
+  ZeroUnit:
+    enabled: true
+
+  Compass::*:
+    enabled: false
diff --git a/source/js/app.js b/source/js/app.js
@@ -1,9 +1,9 @@
-$(document).ready(function() {
-	$('.image-popup').magnificPopup({
-		type: 'image',
+$( document ).ready( function() {
+	$( ".image-popup" ).magnificPopup( {
+		type: "image",
 		closeOnContentClick: true,
 		image: {
 			verticalFit: true
 		}
-	});
-});
+	} );
+} );
diff --git a/source/templates/partials/layout.twig b/source/templates/partials/layout.twig
@@ -2,7 +2,7 @@
 <html class="no-js" lang="">
     <head>
         <meta charset="utf-8">
-        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
         <title>{% block title %}{% endblock %}</title>
         <meta name="description" content="">
         <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -25,6 +25,7 @@
 			  <ul class="nav navbar-nav">
 				<li><a href="index.html">Homepage</a></li>
 				<li><a href="second-page.html">Second page</a></li>
+			  </ul>
 			</div>
 		  </div>
 		</nav>
diff --git a/source/templates/partials/simple-teaser-column.twig b/source/templates/partials/simple-teaser-column.twig

Original file line number	Diff line number	Diff line change
`@@ -37,7 +37,10 @@`
`37`	`37`	`"gulp-jshint": "~1.11.2",`
`38`	`38`	`"gulp-autoprefixer": "~3.0.2",`
`39`	`39`	`"gulp-html5-lint": "~1.0.1",`
`40`		`- "gulp-csso": "~1.0.0",`
`41`		`- "es6-promise": "~3.0.2"`
	`40`	`+ "gulp-csso": "~1.0.0",`
	`41`	`+ "es6-promise": "~3.0.2",`
	`42`	`+ "gulp-sassbeautify": "~0.1.0",`
	`43`	`+ "gulp-js-prettify": "~0.1.0",`
	`44`	`+ "gulp-jscs": "~3.0.1"`
`42`	`45`	`}`
`43`	`46`	`}`