Roo/bootstrap/NavItem.js

roojs-bootstrap.js
roojs-bootstrap-debug.js

diff --git a/Roo/bootstrap/NavItem.js b/Roo/bootstrap/NavItem.js
index 139ca75..cff0ad0 100644 (file)
--- a/Roo/bootstrap/NavItem.js
+++ b/Roo/bootstrap/NavItem.js
@@ -65,6 +65,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
     html: '',
     badge: '',
     icon: false,
+    fa : false,
     glyphicon: false,
     active: false,
     preventDefault : false,
@@ -89,7 +90,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
             cfg.cls += ' disabled';
         }
         
-        if (this.href || this.html || this.glyphicon || this.icon) {
+        if (this.href || this.html || this.glyphicon || this.icon || this.fa) {
             cfg.cn = [
                 {
                     tag: this.tagtype,
@@ -103,7 +104,9 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
             if (this.icon) {
                 cfg.cn[0].html = '<i class="'+this.icon+'"></i> <span>' + cfg.cn[0].html + '</span>'
             }
-
+           if (this.fa) {
+                cfg.cn[0].html = '<i class="fa fas fa-'+this.fa+'"></i> <span>' + cfg.cn[0].html + '</span>'
+            }
             if(this.glyphicon) {
                 cfg.cn[0].html = '<span class="glyphicon glyphicon-' + this.glyphicon + '"></span> '  + cfg.cn[0].html;
             }

diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js
index b3eff16..75300af 100644 (file)
--- a/roojs-bootstrap-debug.js
+++ b/roojs-bootstrap-debug.js
@@ -4542,8 +4542,9 @@ Roo.apply(Roo.bootstrap.NavGroup, {
  * @cfg {String} html content of button
  * @cfg {String} badge text inside badge
  * @cfg {String} badgecls (bg-green|bg-red|bg-yellow)the extra classes for the badge
- * @cfg {String} glyphicon name of glyphicon
- * @cfg {String} icon name of font awesome icon
+ * @cfg {String} glyphicon DEPRICATED - use fa
+ * @cfg {String} icon DEPRICATED - use fa
+ * @cfg {String} fa - Fontawsome icon name (can add stuff to it like fa-2x)
  * @cfg {Boolean} active Is item active
  * @cfg {Boolean} disabled Is item disabled
  
@@ -4593,6 +4594,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
     html: '',
     badge: '',
     icon: false,
+    fa : false,
     glyphicon: false,
     active: false,
     preventDefault : false,
@@ -4617,7 +4619,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
             cfg.cls += ' disabled';
         }
         
-        if (this.href || this.html || this.glyphicon || this.icon) {
+        if (this.href || this.html || this.glyphicon || this.icon || this.fa) {
             cfg.cn = [
                 {
                     tag: this.tagtype,
@@ -4631,7 +4633,9 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
             if (this.icon) {
                 cfg.cn[0].html = '<i class="'+this.icon+'"></i> <span>' + cfg.cn[0].html + '</span>'
             }
-
+           if (this.fa) {
+                cfg.cn[0].html = '<i class="fa fas fa-'+this.fa+'"></i> <span>' + cfg.cn[0].html + '</span>'
+            }
             if(this.glyphicon) {
                 cfg.cn[0].html = '<span class="glyphicon glyphicon-' + this.glyphicon + '"></span> '  + cfg.cn[0].html;
             }

diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js
index 88844e4..c3977fa 100644 (file)
--- a/roojs-bootstrap.js
+++ b/roojs-bootstrap.js
@@ -179,18 +179,19 @@ if(i>this.navItems.length){return;}this.setActiveItem(this.navItems[i+1]);},setA
 return false;}return true;});},getWasActive:function(){var r=false;Roo.each(this.navItems,function(e){if(e.was_active){r=e;return false;}return true;});return r;}});Roo.apply(Roo.bootstrap.NavGroup,{groups:{},register:function(A){this.groups[A.navId]=A;},get:function(A){if(typeof(this.groups[A])=='undefined'){return false;
 }return this.groups[A];}});
 // Roo/bootstrap/NavItem.js
-Roo.bootstrap.NavItem=function(A){Roo.bootstrap.NavItem.superclass.constructor.call(this,A);this.addEvents({"click":true,'changed':true,'scrollto':true});};Roo.extend(Roo.bootstrap.NavItem,Roo.bootstrap.Component,{href:false,html:'',badge:'',icon:false,glyphicon:false,active:false,preventDefault:false,tabId:false,tagtype:'a',disabled:false,animateRef:false,was_active:false,getAutoCreate:function(){var A={tag:'li',cls:'nav-item'}
-;if(this.active){A.cls=typeof(A.cls)=='undefined'?'active':A.cls+' active';}if(this.disabled){A.cls+=' disabled';}if(this.href||this.html||this.glyphicon||this.icon){A.cn=[{tag:this.tagtype,href:this.href||"#",html:this.html||''}];if(this.tagtype=='a'){A.cn[0].cls='nav-link';
-}if(this.icon){A.cn[0].html='<i class="'+this.icon+'"></i> <span>'+A.cn[0].html+'</span>'}if(this.glyphicon){A.cn[0].html='<span class="glyphicon glyphicon-'+this.glyphicon+'"></span> '+A.cn[0].html;}if(this.menu){A.cn[0].html+=" <span class='caret'></span>";
-}if(this.badge!==''){A.cn[0].html+=' <span class="badge badge-secondary">'+this.badge+'</span>';}}return A;},initEvents:function(){if(typeof(this.menu)!='undefined'){this.menu.parentType=this.xtype;this.menu.triggerEl=this.el;this.menu=this.addxtype(Roo.apply({}
-,this.menu));}this.el.select('a',true).on('click',this.onClick,this);if(this.tagtype=='span'){this.el.select('span',true).on('click',this.onClick,this);}this.parent().register(this);},onClick:function(e){if(e.getTarget('.dropdown-menu-item')){return;}if(this.preventDefault||this.href=='#'){Roo.log("NavItem - prevent Default?");
-e.preventDefault();}if(this.disabled){return;}var tg=Roo.bootstrap.TabGroup.get(this.navId);if(tg&&tg.transition){Roo.log("waiting for the transitionend");return;}if(this.fireEvent('click',this,e)===false){return;};if(this.tagtype=='span'){return;}var A=this.el.select('a',true).first();
-if(A&&this.animateRef&&this.href.indexOf('#')>-1){if(A.dom.href.split("#")[0]!=document.location.toString().split("#")[0]){return;}Roo.log("NavItem - prevent Default?");e.preventDefault();this.scrollToElement(e);}var p=this.parent();if(['tabs','pills'].indexOf(p.type)!==-1){if(typeof(p.setActiveItem)!=='undefined'){p.setActiveItem(this);
-}}if(p.parentType=='NavHeaderbar'&&!this.menu){p.parent().el.select('.navbar-collapse',true).removeClass('in');}},isActive:function(){return this.active},setActive:function(A,B,C){if(this.active&&!A&&this.navId){this.was_active=true;var nv=Roo.bootstrap.NavGroup.get(this.navId);
-if(nv){nv.clearWasActive(this);}}this.active=A;if(!A){this.el.removeClass('active');}else if(!this.el.hasClass('active')){this.el.addClass('active');}if(B){this.fireEvent('changed',this,A);}if(!this.navId||!this.tabId||!A||C){return;}var tg=Roo.bootstrap.TabGroup.get(this.navId);
-if(!tg){return;}var D=tg.getPanelByName(this.tabId);if(!D){return;}if(false==tg.showPanel(D)){var nv=Roo.bootstrap.NavGroup.get(this.navId);if(nv){var E=nv.getWasActive();if(E){E.setActive(true,false,true);}}}},setDisabled:function(A){this.disabled=A;if(!A){this.el.removeClass('disabled');
-}else if(!this.el.hasClass('disabled')){this.el.addClass('disabled');}},tooltipEl:function(){return this.el.select(''+this.tagtype+'',true).first();},scrollToElement:function(e){var c=document.body;if(Roo.isFirefox||Roo.isIE||Roo.isIE11){c=document.documentElement;
-}var A=Roo.get(c).select('a[name='+this.href.split('#')[1]+']',true).first();if(!A){return;}var o=A.calcOffsetsTo(c);var B={target:A,value:o[1]};this.fireEvent('scrollto',this,B,e);Roo.get(c).scrollTo('top',B.value,true);return;}});
+Roo.bootstrap.NavItem=function(A){Roo.bootstrap.NavItem.superclass.constructor.call(this,A);this.addEvents({"click":true,'changed':true,'scrollto':true});};Roo.extend(Roo.bootstrap.NavItem,Roo.bootstrap.Component,{href:false,html:'',badge:'',icon:false,fa:false,glyphicon:false,active:false,preventDefault:false,tabId:false,tagtype:'a',disabled:false,animateRef:false,was_active:false,getAutoCreate:function(){var A={tag:'li',cls:'nav-item'}
+;if(this.active){A.cls=typeof(A.cls)=='undefined'?'active':A.cls+' active';}if(this.disabled){A.cls+=' disabled';}if(this.href||this.html||this.glyphicon||this.icon||this.fa){A.cn=[{tag:this.tagtype,href:this.href||"#",html:this.html||''}];if(this.tagtype=='a'){A.cn[0].cls='nav-link';
+}if(this.icon){A.cn[0].html='<i class="'+this.icon+'"></i> <span>'+A.cn[0].html+'</span>'}if(this.fa){A.cn[0].html='<i class="fa fas fa-'+this.fa+'"></i> <span>'+A.cn[0].html+'</span>'}if(this.glyphicon){A.cn[0].html='<span class="glyphicon glyphicon-'+this.glyphicon+'"></span> '+A.cn[0].html;
+}if(this.menu){A.cn[0].html+=" <span class='caret'></span>";}if(this.badge!==''){A.cn[0].html+=' <span class="badge badge-secondary">'+this.badge+'</span>';}}return A;},initEvents:function(){if(typeof(this.menu)!='undefined'){this.menu.parentType=this.xtype;
+this.menu.triggerEl=this.el;this.menu=this.addxtype(Roo.apply({},this.menu));}this.el.select('a',true).on('click',this.onClick,this);if(this.tagtype=='span'){this.el.select('span',true).on('click',this.onClick,this);}this.parent().register(this);},onClick:function(e){if(e.getTarget('.dropdown-menu-item')){return;
+}if(this.preventDefault||this.href=='#'){Roo.log("NavItem - prevent Default?");e.preventDefault();}if(this.disabled){return;}var tg=Roo.bootstrap.TabGroup.get(this.navId);if(tg&&tg.transition){Roo.log("waiting for the transitionend");return;}if(this.fireEvent('click',this,e)===false){return;
+};if(this.tagtype=='span'){return;}var A=this.el.select('a',true).first();if(A&&this.animateRef&&this.href.indexOf('#')>-1){if(A.dom.href.split("#")[0]!=document.location.toString().split("#")[0]){return;}Roo.log("NavItem - prevent Default?");e.preventDefault();
+this.scrollToElement(e);}var p=this.parent();if(['tabs','pills'].indexOf(p.type)!==-1){if(typeof(p.setActiveItem)!=='undefined'){p.setActiveItem(this);}}if(p.parentType=='NavHeaderbar'&&!this.menu){p.parent().el.select('.navbar-collapse',true).removeClass('in');
+}},isActive:function(){return this.active},setActive:function(A,B,C){if(this.active&&!A&&this.navId){this.was_active=true;var nv=Roo.bootstrap.NavGroup.get(this.navId);if(nv){nv.clearWasActive(this);}}this.active=A;if(!A){this.el.removeClass('active');}else if(!this.el.hasClass('active')){this.el.addClass('active');
+}if(B){this.fireEvent('changed',this,A);}if(!this.navId||!this.tabId||!A||C){return;}var tg=Roo.bootstrap.TabGroup.get(this.navId);if(!tg){return;}var D=tg.getPanelByName(this.tabId);if(!D){return;}if(false==tg.showPanel(D)){var nv=Roo.bootstrap.NavGroup.get(this.navId);
+if(nv){var E=nv.getWasActive();if(E){E.setActive(true,false,true);}}}},setDisabled:function(A){this.disabled=A;if(!A){this.el.removeClass('disabled');}else if(!this.el.hasClass('disabled')){this.el.addClass('disabled');}},tooltipEl:function(){return this.el.select(''+this.tagtype+'',true).first();
+},scrollToElement:function(e){var c=document.body;if(Roo.isFirefox||Roo.isIE||Roo.isIE11){c=document.documentElement;}var A=Roo.get(c).select('a[name='+this.href.split('#')[1]+']',true).first();if(!A){return;}var o=A.calcOffsetsTo(c);var B={target:A,value:o[1]}
+;this.fireEvent('scrollto',this,B,e);Roo.get(c).scrollTo('top',B.value,true);return;}});
 // Roo/bootstrap/NavSidebarItem.js
 Roo.bootstrap.NavSidebarItem=function(A){Roo.bootstrap.NavSidebarItem.superclass.constructor.call(this,A);this.addEvents({"click":true,'changed':true});};Roo.extend(Roo.bootstrap.NavSidebarItem,Roo.bootstrap.NavItem,{badgeWeight:'default',open:false,buttonView:false,buttonWeight:'default',buttonSize:'md',showArrow:true,getAutoCreate:function(){var a={tag:'a',href:this.href||'#',cls:'',html:'',cn:[]}
 ;if(this.buttonView){a={tag:'button',href:this.href||'#',cls:'btn btn-'+this.buttonWeight+' btn-'+this.buttonSize+'roo-button-dropdown-toggle',html:this.html,cn:[]};}var A={tag:'li',cls:'',cn:[a]};if(this.active){A.cls+=' active';}if(this.disabled){A.cls+=' disabled';