Adds a tutor box to Mathspace with a number-only calculator UI (no functionality yet)
// ==UserScript==
// @name Mathspace Tutor Box
// @namespace http://tampermonkey.net/
// @version 1.7
// @description Adds a tutor box to Mathspace with a number-only calculator UI (no functionality yet)
// @author Your Name
// @match *://*.mathspace.co/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
function createTutorBox() {
// Remove existing box if it already exists
let existingBox = document.getElementById("mathspace-tutor");
if (existingBox) existingBox.remove();
// Create the floating box
let tutorBox = document.createElement("div");
tutorBox.id = "mathspace-tutor";
tutorBox.style.position = "fixed";
tutorBox.style.bottom = "20px";
tutorBox.style.right = "20px";
tutorBox.style.background = "#0073e6";
tutorBox.style.color = "white";
tutorBox.style.padding = "15px";
tutorBox.style.borderRadius = "8px";
tutorBox.style.boxShadow = "0px 0px 10px rgba(0,0,0,0.2)";
tutorBox.style.cursor = "pointer";
tutorBox.style.zIndex = "1000";
tutorBox.style.fontSize = "16px";
tutorBox.style.fontWeight = "bold";
tutorBox.innerText = "Mathematical Tutor";
// Add click event
tutorBox.addEventListener("click", function() {
tutorBox.innerText = "Analysing...";
setTimeout(() => {
tutorBox.innerText = "Analysing the Question...";
setTimeout(() => {
tutorBox.innerText = "Fetching tools...";
setTimeout(() => {
tutorBox.innerText = "IF YOU WANT TO WRITE THE QUESTION, PLEASE HOLD AND THEN WRITE...";
setTimeout(() => {
tutorBox.innerText = "Did you know the creator was a 13-year-old kid?";
setTimeout(() => {
captureProblem(tutorBox); // Move to the next step
}, 2000);
}, 2000);
}, 2000);
}, 2000);
}, 2000);
});
// Add to the page
document.body.appendChild(tutorBox);
}
function captureProblem(tutorBox) {
let problemText = getMathProblem();
// If problem isn't found, immediately ask for manual input
if (problemText === "Problem not found!") {
manualProblemInput(tutorBox);
return;
}
// Otherwise, ask if the detected problem is correct
tutorBox.style.width = "350px";
tutorBox.style.height = "auto";
tutorBox.style.padding = "20px";
tutorBox.innerHTML = `
<b>Is this the correct problem?</b><br><br>
<i>${problemText}</i><br><br>
<button id="confirmProblem" style="margin-right: 10px; background: green; color: white; padding: 5px; border: none; cursor: pointer;">Yes, it is right</button>
<button id="editProblem" style="background: red; color: white; padding: 5px; border: none; cursor: pointer;">No, let me type it in</button>
<div id="manualInput" style="margin-top: 10px; display: none;">
<input type="text" id="manualProblem" style="width: 90%;" placeholder="Type the problem here...">
<button id="submitProblem" style="background: blue; color: white; padding: 5px; border: none; cursor: pointer;">Submit</button>
</div>
`;
document.getElementById("confirmProblem").addEventListener("click", () => {
showLoadingScreen(tutorBox);
});
document.getElementById("editProblem").addEventListener("click", () => {
document.getElementById("manualInput").style.display = "block";
});
document.getElementById("submitProblem").addEventListener("click", () => {
let userInput = document.getElementById("manualProblem").value;
if (userInput.trim() === "") return; // Prevent empty input
tutorBox.innerHTML = `<b>Question received:</b> <br><br> <i>${userInput}</i>`;
setTimeout(() => {
showLoadingScreen(tutorBox);
}, 2000);
});
}
function manualProblemInput(tutorBox) {
tutorBox.style.width = "350px";
tutorBox.style.height = "auto";
tutorBox.style.padding = "20px";
tutorBox.innerHTML = `
<b>Type the problem:</b><br><br>
<input type="text" id="manualProblem" style="width: 90%;" placeholder="Type the problem here...">
<button id="submitProblem" style="background: blue; color: white; padding: 5px; border: none; cursor: pointer;">Submit</button>
`;
document.getElementById("submitProblem").addEventListener("click", () => {
let userInput = document.getElementById("manualProblem").value;
if (userInput.trim() === "") return; // Prevent empty input
tutorBox.innerHTML = `<b>Question received:</b> <br><br> <i>${userInput}</i>`;
setTimeout(() => {
showLoadingScreen(tutorBox);
}, 2000);
});
}
function showLoadingScreen(tutorBox) {
tutorBox.innerText = "Loading and wait for your math tutor to destroy those fails and get more A's";
setTimeout(() => {
showNumberButtons(tutorBox);
}, 3000);
}
function showNumberButtons(tutorBox) {
tutorBox.innerHTML = `
<b>Number Selection</b><br><br>
<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px;">
<button class="numBtn">1</button>
<button class="numBtn">2</button>
<button class="numBtn">3</button>
<button class="numBtn">4</button>
<button class="numBtn">5</button>
<button class="numBtn">6</button>
<button class="numBtn">7</button>
<button class="numBtn">8</button>
<button class="numBtn">9</button>
<button class="numBtn">0</button>
</div>
`;
// Buttons do nothing for now
document.querySelectorAll(".numBtn").forEach(button => {
button.addEventListener("click", () => {
console.log("Number pressed: " + button.innerText);
});
});
}
function getMathProblem() {
let problemElement = document.querySelector('[data-testid="question-content"]'); // Change this selector if needed
return problemElement ? problemElement.innerText.trim() : "Problem not found!";
}
// Ensure the script runs when the page is fully loaded
window.addEventListener("load", createTutorBox);
})();