// private this should really trigger on mouseup..
function onMouseDown(e){
Roo.log("on Mouse Up");
- if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu") && !e.getTarget('.user-menu')){
- Roo.log("hideAll");
+
+ if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".dropdown-menu") && !e.getTarget('.user-menu')){
+ Roo.log("MenuManager hideAll");
hideAll();
e.stopEvent();
}
* @extends Roo.bootstrap.Component
* Bootstrap Menu class - container for MenuItems
* @cfg {String} type (dropdown|treeview|submenu) type of menu
+ * @cfg {bool} hidden if the menu should be hidden when rendered.
*
* @constructor
* Create a new Menu
Roo.bootstrap.Menu = function(config){
Roo.bootstrap.Menu.superclass.constructor.call(this, config);
- if (this.registerMenu) {
+ if (this.registerMenu && this.type != 'treeview') {
Roo.bootstrap.MenuMgr.register(this);
}
this.addEvents({
hidden:true,
+
parentMenu : false,
getChildContainer : function() {
this.triggerEl.addClass('dropdown-toggle');
+
if (Roo.isTouch) {
this.el.on('touchstart' , this.onTouch, this);
}
* Hides this menu and optionally all parent menus
* @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
*/
- hide : function(deep){
+ hide : function(deep)
+ {
this.hideMenuItems();
if(this.el && this.isVisible()){
Roo.log('trigger press');
//Roo.log(e.getTarget());
// Roo.log(this.triggerEl.dom);
- if (Roo.get(e.getTarget()).findParent('.dropdown-menu')) {
+
+ // trigger only occurs on normal menu's -- if it's a treeview or dropdown... do not hide/show..
+ var pel = Roo.get(e.getTarget());
+ if (pel.findParent('.dropdown-menu') || pel.findParent('.treeview-menu') ) {
+
return;
}
hideMenuItems : function()
{
+ Roo.log("hide Menu Items");
+ if (!this.el) {
+ return;
+ }
//$(backdrop).remove()
- Roo.select('.open',true).each(function(aa) {
+ this.el.select('.open',true).each(function(aa) {
aa.removeClass('open');
//var parent = getParent($(this))
//$parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
//if (e.isDefaultPrevented()) return
//$parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget)
- })
+ });
},
addxtypeChild : function (tree, cntr) {
var comp= Roo.bootstrap.Menu.superclass.addxtypeChild.call(this, tree, cntr);
* Bootstrap MenuItem class
* @cfg {String} html the menu label
* @cfg {String} href the link
- * @cfg {Boolean} preventDefault (true | false) default true
- * @cfg {Boolean} isContainer (true | false) default false
+ * @cfg {Boolean} preventDefault do not trigger A href on clicks.
+ * @cfg {Boolean} isContainer is it a container - just returns a drop down item..
+ * @cfg {Boolean} active used on sidebars to highlight active itesm
+ * @cfg {String} fa favicon to show on left of menu item.
+ * @cfg {Roo.bootsrap.Menu} menu the child menu.
*
*
* @constructor
html : false,
preventDefault: true,
isContainer : false,
+ active : false,
+ fa: false,
getAutoCreate : function(){
cls: 'dropdown-menu-item'
};
}
+ var ctag = {
+ tag: 'span',
+ html: 'Link'
+ };
+
+ var anc = {
+ tag : 'a',
+ href : '#',
+ cn : [ ]
+ };
+
+ if (this.fa !== false) {
+ anc.cn.push({
+ tag : 'i',
+ cls : 'fa fa-' + this.fa
+ });
+ }
+
+ anc.cn.push(ctag);
+
var cfg= {
tag: 'li',
cls: 'dropdown-menu-item',
- cn: [
- {
- tag : 'a',
- href : '#',
- html : 'Link'
- }
- ]
+ cn: [ anc ]
};
if (this.parent().type == 'treeview') {
cfg.cls = 'treeview-menu';
}
+ if (this.active) {
+ cfg.cls += ' active';
+ }
+
+
- cfg.cn[0].href = this.href || cfg.cn[0].href ;
- cfg.cn[0].html = this.html || cfg.cn[0].html ;
+ anc.href = this.href || cfg.cn[0].href ;
+ ctag.html = this.html || cfg.cn[0].html ;
return cfg;
},
- initEvents: function() {
-
- //this.el.select('a').on('click', this.onClick, this);
+ initEvents: function()
+ {
+ if (this.parent().type == 'treeview') {
+ this.el.select('a').on('click', this.onClick, this);
+ }
+ if (this.menu) {
+ this.menu.parentType = this.xtype;
+ this.menu.triggerEl = this.el;
+ this.menu = this.addxtype(Roo.apply({}, this.menu));
+ }
},
onClick : function(e)
{
//this.el.select('.modal-footer').()
},
+ diff : false,
+
resizeTo: function(w,h)
{
- // skip..
+ // skip.. ?? why??
+
+ this.el.select('.modal-dialog',true).first().setWidth(w);
+ if (this.diff === false) {
+ this.diff = this.el.select('.modal-dialog',true).first().getHeight() - this.el.select('.modal-body',true).first().getHeight();
+ }
+
+ this.el.select('.modal-body',true).first().setHeight(h-this.diff);
+
+
},
setContentSize : function(w, h)
{
},
getHeaderChildContainer : function()
{
- if (this.el.select('.navbar-header').getCount()) {
+ if (this.srButton && this.el.select('.navbar-header').getCount()) {
return this.el.select('.navbar-header',true).first();
}
onClick : function(e)
{
+ if (e.getTarget('.dropdown-menu-item')) {
+ // did you click on a menu itemm.... - then don't trigger onclick..
+ return;
+ }
+
if(
this.preventDefault ||
this.href == '#'
){
-
+ Roo.log("NavItem - prevent Default?");
e.preventDefault();
}
if (ael.dom.href.split("#")[0] != document.location.toString().split("#")[0]) {
return; // ignore... - it's a 'hash' to another page.
}
-
+ Roo.log("NavItem - prevent Default?");
e.preventDefault();
this.scrollToElement(e);
}
* @extends Roo.bootstrap.NavItem
* Bootstrap Navbar.NavSidebarItem class
* {String} badgeWeight (default|primary|success|info|warning|danger)the extra classes for the badge
+ * {bool} open is the menu open
* @constructor
* Create a new Navbar Button
* @param {Object} config The config object
badgeWeight : 'default',
+ open: false,
+
getAutoCreate : function(){
if (this.disabled) {
cfg.cls += ' disabled';
}
-
+ if (this.open) {
+ cfg.cls += ' open x-open';
+ }
// left icon..
if (this.glyphicon || this.icon) {
var c = this.glyphicon ? ('glyphicon glyphicon-'+this.glyphicon) : this.icon;
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.on('click', this.onClick, this);