add grunt watch task, closes #281

2 files changed, 17 insertions, 3 deletions

diff --git a/Gruntfile.js b/Gruntfile.js
index 0ebe8c40..9931a92b 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -8,6 +8,7 @@ module.exports = function (grunt) {
   grunt.initConfig({
     pkg: grunt.file.readJSON('package.json'),
     builddir: '.',
+    buildtheme: '',
     banner: '/*!\n' +
             ' * <%= pkg.name %> v<%= pkg.version %>\n' +
             ' * Homepage: <%= pkg.homepage %>\n' +
@@ -43,12 +44,20 @@ module.exports = function (grunt) {
         },
         files: {}
       }
+    },
+    watch: {
+      files: ['*/variables.less', '*/bootswatch.less'],
+      tasks: 'build',
+      options: {
+        nospawn: true
+      }
     }
   });
 
   grunt.registerTask('none', function() {});
 
   grunt.registerTask('build', 'build a regular theme', function(theme, compress) {
+    var theme = theme == undefined ? grunt.config('buildtheme') : theme;
     var compress = compress == undefined ? true : compress;
 
     var concatSrc;
@@ -89,4 +98,10 @@ module.exports = function (grunt) {
   grunt.registerTask('default', 'build a theme', function() {
     grunt.task.run('swatch');
   });
+
+  grunt.event.on('watch', function(action, filepath) {
+    var path = require('path');
+    var theme = path.dirname(filepath);
+    grunt.config('buildtheme', theme);
+  });
 };
diff --git a/help/index.html b/help/index.html
index f6cc07c4..a43c1e1d 100644
--- a/help/index.html
+++ b/help/index.html
@@ -108,10 +108,9 @@
             <ol>
               <li><p><code>git clone https://github.com/thomaspark/bootswatch.git</code></p></li>
               <li><p><code>npm install</code></p></li>
-              <li>
-                <p>Edit <code>variables.less</code> and <code>bootswatch.less</code> in one of the theme directories, or create your own in <code>/custom</code>.</p>
-              </li>
+              <li><p>Edit <code>variables.less</code> and <code>bootswatch.less</code> in one of the theme directories, or create your own in <code>/custom</code>.</p></li>
               <li><p>Type <code>grunt swatch:[theme]</code> to build the CSS for a theme, e.g., <code>grunt swatch:amelia</code> for Amelia. Or type <code>grunt swatch</code> to build them all at once. To have <code>grunt</code> available in the command line, install <code>grunt-cli</code> as described on the <a href="http://gruntjs.com/getting-started">Grunt Getting Started page</a>.</p></li>
+              <li><p>You can also run <code>grunt watch</code> to watch for any changes to the LESS files and automatically build a theme on change.</p></li>
             </ol>
             <p>Here are additional tips for <a href="http://coding.smashingmagazine.com/2013/03/12/customizing-bootstrap/" target="_blank">customizing Bootstrap</a>.</p>
           </div>