Jade, imagemin, bower dependencies, gulpfile

4 files changed, 103 insertions, 37 deletions

diff --git a/bower.json b/bower.json
index ade515a..45ca94f 100644
--- a/bower.json
+++ b/bower.json
@@ -11,11 +11,11 @@
     "**/.*",
     "node_modules",
     "bower_components",
-    "test",
-    "tests"
+    "build"
   ],
   "dependencies": {
     "bootstrap": "~3.3.2",
-    "bootswatch": "~3.3.4+1"
+    "bootswatch": "~3.3.4+1",
+    "fontawesome": "~4.3.0"
   }
 }
diff --git a/gulpfile.js b/gulpfile.js
index c75ee12..b7e9091 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -1,43 +1,54 @@
 // see https://github.com/tugberkugurlu/gulp-bootswatch-sample/
 
 var gulp = require('gulp'),
-    minifycss = require('gulp-minify-css'),
+    changed = require('gulp-changed'),
     concat = require('gulp-concat'),
-    less = require('gulp-less'),
+    debug = require('gulp-debug'),
+    foreach = require('gulp-foreach'),
     gulpif = require('gulp-if'),
-    order = require('gulp-order'),
     gutil = require('gulp-util'),
+    imagemin = require('gulp-imagemin'),
+    jade = require('gulp-jade'),
+    jshint = require('gulp-jshint'),
+    less = require('gulp-less'),
+    minifycss = require('gulp-minify-css'),
+    minifyhtml = require('gulp-minify-html'),
+    order = require('gulp-order'),
     rename = require('gulp-rename'),
-    foreach = require('gulp-foreach'),
-    debug = require('gulp-debug'),
-    path =require('path'),
+    stripdebug = require('gulp-strip-debug'),
+    uglify = require('gulp-uglify'),
+    path = require('path'),
     merge = require('merge-stream'),
     del = require('del');
 
 var bootswatch_theme = 'superhero';
 
-gulp.task('default', ['clean'], function() {
-    gulp.start('fonts', 'styles');
+gulp.task('default', [], function() {
+    gulp.start('fonts', 'styles', 'scripts', 'images', 'jade');
 });
 
 gulp.task('clean', function(cb) {
-    del(['build/assets/css', 'build/assets/js', 'build/assets/less', 'build/assets/img', 'build/assets/fonts'], cb)
+    del(['./build/assets/css', './build/assets/js', './build/assets/less', './build/assets/img', './build/assets/fonts', './build/*.html'], cb)
 });
 
 gulp.task('fonts', function() {
     
     var fileList = [
-        'bower_components/bootstrap/dist/fonts/*', 
-        'bower_components/fontawesome/fonts/*'
+        './bower_components/bootstrap/dist/fonts/*', 
+        './bower_components/fontawesome/fonts/*'
     ];
+
+    var dst = './build/assets/fonts';
     
     return gulp.src(fileList)
-        .pipe(gulp.dest('build/assets/fonts'));
+        .pipe(changed(dst))
+        .pipe(gulp.dest(dst));
 });
 
 gulp.task('styles', function() {
     
-    var baseContent = '@import "bower_components/bootstrap/less/bootstrap.less";@import "bower_components/bootswatch/' + bootswatch_theme + '/variables.less";@import "bower_components/bootswatch/' + bootswatch_theme + '/bootswatch.less";@import "bower_components/bootstrap/less/utilities.less";';
+    var baseContent = '@import "./bower_components/bootstrap/less/bootstrap.less";@import "./bower_components/bootswatch/' + bootswatch_theme + '/variables.less";@import "./bower_components/bootswatch/' + bootswatch_theme + '/bootswatch.less";@import "./bower_components/bootstrap/less/utilities.less";';
+    
     var isBootswatchFile = function(file) {
         var suffix = 'bootswatch.less';
         return file.path.indexOf(suffix, file.path.length - suffix.length) !== -1;
@@ -51,12 +62,21 @@ gulp.task('styles', function() {
     }
     
     var fileList = [
-        'client/less/main.less', 
-        'bower_components/bootswatch/**/bootswatch.less', 
-        'bower_components/fontawesome/css/font-awesome.css'
+        './bower_components/bootswatch/' + bootswatch_theme + '/bootswatch.less', 
+        './bower_components/fontawesome/css/font-awesome.css'
     ];
+
+    var dst = './build/assets/css';
+    var bootswatch_dst = 'bootswatch.css';
     
     return gulp.src(fileList)
+        .pipe(changed(dst, {extension: '.css', destination: function(file){
+            if (isBootswatchFile(file)) {
+                return 'bootswatch.css';
+            } else {
+                return file;
+            }
+        }}))
         .pipe(gulpif(isBootswatchFile, foreach(function(stream, file) {
             var themeName = path.basename(path.dirname(file.path)),
                 content = replaceAll(baseContent, bootswatch_theme, themeName),
@@ -65,20 +85,57 @@ gulp.task('styles', function() {
             return file;
         })))
         .pipe(less())
-        .pipe(gulp.dest('build/assets/css'))
         .pipe(gulpif(isBootstrapFile, foreach(function(stream, file) {
             var fileName = path.basename(file.path),
                 themeName = fileName.substring(fileName.indexOf('-') + 1, fileName.indexOf('.'));
             
             // http://stackoverflow.com/questions/21719833/gulp-how-to-add-src-files-in-the-middle-of-a-pipe
             // https://github.com/gulpjs/gulp/blob/master/docs/recipes/using-multiple-sources-in-one-task.md
-            return merge(stream, gulp.src(['build/assets/css/font-awesome.css', 'build/assets/css/main.css']))
-                .pipe(concat('style-' + themeName + ".css"))
-                .pipe(gulp.dest('build/assets/css'))
+            return merge(stream, gulp.src(['./build/assets/css/font-awesome.css', './build/assets/css/main.css']))
+                .pipe(concat('bootswatch.css'))
+                .pipe(gulp.dest(dst))
                 .pipe(rename({suffix: '.min'}))
-                .pipe(minifycss())
-                .pipe(gulp.dest('build/assets/css'));
+                .pipe(minifycss());
         })))
+        .pipe(gulp.dest(dst));
+});
+
+gulp.task('scripts', function(){
+    var fileList = [
+        './bower_components/bootstrap/dist/js/bootstrap.min.js',
+        './bower_components/jquery/jquery.min.js',
+        './src/js/*.js'
+    ];
+
+    var dst = './build/assets/js';
+
+    gulp.src(fileList)
+        .pipe(changed(dst, {destination: 'script.js'}))
+        .pipe(concat('script.js'))
+        .pipe(stripdebug())
+        .pipe(uglify())
+        .pipe(gulp.dest(dst));
+});
+
+gulp.task('images', function(){
+    var src = './src/img/**/*',
+        dst = './build/img';
+
+    gulp.src(src)
+        .pipe(changed(dst))
+        .pipe(imagemin())
+        .pipe(gulp.dest(dst));
+});
+
+gulp.task('jade', function(){
+    var src = './src/*.jade',
+        dst = './build';
+
+    gulp.src(src)
+        .pipe(changed(dst, {extension: 'html'}))
+        .pipe(jade())
+        .pipe(minifyhtml())
+        .pipe(gulp.dest(dst));
 });
 
 // http://stackoverflow.com/questions/1144783/replacing-all-occurrences-of-a-string-in-javascript
diff --git a/package.json b/package.json
index f6d5fa9..82d01d3 100644
--- a/package.json
+++ b/package.json
@@ -3,27 +3,28 @@
   "version": "0.0.0",
   "description": "",
   "main": ".",
-  "dependencies": {
-    "gulp": "^3.8.11",
-    "gulp-autoprefixer": "^2.1.0",
-    "gulp-changed": "^1.1.1",
-    "gulp-concat": "^2.5.0",
-    "gulp-jshint": "^1.9.2",
-    "gulp-minify-css": "^0.4.5",
-    "gulp-minify-html": "^0.1.8",
-    "gulp-strip-debug": "^1.0.2",
-    "gulp-uglify": "^1.1.0"
-  },
+  "dependencies": {},
   "devDependencies": {
     "del": "^1.1.1",
+    "gulp": "^3.8.11",
+    "gulp-autoprefixer": "^2.1.0",
+    "gulp-changed": "~1.2.1",
+    "gulp-concat": "~2.5.2",
     "gulp-debug": "^2.0.0",
     "gulp-foreach": "^0.1.0",
     "gulp-if": "^1.2.5",
+    "gulp-imagemin": "~2.2.1",
+    "gulp-jade": "~1.0.0"
+    "gulp-jshint": "^1.9.2",
     "gulp-less": "^3.0.0",
+    "gulp-minify-css": "^0.4.5",
+    "gulp-minify-html": "~1.0.2",
     "gulp-order": "^1.1.1",
     "gulp-rename": "^1.2.0",
+    "gulp-strip-debug": "~1.0.2",
+    "gulp-uglify": "~1.2.0",
     "gulp-util": "^3.0.3",
-    "merge-stream": "^0.1.7"
+    "merge-stream": "^0.1.7",
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
diff --git a/src/index.jade b/src/index.jade
new file mode 100644
index 0000000..dda3b97
--- /dev/null
+++ b/src/index.jade
@@ -0,0 +1,8 @@
+doctype html
+html(lang="en")
+  head
+    title= Botleagues
+    link(rel='stylesheet', href='/assets/css/bootswatch.css', type='text/css')
+    link(rel='stylesheet', href='/assets/css/fontawesome.css', type='text/css')
+  body
+    p Hello world.
\ No newline at end of file