Merge pull request #34 from denoir/master

Allow change event propagation

static/js/bootstrapSwitch.js

@@ -23,7 +23,8 @@
               , color
               , moving
               , onLabel = "ON"
-              , offLabel = "OFF";
+              , offLabel = "OFF"
+              , icon = false;
 
             $.each(['switch-mini', 'switch-small', 'switch-large'], function (i, el) {
               if (classes.indexOf(el) >= 0)
@@ -41,6 +42,9 @@
             if ($element.data('off-label') !== undefined)
               offLabel = $element.data('off-label');
 
+            if ($element.data('icon') !== undefined)
+              icon = $element.data('icon');
+
             $switchLeft = $('<span>')
               .addClass("switch-left")
               .addClass(myClasses)
@@ -62,6 +66,10 @@
               .addClass(myClasses)
               .attr('for', $element.find('input').attr('id'));
 
+            if (icon) {
+              $label.html('<i class="icon icon-'+icon+'"></i>');
+            }
+
             $div = $element.find(':checkbox').wrap($('<div>')).parent().data('animated', false);
 
             if ($element.data('animated') !== false)
@@ -103,7 +111,11 @@
               var $element = $(this).parent();
 
               e.preventDefault();
-              e.stopImmediatePropagation();
+              // don't stop propagation of the
+              // change event, there's no need to do so
+              // and we don't want to break other modules
+              // that might depend on this event.
+              // e.stopImmediatePropagation();
 
               $element.css('left', '');
 

static/less/bootstrapSwitch.less

@@ -102,6 +102,7 @@
   }
 
   label {
+  	text-align: center;
     margin-top: -1px;
     margin-bottom: -1px;
     z-index: 100;
@@ -110,6 +111,13 @@
     border-right: 1px solid @btnBorder;
 
     .buttonBackground(@btnBackground, @btnBackgroundHighlight);
+
+    i {
+      color: #000;
+      text-shadow: 0 1px 0 #fff;
+      line-height: 18px;
+      pointer-events: none;
+    }
   }
 
   span {

static/stylesheets/bootstrapSwitch.css

@@ -99,6 +99,7 @@
   line-height: normal;
 }
 .has-switch label {
+  text-align: center;
   margin-top: -1px;
   margin-bottom: -1px;
   z-index: 100;
@@ -136,6 +137,14 @@
 .has-switch label.active {
   background-color: #cccccc \9;
 }
+
+	.has-switch label i {
+		color: #000;
+		text-shadow: 0 1px 0 #fff;
+		line-height: 18px;
+		pointer-events: none;
+	}
+
 .has-switch span {
   text-align: center;
   z-index: 1;