[SSE mobile] Added positioning for tooltip

This commit is contained in:
SergeyEzhin 2022-06-17 17:51:57 +04:00
parent 0d5daecadd
commit 1800336973

View file

@ -461,16 +461,18 @@ class MainController extends Component {
this.api.asc_registerCallback('asc_onValidationListMenu', this.onEntriesListMenu.bind(this, true)); this.api.asc_registerCallback('asc_onValidationListMenu', this.onEntriesListMenu.bind(this, true));
this.api.asc_registerCallback('asc_onInputMessage', (title, msg) => { this.api.asc_registerCallback('asc_onInputMessage', (title, msg) => {
if(!!title && !!msg) { if(!!msg) {
const coord = this.api.asc_getActiveCellCoord(); const coord = this.api.asc_getActiveCellCoord();
// const topPosition = coord.asc_getY() * 2 + coord.asc_getHeight() * 3 + 10; const widthCell = coord.asc_getWidth();
// const leftPosition = coord.asc_getX(); const heightCell = coord.asc_getHeight();
// console.log(coord); const topPosition = coord.asc_getY();
// console.log(topPosition, leftPosition); const leftPosition = coord.asc_getX();
const sdk = document.querySelector('#editor_sdk');
const rect = sdk.getBoundingClientRect();
f7.popover.create({ f7.popover.create({
targetX: coord.asc_getX(), targetX: -10000,
targetY: coord.asc_getY(), targetY: -10000,
content: ` content: `
<div class="popover tooltip-cell-data"> <div class="popover tooltip-cell-data">
<div class="popover-angle"></div> <div class="popover-angle"></div>
@ -484,8 +486,27 @@ class MainController extends Component {
closeByBackdropClick: false closeByBackdropClick: false
}).open(); }).open();
// document.querySelector('.tooltip-cell-data').style.top = `${topPosition}px`; const tooltipCell = document.querySelector('.tooltip-cell-data');
// document.querySelector('.tooltip-cell-data').style.left = `${leftPosition}px`;
// Define left position
if(rect.right - leftPosition <= widthCell || rect.right - leftPosition <= tooltipCell.offsetWidth) {
tooltipCell.style.left = `${leftPosition - tooltipCell.offsetWidth}px`;
} else if(leftPosition === 0) {
tooltipCell.style.left = `26px`;
} else {
tooltipCell.style.left = `${leftPosition}px`;
}
// Define top position
if(rect.bottom - topPosition <= heightCell || rect.bottom - topPosition <= tooltipCell.offsetHeight) {
tooltipCell.style.top = `${rect.bottom - tooltipCell.offsetHeight - heightCell - 7}px`;
} else if(topPosition === 0) {
tooltipCell.style.top = `${heightCell + rect.top + 22}px`;
} else {
tooltipCell.style.top = `${topPosition + rect.top + heightCell + 2}px`;
}
} }
}); });
} }