Update ImageUtilities.plugin.js
This commit is contained in:
parent
27cda7756d
commit
77483eaf2e
|
@ -2,7 +2,7 @@
|
|||
* @name ImageUtilities
|
||||
* @author DevilBro
|
||||
* @authorId 278543574059057154
|
||||
* @version 5.2.5
|
||||
* @version 5.2.6
|
||||
* @description Adds several Utilities for Images/Videos (Gallery, Download, Reverse Search, Zoom, Copy, etc.)
|
||||
* @invite Jx3TjNS
|
||||
* @donate https://www.paypal.me/MircoWittrien
|
||||
|
@ -14,7 +14,9 @@
|
|||
|
||||
module.exports = (_ => {
|
||||
const changeLog = {
|
||||
|
||||
"added": {
|
||||
"Click Zoom Mode": "Added Option to click an Image to Zoom instead of having to hold down the Mouse Button"
|
||||
}
|
||||
};
|
||||
|
||||
return !window.BDFDB_Global || (!window.BDFDB_Global.loaded && !window.BDFDB_Global.started) ? class {
|
||||
|
@ -214,6 +216,7 @@ module.exports = (_ => {
|
|||
galleryFilter: {},
|
||||
zoomSettings: {
|
||||
pixelMode: {value: false, label: "Uses Pixel Lens instead of a Blur Lens"},
|
||||
clickMode: {value: false, label: "Click Image to zoom instead of holding the Mouse Button"},
|
||||
lensSize: {value: 200, digits: 0, minValue: 50, maxValue: 5000, unit: "px", label: "context_lenssize"},
|
||||
zoomLevel: {value: 2, digits: 1, minValue: 1, maxValue: 20, unit: "x", label: "ACCESSIBILITY_ZOOM_LEVEL_LABEL"},
|
||||
zoomSpeed: {value: 0.1, digits: 2, minValue: 0.01, maxValue: 1, unit: "", label: "context_zoomspeed"}
|
||||
|
@ -1246,7 +1249,8 @@ module.exports = (_ => {
|
|||
if (this.isValid(e.instance.props.src, "gif")) e.node.style.setProperty("pointer-events", "none");
|
||||
if (this.settings.viewerSettings.zoomMode && typeof e.instance.props.children != "function" && !BDFDB.DOMUtils.containsClass(e.node.parentElement, BDFDB.disCN._imageutilitiessibling)) {
|
||||
e.node.style.setProperty("cursor", "zoom-in");
|
||||
e.node.addEventListener("mousedown", event => {
|
||||
e.node.addEventListener(this.settings.zoomSettings.clickMode ? "click" : "mousedown", event => {
|
||||
BDFDB.ListenerUtils.stopEvent(event);
|
||||
if (event.which != 1 || e.node.querySelector("video")) return;
|
||||
|
||||
let vanishObserver;
|
||||
|
@ -1255,7 +1259,7 @@ module.exports = (_ => {
|
|||
let imgRects = BDFDB.DOMUtils.getRects(e.node.firstElementChild);
|
||||
let lens = BDFDB.DOMUtils.create(`<div class="${BDFDB.disCN._imageutilitieslense}" style="border-radius: 50% !important; pointer-events: none !important; z-index: 10000 !important; width: ${this.settings.zoomSettings.lensSize}px !important; height: ${this.settings.zoomSettings.lensSize}px !important; position: fixed !important;"><div style="position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;"><${e.node.firstElementChild.tagName} src="${!this.isValid(e.instance.props.src, "video") ? e.instance.props.src : this.getPosterUrl(e.instance.props.src)}" style="width: ${imgRects.width * zoomLevel}px; height: ${imgRects.height * zoomLevel}px; position: fixed !important;${this.settings.zoomSettings.pixelMode ? " image-rendering: pixelated !important;" : ""}"${e.node.firstElementChild.tagName == "VIDEO" ? " loop autoplay" : ""}></${e.node.firstElementChild.tagName}></div></div>`);
|
||||
let pane = lens.firstElementChild.firstElementChild;
|
||||
let backdrop = BDFDB.DOMUtils.create(`<div class="${BDFDB.disCN._imageutilitieslensebackdrop}" style="background: rgba(0, 0, 0, 0.3) !important; position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; pointer-events: none !important; z-index: 8000 !important;"></div>`);
|
||||
let backdrop = BDFDB.DOMUtils.create(`<div class="${BDFDB.disCN._imageutilitieslensebackdrop}" style="background: rgba(0, 0, 0, 0.3) !important; position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; pointer-events: all !important; z-index: 8000 !important;"></div>`);
|
||||
let appMount = document.querySelector(BDFDB.dotCN.appmount);
|
||||
appMount.appendChild(lens);
|
||||
appMount.appendChild(backdrop);
|
||||
|
@ -1282,15 +1286,12 @@ module.exports = (_ => {
|
|||
};
|
||||
lens.update();
|
||||
|
||||
for (let ele of [e.node, document.querySelector(BDFDB.dotCN.imagemodal)]) if (ele) ele.style.setProperty("pointer-events", "none", "important");
|
||||
|
||||
let dragging = event2 => {
|
||||
event = event2;
|
||||
lens.update();
|
||||
};
|
||||
let releasing = event2 => {
|
||||
BDFDB.ListenerUtils.stopEvent(event2);
|
||||
for (let ele of [e.node, document.querySelector(BDFDB.dotCN.imagemodal)]) if (ele) ele.style.removeProperty("pointer-events");
|
||||
this.cleanupListeners("Zoom");
|
||||
document.removeEventListener("mousemove", dragging);
|
||||
document.removeEventListener("mouseup", releasing);
|
||||
|
|
Loading…
Reference in New Issue