stuff
This commit is contained in:
parent
117d94467f
commit
6f64805d36
|
@ -698,10 +698,12 @@
|
||||||
let itemLayerContainer = document.querySelector(BDFDB.dotCN.appmount + " > " + BDFDB.dotCN.itemlayercontainer);
|
let itemLayerContainer = document.querySelector(BDFDB.dotCN.appmount + " > " + BDFDB.dotCN.itemlayercontainer);
|
||||||
if (!itemLayerContainer || (typeof text != "string" && !BDFDB.ObjectUtils.is(options.guild)) || !Node.prototype.isPrototypeOf(anker) || !document.contains(anker)) return null;
|
if (!itemLayerContainer || (typeof text != "string" && !BDFDB.ObjectUtils.is(options.guild)) || !Node.prototype.isPrototypeOf(anker) || !document.contains(anker)) return null;
|
||||||
let id = BDFDB.NumberUtils.generateId(Tooltips);
|
let id = BDFDB.NumberUtils.generateId(Tooltips);
|
||||||
let itemLayer = BDFDB.DOMUtils.create(`<div class="${BDFDB.disCNS.itemlayer + BDFDB.disCN.itemlayerdisabledpointerevents}"><div class="${BDFDB.disCN.tooltip}" tooltip-id="${id}"></div></div>`);
|
let itemLayer = BDFDB.DOMUtils.create(`<div class="${BDFDB.disCNS.itemlayer + BDFDB.disCN.itemlayerdisabledpointerevents}"><div class="${BDFDB.disCN.tooltip}" tooltip-id="${id}"><div class="${BDFDB.disCN.tooltippointer}"></div><div class="${BDFDB.disCN.tooltipcontent}"></div></div></div>`);
|
||||||
itemLayerContainer.appendChild(itemLayer);
|
itemLayerContainer.appendChild(itemLayer);
|
||||||
|
|
||||||
let tooltip = itemLayer.firstElementChild;
|
let tooltip = itemLayer.firstElementChild;
|
||||||
|
let tooltipContent = itemLayer.querySelector(BDFDB.dotCN.tooltipcontent);
|
||||||
|
let tooltipPointer = itemLayer.querySelector(BDFDB.dotCN.tooltippointer);
|
||||||
|
|
||||||
if (options.id) tooltip.id = options.id.split(" ").join("");
|
if (options.id) tooltip.id = options.id.split(" ").join("");
|
||||||
|
|
||||||
|
@ -783,16 +785,14 @@
|
||||||
]
|
]
|
||||||
}) : null
|
}) : null
|
||||||
].filter(n => n)
|
].filter(n => n)
|
||||||
}), tooltip);
|
}), tooltipContent);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
if (fontColorIsGradient) tooltip.innerHTML = `<span style="pointer-events: none; -webkit-background-clip: text !important; color: transparent !important; background-image: ${BDFDB.ColorUtils.createGradient(options.fontColor)} !important;">${BDFDB.StringUtils.htmlEscape(text)}</span>`;
|
if (fontColorIsGradient) tooltipContent.innerHTML = `<span style="pointer-events: none; -webkit-background-clip: text !important; color: transparent !important; background-image: ${BDFDB.ColorUtils.createGradient(options.fontColor)} !important;">${BDFDB.StringUtils.htmlEscape(text)}</span>`;
|
||||||
else if (options.html === true) tooltip.innerHTML = text;
|
else if (options.html === true) tooltipContent.innerHTML = text;
|
||||||
else tooltip.innerText = text;
|
else tooltipContent.innerText = text;
|
||||||
}
|
}
|
||||||
|
|
||||||
tooltip.appendChild(BDFDB.DOMUtils.create(`<div class="${BDFDB.disCN.tooltippointer}"></div>`));
|
|
||||||
|
|
||||||
if (options.hide) BDFDB.DOMUtils.appendLocalStyle("BDFDBhideOtherTooltips" + id, `#app-mount ${BDFDB.dotCN.tooltip}:not([tooltip-id="${id}"]) {display: none !important;}`, itemLayerContainer);
|
if (options.hide) BDFDB.DOMUtils.appendLocalStyle("BDFDBhideOtherTooltips" + id, `#app-mount ${BDFDB.dotCN.tooltip}:not([tooltip-id="${id}"]) {display: none !important;}`, itemLayerContainer);
|
||||||
|
|
||||||
let mouseleave = _ => {BDFDB.DOMUtils.remove(itemLayer);};
|
let mouseleave = _ => {BDFDB.DOMUtils.remove(itemLayer);};
|
||||||
|
@ -811,7 +811,6 @@
|
||||||
observer.observe(document.body, {subtree:true, childList:true});
|
observer.observe(document.body, {subtree:true, childList:true});
|
||||||
|
|
||||||
(tooltip.update = _ => {
|
(tooltip.update = _ => {
|
||||||
let pointer = tooltip.querySelector(BDFDB.dotCN.tooltippointer);
|
|
||||||
let left, top, tRects = BDFDB.DOMUtils.getRects(anker), iRects = BDFDB.DOMUtils.getRects(itemLayer), aRects = BDFDB.DOMUtils.getRects(document.querySelector(BDFDB.dotCN.appmount)), positionOffsets = {height: 10, width: 10}, offset = typeof options.offset == "number" ? options.offset : 0;
|
let left, top, tRects = BDFDB.DOMUtils.getRects(anker), iRects = BDFDB.DOMUtils.getRects(itemLayer), aRects = BDFDB.DOMUtils.getRects(document.querySelector(BDFDB.dotCN.appmount)), positionOffsets = {height: 10, width: 10}, offset = typeof options.offset == "number" ? options.offset : 0;
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case "top":
|
case "top":
|
||||||
|
@ -835,31 +834,31 @@
|
||||||
itemLayer.style.setProperty("top", top + "px");
|
itemLayer.style.setProperty("top", top + "px");
|
||||||
itemLayer.style.setProperty("left", left + "px");
|
itemLayer.style.setProperty("left", left + "px");
|
||||||
|
|
||||||
pointer.style.removeProperty("margin-left");
|
tooltipPointer.style.removeProperty("margin-left");
|
||||||
pointer.style.removeProperty("margin-top");
|
tooltipPointer.style.removeProperty("margin-top");
|
||||||
if (type == "top" || type == "bottom") {
|
if (type == "top" || type == "bottom") {
|
||||||
if (left < 0) {
|
if (left < 0) {
|
||||||
itemLayer.style.setProperty("left", "5px");
|
itemLayer.style.setProperty("left", "5px");
|
||||||
pointer.style.setProperty("margin-left", `${left - 10}px`);
|
tooltipPointer.style.setProperty("margin-left", `${left - 10}px`);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
let rightMargin = aRects.width - (left + iRects.width);
|
let rightMargin = aRects.width - (left + iRects.width);
|
||||||
if (rightMargin < 0) {
|
if (rightMargin < 0) {
|
||||||
itemLayer.style.setProperty("left", (aRects.width - iRects.width - 5) + "px");
|
itemLayer.style.setProperty("left", (aRects.width - iRects.width - 5) + "px");
|
||||||
pointer.style.setProperty("margin-left", `${-1*rightMargin}px`);
|
tooltipPointer.style.setProperty("margin-left", `${-1*rightMargin}px`);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else if (type == "left" || type == "right") {
|
else if (type == "left" || type == "right") {
|
||||||
if (top < 0) {
|
if (top < 0) {
|
||||||
itemLayer.style.setProperty("top", "5px");
|
itemLayer.style.setProperty("top", "5px");
|
||||||
pointer.style.setProperty("margin-top", `${top - 10}px`);
|
tooltipPointer.style.setProperty("margin-top", `${top - 10}px`);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
let bottomMargin = aRects.height - (top + iRects.height);
|
let bottomMargin = aRects.height - (top + iRects.height);
|
||||||
if (bottomMargin < 0) {
|
if (bottomMargin < 0) {
|
||||||
itemLayer.style.setProperty("top", aRects.height - iRects.height - 5 + "px");
|
itemLayer.style.setProperty("top", aRects.height - iRects.height - 5 + "px");
|
||||||
pointer.style.setProperty("margin-top", `${-1*bottomMargin}px`);
|
tooltipPointer.style.setProperty("margin-top", `${-1*bottomMargin}px`);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -5682,6 +5681,8 @@
|
||||||
tooltipblack: ["Tooltip", "tooltipBlack"],
|
tooltipblack: ["Tooltip", "tooltipBlack"],
|
||||||
tooltipbottom: ["Tooltip", "tooltipBottom"],
|
tooltipbottom: ["Tooltip", "tooltipBottom"],
|
||||||
tooltipbrand: ["Tooltip", "tooltipBrand"],
|
tooltipbrand: ["Tooltip", "tooltipBrand"],
|
||||||
|
tooltipcontent: ["Tooltip", "tooltipContent"],
|
||||||
|
tooltipcontentallowoverflow: ["Tooltip", "tooltipContentAllowOverflow"],
|
||||||
tooltipcustom: ["BDFDB", "tooltipCustom"],
|
tooltipcustom: ["BDFDB", "tooltipCustom"],
|
||||||
tooltipgreen: ["Tooltip", "tooltipGreen"],
|
tooltipgreen: ["Tooltip", "tooltipGreen"],
|
||||||
tooltipgrey: ["Tooltip", "tooltipGrey"],
|
tooltipgrey: ["Tooltip", "tooltipGrey"],
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue