Update 0BDFDB.plugin.js
This commit is contained in:
parent
46be8e2786
commit
4928a209cc
|
@ -948,14 +948,14 @@ module.exports = (_ => {
|
||||||
for (let child of e.path) if (typeof child.matches == "function" && child.matches(selector) && !child[namespace + "BDFDB" + origEventName]) {
|
for (let child of e.path) if (typeof child.matches == "function" && child.matches(selector) && !child[namespace + "BDFDB" + origEventName]) {
|
||||||
child[namespace + "BDFDB" + origEventName] = true;
|
child[namespace + "BDFDB" + origEventName] = true;
|
||||||
if (origEventName == "mouseenter") callback(BDFDB.ListenerUtils.copyEvent(e, child));
|
if (origEventName == "mouseenter") callback(BDFDB.ListenerUtils.copyEvent(e, child));
|
||||||
let mouseout = e2 => {
|
let mouseOut = e2 => {
|
||||||
if (e2.target.contains(child) || e2.target == child || !child.contains(e2.target)) {
|
if (e2.target.contains(child) || e2.target == child || !child.contains(e2.target)) {
|
||||||
if (origEventName == "mouseleave") callback(BDFDB.ListenerUtils.copyEvent(e, child));
|
if (origEventName == "mouseleave") callback(BDFDB.ListenerUtils.copyEvent(e, child));
|
||||||
delete child[namespace + "BDFDB" + origEventName];
|
delete child[namespace + "BDFDB" + origEventName];
|
||||||
document.removeEventListener("mouseout", mouseout);
|
document.removeEventListener("mouseout", mouseOut);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseout", mouseout);
|
document.addEventListener("mouseout", mouseOut);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -1272,18 +1272,19 @@ module.exports = (_ => {
|
||||||
|
|
||||||
if (options.list || BDFDB.ObjectUtils.is(options.guild)) BDFDB.DOMUtils.addClass(tooltip, BDFDB.disCN.tooltiplistitem);
|
if (options.list || BDFDB.ObjectUtils.is(options.guild)) BDFDB.DOMUtils.addClass(tooltip, BDFDB.disCN.tooltiplistitem);
|
||||||
|
|
||||||
let mouseLeave = _ => {itemLayer.removeTooltip();};
|
let mouseMove = e => {
|
||||||
if (!options.perssist) anker.addEventListener("mouseleave", mouseLeave);
|
let parent = e.target.parentElement.querySelector(":hover");
|
||||||
|
if (parent && anker != parent && !anker.contains(parent)) itemLayer.removeTooltip();
|
||||||
|
};
|
||||||
|
let mouseLeave = e => {itemLayer.removeTooltip();};
|
||||||
|
if (!options.perssist) {
|
||||||
|
document.addEventListener("mousemove", mouseMove);
|
||||||
|
document.addEventListener("mouseleave", mouseLeave);
|
||||||
|
}
|
||||||
|
|
||||||
let observer = new MutationObserver(changes => changes.forEach(change => {
|
let observer = new MutationObserver(changes => changes.forEach(change => {
|
||||||
let nodes = Array.from(change.removedNodes);
|
let nodes = Array.from(change.removedNodes);
|
||||||
if (nodes.indexOf(itemLayer) > -1 || nodes.indexOf(anker) > -1 || nodes.some(n => n.contains(anker))) {
|
if (nodes.indexOf(itemLayer) > -1 || nodes.indexOf(anker) > -1 || nodes.some(n => n.contains(anker))) itemLayer.removeTooltip();
|
||||||
BDFDB.ArrayUtils.remove(Tooltips, id);
|
|
||||||
observer.disconnect();
|
|
||||||
itemLayer.removeTooltip();
|
|
||||||
anker.removeEventListener("mouseleave", mouseLeave);
|
|
||||||
if (typeof options.onHide == "function") options.onHide(itemLayer, anker);
|
|
||||||
}
|
|
||||||
}));
|
}));
|
||||||
observer.observe(document.body, {subtree:true, childList:true});
|
observer.observe(document.body, {subtree:true, childList:true});
|
||||||
|
|
||||||
|
@ -1350,8 +1351,13 @@ module.exports = (_ => {
|
||||||
}
|
}
|
||||||
})(text);
|
})(text);
|
||||||
(tooltip.removeTooltip = itemLayer.removeTooltip = _ => {
|
(tooltip.removeTooltip = itemLayer.removeTooltip = _ => {
|
||||||
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
|
document.removeEventListener("mouseleave", mouseLeave);
|
||||||
BDFDB.DOMUtils.remove(itemLayer);
|
BDFDB.DOMUtils.remove(itemLayer);
|
||||||
|
BDFDB.ArrayUtils.remove(Tooltips, id);
|
||||||
|
observer.disconnect();
|
||||||
if (zIndexed) BDFDB.DOMUtils.remove(itemLayerContainer);
|
if (zIndexed) BDFDB.DOMUtils.remove(itemLayerContainer);
|
||||||
|
if (typeof options.onHide == "function") options.onHide(itemLayer, anker);
|
||||||
});
|
});
|
||||||
(tooltip.update = itemLayer.update = newText => {
|
(tooltip.update = itemLayer.update = newText => {
|
||||||
if (newText) tooltip.setText(newText);
|
if (newText) tooltip.setText(newText);
|
||||||
|
@ -4739,24 +4745,24 @@ module.exports = (_ => {
|
||||||
}
|
}
|
||||||
handleSelection() {
|
handleSelection() {
|
||||||
if (!this.refElement) return;
|
if (!this.refElement) return;
|
||||||
let mousemove = _ => {
|
let mouseMove = _ => {
|
||||||
BDFDB.TimeUtils.timeout(this.forceUpdateCounter.bind(this), 10);
|
BDFDB.TimeUtils.timeout(this.forceUpdateCounter.bind(this), 10);
|
||||||
};
|
};
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
if (this.refElement.selectionEnd - this.refElement.selectionStart) BDFDB.TimeUtils.timeout(_ => {
|
if (this.refElement.selectionEnd - this.refElement.selectionStart) BDFDB.TimeUtils.timeout(_ => {
|
||||||
document.addEventListener("click", click);
|
document.addEventListener("click", click);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
let click = _ => {
|
let click = _ => {
|
||||||
BDFDB.TimeUtils.timeout(this.forceUpdateCounter.bind(this), 100);
|
BDFDB.TimeUtils.timeout(this.forceUpdateCounter.bind(this), 100);
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
document.removeEventListener("click", click);
|
document.removeEventListener("click", click);
|
||||||
};
|
};
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
}
|
}
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
if (this.props.refClass) {
|
if (this.props.refClass) {
|
||||||
|
@ -4898,18 +4904,18 @@ module.exports = (_ => {
|
||||||
let mousedown = event => {
|
let mousedown = event => {
|
||||||
if (!this.domElementRef.current || !document.contains(this.domElementRef.current)) document.removeEventListener("mousedown", mousedown);
|
if (!this.domElementRef.current || !document.contains(this.domElementRef.current)) document.removeEventListener("mousedown", mousedown);
|
||||||
else if (!this.domElementRef.current.contains(event.target)) {
|
else if (!this.domElementRef.current.contains(event.target)) {
|
||||||
let mouseup = event => {
|
let mouseUp = event => {
|
||||||
if (!this.domElementRef.current || !document.contains(this.domElementRef.current)) {
|
if (!this.domElementRef.current || !document.contains(this.domElementRef.current)) {
|
||||||
document.removeEventListener("mousedown", mousedown);
|
document.removeEventListener("mousedown", mousedown);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
}
|
}
|
||||||
else if (!this.domElementRef.current.contains(event.target)) {
|
else if (!this.domElementRef.current.contains(event.target)) {
|
||||||
document.removeEventListener("mousedown", mousedown);
|
document.removeEventListener("mousedown", mousedown);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
popoutContainerInstance.handleClick(event);
|
popoutContainerInstance.handleClick(event);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
document.addEventListener("mousedown", mousedown);
|
document.addEventListener("mousedown", mousedown);
|
||||||
|
@ -4948,17 +4954,17 @@ module.exports = (_ => {
|
||||||
onMouseDown: event => {
|
onMouseDown: event => {
|
||||||
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickersaturationcolor, event.target));
|
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickersaturationcolor, event.target));
|
||||||
|
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
};
|
};
|
||||||
let mousemove = event2 => {
|
let mouseMove = event2 => {
|
||||||
let newS = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 100], event2.clientX) + "%";
|
let newS = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 100], event2.clientX) + "%";
|
||||||
let newL = BDFDB.NumberUtils.mapRange([rects.top, rects.top + rects.height], [100, 0], event2.clientY) + "%";
|
let newL = BDFDB.NumberUtils.mapRange([rects.top, rects.top + rects.height], [100, 0], event2.clientY) + "%";
|
||||||
this.handleColorChange(BDFDB.ColorUtils.convert([h, newS, newL, a], hslFormat));
|
this.handleColorChange(BDFDB.ColorUtils.convert([h, newS, newL, a], hslFormat));
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
BDFDB.ReactUtils.createElement("style", {
|
BDFDB.ReactUtils.createElement("style", {
|
||||||
|
@ -4999,16 +5005,16 @@ module.exports = (_ => {
|
||||||
onMouseDown: event => {
|
onMouseDown: event => {
|
||||||
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickerhuehorizontal, event.target));
|
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickerhuehorizontal, event.target));
|
||||||
|
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
};
|
};
|
||||||
let mousemove = event2 => {
|
let mouseMove = event2 => {
|
||||||
let newH = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 360], event2.clientX);
|
let newH = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 360], event2.clientX);
|
||||||
this.handleColorChange(BDFDB.ColorUtils.convert([newH, s, l, a], hslFormat));
|
this.handleColorChange(BDFDB.ColorUtils.convert([newH, s, l, a], hslFormat));
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
BDFDB.ReactUtils.createElement("style", {
|
BDFDB.ReactUtils.createElement("style", {
|
||||||
|
@ -5048,19 +5054,19 @@ module.exports = (_ => {
|
||||||
onMouseDown: event => {
|
onMouseDown: event => {
|
||||||
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickeralphahorizontal, event.target));
|
let rects = BDFDB.DOMUtils.getRects(BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickeralphahorizontal, event.target));
|
||||||
|
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
this.state.draggingAlphaCursor = false;
|
this.state.draggingAlphaCursor = false;
|
||||||
BDFDB.ReactUtils.forceUpdate(this);
|
BDFDB.ReactUtils.forceUpdate(this);
|
||||||
};
|
};
|
||||||
let mousemove = event2 => {
|
let mouseMove = event2 => {
|
||||||
this.state.draggingAlphaCursor = true;
|
this.state.draggingAlphaCursor = true;
|
||||||
let newA = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 1], event2.clientX);
|
let newA = BDFDB.NumberUtils.mapRange([rects.left, rects.left + rects.width], [0, 1], event2.clientX);
|
||||||
this.handleColorChange(BDFDB.ColorUtils.setAlpha(selectedColor, newA, hslFormat));
|
this.handleColorChange(BDFDB.ColorUtils.setAlpha(selectedColor, newA, hslFormat));
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
},
|
},
|
||||||
children: BDFDB.ReactUtils.createElement("div", {
|
children: BDFDB.ReactUtils.createElement("div", {
|
||||||
className: BDFDB.disCN.colorpickeralphacursor,
|
className: BDFDB.disCN.colorpickeralphacursor,
|
||||||
|
@ -5109,10 +5115,10 @@ module.exports = (_ => {
|
||||||
style: {position: "absolute", cursor: "pointer", left: `${posAndColor[0] * 100}%`},
|
style: {position: "absolute", cursor: "pointer", left: `${posAndColor[0] * 100}%`},
|
||||||
onMouseDown: posAndColor[0] == 0 || posAndColor[0] == 1 ? _ => {} : event => {
|
onMouseDown: posAndColor[0] == 0 || posAndColor[0] == 1 ? _ => {} : event => {
|
||||||
event = event.nativeEvent || event;
|
event = event.nativeEvent || event;
|
||||||
let mousemove = event2 => {
|
let mouseMove = event2 => {
|
||||||
if (Math.sqrt((event.pageX - event2.pageX)**2) > 10) {
|
if (Math.sqrt((event.pageX - event2.pageX)**2) > 10) {
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
|
|
||||||
this.state.draggingGradientCursor = true;
|
this.state.draggingGradientCursor = true;
|
||||||
let cursor = BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickergradientcursor, event.target);
|
let cursor = BDFDB.DOMUtils.getParent(BDFDB.dotCN.colorpickergradientcursor, event.target);
|
||||||
|
@ -5137,12 +5143,12 @@ module.exports = (_ => {
|
||||||
document.addEventListener("mouseup", releasing);
|
document.addEventListener("mouseup", releasing);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
};
|
};
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
},
|
},
|
||||||
onClick: event => {
|
onClick: event => {
|
||||||
BDFDB.ListenerUtils.stopEvent(event);
|
BDFDB.ListenerUtils.stopEvent(event);
|
||||||
|
@ -5205,18 +5211,18 @@ module.exports = (_ => {
|
||||||
let rects = BDFDB.DOMUtils.getRects(this.domElementRef.current);
|
let rects = BDFDB.DOMUtils.getRects(this.domElementRef.current);
|
||||||
let left = rects.left, top = rects.top;
|
let left = rects.left, top = rects.top;
|
||||||
let oldX = e.pageX, oldY = e.pageY;
|
let oldX = e.pageX, oldY = e.pageY;
|
||||||
let mouseup = _ => {
|
let mouseUp = _ => {
|
||||||
document.removeEventListener("mouseup", mouseup);
|
document.removeEventListener("mouseup", mouseUp);
|
||||||
document.removeEventListener("mousemove", mousemove);
|
document.removeEventListener("mousemove", mouseMove);
|
||||||
};
|
};
|
||||||
let mousemove = e2 => {
|
let mouseMove = e2 => {
|
||||||
left = left - (oldX - e2.pageX), top = top - (oldY - e2.pageY);
|
left = left - (oldX - e2.pageX), top = top - (oldY - e2.pageY);
|
||||||
oldX = e2.pageX, oldY = e2.pageY;
|
oldX = e2.pageX, oldY = e2.pageY;
|
||||||
this.domElementRef.current.style.setProperty("left", `${left}px`, "important");
|
this.domElementRef.current.style.setProperty("left", `${left}px`, "important");
|
||||||
this.domElementRef.current.style.setProperty("top", `${top}px`, "important");
|
this.domElementRef.current.style.setProperty("top", `${top}px`, "important");
|
||||||
};
|
};
|
||||||
document.addEventListener("mouseup", mouseup);
|
document.addEventListener("mouseup", mouseUp);
|
||||||
document.addEventListener("mousemove", mousemove);
|
document.addEventListener("mousemove", mouseMove);
|
||||||
},
|
},
|
||||||
style: Object.assign({}, pos, {width: 10, height: 10, cursor: "move", position: "absolute"})
|
style: Object.assign({}, pos, {width: 10, height: 10, cursor: "move", position: "absolute"})
|
||||||
}))
|
}))
|
||||||
|
|
Loading…
Reference in New Issue