verdnatura/salix
verdnatura
/
salix
3
4
Fork 0
Code Issues Pull Requests 67 Releases Wiki Activity

Popover fixes

This commit is contained in:
Juan Ferrer 2019-04-10 15:47:23 +02:00
parent 862f0b6c1e
commit c1b103d170
1 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
front/core/components/popover/popover.js
View File

@ -118,7 +118,9 @@ export default class Popover extends Component {
*/
relocate() {
if (!(this.parent && this._shown)) return;
let margin = 10;
let scrollbarSize = 10;
let style = this.popover.style;
style.width = '';
@ -131,37 +133,40 @@ export default class Popover extends Component {
let parentRect = this.parent.getBoundingClientRect();
let popoverRect = this.popover.getBoundingClientRect();
let arrowRect = this.arrow.getBoundingClientRect();
let clamp = (value, min, max) => Math.min(Math.max(value, min), max);
let arrowHeight = Math.sqrt(Math.pow(arrowRect.height, 2) * 2) / 2;
let endMargin = margin + scrollbarSize;
let maxRight = window.innerWidth - endMargin;
let maxBottom = window.innerHeight - endMargin;
let maxWith = maxRight - margin;
let maxHeight = maxBottom - margin - arrowHeight;
let width = clamp(popoverRect.width, parentRect.width, maxWith);
let height = popoverRect.height;
let width = Math.max(popoverRect.width, parentRect.width);
let left = parentRect.left + parentRect.width / 2 - width / 2;
left = clamp(left, margin, maxRight - width);
let top = parentRect.top + parentRect.height + arrowHeight;
let left = Math.max(parentRect.left + parentRect.width / 2 - width / 2, margin);
let showTop = top + height + margin > window.innerHeight;
if (showTop)
top = Math.max(parentRect.top - height - arrowHeight, margin);
if (left + width + margin > window.innerWidth)
left = window.innerWidth - width - margin;
let showTop = top + height > maxBottom;
if (showTop) top = parentRect.top - height - arrowHeight;
top = Math.max(top, margin);
if (showTop)
arrowStyle.bottom = `0`;
else
arrowStyle.top = `0`;
let arrowMargin = margin + 10;
let arrowLeft = (parentRect.left - left) + parentRect.width / 2;
arrowLeft = Math.max(Math.min(arrowLeft, width - arrowMargin), arrowMargin);
arrowLeft = clamp(arrowLeft, arrowHeight, width - arrowHeight);
arrowStyle.left = `${arrowLeft}px`;
style.top = `${top}px`;
style.left = `${left}px`;
style.width = `${width}px`;
if (height + margin * 2 + arrowHeight > window.innerHeight)
style.height = `${window.innerHeight - margin * 2 - arrowHeight}px`;
if (height > maxHeight) style.height = `${maxHeight}px`;
}
onDocKeyDown(event) {