Skip to content

Commit

Permalink
Merge pull request #2981 from ONLYOFFICE/fix/bug-48898
Browse files Browse the repository at this point in the history 
Fix/bug 48898
  • Loading branch information
@JuliaRadzhabova
JuliaRadzhabova authored May 8, 2024
2 parents 948eeba + c083b96 commit 155a769
Show file tree
Hide file tree
Showing 15 changed files with 250 additions and 44 deletions.
54 changes: 39 additions & 15 deletions apps/common/main/lib/component/ComboBox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ define([
disabled : false,
menuCls : '',
menuStyle : '',
menuAlignEl : null,
restoreMenuHeight: true,
displayField: 'displayValue',
valueField : 'value',
Expand Down Expand Up @@ -130,7 +131,6 @@ define([
this.search = me.options.search;
this.scrollAlwaysVisible = me.options.scrollAlwaysVisible;
this.focusWhenNoSelection = (me.options.focusWhenNoSelection!==false);

this.restoreMenuHeight = me.options.restoreMenuHeight;

me.rendered = me.options.rendered || false;
Expand Down Expand Up @@ -319,16 +319,31 @@ define([
}
}

var $list = this.cmpEl.find('ul');
if ($list.hasClass('menu-absolute')) {
var offset = this.cmpEl.offset();
var left = offset.left;
if (left + $list.outerWidth()>Common.Utils.innerWidth())
left += (this.cmpEl.outerWidth() - $list.outerWidth());
$list.css({left: left, top: offset.top + this.cmpEl.outerHeight() + 2});
} else if ($list.hasClass('menu-aligned')) {
var offset = this.cmpEl.offset();
$list.toggleClass('show-top', offset.top + this.cmpEl.outerHeight() + $list.outerHeight() > Common.Utils.innerHeight());
var $list = this.cmpEl.find('ul'),
isMenuAbsolute = $list.hasClass('menu-absolute');
if (this.options.restoreMenuHeightAndTop || isMenuAbsolute) {
var offset = this.cmpEl.offset(),
parentTop = this.options.menuAlignEl ? this.options.menuAlignEl.offset().top : 0,
marginTop = parseInt($list.css('margin-top')),
menuTop = offset.top - parentTop + this.cmpEl.outerHeight() + marginTop,
menuLeft = offset.left;

if (this.options.restoreMenuHeightAndTop) { // show menu at top
var parentHeight = this.options.menuAlignEl ? this.options.menuAlignEl.outerHeight() : Common.Utils.innerHeight() - 10,
diff = typeof this.options.restoreMenuHeightAndTop === "number" ? this.options.restoreMenuHeightAndTop : 100000;

var showAtTop = (menuTop + $list.outerHeight() > parentHeight) && (menuTop + diff > parentHeight) && ((offset.top - parentTop)*0.9 > parentHeight - menuTop);
// if menu height less than restoreMenuHeightAndTop - show menu at top, if greater - try to change menu height + compare available space at top and bottom of combobox
if (!isMenuAbsolute)
$list.toggleClass('show-top', showAtTop);
else if (showAtTop)
menuTop = offset.top - parentTop - $list.outerHeight();
}
if (isMenuAbsolute) {
if (menuLeft + $list.outerWidth()>Common.Utils.innerWidth())
menuLeft += (this.cmpEl.outerWidth() - $list.outerWidth());
$list.css({left: menuLeft, top: menuTop + parentTop});
}
}
},

Expand Down Expand Up @@ -372,19 +387,28 @@ define([
}
}
var cg = Common.Utils.croppedGeometry(),
docH = cg.height - 10,
parentTop = this.options.menuAlignEl ? this.options.menuAlignEl.offset().top : cg.top,
parentHeight = this.options.menuAlignEl ? this.options.menuAlignEl.outerHeight() : cg.height - 10,
menuH = $list.outerHeight(),
menuTop = $list.get(0).getBoundingClientRect().top,
newH = menuH;

if (menuH < this.restoreMenuHeight)
newH = this.restoreMenuHeight;

if (menuTop + newH > docH)
newH = docH - menuTop;
var offset = this.cmpEl.offset();
if (menuTop<offset.top) { // menu is shown at top
if (offset.top - parentTop < newH)
newH = offset.top - parentTop;
} else {
if (menuTop + newH > parentHeight + parentTop)
newH = parentHeight + parentTop - menuTop;
}

if (newH !== menuH)
if (newH !== menuH) {
$list.css('max-height', newH + 'px');
$list.hasClass('menu-absolute') && (menuTop<offset.top) && $list.css({top: offset.top - $list.outerHeight()});
}
}
},

Expand Down
6 changes: 3 additions & 3 deletions apps/common/main/lib/component/Menu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -685,12 +685,12 @@ define([
menuRoot.css('max-height', 'none');
menuH = menuRoot.outerHeight();
if (top + menuH > docH + cg.top) {
top = docH - menuH;
top = docH - menuH + cg.top;
}
if (top < cg.top)
top = cg.top;
if (top + menuH > docH + cg.top) {
menuRoot.css('max-height', (docH - top) + 'px');
menuRoot.css('max-height', (docH - top + cg.top) + 'px');
(!this.scroller) && (this.scroller = new Common.UI.Scroller({
el: this.$el.find('> .dropdown-menu '),
minScrollbarLength: 30,
Expand Down Expand Up @@ -724,7 +724,7 @@ define([
m = fixedAlign.match(/^([a-z]+)-([a-z]+)/);
top = offset.top - posMenu[m[1]][1] + posParent[m[2]][1] + this.offset[1] + (fixedOffset || 0);
} else
top = docH - menuH;
top = docH - menuH + cg.top;
}


Expand Down
2 changes: 1 addition & 1 deletion apps/common/main/lib/view/AutoCorrectDialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -346,7 +346,7 @@ define([ 'text!common/main/lib/template/AutoCorrectDialog.template',
menuStyle : 'min-width:100%;',
editable : false,
takeFocusOnClose : true,
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
cls : 'input-group-nr',
dataHintDirection: 'bottom',
data : _exciptionsLangs.map(function(lang){
Expand Down
6 changes: 6 additions & 0 deletions apps/documenteditor/main/app/template/HeaderFooterSettings.template
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,5 +91,11 @@
<div id="headerfooter-spin-from"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<label id="headerfooter-label-format" class="input-label"><%= scope.textNumFormat %></label>
<div id="headerfooter-combo-format"></div>
</td>
</tr>
<tr class="finish-cell"></tr>
</table>
15 changes: 10 additions & 5 deletions apps/documenteditor/main/app/view/FileMenuPanels.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -575,7 +575,7 @@ define([
el : $markup.findById('#fms-cmb-zoom'),
style : 'width: 160px;',
editable : false,
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
cls : 'input-group-nr',
menuStyle : 'min-width:100%; max-height: 157px;',
data : [
Expand Down Expand Up @@ -694,7 +694,7 @@ define([
el : $markup.find('#fms-cmb-font-render'),
style : 'width: 160px;',
editable : false,
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
menuStyle : 'min-width:100%;',
cls : 'input-group-nr',
itemsTemplate: itemsTemplate,
Expand All @@ -713,7 +713,7 @@ define([
this.cmbUnit = new Common.UI.ComboBox({
el : $markup.findById('#fms-cmb-unit'),
style : 'width: 160px;',
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
menuStyle : 'min-width:100%;',
editable : false,
cls : 'input-group-nr',
Expand All @@ -731,7 +731,7 @@ define([
el : $markup.findById('#fms-cmb-macros'),
style : 'width: 160px;',
editable : false,
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
menuStyle : 'min-width:100%;',
cls : 'input-group-nr',
data : [
Expand Down Expand Up @@ -773,7 +773,7 @@ define([
style : 'width: 160px;',
menuStyle : 'min-width:100%;',
editable : false,
menuCls : 'menu-aligned',
restoreMenuHeightAndTop: true,
cls : 'input-group-nr',
dataHint: '2',
dataHintDirection: 'bottom',
Expand Down Expand Up @@ -855,6 +855,11 @@ define([
this.pnlSettings.css('overflow', scrolled ? 'hidden' : 'visible');
this.scroller.update();
this.pnlSettings.toggleClass('bordered', this.scroller.isVisible());
this.cmbZoom.options.menuAlignEl = scrolled ? this.pnlSettings : null;
this.cmbUnit.options.menuAlignEl = scrolled ? this.pnlSettings : null;
this.cmbFontRender.options.menuAlignEl = scrolled ? this.pnlSettings : null;
this.cmbTheme.options.menuAlignEl = scrolled ? this.pnlSettings : null;
this.cmbMacros.options.menuAlignEl = scrolled ? this.pnlSettings : null;
}
},

Expand Down
16 changes: 16 additions & 0 deletions apps/documenteditor/main/app/view/FormSettings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,6 +130,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px; max-height: 190px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: true,
data: [],
dataHint: '1',
Expand Down Expand Up @@ -241,6 +243,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px; max-height: 190px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: false,
data: [],
dataHint: '1',
Expand Down Expand Up @@ -372,6 +376,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px; max-height: 190px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: true,
data: [],
dataHint: '1',
Expand Down Expand Up @@ -631,6 +637,8 @@ define([
cls: 'menu-roles',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 194px; max-height: 190px;max-width: 400px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
style: 'width: 194px;',
editable: false,
template : _.template(template.join('')),
Expand Down Expand Up @@ -661,6 +669,8 @@ define([
el: $markup.findById('#form-combo-format'),
cls: 'input-group-nr',
menuStyle: 'min-width: 100%;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: false,
data: [{ displayValue: this.textNone, value: Asc.TextFormFormatType.None },
{ displayValue: this.textDigits, value: Asc.TextFormFormatType.Digit },
Expand Down Expand Up @@ -698,6 +708,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: true,
data: [
{ displayValue: this.textPhone1, value: '(999)999-9999' },
Expand Down Expand Up @@ -748,6 +760,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px; max-height: 190px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: false,
data: [],
dataHint: '1',
Expand Down Expand Up @@ -776,6 +790,8 @@ define([
cls: 'input-group-nr',
menuCls: 'menu-absolute',
menuStyle: 'min-width: 195px; max-height: 190px;',
menuAlignEl: $(this.el).parent(),
restoreMenuHeightAndTop: 85,
editable: false,
data: data,
dataHint: '1',
Expand Down
Loading

0 comments on commit 155a769

Please sign in to comment.