Modular and midleware support

package.json

@@ -1,6 +1,6 @@
 {
   "name": "slush-angular",
-  "version": "0.4.5",
+  "version": "0.4.6",
   "description": "A slush generator for AngularJS using the Google Angular App Structure Recommendations",
   "main": "slushfile.js",
   "scripts": {
@@ -33,7 +33,8 @@
     "gulp-conflict": "~0.2.0",
     "underscore.string": "~2.3.3",
     "gulp-rename": "~1.2.0",
-    "inquirer": "~0.5.1"
+    "inquirer": "~0.5.1",
+    "gulp-load-tasks": "^0.8.3"
   },
   "devDependencies": {
     "chai": "*",

slushfile.js

@@ -1,83 +1,2 @@
-var gulp = require('gulp'),
-    install = require('gulp-install'),
-    conflict = require('gulp-conflict'),
-    template = require('gulp-template'),
-    rename = require('gulp-rename'),
-    inquirer = require('inquirer'),
-    _ = require('underscore.string');
-
-var cssTypeData = {
-  'less': {
-    plugin: 'gulp-less',
-    pluginVersion: '^1.2.3',
-    pipeCommand: 'g.less()',
-    extension: 'less'
-  },
-  'sass': {
-    plugin: 'gulp-sass',
-    pluginVersion: '^0.7.1',
-    pipeCommand: 'g.sass()',
-    extension: 'scss'
-  },
-  'styl': {
-    plugin: 'gulp-stylus',
-    pluginVersion: '^1.0.2',
-    pipeCommand: 'g.stylus({use: [require(\'nib\')()]})',
-    extension: 'styl',
-    extraDependencies: {
-      'nib': '^1.0.2'
-    }
-  }
-};
-
-gulp.task('default', function (done) {
-  inquirer.prompt([
-    {type: 'input', name: 'name', message: 'What do you want to name your AngularJS app?', default: getNameProposal()},
-    {type: 'list', name: 'csstype', message: 'What CSS preprocessor do you want to use?', default: 'styl', choices: [
-      {name: 'Stylus', value: 'styl'},
-      {name: 'LESS', value: 'less'},
-      {name: 'Sass', value: 'sass'}
-    ]},
-    {type: 'confirm', name: 'coffee', message: 'Do you want to use CoffeeScript in your app?', default: false},
-    {type: 'confirm', name: 'example', message: 'Do you want to include a Todo List example in your app?', default: true}
-  ],
-  function (answers) {
-    answers.nameDashed = _.slugify(answers.name);
-    answers.modulename = _.camelize(answers.nameDashed);
-    var files = [__dirname + '/templates/**'];
-    if (answers.coffee) {
-      files.push('!' + __dirname + '/templates/src/**/*.js')
-    }
-    else {
-      files.push('!' + __dirname + '/templates/src/**/*.coffee')
-    }
-    if (!answers.example) {
-      files.push('!' + __dirname + '/templates/src/app/todo/**');
-    }
-    answers.styleData = cssTypeData[answers.csstype];
-    return gulp.src(files)
-      .pipe(template(answers))
-      .pipe(rename(function (file) {
-        if (file.extname === '.css') {
-          file.extname = '.' + answers.styleData.extension;
-        } else if (file.basename[0] === '_') {
-          file.basename = '.' + file.basename.slice(1);
-        }
-      }))
-      .pipe(conflict('./'))
-      .pipe(gulp.dest('./'))
-      .pipe(install())
-      .on('finish', function () {
-        done();
-      });
-  });
-});
-
-function getNameProposal () {
-  var path = require('path');
-  try {
-    return require(path.join(process.cwd(), 'package.json')).name;
-  } catch (e) {
-    return path.basename(process.cwd());
-  }
-}
+// Tasks are in `tasks/`
+require('gulp-load-tasks')();

tasks/default.js

@@ -0,0 +1,85 @@
+/**
+ * Default Task
+ * This is the mail task that is invoked for the processing of the slushfile.js
+ */
+var gulp = require('gulp'),
+    install = require('gulp-install'),
+    conflict = require('gulp-conflict'),
+    template = require('gulp-template'),
+    rename = require('gulp-rename'),
+    inquirer = require('inquirer'),
+    _ = require('underscore.string');
+
+//Local dependencies
+var util = require('../util');
+
+module.exports = function(done) {
+
+    //User Input
+    inquirer.prompt([{
+            type: 'input',
+            name: 'name',
+            message: 'What do you want to name your AngularJS app?',
+            default: util.getNameProposal()
+        }, {
+            type: 'list',
+            name: 'csstype',
+            message: 'What CSS preprocessor do you want to use?',
+            default: 'styl',
+            choices: [{
+                name: 'Stylus',
+                value: 'styl'
+            }, {
+                name: 'LESS',
+                value: 'less'
+            }, {
+                name: 'Sass',
+                value: 'sass'
+            }]
+        }, {
+            type: 'confirm',
+            name: 'middleware',
+            message: 'Do you want to use middleware for proxy support?',
+            default: false
+        }, {
+            type: 'confirm',
+            name: 'coffee',
+            message: 'Do you want to use CoffeeScript in your app?',
+            default: false
+        }, {
+            type: 'confirm',
+            name: 'example',
+            message: 'Do you want to include a Todo List example in your app?',
+            default: true
+        }],
+        function(answers) {
+            //Hande for user response
+            answers.nameDashed = _.slugify(answers.name);
+            answers.modulename = _.camelize(answers.nameDashed);
+            var files = [__dirname + '/../templates/**'];
+            if (answers.coffee) {
+                files.push('!' + __dirname + '/../templates/src/**/*.js')
+            } else {
+                files.push('!' + __dirname + '/../templates/src/**/*.coffee')
+            }
+            if (!answers.example) {
+                files.push('!' + __dirname + '/../templates/src/app/todo/**');
+            }
+            answers.styleData = util.cssTypeData[answers.csstype];
+            return gulp.src(files)
+                .pipe(template(answers))
+                .pipe(rename(function(file)  {
+                    if (file.extname === '.css') {
+                        file.extname = '.' + answers.styleData.extension;
+                    } else if (file.basename[0] === '_') {
+                        file.basename = '.' + file.basename.slice(1);
+                    }
+                }))
+                .pipe(conflict('./'))
+                .pipe(gulp.dest('./'))
+                .pipe(install())
+                .on('finish', function() {
+                    done();
+                });
+        });
+}

templates/gulpfile.js

@@ -11,6 +11,12 @@ var gulp = require('gulp'),
     lazypipe = require('lazypipe'),
     stylish = require('jshint-stylish'),
     bower = require('./bower'),
+    <%if(middleware){%>
+    proxy = require('proxy-middleware'),
+    url = require('url'),
+    connect = require('gulp-connect'),
+    _ = require('lodash'),
+    <%}%>
     isWatching = false;
 
 var htmlminOpts = {
@@ -21,6 +27,19 @@ var htmlminOpts = {
   removeRedundantAttributes: true
 };
 
+
+<%if(middleware){%>
+  //Configure your proxy for integrating with services
+  var proxyOptions = _.extend(url.parse('http://demo-venkatvp.rhcloud.com/services'), {
+    route: '/services',
+      headers: {
+        'Origin': 'http://yourdomain.com',
+        'Access-Control-Request-Method': 'GET',
+        'Access-Control-Request-Headers': 'X-Custom-Header'
+      }
+  });
+<%}%>
+
 /**
  * JS Hint
  */
@@ -145,14 +164,14 @@ gulp.task('dist', ['vendors', 'assets', 'styles-dist', 'scripts-dist'], function
     .pipe(gulp.dest('./dist/'));
 });
 
+<%if(!middleware){%>
 /**
  * Static file server
  */
 gulp.task('statics', g.serve({
   port: 3000,
   root: ['./.tmp', './.tmp/src/app', './src/app', './bower_components']
 }));
-
 /**
  * Watch
  */
@@ -179,6 +198,37 @@ gulp.task('watch', ['statics', 'default'], function () {
     }
   });
 });
+<%} else {%>
+/**
+* connect server with middleware
+*/
+gulp.task('connect', function() {
+    connect.server({
+        root: ['./.tmp', './.tmp/src/app', './src/app', './bower_components'],
+        port: 3000,
+        livereload: true,
+        middleware: function() {
+            return [(function() {
+                return proxy(proxyOptions);
+            })()];
+        }
+    });
+});
+/**
+ * Watch
+ */
+gulp.task('serve', ['watch']);
+gulp.task('watch', ['connect', 'default'], function() {
+    isWatching = true;
+    // Initiate livereload server:
+    <% if (coffee) { %>
+    gulp.watch('./src/app/**/*.coffee', ['coffee']);<% } %>
+    gulp.watch('./<% if (coffee) { %>.tmp/<% } %>src/app/**/*.js', ['jshint']);
+    gulp.watch('./src/app/index.html', ['index']);
+    gulp.watch(['./src/app/**/*.html', '!./src/app/index.html'], ['templates']);
+    gulp.watch(['./src/app/**/*.less'], ['csslint']);
+});
+<%} %>
 
 /**
  * Default task
@@ -310,11 +360,15 @@ function dist (ext, name, opt) {
 /**
  * Livereload (or noop if not run by watch)
  */
-function livereload () {
-  return lazypipe()
-    .pipe(isWatching ? g.livereload : noop)();
+function livereload() { <%
+    if (middleware) { %>
+        return lazypipe()
+            .pipe(isWatching ? connect.reload : noop)(); <%
+    } else { %>
+        return lazypipe()
+            .pipe(isWatching ? g.livereload : noop)(); <%
+    } %>
 }
-
 /**
  * Jshint with stylish reporter
  */

templates/package.json

@@ -47,6 +47,10 @@
     "karma-script-launcher": "~0.1.0",
     "karma-chrome-launcher": "~0.1.4",
     "karma-firefox-launcher": "~0.1.3",
-    "karma": "~0.12.16"
+    "karma": "~0.12.16"<% if (middleware) { %>,
+    "proxy-middleware": "^0.9.0",
+    "url": "^0.10.2",
+    "gulp-connect": "^2.2.0",
+    "lodash": "^3.0.0"<% } %>
   }
 }

test/slush-angular_test.js

@@ -108,6 +108,35 @@ describe('slush-angular', function() {
       });
     });
 
+    describe('Middleware Example', function () {
+
+      it('should generate template with middleware and LESS', function (done) {
+        mockPrompt({name: 'module', csstype: 'less', example: true, middleware : true});
+
+        gulp.start('default').once('stop', function () {
+          mockGulpDest.assertDestContains([
+            'src/app/app.less',
+            'src/app/styles/_base.less',
+            'src/app/todo/todo.less'
+          ]);
+          done();
+        });
+      });
+
+      it('should generate template with middleware and sass', function (done) {
+        mockPrompt({name: 'module', csstype: 'sass', example: true, middleware : true});
+
+        gulp.start('default').once('stop', function () {
+          mockGulpDest.assertDestContains([
+            'src/app/app.scss',
+            'src/app/styles/_base.scss',
+            'src/app/todo/todo.scss'
+          ]);
+          done();
+        });
+      });
+    });
+
     describe('Todo example', function () {
       it('should not add any todo example files by default', function (done) {
         mockPrompt({name: 'module', example: false});

util.js

@@ -0,0 +1,40 @@
+/**
+ * cssTypeData configuration
+ * @type {cssTypeData}
+ */
+module.exports.cssTypeData =  {
+    'less': {
+        plugin: 'gulp-less',
+        pluginVersion: '^1.2.3',
+        pipeCommand: 'g.less()',
+        extension: 'less'
+    },
+    'sass': {
+        plugin: 'gulp-sass',
+        pluginVersion: '^0.7.1',
+        pipeCommand: 'g.sass()',
+        extension: 'scss'
+    },
+    'styl': {
+        plugin: 'gulp-stylus',
+        pluginVersion: '^1.0.2',
+        pipeCommand: 'g.stylus({use: [require(\'nib\')()]})',
+        extension: 'styl',
+        extraDependencies: {
+            'nib': '^1.0.2'
+        }
+    }
+};
+
+/**
+ * Proposes the names based on the path/package.json file.
+ * @return {String} name
+ */
+module.exports.getNameProposal =  function() {
+    var path = require('path');
+    try {
+        return require(path.join(process.cwd(), 'package.json')).name;
+    } catch (e) {
+        return path.basename(process.cwd());
+    }
+}