Merge pull request #103 from jimmynotjim/gulp-option

Add gulp option

CHANGELOG.md

@@ -4,6 +4,17 @@ All notable changes to this project will be documented in this file.
 We follow the [Semantic Versioning 2.0.0](http://semver.org/) format.
 
 
+## Unreleased
+
+## 1.3.0 - 2015-10-15
+
+### Added
+- Added option to use Gulp as project build tool
+
+### Changed
+- Moved Grunt specific template files to `/grunt` directory
+
+
 ## 1.2.0 - 2015-10-13
 
 ### Added
@@ -19,7 +30,6 @@ We follow the [Semantic Versioning 2.0.0](http://semver.org/) format.
 - Updates the `copy` task to include images, include HTML files in subfolders,
   exclude HTML files from dependencies, include html5shiv.
 
-
 ## 1.1.2 - 2015-09-28
 
 ### Changed

app/index.js

@@ -157,8 +157,31 @@ var CapitalFrameworkGenerator = yeoman.generators.Base.extend({
           done();
         }.bind(this));
       }.bind(this));
-    }
+    },
 
+    askForBuildTool: function() {
+      var done = this.async();
+
+      this.prompt( {
+        required: true,
+        type:     'list',
+        name:     'buildToolChoice',
+        message:  'Which build tool do you prefer?',
+        choices:  [
+          {
+            name: 'Grunt',
+            value: 'grunt'
+          },
+          {
+            name: 'Gulp',
+            value: 'gulp'
+          }
+        ]
+      }, function( answers ) {
+        this.buildToolChoice = answers.buildToolChoice;
+        done();
+      }.bind(this) );
+    }
   },
 
   writing: {
@@ -193,12 +216,22 @@ var CapitalFrameworkGenerator = yeoman.generators.Base.extend({
           .pipe( fs.createWriteStream(file) );
       }.bind(this));
 
-      this.template('_README.md', 'README.md');
-      this.template('_setup.sh', 'setup.sh');
-      this.template('_package.json', 'package.json');
       this.template('_bower.json', 'bower.json');
-      this.template('_Gruntfile.js', 'Gruntfile.js');
       this.copy('bowerrc', '.bowerrc');
+
+      if ( this.buildToolChoice === 'gulp' ) {
+        this.template( 'gulp/_package.json', 'package.json' );
+        this.template('gulp/_README.md', 'README.md');
+        this.copy( 'gulp/_gulpfile.js', 'gulpfile.js' );
+        this.copy( 'gulp/_setup.sh', 'setup.sh' );
+        this.directory( 'gulp/gulp', 'gulp' );
+        this.directory( 'gulp/config', 'config' );
+      } else {
+        this.template( 'grunt/_package.json', 'package.json' );
+        this.template( 'grunt/_README.md', 'README.md' );
+        this.copy( 'grunt/_Gruntfile.js', 'Gruntfile.js' );
+        this.copy( 'grunt/_setup.sh', 'setup.sh' );
+      }
     },
 
     srcFiles: function() {

app/templates/_bower.json

@@ -15,6 +15,7 @@
   "license": "<%= props.license %>",
   "dependencies": { <% for(var i=0; i<components.length; i++) { %>
     "<%= components[i].name %>": "<%= components[i].ver %>",<% } %>
-    "html5shiv": "latest"
+    "html5shiv": "latest",
+    "jquery.easing": "~1.3.0"
   }
 }

app/templates/gulp/_README.md

@@ -0,0 +1,97 @@
+# <%= humanName %>
+
+<%= props.description %>
+
+![Screenshot](screenshot.png)
+
+## Dependencies
+
+- [Gulp](http://gulpjs.com): task runner for pulling in assets,
+  linting and concatenating code, etc.
+- [Bower](http://bower.io): Package manager for front-end dependencies.
+- [Less](http://lesscss.org): CSS pre-processor.
+- [Capital Framework](https://cfpb.github.io/capital-framework/getting-started):
+  User interface pattern-library produced by the CFPB.
+
+**NOTE:** If you're new to Capital Framework, we encourage you to
+[start here](https://cfpb.github.io/capital-framework/getting-started).
+
+## Installation
+
+1. Install [Node.js](http://nodejs.org) however you'd like.
+2. Install [Gulp](http://gulpjs.com) and [Bower](http://bower.io):
+  ```bash
+  npm install -g gulp bower
+  ```
+3. Next, install the dependencies and compile the project with:
+  ```bash
+  ./setup.sh
+  ```
+  __NOTE:__ To re-install and rebuild all the site’s assets run
+  `./setup.sh` again. See the [usage](#usage) section on updating all the
+  project dependencies.
+
+## Configuration
+
+_If the software is configurable, describe it in detail,
+either here or in other documentation to which you link._
+
+## Usage
+
+Each time you fetch from the upstream repository (this repo), run `./setup.sh`.
+This setup script will remove and re-install the project dependencies and
+rebuild the site's JavaScript and CSS assets.
+
+To watch for changes in the source code and automatically update the running site,
+open a terminal and run:
+
+```bash
+gulp watch
+```
+
+## How to test the software
+
+After running `./setup.sh` or compiling with Gulp,
+you can view the site in a browser by opening `/dist/index.html`.
+Alternatively, you may want to use a local server with something like
+`python -m SimpleHTTPServer`.
+
+## Known issues
+
+_Document any known significant shortcomings with the software._
+
+## Getting help
+
+_Instruct users how to get help with this software; this might include links
+to an issue tracker, wiki, mailing list, etc._
+
+Use the issue tracker to follow the development conversation.
+If you find a bug not listed in the issue tracker, please file a bug report.
+
+## Getting involved
+
+We welcome your feedback and contributions. See the
+[contribution guidelines](https://github.com/cfpb/open-source-project-template/blob/master/CONTRIBUTING.md)
+for more details.
+
+Additionally, you may want to consider
+[contributing to the Capital Framework](https://cfpb.github.io/capital-framework/contributing/),
+which is the front-end pattern library used in this project.
+
+
+----
+
+## Open source licensing info
+1. [TERMS](TERMS.md)
+2. [LICENSE](LICENSE)
+3. [CFPB Source Code Policy](https://github.com/cfpb/source-code-policy/)
+
+
+----
+
+## Credits and references
+
+1. Projects that inspired you
+2. Related projects
+3. Books, papers, talks, or other sources that have meaniginful impact or
+   influence on this project

app/templates/gulp/_gulpfile.js

@@ -0,0 +1,18 @@
+'use strict';
+
+/*
+  gulpfile.js
+  ===========
+  Rather than manage one giant configuration file responsible
+  for creating multiple tasks, each task has been broken out into
+  its own file in gulp/tasks. Any files in that directory get
+  automatically required below.
+  To add a new task, simply add a new task file the gulp/tasks directory.
+  gulp/tasks/default.js specifies the default set of tasks to run
+  when you run `gulp`.
+*/
+
+var requireDir = require( 'require-dir' );
+
+// Require all tasks in gulp/tasks, including subfolders
+requireDir( './gulp/tasks', { recurse: true } );

app/templates/gulp/_package.json

@@ -0,0 +1,44 @@
+{
+  "name": "<%= slugname %>",
+  "version": "0.1.0",
+  "description": "<%= props.description %>",
+  <% if (props.homepage) { %>"homepage": "<%= props.homepage %>",<% } %>
+  "author": {
+    "name": "<%= props.authorName %>",
+    "email": "<%= props.authorEmail %>"<% if (props.authorUrl) { %>,
+    "url": "<%= props.authorUrl %>"<% } %>
+  },
+  "repository": {
+    "type": "<%= props.repoType %>",
+    "url": "<%= props.repoUrl %>"
+  },
+  "license": "<%= props.license %>",
+  "keywords": [
+    "<%= slugname %>"
+  ],
+  "devDependencies": {
+    "browser-sync": "^2.8.0",
+    "del": "^1.2.0",
+    "fs": "0.0.2",
+    "gulp": "^3.9.0",
+    "gulp-autoprefixer": "^2.3.1",
+    "gulp-changed": "^1.2.1",
+    "gulp-concat": "^2.6.0",
+    "gulp-cssmin": "^0.1.7",
+    "gulp-eslint": "^1.0.0",
+    "gulp-header": "^1.2.2",
+    "gulp-imagemin": "^2.3.0",
+    "gulp-less": "^3.0.3",
+    "gulp-load-plugins": "^1.0.0-rc.1",
+    "gulp-mq-remove": "0.0.2",
+    "gulp-notify": "^2.2.0",
+    "gulp-rename": "^1.2.2",
+    "gulp-replace": "^0.5.3",
+    "gulp-sourcemaps": "^1.5.2",
+    "gulp-uglify": "^1.4.1",
+    "gulp-util": "^3.0.6",
+    "jquery": "^1.11.3",
+    "pretty-hrtime": "^1.0.0",
+    "require-dir": "^0.3.0"
+  }
+}

app/templates/gulp/_setup.sh

@@ -0,0 +1,51 @@
+#!/bin/sh
+
+# Set script to exit on any errors.
+set -e
+
+# Initialize project dependency directories.
+init(){
+  NODE_DIR=node_modules
+  BOWER_DIR=bower_components
+
+  if [ -f .bowerrc ]; then
+    # Get the "directory" line from .bowerrc
+    BOWER_DIR=$(grep "directory" .bowerrc | cut -d '"' -f 4)
+  fi
+
+  echo 'npm components directory:' $NODE_DIR
+  echo 'Bower components directory:' $BOWER_DIR
+}
+
+# Clean project dependencies.
+clean(){
+  # If the node and bower directories already exist,
+  # clear them so we know we're working with a clean
+  # slate of the dependencies listed in package.json
+  # and bower.json.
+  if [ -d $NODE_DIR ] || [ -d $BOWER_DIR ]; then
+    echo 'Removing project dependency directories...'
+    rm -rf $NODE_DIR
+    rm -rf $BOWER_DIR
+  fi
+  echo 'Project dependencies have been removed.'
+}
+
+# Install project dependencies.
+install(){
+  echo 'Installing project dependencies...'
+  npm install
+  bower install --config.interactive=false
+}
+
+# Run tasks to build the project for distribution.
+build(){
+  echo 'Building project...'
+  gulp clean
+  gulp build
+}
+
+init
+clean
+install
+build