Uncommited changes synced

[roojs1] / Roo / bootstrap / Button.js

diff --git a/Roo/bootstrap/Button.js b/Roo/bootstrap/Button.js
index 8116036..fee7e93 100644 (file)
--- a/Roo/bootstrap/Button.js
+++ b/Roo/bootstrap/Button.js
@@ -10,7 +10,9 @@
  * @extends Roo.bootstrap.Component
  * Bootstrap Button class
  * @cfg {String} html The button content
- * @cfg {String} weight (default | primary | success | info | warning | danger | link ) default 
+ * @cfg {String} weight (default | primary | secondary | success | info | warning | danger | link ) default
+ * @cfg {String} badge_weight (default | primary | secondary | success | info | warning | danger | link ) default (same as button)
+ * @cfg {Boolean} outline default false (except for weight=default which emulates old behaveiour with an outline)
  * @cfg {String} size ( lg | sm | xs)
  * @cfg {String} tag ( a | input | submit)
  * @cfg {String} href empty or href
@@ -36,7 +38,7 @@
 
 Roo.bootstrap.Button = function(config){
     Roo.bootstrap.Button.superclass.constructor.call(this, config);
-    this.weightClass = ["btn-default", 
+    this.weightClass = ["btn-default btn-outline-secondary", 
                        "btn-primary", 
                        "btn-success", 
                        "btn-info", 
@@ -68,6 +70,8 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
     html: false,
     active: false,
     weight: '',
+    badge_weight: '',
+    outline : false,
     size: '',
     tag: 'button',
     href: '',
@@ -121,7 +125,7 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
                 ]
             };
             
-            if (['default', 'primary', 'success', 'info', 'warning', 'danger', 'link'].indexOf(this.weight) > -1) {
+            if (['default', 'secondary' , 'primary', 'success', 'info', 'warning', 'danger', 'link'].indexOf(this.weight) > -1) {
                 cfg.cls += ' '+this.weight;
             }
             
@@ -145,9 +149,15 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
             //if (this.parentType != 'Navbar') {
             this.weight = this.weight.length ?  this.weight : 'default';
             //}
-            if (['default', 'primary', 'success', 'info', 'warning', 'danger', 'link'].indexOf(this.weight) > -1) {
+            if (['default', 'primary', 'secondary', 'success', 'info', 'warning', 'danger', 'link'].indexOf(this.weight) > -1) {
                 
-                cfg.cls += ' btn-' + this.weight;
+                var outline = this.outline || this.weight == 'default' ? 'outline-' : '';
+                var weight = this.weight == 'default' ? 'secondary' : this.weight;
+                cfg.cls += ' btn-' + outline + weight;
+                if (this.weight == 'default') {
+                    // BC
+                    cfg.cls += ' btn-' + this.weight;
+                }
             }
         } else if (this.theme==='glow') {
             
@@ -236,12 +246,15 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
                         };
                 
             }
+            var bw = this.badge_weight.length ? this.badge_weight :
+                (this.weight.length ? this.weight : 'secondary');
+            bw = bw == 'default' ? 'secondary' : bw;
             
             cfg.cn = [
                 value,
                 {
                     tag: 'span',
-                    cls: 'badge',
+                    cls: 'badge badge-' + bw,
                     html: this.badge
                 }
             ];
@@ -375,7 +388,13 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
     setWeight : function(str)
     {
        this.el.removeClass(this.weightClass);
-        this.el.addClass('btn-' + str);        
+        this.weight = str;
+        var outline = this.outline ? 'outline-' : '';
+        if (str == 'default') {
+            this.el.addClass('btn-default btn-outline-secondary');        
+            return;
+        }
+        this.el.addClass('btn-' + outline + str);        
     }