Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Optimization for mouse click to document: replace heavy bootstrap function clearMenus. Elements with data-toggle=dropdown must have class dropdown-toggle.

Browse source
This commit is contained in:
Julia Radzhabova 2016-10-19 14:16:46 +03:00
parent a7e603ca5f
commit 4048b849f8
7 changed files with 19 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
apps/common/main/lib/extend/Bootstrap.js
View file

@ -186,6 +186,16 @@ function getParent($this) {
return $parent && $parent.length ? $parent : $this.parent(); return $parent && $parent.length ? $parent : $this.parent();
} }
function clearMenus() {
$('.dropdown-toggle').each(function (e) {
var $parent = ($(this)).parent();
if (!$parent.hasClass('open')) return;
$parent.trigger(e = $.Event('hide.bs.dropdown'));
if (e.isDefaultPrevented()) return;
$parent.removeClass('open').trigger('hidden.bs.dropdown');
})
}
$(document) $(document)
.off('keydown.bs.dropdown.data-api') .off('keydown.bs.dropdown.data-api')
.on('keydown.bs.dropdown.data-api', '[data-toggle=dropdown], [role=menu]' , onDropDownKeyDown); .on('keydown.bs.dropdown.data-api', '[data-toggle=dropdown], [role=menu]' , onDropDownKeyDown);
@ -206,9 +216,8 @@ $(document)
} }
function onDropDownClick(e) { function onDropDownClick(e) {
if ((e.which == 1 || e.which == undefined) && !!clickDefHandler) { if (e.which == 1 || e.which == undefined)
clickDefHandler(e); clearMenus();
}
} }
if (!!clickDefHandler) { if (!!clickDefHandler) {

2
apps/documenteditor/main/app/template/StatusBar.template
View file

@ -1,7 +1,7 @@
<div class="statusbar" style="display:table;"> <div class="statusbar" style="display:table;">
<div class="status-group dropup"> <div class="status-group dropup">
<label id="label-pages" class="status-label" style="margin-left: 40px;" data-toggle="dropdown"><%= Common.Utils.String.format(scope.pageIndexText, 1, 1) %></label> <label id="label-pages" class="status-label dropdown-toggle" style="margin-left: 40px;" data-toggle="dropdown"><%= Common.Utils.String.format(scope.pageIndexText, 1, 1) %></label>
<div id="status-goto-box" class="dropdown-menu"> <div id="status-goto-box" class="dropdown-menu">
<label style="float:left;line-height:22px;"><%= scope.goToPageText %></label> <label style="float:left;line-height:22px;"><%= scope.goToPageText %></label>
<div id="status-goto-page" style="display:inline-block;"></div> <div id="status-goto-page" style="display:inline-block;"></div>

1
apps/documenteditor/main/app/view/Statusbar.js
View file

@ -417,6 +417,7 @@ define([
usertip.setContent(); usertip.setContent();
} }
(length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle'); (length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle');
this.panelUsersBlock.toggleClass('dropdown-toggle', length > 1);
(length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this)); (length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this));
}, },

2
apps/presentationeditor/main/app/template/StatusBar.template
View file

@ -2,7 +2,7 @@
<div class="statusbar" style="display:table;"> <div class="statusbar" style="display:table;">
<div class="status-group dropup"> <div class="status-group dropup">
<button id="status-btn-preview" type="button" class="btn small btn-toolbar" style="margin-left: 9px;"><span class="btn-icon">&nbsp;</span></button> <button id="status-btn-preview" type="button" class="btn small btn-toolbar" style="margin-left: 9px;"><span class="btn-icon">&nbsp;</span></button>
<label id="status-label-pages" class="status-label" style="margin-left: 7px;" data-toggle="dropdown"><%= Common.Utils.String.format(scope.pageIndexText, 1, 1) %></label> <label id="status-label-pages" class="status-label dropdown-toggle" style="margin-left: 7px;" data-toggle="dropdown"><%= Common.Utils.String.format(scope.pageIndexText, 1, 1) %></label>
<div id="status-goto-box" class="dropdown-menu"> <div id="status-goto-box" class="dropdown-menu">
<label style="float:left;line-height:22px;"><%= scope.goToPageText %></label> <label style="float:left;line-height:22px;"><%= scope.goToPageText %></label>
<div id="status-goto-page" style="display:inline-block;"></div> <div id="status-goto-page" style="display:inline-block;"></div>

2
apps/presentationeditor/main/app/view/DocumentPreview.js
View file

@ -78,7 +78,7 @@ define([
'<div class="separator"/>', '<div class="separator"/>',
'</div>', '</div>',
'<div class="preview-group dropup">', '<div class="preview-group dropup">',
'<label id="preview-label-slides" class="status-label" data-toggle="dropdown">Slide 1 of 1</label>', '<label id="preview-label-slides" class="status-label dropdown-toggle" data-toggle="dropdown">Slide 1 of 1</label>',
'<div id="preview-goto-box" class="dropdown-menu">', '<div id="preview-goto-box" class="dropdown-menu">',
'<label style="float:left;line-height:22px;">' + this.goToSlideText + '</label>', '<label style="float:left;line-height:22px;">' + this.goToSlideText + '</label>',
'<div id="preview-goto-page" style="display:inline-block;"></div>', '<div id="preview-goto-page" style="display:inline-block;"></div>',

1
apps/presentationeditor/main/app/view/Statusbar.js
View file

@ -321,6 +321,7 @@ define([
usertip.setContent(); usertip.setContent();
} }
(length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle'); (length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle');
this.panelUsersBlock.toggleClass('dropdown-toggle', length > 1);
(length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this)); (length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this));
}, },

3
apps/spreadsheeteditor/main/app/view/Statusbar.js
View file

@ -300,7 +300,7 @@ define([
}); });
}); });
this.tabbar.$el.append('<div class="menu-backdrop" data-toggle="dropdown" style="width:0; height:0;"/>'); this.tabbar.$el.append('<div class="menu-backdrop dropdown-toggle" data-toggle="dropdown" style="width:0; height:0;"/>');
this.tabMenu.render(this.tabbar.$el); this.tabMenu.render(this.tabbar.$el);
this.tabMenu.on('show:after', _.bind(this.onTabMenuAfterShow, this)); this.tabMenu.on('show:after', _.bind(this.onTabMenuAfterShow, this));
this.tabMenu.on('hide:after', _.bind(this.onTabMenuAfterHide, this)); this.tabMenu.on('hide:after', _.bind(this.onTabMenuAfterHide, this));
@ -445,6 +445,7 @@ define([
usertip.setContent(); usertip.setContent();
} }
(length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle'); (length > 1) ? this.panelUsersBlock.attr('data-toggle', 'dropdown') : this.panelUsersBlock.removeAttr('data-toggle');
this.panelUsersBlock.toggleClass('dropdown-toggle', length > 1);
(length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this)); (length > 1) ? this.panelUsersBlock.off('click') : this.panelUsersBlock.on('click', _.bind(this.onUsersClick, this));
}, },