Spaces:
Running
Running
File size: 3,965 Bytes
6bcb42f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 |
// This file is imported from
// https://github.com/ScratchAddons/ScratchAddons/blob/master/addon-api/content-script/contextmenu.js
/* eslint-disable */
let initialized = false;
let hasDynamicContextMenu = false;
let contextMenus = [];
const onReactContextMenu = function (e) {
if (!e.target) return;
const ctxTarget = e.target.closest(".react-contextmenu-wrapper");
if (!ctxTarget) return;
let ctxMenu = ctxTarget.querySelector("nav.react-contextmenu");
let type;
const extra = {};
if (false && !ctxMenu && ctxTarget.closest(".monitor-overlay")) {
// Monitors are rendered on document.body.
// This is internal id which is different from the actual monitor ID.
// Optional chain just to prevent crashes when they change the internal stuff.
const mInternalId = ctxTarget[this.traps.getInternalKey(ctxTarget)]?.return?.stateNode?.props?.id;
if (!mInternalId) return;
ctxMenu = Array.prototype.find.call(
document.querySelectorAll("body > nav.react-contextmenu"),
(candidate) => candidate[this.traps.getInternalKey(candidate)]?.return?.stateNode?.props?.id === mInternalId
);
if (!ctxMenu) return;
const props = ctxTarget[this.traps.getInternalKey(ctxTarget)]?.return?.return?.return?.stateNode?.props;
if (!props) return;
extra.monitorParams = props.params;
extra.opcode = props.opcode;
extra.itemId = props.id;
extra.targetId = props.targetId;
type = `monitor_${props.mode}`;
} else if (ctxTarget[this.traps.getInternalKey(ctxTarget)]?.return?.return?.return?.stateNode?.props?.dragType) {
// SpriteSelectorItem which despite its name is used for costumes, sounds, backpacked script etc
const props = ctxTarget[this.traps.getInternalKey(ctxTarget)].return.return.return.stateNode.props;
type = props.dragType.toLowerCase();
extra.name = props.name;
extra.itemId = props.id;
extra.index = props.index;
} else {
return;
}
const ctx = {
menuItem: ctxMenu,
target: ctxTarget,
type,
...extra,
};
Array.from(ctxMenu.children).forEach((existing) => {
if (existing.classList.contains("sa-ctx-menu")) existing.remove();
});
for (const item of hasDynamicContextMenu
? contextMenus.flatMap((menu) => (typeof menu === "function" ? menu(type, ctx) : menu))
: contextMenus) {
if (!item) continue;
if (item.types && !item.types.some((itemType) => type === itemType)) continue;
if (item.condition && !item.condition(ctx)) continue;
const itemElem = document.createElement("div");
const classes = ["context-menu_menu-item"];
if (item.border) classes.push("context-menu_menu-item-bordered");
if (item.dangerous) classes.push("context-menu_menu-item-danger");
itemElem.className = this.scratchClass(...classes, {
others: ["react-contextmenu-item", "sa-ctx-menu", item.className || ""],
});
const label = document.createElement("span");
label.textContent = item.label;
itemElem.append(label);
this.displayNoneWhileDisabled(itemElem, {
display: "block",
});
itemElem.addEventListener("click", (e) => {
e.stopPropagation();
window.dispatchEvent(
new CustomEvent("REACT_CONTEXTMENU_HIDE", {
detail: {
action: "REACT_CONTEXTMENU_HIDE",
},
})
);
item.callback(ctx);
});
this.appendToSharedSpace({
space: item.position,
order: item.order,
scope: ctxMenu,
element: itemElem,
});
}
return;
};
const initialize = (tab) => {
if (initialized) return;
initialized = true;
document.body.addEventListener("contextmenu", (e) => onReactContextMenu.call(tab, e), { capture: true });
};
export const addContextMenu = (tab, callback, opts) => {
if (typeof opts === "undefined") {
contextMenus.push(callback);
hasDynamicContextMenu = true;
} else {
contextMenus.push({
...opts,
callback,
});
}
initialize(tab);
};
|