Merge pull request #107 from BdMdesigN/v.1.8

Update to v1.8 and add example for Text Label

README.md

@@ -1,4 +1,4 @@
-Bootstrap-switch v.1.7
+Bootstrap-switch v.1.8
 ========================
 
 You can now also use radio buttons and checkboxes as switches.
@@ -129,6 +129,25 @@ radioboxes:
 ```
 
 
+Text Label
+----------
+checkboxes:
+
+``` html
+<div class="make-switch" data-text-label="My Slider Text">
+    <input type="checkbox">
+</div>
+```
+
+radioboxes:
+
+``` html
+<div class="make-switch" data-text-label="My Slider Text">
+    <input type="radio">
+</div>
+```
+
+
 HTML Text
 ----------
 checkboxes:

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "bootstrap-switch",
   "description" : "Unofficial bootstrap switch",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "main": "static/js/bootstrap-switch.js",
   "ignore": [ 
     "examples"

component.json

@@ -1,7 +1,7 @@
 {
   "name"        : "bootstrap-switch",
   "description" : "Unofficial bootstrap switch",
-  "version"     : "1.7.0",
+  "version"     : "1.8.0",
   "main"        : "static/js/bootstrap-switch.js",
   "ignore": [ 
     "examples"

examples/index.html

@@ -276,6 +276,25 @@ $('#label-switch').bootstrapSwitch('setOffLabel', 'O');
         </div>
     </div>
 
+    <!-- LABEL TEXT -->
+    <div class="row-fluid">
+        <div class="span12">
+            <h3>Label Text</h3>
+
+            <div class="bs-docs-example">
+            <h3>Standard</h3>
+                <div class="make-switch" data-text-label="My TV">
+                    <input type="checkbox" checked />
+                </div>
+            </div>
+            <pre class="prettyprint linenums">
+&lt;div class="make-switch" data-text-label="My TV">
+    &lt;input type="checkbox" checked />
+&lt;/div>
+            </pre>
+        </div>
+    </div>
+
     <!-- HTML TEXT -->
     <div class="row-fluid">
         <div class="span12">
@@ -815,8 +834,7 @@ $(document).ready(function() {
         $('.radio1').bootstrapSwitch('toggleRadioState');
     });
     $('.radio2').on('switch-change', function () {
-        $('.radio2')
-                .bootstrapSwitch('toggleRadioStateAllowUncheck', true);
+        $('.radio2').bootstrapSwitch('toggleRadioStateAllowUncheck', true);
     });
 
 });

static/js/bootstrap-switch.js

@@ -1,5 +1,5 @@
 /*! ============================================================
- * bootstrapSwitch v1.7 by Larentis Mattia @SpiritualGuru
+ * bootstrapSwitch v1.8 by Larentis Mattia @SpiritualGuru
  * http://www.larentis.eu/
  * 
  * Enhanced for radiobuttons by Stein, Peter @BdMdesigN
@@ -32,7 +32,8 @@
               , moving
               , onLabel = "ON"
               , offLabel = "OFF"
-              , icon = false;
+              , icon = false
+              , textLabel = false;
 
             $.each(['switch-mini', 'switch-small', 'switch-large'], function (i, el) {
               if (classes.indexOf(el) >= 0)
@@ -53,6 +54,9 @@
             if ($element.data('label-icon') !== undefined)
               icon = $element.data('label-icon');
 
+            if ($element.data('text-label') !== undefined)
+              textLabel = $element.data('text-label');
+
             $switchLeft = $('<span>')
               .addClass("switch-left")
               .addClass(myClasses)
@@ -77,6 +81,10 @@
             if (icon) {
               $label.html('<i class="icon ' + icon + '"></i>');
             }
+            
+            if (textLabel) {
+              $label.html('<div class="text-label">' + textLabel + '</div>');
+            }
 
             $div = $element.find(inputSelector).wrap($('<div>')).parent().data('animated', false);
 

static/less/bootstrap-switch.less

@@ -1,5 +1,5 @@
 /* ============================================================
- * bootstrapSwitch v1.7 by Larentis Mattia @SpiritualGuru
+ * bootstrapSwitch v1.8 by Larentis Mattia @SpiritualGuru
  * http://www.larentis.eu/
  *
  * Enhanced for radiobuttons by Stein, Peter @BdMdesigN

static/stylesheets/bootstrap-switch.css

@@ -1,5 +1,5 @@
 /* ============================================================
- * bootstrapSwitch v1.7 by Larentis Mattia @SpiritualGuru
+ * bootstrapSwitch v1.8 by Larentis Mattia @SpiritualGuru
  * http://www.larentis.eu/
  *
  * Enhanced for radiobuttons by Stein, Peter @BdMdesigN
@@ -117,6 +117,11 @@
   font-size: 16px;
   line-height: normal;
 }
+.has-switch .text-label {
+  text-align: center;
+  color: #000000;
+  font-size: 14px;
+}
 .has-switch label {
   text-align: center;
   margin-top: -1px;