tsanie/ui-lib
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

sync working code, and import type-doc

Browse Source
This commit is contained in:
Chen Lily
2023-07-17 17:24:49 +08:00
parent 7ab7a7094a
commit 3e9ee59178
43 changed files with 1024 additions and 1553 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
lib/ui/tooltip.js
View File

@ -2,7 +2,7 @@ import './css/tooltip.scss';
import { createElement } from "../functions";
// import { global } from "../utility";
function setTooltip(container, content, flag = false, parent = null) {
export function setTooltip(container, content, flag = false, parent = null) {
const isParent = parent instanceof HTMLElement;
if (isParent) {
const tipid = container.dataset.tipId;
@ -73,64 +73,77 @@ function setTooltip(container, content, flag = false, parent = null) {
top -= p.scrollTop;
p = p.parentElement;
}
// check overflow
let t = c.offsetTop;
let l = c.offsetLeft;
p = c.offsetParent;
let lastWidth = p.clientWidth;
let lastHeight = p.clientHeight;
while (p != null) {
const overflow = window.getComputedStyle(p).overflow;
if (overflow !== 'visible') {
t -= p.scrollTop;
l -= p.scrollLeft;
break;
}
t += p.offsetTop;
l += p.offsetLeft;
const w = p.clientWidth;
if (w < lastWidth) {
lastWidth += l;
} else {
lastWidth = p.clientWidth;
}
const h = p.clientHeight;
if (h < lastHeight) {
lastHeight += t;
} else {
lastHeight = p.clientHeight;
}
const parent = p.offsetParent;
while (p != null && p != parent) {
t -= p.scrollTop;
l -= p.scrollLeft;
p = p.parentElement;
}
}
wrapper.style.display = '';
const offsetHeight = wrapper.offsetHeight;
if (t - offsetHeight - 14 < 0) {
const parentOffsetHeight = c.parentElement.offsetHeight;
if (t + parentOffsetHeight + offsetHeight + 10 > lastHeight) {
top = t + (parentOffsetHeight - offsetHeight) / 2;
if (top + offsetHeight + 1 > lastHeight) {
top = lastHeight - offsetHeight - 1;
}
wrapper.classList.add('ui-tooltip-no');
} else {
top += parentOffsetHeight + 10;
const offsetWidth = wrapper.offsetWidth;
if (isParent) {
top -= offsetHeight + 14;
if (top < -offsetHeight) {
top += c.offsetHeight + offsetHeight + 14;
wrapper.classList.add('ui-tooltip-down');
}
left += (c.offsetWidth - offsetWidth) / 2;
if (left < 1) {
left = 1;
}
} else {
top -= offsetHeight + 14;
wrapper.classList.remove('ui-tooltip-down');
}
const offsetWidth = wrapper.offsetWidth;
left += (c.offsetWidth - offsetWidth) / 2;
if (l - offsetWidth < 0) {
left = 1;
} else if (left + offsetWidth + 1 > lastWidth) {
left = lastWidth - offsetWidth - 1;
// check overflow
let t = c.offsetTop;
let l = c.offsetLeft;
p = c.offsetParent;
let lastWidth = p.clientWidth;
let lastHeight = p.clientHeight;
while (p != null) {
const overflow = window.getComputedStyle(p).overflow;
if (overflow !== 'visible') {
break;
}
t += p.offsetTop;
l += p.offsetLeft;
const parent = p.offsetParent;
while (p != null) {
const w = p.clientWidth;
if (w < lastWidth) {
lastWidth += l;
} else {
lastWidth = p.clientWidth;
}
const h = p.clientHeight;
if (h < lastHeight) {
lastHeight += t;
} else {
lastHeight = p.clientHeight;
}
t -= p.scrollTop;
l -= p.scrollLeft;
if (p === parent) {
break;
}
p = p.parentElement;
}
}
if (t - offsetHeight - 14 < 0) {
const containerOffsetHeight = c.offsetHeight;
if (t + containerOffsetHeight + offsetHeight + 14 > lastHeight) {
top = t + (containerOffsetHeight - offsetHeight) / 2;
if (top + offsetHeight + 1 > lastHeight) {
top = lastHeight - offsetHeight - 1;
}
wrapper.classList.add('ui-tooltip-no');
} else {
top += containerOffsetHeight + 14;
wrapper.classList.add('ui-tooltip-down');
}
} else {
top -= offsetHeight + 14;
wrapper.classList.remove('ui-tooltip-down');
}
left += (c.offsetWidth - offsetWidth) / 2;
if (l - offsetWidth < 0) {
left = 1;
} else if (left + offsetWidth + 1 > lastWidth) {
left = lastWidth - offsetWidth - 1;
}
}
// wrapper.style.left = `${left}px`;
// wrapper.style.top = `${top}px`;
@ -151,7 +164,7 @@ function setTooltip(container, content, flag = false, parent = null) {
return container;
}
function resolveTooltip(container = document.body) {
export function resolveTooltip(container = document.body) {
const tips = container.querySelectorAll('[title]');
for (let tip of tips) {
const title = tip.getAttribute('title');
@ -161,9 +174,4 @@ function resolveTooltip(container = document.body) {
}
}
return container;
}
export {
setTooltip,
resolveTooltip
}