[DE] Refactoring DataViewSimple. Optimize equation loading.

This commit is contained in:
Julia Radzhabova 2019-08-15 15:54:53 +03:00
parent 4a59da29c2
commit faecea9e11
2 changed files with 48 additions and 72 deletions

View file

@ -768,13 +768,10 @@ define([
Common.UI.DataViewSimple = Common.UI.BaseView.extend({
options : {
multiSelect: false,
handleSelect: true,
enableKeyEvents: true,
keyMoveDirection: 'both', // 'vertical', 'horizontal'
restoreHeight: 0,
emptyText: '',
allowScrollbar: true,
scrollAlwaysVisible: false,
useBSKeydown: false
},
@ -800,8 +797,6 @@ define([
me.enableKeyEvents= me.options.enableKeyEvents;
me.useBSKeydown = me.options.useBSKeydown; // only with enableKeyEvents && parentMenu
me.style = me.options.style || '';
me.emptyText = me.options.emptyText || '';
me.allowScrollbar = (me.options.allowScrollbar!==undefined) ? me.options.allowScrollbar : true;
me.scrollAlwaysVisible = me.options.scrollAlwaysVisible || false;
if (me.parentMenu)
me.parentMenu.options.restoreHeight = (me.options.restoreHeight>0);
@ -819,7 +814,6 @@ define([
render: function (parentEl) {
var me = this;
this.trigger('render:before', this);
if (parentEl) {
this.setElement(parentEl, false);
this.cmpEl = $(this.template({
@ -867,7 +861,7 @@ define([
this.attachKeyEvents();
this.cmpEl.on( "click", "div.item", _.bind(me.onClickItem, me));
}
if (_.isUndefined(this.scroller) && this.allowScrollbar) {
if (_.isUndefined(this.scroller)) {
this.scroller = new Common.UI.Scroller({
el: $(this.el).find('.inner').addBack().filter('.inner'),
useKeyboard: this.enableKeyEvents && !this.handleSelect,
@ -949,7 +943,7 @@ define([
'<div class="item" <% if(!!item.tip) { %> data-toggle="tooltip" <% } %> ><%= itemTemplate(item) %></div>',
'<% }) %>'
].join(''));
this.cmpEl && this.cmpEl.html(template({
this.cmpEl && this.cmpEl.find('.inner').html(template({
items: this.store.toJSON(),
itemTemplate: this.itemTemplate,
style : this.style
@ -960,7 +954,6 @@ define([
delete this.scroller;
}
if (this.allowScrollbar) {
this.scroller = new Common.UI.Scroller({
el: $(this.el).find('.inner').addBack().filter('.inner'),
useKeyboard: this.enableKeyEvents && !this.handleSelect,
@ -968,11 +961,9 @@ define([
wheelSpeed: 10,
alwaysVisibleY: this.scrollAlwaysVisible
});
}
if (this.parentMenu && this.store.length>0)
if (!this.parentMenu && this.store.length>0)
this.onAfterShowMenu();
this.attachKeyEvents();
this._layoutParams = undefined;
},
@ -1033,7 +1024,7 @@ define([
div_first = this.dataViewItems[0].el,
div_first_top = (div_first.length>0) ? div_first[0].offsetTop : 0;
if (div_top < inner_top + div_first_top || div_top+div.outerHeight() > inner_top + innerEl.height()) {
if (this.scroller && this.allowScrollbar) {
if (this.scroller) {
this.scroller.scrollTop(innerEl.scrollTop() + div_top - inner_top - div_first_top, 0);
} else {
innerEl.scrollTop(innerEl.scrollTop() + div_top - inner_top - div_first_top);
@ -1159,10 +1150,10 @@ define([
if (top + menuH > docH ) {
innerEl.css('max-height', (docH - top - paddings - margins) + 'px');
if (this.allowScrollbar) this.scroller.update(props);
this.scroller.update(props);
} else if ( top + menuH < docH && innerEl.height() < this.options.restoreHeight ) {
innerEl.css('max-height', (Math.min(docH - top - paddings - margins, this.options.restoreHeight)) + 'px');
if (this.allowScrollbar) this.scroller.update(props);
this.scroller.update(props);
}
},

View file

@ -2352,54 +2352,20 @@ define([
if (!this.toolbar.btnInsertEquation.rendered || this.toolbar.btnInsertEquation.menu.items.length>0) return;
var me = this, equationsStore = this.getApplication().getCollection('EquationGroups');
me.equationPickers = [];
me.toolbar.btnInsertEquation.menu.removeAll();
var onShowAfter = function(menu) {
for (var i = 0; i < equationsStore.length; ++i) {
var equationGroup = equationsStore.at(i);
var menuItem = new Common.UI.MenuItem({
caption: equationGroup.get('groupName'),
menu: new Common.UI.Menu({
menuAlign: 'tl-tr',
items: [
{ template: _.template('<div id="id-toolbar-menu-equationgroup' + i +
'" class="menu-shape" style="width:' + (equationGroup.get('groupWidth') + 8) + 'px; ' +
equationGroup.get('groupHeight') + 'margin-left:5px;"></div>') }
]
})
});
me.toolbar.btnInsertEquation.menu.addItem(menuItem);
var equationPicker = new Common.UI.DataViewSimple({
el: $('#id-toolbar-menu-equationgroup' + i),
store: equationGroup.get('groupStore'),
parentMenu: menuItem.menu,
showLast: false,
parentMenu: menu.items[i].menu,
store: equationsStore.at(i).get('groupStore'),
scrollAlwaysVisible: true,
itemTemplate: _.template('<div class="item-equation" '+
'style="background-position:<%= posX %>px <%= posY %>px;" >' +
'<div style="width:<%= width %>px;height:<%= height %>px;" id="<%= id %>"></div>' +
'</div>')
});
if (equationGroup.get('groupHeight').length) {
me.equationPickers.push(equationPicker);
me.toolbar.btnInsertEquation.menu.on('show:after', function () {
if (me.equationPickers.length) {
var element = $(this.el).find('.over').find('.menu-shape');
if (element.length) {
for (var i = 0; i < me.equationPickers.length; ++i) {
if (element[0].id == me.equationPickers[i].el.id) {
me.equationPickers[i].scroller.update({alwaysVisibleY: true});
me.equationPickers.splice(i, 1);
return;
}
}
}
}
});
}
equationPicker.on('item:click', function(picker, item, record, e) {
if (me.api) {
if (record)
@ -2419,6 +2385,25 @@ define([
}
});
}
me.toolbar.btnInsertEquation.menu.off('show:after', onShowAfter);
};
me.toolbar.btnInsertEquation.menu.on('show:after', onShowAfter);
for (var i = 0; i < equationsStore.length; ++i) {
var equationGroup = equationsStore.at(i);
var menuItem = new Common.UI.MenuItem({
caption: equationGroup.get('groupName'),
menu: new Common.UI.Menu({
menuAlign: 'tl-tr',
items: [
{ template: _.template('<div id="id-toolbar-menu-equationgroup' + i +
'" class="menu-shape" style="width:' + (equationGroup.get('groupWidth') + 8) + 'px; ' +
equationGroup.get('groupHeight') + 'margin-left:5px;"></div>') }
]
})
});
me.toolbar.btnInsertEquation.menu.addItem(menuItem);
}
},
onInsertEquationClick: function() {