User:Stumblean/common.js
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
(function () {
const defaultSettings = {
menuTitle: "Mahito Menu",
iconURL: "https://files.catbox.moe/wk78nl.jpg",
backgroundColor: "#7889B2",
buttonColor: "#45A8C5",
textColor: "#ffffff",
borderColor: "#ffffff",
iconSize: 15,
minimizedSize: 30
};
const defaultPrefs = {
showMassUndo: true,
showExplanation: true,
showEncouragement: true,
showYujify: true,
showCustomize: true,
showUndoChanges: true,
showPreferences: true, // always true but kept here for completeness
showWatermark: true
};
const settings = JSON.parse(localStorage.getItem("mahitoMenuSettings")) || defaultSettings;
const prefs = JSON.parse(localStorage.getItem("mahitoMenuPrefs")) || defaultPrefs;
function saveSettings() {
localStorage.setItem("mahitoMenuSettings", JSON.stringify(settings));
}
function savePrefs() {
localStorage.setItem("mahitoMenuPrefs", JSON.stringify(prefs));
}
const menu = document.createElement("div");
menu.id = "mahitoMenu";
Object.assign(menu.style, {
position: "fixed",
top: "20px",
right: "20px",
background: settings.backgroundColor,
color: settings.textColor,
border: `2px solid ${settings.borderColor}`,
borderRadius: "10px",
padding: "10px",
fontFamily: "monospace",
zIndex: "99999",
boxShadow: "0 0 10px black",
width: "200px",
userSelect: "none"
});
function makeDraggable(el) {
let offsetX = 0, offsetY = 0, isDragging = false;
el.addEventListener("mousedown", startDrag);
el.addEventListener("touchstart", startDrag);
function startDrag(e) {
isDragging = true;
const evt = e.type.startsWith("touch") ? e.touches[0] : e;
offsetX = evt.clientX - el.offsetLeft;
offsetY = evt.clientY - el.offsetTop;
document.addEventListener("mousemove", onDrag);
document.addEventListener("mouseup", stopDrag);
document.addEventListener("touchmove", onDrag);
document.addEventListener("touchend", stopDrag);
}
function onDrag(e) {
if (!isDragging) return;
const evt = e.type.startsWith("touch") ? e.touches[0] : e;
el.style.left = evt.clientX - offsetX + "px";
el.style.top = evt.clientY - offsetY + "px";
el.style.right = "auto";
}
function stopDrag() {
isDragging = false;
document.removeEventListener("mousemove", onDrag);
document.removeEventListener("mouseup", stopDrag);
document.removeEventListener("touchmove", onDrag);
document.removeEventListener("touchend", stopDrag);
}
}
makeDraggable(menu);
const header = document.createElement("div");
header.style.display = "flex";
header.style.justifyContent = "space-between";
header.style.alignItems = "center";
header.style.marginBottom = "8px";
const titleWrap = document.createElement("div");
titleWrap.style.display = "flex";
titleWrap.style.alignItems = "center";
titleWrap.style.gap = "6px";
const leftIcon = document.createElement("img");
leftIcon.src = settings.iconURL;
leftIcon.width = settings.iconSize;
leftIcon.height = settings.iconSize;
const title = document.createElement("div");
title.textContent = settings.menuTitle;
title.style.fontWeight = "bold";
title.style.color = settings.textColor;
const rightIcon = document.createElement("img");
rightIcon.src = settings.iconURL;
rightIcon.width = settings.iconSize;
rightIcon.height = settings.iconSize;
titleWrap.appendChild(leftIcon);
titleWrap.appendChild(title);
titleWrap.appendChild(rightIcon);
const minimizeBtn = document.createElement("button");
minimizeBtn.textContent = "–";
Object.assign(minimizeBtn.style, {
background: settings.buttonColor,
border: "none",
color: settings.textColor,
cursor: "pointer",
borderRadius: "5px",
width: "25px",
height: "25px"
});
header.appendChild(titleWrap);
header.appendChild(minimizeBtn);
const minimizedIcon = document.createElement("img");
minimizedIcon.src = settings.iconURL;
Object.assign(minimizedIcon.style, {
position: "fixed",
top: "20px",
right: "20px",
zIndex: "99999",
display: "none",
cursor: "pointer",
borderRadius: "6px",
width: settings.minimizedSize + "px",
height: settings.minimizedSize + "px"
});
minimizedIcon.addEventListener("click", () => {
minimizedIcon.style.display = "none";
menu.style.display = "block";
});
minimizeBtn.addEventListener("click", () => {
menu.style.display = "none";
minimizedIcon.style.display = "block";
});
makeDraggable(minimizedIcon);
function makeButton(text, action) {
const btn = document.createElement("button");
btn.textContent = text;
btn.onclick = action;
Object.assign(btn.style, {
marginBottom: "6px",
width: "100%",
cursor: "pointer",
background: settings.buttonColor,
color: settings.textColor,
border: "none",
padding: "5px 10px",
borderRadius: "5px"
});
return btn;
}
const btnMassUndo = makeButton("Mass undo", () => {
navigator.clipboard.writeText(
"mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Alexis_Jazz/Kill-It-With-Fire.js&action=raw&ctype=text/javascript');"
);
alert("Go to your common.js and paste what was just copied!");
});
const btnExplain = makeButton("Open Explanation", () => {
window.open("https://hpd0v2.mimo.run/index.html", "_blank");
});
const btnEncouragement = makeButton("Encouragement", () => {
ytContainer.style.display = ytContainer.style.display === "none" ? "block" : "none";
});
const btnYujify = makeButton("YUJIFY", () => {
const confirmKill = confirm("Are you sure you want to YUJIFY this menu? This will kill the script.");
if (!confirmKill) return;
console.log("I'll admit it, mahito, I am you. (script killed)");
menu.remove();
minimizedIcon.remove();
ytContainer.remove();
prefsPanel.remove();
watermark.remove();
});
const btnCustomize = makeButton("Customize Menu", () => {
const newTitle = prompt("New menu title:", settings.menuTitle);
const newIcon = prompt("New icon URL:", settings.iconURL);
const newBg = prompt("Background color (hex):", settings.backgroundColor);
const newBtn = prompt("Button color (hex):", settings.buttonColor);
const newTxt = prompt("Text color (hex):", settings.textColor);
const newBorder = prompt("Border color (hex):", settings.borderColor);
if (newTitle) settings.menuTitle = newTitle;
if (newIcon) settings.iconURL = newIcon;
if (newBg) settings.backgroundColor = newBg;
if (newBtn) settings.buttonColor = newBtn;
if (newTxt) settings.textColor = newTxt;
if (newBorder) settings.borderColor = newBorder;
saveSettings();
alert("Changes saved! Refresh to apply.");
});
const btnReset = makeButton("Undo Changes", () => {
const confirmReset = confirm("Are you sure you want to undo all customizations?");
if (!confirmReset) return;
localStorage.removeItem("mahitoMenuSettings");
alert("Customizations reset! Reloading...");
location.reload();
});
// Preferences Button (always visible)
const btnPreferences = makeButton("Preferences", () => {
if (prefsPanel.style.display === "block") {
prefsPanel.style.display = "none";
} else {
prefsPanel.style.display = "block";
}
});
// Preferences Panel
const prefsPanel = document.createElement("div");
Object.assign(prefsPanel.style, {
backgroundColor: "#333a66",
padding: "8px",
borderRadius: "6px",
marginTop: "10px",
display: "none",
color: "#eee",
fontSize: "13px"
});
function createCheckbox(labelText, prefKey, buttonOrFeature) {
const label = document.createElement("label");
label.style.display = "block";
label.style.marginBottom = "6px";
label.style.cursor = "pointer";
const checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.checked = prefs[prefKey];
checkbox.style.marginRight = "6px";
checkbox.addEventListener("change", () => {
prefs[prefKey] = checkbox.checked;
savePrefs();
applyPreferences();
});
label.appendChild(checkbox);
label.appendChild(document.createTextNode(labelText));
return label;
}
prefsPanel.appendChild(createCheckbox("Show Mass undo Button", "showMassUndo"));
prefsPanel.appendChild(createCheckbox("Show Explanation Button", "showExplanation"));
prefsPanel.appendChild(createCheckbox("Show Encouragement Button", "showEncouragement"));
prefsPanel.appendChild(createCheckbox("Show YUJIFY Button", "showYujify"));
prefsPanel.appendChild(createCheckbox("Show Customize Menu Button", "showCustomize"));
prefsPanel.appendChild(createCheckbox("Show Undo Changes Button", "showUndoChanges"));
prefsPanel.appendChild(createCheckbox("Show Preferences Button", "showPreferences")); // always true, but user can toggle
prefsPanel.appendChild(createCheckbox("Show Watermark Footer", "showWatermark"));
function applyPreferences() {
btnMassUndo.style.display = prefs.showMassUndo ? "block" : "none";
btnExplain.style.display = prefs.showExplanation ? "block" : "none";
btnEncouragement.style.display = prefs.showEncouragement ? "block" : "none";
btnYujify.style.display = prefs.showYujify ? "block" : "none";
btnCustomize.style.display = prefs.showCustomize ? "block" : "none";
btnReset.style.display = prefs.showUndoChanges ? "block" : "none";
btnPreferences.style.display = prefs.showPreferences ? "block" : "none";
watermark.style.display = prefs.showWatermark ? "block" : "none";
}
// Create YouTube encouragement container
const ytContainer = document.createElement("div");
Object.assign(ytContainer.style, {
position: "fixed",
right: "20px",
top: "150px",
zIndex: "99998",
display: "none",
background: "#000",
padding: "5px",
borderRadius: "10px",
boxShadow: "0 0 10px black"
});
const ytIframe = document.createElement("iframe");
ytIframe.width = "280";
ytIframe.height = "157";
ytIframe.src = "https://www.youtube.com/embed/VKfyq_hOL0c?autoplay=1";
ytIframe.title = "Self Embodiment of Perfection OST";
ytIframe.frameBorder = "0";
ytIframe.allow = "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture";
ytIframe.allowFullscreen = true;
ytContainer.appendChild(ytIframe);
// Transparent watermark footer
const watermark = document.createElement("div");
watermark.textContent = "Mahito Menu. Made by Radarhump/Washweans. Do not republish, do not reskin and republish.";
Object.assign(watermark.style, {
position: "fixed",
bottom: "2px",
left: "5px",
fontSize: "10px",
color: "#ffffff",
opacity: "0.05",
zIndex: "9999",
pointerEvents: "none",
fontFamily: "monospace"
});
// Append buttons
menu.appendChild(header);
menu.appendChild(btnMassUndo);
menu.appendChild(btnExplain);
menu.appendChild(btnEncouragement);
menu.appendChild(btnYujify);
menu.appendChild(btnCustomize);
menu.appendChild(btnReset);
menu.appendChild(btnPreferences);
menu.appendChild(prefsPanel);
// Append everything to body
document.body.appendChild(menu);
document.body.appendChild(minimizedIcon);
document.body.appendChild(ytContainer);
document.body.appendChild(watermark);
// Apply preferences initially
applyPreferences();
})();