added indeterminate state, updated gulp plugins and gulpfile

coffeelint.json

@@ -0,0 +1,26 @@
+{
+  "indentation": {
+    "value": 2
+  },
+  "line_endings": {
+    "level": "warn"
+  },
+  "max_line_length": {
+    "value": 120
+  },
+  "newlines_after_classes": {
+    "level": "error"
+  },
+  "no_trailing_semicolons": {
+    "value": true
+  },
+  "no_trailing_whitespace": {
+    "value": true
+  },
+  "no_empty_param_list": {
+    "level": "error"
+  },
+  "no_unnecessary_fat_arrows": {
+    "level": "error"
+  }
+}

dist/css/bootstrap2/bootstrap-switch.css

@@ -131,18 +131,25 @@
   -moz-border-radius-bottomleft: 4px;
   border-bottom-left-radius: 4px;
 }
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-container {
+  margin-left: -25%;
+}
 .bootstrap-switch.bootstrap-switch-disabled,
-.bootstrap-switch.bootstrap-switch-readonly {
+.bootstrap-switch.bootstrap-switch-readonly,
+.bootstrap-switch.bootstrap-switch-indeterminate {
   opacity: 0.5;
   filter: alpha(opacity=50);
   cursor: default !important;
 }
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
 .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
 .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label,
-.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label {
+.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label {
   cursor: default !important;
 }
 .bootstrap-switch.bootstrap-switch-focused {

dist/css/bootstrap3/bootstrap-switch.css

@@ -89,18 +89,25 @@
   border-bottom-left-radius: 3px;
   border-top-left-radius: 3px;
 }
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-container {
+  margin-left: -25%;
+}
 .bootstrap-switch.bootstrap-switch-disabled,
-.bootstrap-switch.bootstrap-switch-readonly {
+.bootstrap-switch.bootstrap-switch-readonly,
+.bootstrap-switch.bootstrap-switch-indeterminate {
   opacity: 0.5;
   filter: alpha(opacity=50);
   cursor: default !important;
 }
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
 .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
 .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
 .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label,
-.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label {
+.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label,
+.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label {
   cursor: default !important;
 }
 .bootstrap-switch.bootstrap-switch-focused {

dist/js/bootstrap-switch.js

@@ -26,8 +26,6 @@
     "use strict";
     var BootstrapSwitch;
     BootstrapSwitch = (function() {
-      BootstrapSwitch.prototype.name = "bootstrap-switch";
-
       function BootstrapSwitch(element, options) {
         if (options == null) {
           options = {};
@@ -39,6 +37,7 @@
           animate: this.$element.data("animate"),
           disabled: this.$element.is(":disabled"),
           readonly: this.$element.is("[readonly]"),
+          indeterminate: this.$element.data("indeterminate"),
           onColor: this.$element.data("on-color"),
           offColor: this.$element.data("off-color"),
           onText: this.$element.data("on-text"),
@@ -65,6 +64,9 @@
               if (_this.options.readonly) {
                 classes.push("" + _this.options.baseClass + "-readonly");
               }
+              if (_this.options.indeterminate) {
+                classes.push("" + _this.options.baseClass + "-indeterminate");
+              }
               if (_this.$element.attr("id")) {
                 classes.push("" + _this.options.baseClass + "-id-" + (_this.$element.attr("id")));
               }
@@ -88,6 +90,9 @@
           html: this.options.labelText,
           "class": "" + this.options.baseClass + "-label"
         });
+        if (this.options.indeterminate) {
+          this.$element.prop("indeterminate", true);
+        }
         this.$element.on("init.bootstrapSwitch", (function(_this) {
           return function() {
             return _this.options.onInit.apply(element, arguments);
@@ -113,7 +118,7 @@
         if (typeof value === "undefined") {
           return this.options.state;
         }
-        if (this.options.disabled || this.options.readonly) {
+        if (this.options.disabled || this.options.readonly || this.options.indeterminate) {
           return this.$element;
         }
         value = !!value;
@@ -122,7 +127,7 @@
       };
 
       BootstrapSwitch.prototype.toggleState = function(skip) {
-        if (this.options.disabled || this.options.readonly) {
+        if (this.options.disabled || this.options.readonly || this.options.indeterminate) {
           return this.$element;
         }
         return this.$element.prop("checked", !this.options.state).trigger("change.bootstrapSwitch", skip);
@@ -188,6 +193,24 @@
         return this.$element;
       };
 
+      BootstrapSwitch.prototype.indeterminate = function(value) {
+        if (typeof value === "undefined") {
+          return this.options.indeterminate;
+        }
+        value = !!value;
+        this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-indeterminate");
+        this.$element.prop("indeterminate", value);
+        this.options.indeterminate = value;
+        return this.$element;
+      };
+
+      BootstrapSwitch.prototype.toggleIndeterminate = function() {
+        this.$element.prop("indeterminate", !this.options.indeterminate);
+        this.$wrapper.toggleClass("" + this.options.baseClass + "-indeterminate");
+        this.options.indeterminate = !this.options.indeterminate;
+        return this.$element;
+      };
+
       BootstrapSwitch.prototype.onColor = function(value) {
         var color;
         color = this.options.onColor;
@@ -311,7 +334,7 @@
           })(this),
           "keydown.bootstrapSwitch": (function(_this) {
             return function(e) {
-              if (!e.which || _this.options.disabled || _this.options.readonly) {
+              if (!e.which || _this.options.disabled || _this.options.readonly || _this.options.indeterminate) {
                 return;
               }
               switch (e.which) {
@@ -355,12 +378,13 @@
         return this.$label.on({
           "mousemove.bootstrapSwitch touchmove.bootstrapSwitch": (function(_this) {
             return function(e) {
-              var left, percent, right;
+              var left, pageX, percent, right;
               if (!_this.drag) {
                 return;
               }
               e.preventDefault();
-              percent = (((e.pageX || e.originalEvent.touches[0].pageX) - _this.$wrapper.offset().left) / _this.$wrapper.width()) * 100;
+              pageX = e.pageX || e.originalEvent.touches[0].pageX;
+              percent = ((pageX - _this.$wrapper.offset().left) / _this.$wrapper.width()) * 100;
               left = 25;
               right = 75;
               if (percent < left) {
@@ -374,7 +398,7 @@
           })(this),
           "mousedown.bootstrapSwitch touchstart.bootstrapSwitch": (function(_this) {
             return function(e) {
-              if (_this.drag || _this.options.disabled || _this.options.readonly) {
+              if (_this.drag || _this.options.disabled || _this.options.readonly || _this.options.indeterminate) {
                 return;
               }
               e.preventDefault();
@@ -464,6 +488,7 @@
       animate: true,
       disabled: false,
       readonly: false,
+      indeterminate: false,
       onColor: "primary",
       offColor: "default",
       onText: "ON",

docs/index.jade

@@ -172,6 +172,12 @@ html(lang='en')
                 td Readonly state
                 td true, false
                 td 'readonly' attribute or false
+              tr
+                td indeterminate
+                td Boolean
+                td indeterminate state
+                td true, false
+                td false
               tr
                 td onColor
                 td String

gulpfile.js

@@ -26,82 +26,90 @@ var banner = [
   '',
   ''].join('\n');
 
-gulp.task('coffee', function() {
-  gulp.src('src/coffee/' + name + '.coffee')
-    .pipe(plugins.coffeelint({
-      indentation: 2,
-      no_trailing_semicolons: true,
-      no_trailing_whitespace: true
-    }))
+var SERVER_HOST = 'localhost';
+var SERVER_PORT = 3000;
+
+gulp.task('coffee', function(done) {
+  gulp.src('./src/coffee/' + name + '.coffee')
+    .pipe(plugins.coffeelint('./coffeelint.json'))
+    .pipe(plugins.coffeelint.reporter())
     .pipe(plugins.coffee()).on('error', plugins.util.log)
     .pipe(plugins.header(banner, { pkg: pkg }))
-    .pipe(gulp.dest('dist/js'))
+    .pipe(gulp.dest('./dist/js'))
     .pipe(plugins.uglify())
     .pipe(plugins.header(banner, { pkg: pkg }))
     .pipe(plugins.rename({ suffix: '.min' }))
-    .pipe(gulp.dest('dist/js'));
+    .pipe(gulp.dest('./dist/js'))
+    .on('end', done);
 });
 
-gulp.task('less-bootstrap2', function() {
-  gulp.src('src/less/bootstrap2/build.less')
+gulp.task('less-bootstrap2', function(done) {
+  gulp.src('./src/less/bootstrap2/build.less')
     .pipe(plugins.less())
     .pipe(plugins.header(banner, { pkg: pkg }))
     .pipe(plugins.rename({ basename: name }))
-    .pipe(gulp.dest('dist/css/bootstrap2'))
+    .pipe(gulp.dest('./dist/css/bootstrap2'))
     .pipe(plugins.less({
       compress: true,
       cleancss: true
     }))
     .pipe(plugins.header(banner, { pkg: pkg }))
     .pipe(plugins.rename({ suffix: '.min' }))
-    .pipe(gulp.dest('dist/css/bootstrap2'));
+    .pipe(gulp.dest('./dist/css/bootstrap2'))
+    .on('end', done);
 });
 
-gulp.task('less-bootstrap3', function() {
-  gulp.src('src/less/bootstrap3/build.less')
+gulp.task('less-bootstrap3', function(done) {
+  gulp.src('./src/less/bootstrap3/build.less')
     .pipe(plugins.less())
     .pipe(plugins.header(banner, { pkg: pkg }))
     .pipe(plugins.rename({ basename: name }))
-    .pipe(gulp.dest('dist/css/bootstrap3'))
+    .pipe(gulp.dest('./dist/css/bootstrap3'))
     .pipe(plugins.less({
       compress: true,
       cleancss: true
     }))
     .pipe(plugins.header(banner, { pkg: pkg }))
     .pipe(plugins.rename({ suffix: '.min' }))
-    .pipe(gulp.dest('dist/css/bootstrap3'));
+    .pipe(gulp.dest('./dist/css/bootstrap3'))
+    .on('end', done);
 });
 
-gulp.task('docs', function() {
-  gulp.src('docs/index.jade')
+gulp.task('docs', function(done) {
+  gulp.src('./docs/index.jade')
     .pipe(plugins.jade({ pretty: true }))
-    .pipe(gulp.dest('./'));
+    .pipe(gulp.dest('./'))
+    .on('end', done);
 });
 
-gulp.task('connect', ['docs'], plugins.connect.server({
-  root: [__dirname],
-  open: true
-}));
-
-gulp.task('watch', ['connect'], function() {
-  gulp.watch('src/coffee/' + name + '.coffee', ['coffee']).on('change', function(data) {
-    gulp.src(data.path).pipe(plugins.connect.reload());
-  });
-
-  gulp.watch('src/less/bootstrap2/*.less', ['less-bootstrap2']).on('change', function(data) {
-    gulp.src(data.path).pipe(plugins.connect.reload());
-  });
+gulp.task('open', ['connect'], function(done) {
+  gulp.src('./index.html')
+    .pipe(plugins.open('', { url: 'http://' + SERVER_HOST + ':' + SERVER_PORT }))
+    .on('end', done);
+});
 
-  gulp.watch('src/less/bootstrap3/*.less', ['less-bootstrap3']).on('change', function(data) {
-    gulp.src(data.path).pipe(plugins.connect.reload());
+gulp.task('connect', function(done) {
+  plugins.connect.server({
+    root: [__dirname],
+    host: SERVER_HOST,
+    port: SERVER_PORT,
+    livereload: true
   });
+  done();
+});
 
-  gulp.watch('docs/index.jade', ['docs']).on('change', function(data) {
+gulp.task('watch', ['connect'], function() {
+  var change = function(data) {
     gulp.src(data.path).pipe(plugins.connect.reload());
-  });
+  };
 
+  gulp.watch('./src/coffee/' + name + '.coffee', ['coffee']).on('change', change);
+  gulp.watch('./src/less/bootstrap2/*.less', ['less-bootstrap2']).on('change', change);
+  gulp.watch('./src/less/bootstrap3/*.less', ['less-bootstrap3']).on('change', change);
+  gulp.watch('./docs/index.jade', ['docs']).on('change', change);
 });
 
+gulp.task('server', ['connect', 'open']);
 gulp.task('less', ['less-bootstrap2', 'less-bootstrap3']);
 gulp.task('build', ['coffee', 'less']);
-gulp.task('default', ['connect', 'build', 'docs', 'watch']);
+gulp.task('default', ['server', 'build', 'docs', 'watch']);

index.html

@@ -163,6 +163,13 @@
                 <td>true, false</td>
                 <td>'readonly' attribute or false</td>
               </tr>
+              <tr>
+                <td>indeterminate</td>
+                <td>Boolean</td>
+                <td>indeterminate state</td>
+                <td>true, false</td>
+                <td>false</td>
+              </tr>
               <tr>
                 <td>onColor</td>
                 <td>String</td>

package.json

@@ -41,14 +41,13 @@
     "gulp-util": "~2.2.14",
     "gulp-header": "~1.0.2",
     "gulp-uglify": "~0.2.1",
-    "gulp-coffeelint": "~0.2.2",
-    "gulp": "~3.5.5",
-    "gulp-less": "~1.2.2",
-    "gulp-rename": "~1.0.0",
+    "gulp-coffeelint": "~0.3.2",
+    "gulp": "~3.6.0",
+    "gulp-less": "~1.2.3",
+    "gulp-rename": "~1.2.0",
     "gulp-open": "~0.2.8",
-    "gulp-load-plugins": "~0.3.0",
+    "gulp-load-plugins": "~0.5.0",
     "gulp-jade": "~0.4.2",
-    "run-sequence": "~0.3.6",
-    "gulp-connect": "~1.0.7"
+    "gulp-connect": "~2.0.4"
   }
 }

src/coffee/bootstrap-switch.coffee

@@ -2,8 +2,6 @@ do ($ = window.jQuery, window) ->
   "use strict"
 
   class BootstrapSwitch
-    name: "bootstrap-switch"
-
     constructor: (element, options = {}) ->
       @$element = $ element
       @options = $.extend {}, $.fn.bootstrapSwitch.defaults, options,
@@ -12,6 +10,7 @@ do ($ = window.jQuery, window) ->
         animate: @$element.data "animate"
         disabled: @$element.is ":disabled"
         readonly: @$element.is "[readonly]"
+        indeterminate: @$element.data "indeterminate"
         onColor: @$element.data "on-color"
         offColor: @$element.data "off-color"
         onText: @$element.data "on-text"
@@ -28,6 +27,7 @@ do ($ = window.jQuery, window) ->
           classes.push "#{@options.baseClass}-animate" if @options.animate
           classes.push "#{@options.baseClass}-disabled" if @options.disabled
           classes.push "#{@options.baseClass}-readonly" if @options.readonly
+          classes.push "#{@options.baseClass}-indeterminate" if @options.indeterminate
           classes.push "#{@options.baseClass}-id-#{@$element.attr("id")}" if @$element.attr "id"
           classes.join " "
       @$container = $ "<div>",
@@ -43,6 +43,9 @@ do ($ = window.jQuery, window) ->
         html: @options.labelText
         class: "#{@options.baseClass}-label"
 
+      # indeterminate state
+      @$element.prop "indeterminate", true if @options.indeterminate
+
       # set up events
       @$element.on "init.bootstrapSwitch", => @options.onInit.apply element, arguments
       @$element.on "switchChange.bootstrapSwitch", => @options.onSwitchChange.apply element, arguments
@@ -69,7 +72,7 @@ do ($ = window.jQuery, window) ->
 
     state: (value, skip) ->
       return @options.state if typeof value is "undefined"
-      return @$element if @options.disabled or @options.readonly
+      return @$element if @options.disabled or @options.readonly or @options.indeterminate
 
       value = not not value
 
@@ -77,7 +80,7 @@ do ($ = window.jQuery, window) ->
       @$element
 
     toggleState: (skip) ->
-      return @$element if @options.disabled or @options.readonly
+      return @$element if @options.disabled or @options.readonly or @options.indeterminate
 
       @$element.prop("checked", not @options.state).trigger "change.bootstrapSwitch", skip
 
@@ -130,6 +133,22 @@ do ($ = window.jQuery, window) ->
       @options.readonly = not @options.readonly
       @$element
 
+    indeterminate: (value) ->
+      return @options.indeterminate if typeof value is "undefined"
+
+      value = not not value
+
+      @$wrapper[if value then "addClass" else "removeClass"]("#{@options.baseClass}-indeterminate")
+      @$element.prop "indeterminate", value
+      @options.indeterminate = value
+      @$element
+
+    toggleIndeterminate: ->
+      @$element.prop "indeterminate", not @options.indeterminate
+      @$wrapper.toggleClass "#{@options.baseClass}-indeterminate"
+      @options.indeterminate = not @options.indeterminate
+      @$element
+
     onColor: (value) ->
       color = @options.onColor
 
@@ -209,7 +228,11 @@ do ($ = window.jQuery, window) ->
           .addClass if checked then "#{@options.baseClass}-on" else "#{@options.baseClass}-off"
 
           unless skip
-            $("[name='#{@$element.attr('name')}']").not(@$element).prop("checked", false).trigger "change.bootstrapSwitch", true if @$element.is ":radio"
+            if @$element.is ":radio"
+              $("[name='#{@$element.attr('name')}']")
+              .not(@$element)
+              .prop("checked", false)
+              .trigger "change.bootstrapSwitch", true
             @$element.trigger "switchChange.bootstrapSwitch", [checked]
 
         "focus.bootstrapSwitch": (e) =>
@@ -227,7 +250,7 @@ do ($ = window.jQuery, window) ->
           @$wrapper.removeClass "#{@options.baseClass}-focused"
 
         "keydown.bootstrapSwitch": (e) =>
-          return if not e.which or @options.disabled or @options.readonly
+          return if not e.which or @options.disabled or @options.readonly or @options.indeterminate
 
           switch e.which
             when 32
@@ -265,7 +288,8 @@ do ($ = window.jQuery, window) ->
 
           e.preventDefault()
 
-          percent = (((e.pageX or e.originalEvent.touches[0].pageX) - @$wrapper.offset().left) / @$wrapper.width()) * 100
+          pageX = e.pageX or e.originalEvent.touches[0].pageX
+          percent = ((pageX - @$wrapper.offset().left) / @$wrapper.width()) * 100
           left = 25
           right = 75
 
@@ -278,7 +302,7 @@ do ($ = window.jQuery, window) ->
           @$element.trigger "focus.bootstrapSwitch"
 
         "mousedown.bootstrapSwitch touchstart.bootstrapSwitch": (e) =>
-          return if @drag or @options.disabled or @options.readonly
+          return if @drag or @options.disabled or @options.readonly or @options.indeterminate
 
           e.preventDefault()
 
@@ -292,7 +316,9 @@ do ($ = window.jQuery, window) ->
           e.preventDefault()
 
           @drag = false
-          @$element.prop("checked", parseInt(@$container.css("margin-left"), 10) > -(@$container.width() / 6)).trigger "change.bootstrapSwitch"
+          @$element
+          .prop("checked", parseInt(@$container.css("margin-left"), 10) > -(@$container.width() / 6))
+          .trigger "change.bootstrapSwitch"
           @$container.css "margin-left", ""
           @$wrapper.addClass "#{@options.baseClass}-animate" if @options.animate
 
@@ -339,6 +365,7 @@ do ($ = window.jQuery, window) ->
     animate: true
     disabled: false
     readonly: false
+    indeterminate: false
     onColor: "primary"
     offColor: "default"
     onText: "ON"

src/less/bootstrap2/bootstrap-switch.less

@@ -83,8 +83,16 @@
     }
   }
 
+  &.@{bootstrap-switch-base}-indeterminate {
+
+    .@{bootstrap-switch-base}-container {
+      margin-left: -25%;
+    }
+  }
+
   &.@{bootstrap-switch-base}-disabled,
-  &.@{bootstrap-switch-base}-readonly {
+  &.@{bootstrap-switch-base}-readonly,
+  &.@{bootstrap-switch-base}-indeterminate {
     .opacity(50);
     cursor: default !important;
 

src/less/bootstrap3/bootstrap-switch.less

@@ -83,8 +83,16 @@
     }
   }
 
+  &.@{bootstrap-switch-base}-indeterminate {
+
+    .@{bootstrap-switch-base}-container {
+      margin-left: -25%;
+    }
+  }
+
   &.@{bootstrap-switch-base}-disabled,
-  &.@{bootstrap-switch-base}-readonly {
+  &.@{bootstrap-switch-base}-readonly,
+  &.@{bootstrap-switch-base}-indeterminate {
     .opacity(.5);
     cursor: default !important;