3rdparty/flameddogo99-eaglermobile
1
0
Fork 0
mirror of https://github.com/FlamedDogo99/EaglerMobile.git synced 2024-11-21 11:36:05 -08:00
Code Issues Packages Projects Releases Wiki Activity

Refactoring

Browse Source 
Lots of house cleaning! The names of variables and functions now have a consistent naming scheme. The scrollwheel events have been given a function. Button styles have been updated. Mobile buttons have the mobileButton class, and can be given a inGame or inMenu class to hide them respectively. Adding buttons is now slightly easier.
This commit is contained in:
FlamedDogo99 2024-05-30 09:15:30 -06:00
parent 0f220dd5ea
commit edd5ae31f0
1 changed files with 155 additions and 178 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

333
eaglermobile.user.js
View File

@ -7,7 +7,7 @@
// @license Apache License 2.0 - http://www.apache.org/licenses/ // @license Apache License 2.0 - http://www.apache.org/licenses/
// @match https://eaglercraft.com/mc/* // @match https://eaglercraft.com/mc/*
// @grant none // @grant none
// @version 1.4 // @version 1.5
// @updateURL https://raw.githubusercontent.com/FlamedDogo99/EaglerMobile/main/eaglermobile.user.js // @updateURL https://raw.githubusercontent.com/FlamedDogo99/EaglerMobile/main/eaglermobile.user.js
// @run-at document-start // @run-at document-start
// ==/UserScript== // ==/UserScript==
@ -21,12 +21,12 @@ function isMobile() {
return false; return false;
} }
} }
if(!isMobile()){alert("WARNING: This script doesn't play well with non-mobile browsers. Proceed at your own risk!")}; if(!isMobile()){
// Hides inventory button alert("WARNING: This script was created for mobile, and may break functionality in non-mobile browsers!");
window.inInventory = false; }
// Used for changing touchmove events to mousemove events // Used for changing touchmove events to mousemove events
var previousX = null; var previousTouchX = null;
var previousY = null; var previousTouchY = null;
// Key and mouse events // Key and mouse events
function keyEvent(name, state) { function keyEvent(name, state) {
const keyName = name.toUpperCase().charCodeAt(0) const keyName = name.toUpperCase().charCodeAt(0)
@ -36,7 +36,7 @@ function keyEvent(name, state) {
which: keyName which: keyName
})); }));
} }
function shiftKey(state) { function shiftKeyEvent(state) {
window.dispatchEvent(new KeyboardEvent(state, { window.dispatchEvent(new KeyboardEvent(state, {
keyCode: 16, keyCode: 16,
which: 16 which: 16
@ -45,6 +45,17 @@ function shiftKey(state) {
function mouseEvent(number, state, canvas) { function mouseEvent(number, state, canvas) {
canvas.dispatchEvent(new PointerEvent(state, {"button": number})) canvas.dispatchEvent(new PointerEvent(state, {"button": number}))
} }
function wheelEvent(canvas, delta) {
canvas.dispatchEvent(new WheelEvent("wheel", {
"wheelDeltaY": delta
}));
}
function setButtonVisibility(pointerLocked) {
let inGameStyle = document.getElementById('inGameStyle');
let inMenuStyle = document.getElementById('inMenuStyle');
inGameStyle.disabled = pointerLocked;
inMenuStyle.disabled = !pointerLocked;
}
// POINTERLOCK // POINTERLOCK
// When requestpointerlock is called, this dispatches an event, saves the requested element to window.fakelock, and unhides the touch controls // When requestpointerlock is called, this dispatches an event, saves the requested element to window.fakelock, and unhides the touch controls
window.fakelock = null; window.fakelock = null;
@ -53,10 +64,7 @@ Element.prototype.requestPointerLock = function() {
window.fakelock = this window.fakelock = this
document.dispatchEvent(new Event('pointerlockchange')); document.dispatchEvent(new Event('pointerlockchange'));
console.log("requested pointerlock") console.log("requested pointerlock")
var hideButtonStyleDOM = document.getElementById('hideButtonStyle'); setButtonVisibility(true);
var hideInventoryStyleDOM = document.getElementById('hideInventoryStyle');
hideButtonStyleDOM.disabled = true;
hideInventoryStyleDOM.disabled = true;
return true return true
} }
@ -69,12 +77,9 @@ Object.defineProperty(document, "pointerLockElement", {
}); });
// When exitPointerLock is called, this dispatches an event, clears the // When exitPointerLock is called, this dispatches an event, clears the
document.exitPointerLock = function() { document.exitPointerLock = function() {
window.fakelock = null window.fakelock = null
document.dispatchEvent(new Event('pointerlockchange')); document.dispatchEvent(new Event('pointerlockchange'));
var hideButtonStyleDOM = document.getElementById('hideButtonStyle'); setButtonVisibility(false);
var hideInventoryStyleDOM = document.getElementById('hideInventoryStyle');
hideButtonStyleDOM.disabled = false;
hideInventoryStyleDOM.disabled = window.inInventory;
return true return true
} }
@ -123,7 +128,7 @@ document.createElement = function(type) {
// CSS for touch screen buttons, along with fixing iOS's issues with 100vh ignoring the naviagtion bar, and actually disabling zoom because safari ignores user-scalable=no :( // CSS for touch screen buttons, along with fixing iOS's issues with 100vh ignoring the naviagtion bar, and actually disabling zoom because safari ignores user-scalable=no :(
let customStyle = document.createElement("style"); let customStyle = document.createElement("style");
customStyle.textContent = ` customStyle.textContent = `
button { .mobileControl {
position: absolute; position: absolute;
width: 9.5vh; width: 9.5vh;
height: 9.5vh; height: 9.5vh;
@ -143,7 +148,7 @@ customStyle.textContent = `
box-shadow: none; box-shadow: none;
border: none; border: none;
} }
button:active { .mobileControl:active {
position: absolute; position: absolute;
width: 9.5vh; width: 9.5vh;
height: 9.5vh; height: 9.5vh;
@ -172,20 +177,22 @@ customStyle.textContent = `
document.documentElement.appendChild(customStyle); document.documentElement.appendChild(customStyle);
// Lazy way to hide touch controls through CSS. // Lazy way to hide touch controls through CSS.
let hideButtonStyle = document.createElement("style"); let inGameStyle = document.createElement("style");
hideButtonStyle.id = "hideButtonStyle"; inGameStyle.id = "inGameStyle";
hideButtonStyle.textContent = ` inGameStyle.textContent = `
#hideButton { .inGame {
display: none; display: none;
}`; }`;
document.documentElement.appendChild(hideButtonStyle); document.documentElement.appendChild(inGameStyle);
let hideInventoryStyle = document.createElement("style");
hideInventoryStyle.id = "hideInventoryStyle"; let inMenuStyle = document.createElement("style");
hideInventoryStyle.textContent = ` inMenuStyle.id = "inMenuStyle";
#hideInventory { inMenuStyle.textContent = `
.inMenu {
display: none; display: none;
}`; }`;
document.documentElement.appendChild(hideInventoryStyle); document.documentElement.appendChild(inMenuStyle);
// The canvas is created by the client after it finishes unzipping and loading. When the canvas is created, this applies any necessary event listeners // The canvas is created by the client after it finishes unzipping and loading. When the canvas is created, this applies any necessary event listeners
function waitForElm(selector) { function waitForElm(selector) {
@ -205,171 +212,141 @@ function waitForElm(selector) {
}); });
}); });
} }
function createTouchButton(buttonClass, buttonDisplay, elementName) {
var touchButton = document.createElement(elementName ?? 'button');
touchButton.classList.add(buttonClass);
touchButton.classList.add(buttonDisplay);
touchButton.classList.add("mobileControl");
touchButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
return touchButton;
}
waitForElm('canvas').then(() => {insertCanvasElements()}); waitForElm('canvas').then(() => {insertCanvasElements()});
function insertCanvasElements() { function insertCanvasElements() {
// Translates touchmove events to mousemove events // Translates touchmove events to mousemove events when inGame, and touchmove events to wheele events when inMenu
var canvas = document.querySelector('canvas'); var canvas = document.querySelector('canvas');
canvas.addEventListener("touchmove", (e) => { canvas.addEventListener("touchmove", (e) => {
const touch = e.targetTouches[0]; // We can get away with this because every other touch event will be on different elements const touch = e.targetTouches[0]; // We can get away with this because every other touch event will be on different elements
if (!previousX) { if (!previousTouchX) {
previousX = touch.pageX; previousTouchX = touch.pageX;
previousY = touch.pageY; previousTouchY = touch.pageY;
} }
e.movementX = touch.pageX - previousX; e.movementX = touch.pageX - previousTouchX;
e.movementY = touch.pageY - previousY; e.movementY = touch.pageY - previousTouchY;
var evt = window.fakelock ? new MouseEvent("mousemove", {movementX: e.movementX, movementY: e.movementY}) : new WheelEvent("wheel", {"wheelDeltaY": e.movementY}); var evt = window.fakelock ? new MouseEvent("mousemove", {movementX: e.movementX, movementY: e.movementY}) : new WheelEvent("wheel", {"wheelDeltaY": e.movementY});
canvas.dispatchEvent(evt); canvas.dispatchEvent(evt);
previousX = touch.pageX; previousTouchX = touch.pageX;
previousY = touch.pageY; previousTouchY = touch.pageY;
event.preventDefault(); event.preventDefault();
}, false); }, false);
canvas.addEventListener("touchend", (e) => { canvas.addEventListener("touchend", (e) => {
previousX = null; previousTouchX = null;
previousY = null; previousTouchY = null;
}, false) }, false)
//Updates button visibility on load
setButtonVisibility(window.fakelock != null);
// Adds all of the touch screen controls // Adds all of the touch screen controls
// Theres probably a better way to do this but this works for now // Theres probably a better way to do this but this works for now
var forwardButton = document.createElement('button');
forwardButton.id = "hideButton" let forwardButton = createTouchButton("forwardButton", "inGame");
forwardButton.textContent = "▲"; forwardButton.textContent = "▲";
forwardButton.style.cssText = "left:10vh;bottom:20vh;" forwardButton.style.cssText = "left:10vh;bottom:20vh;"
forwardButton.addEventListener("touchstart", function(e){keyEvent("w", "keydown")}, false); forwardButton.addEventListener("touchstart", function(e){keyEvent("w", "keydown")}, false);
forwardButton.addEventListener("touchend", function(e){keyEvent("w", "keyup")}, false); forwardButton.addEventListener("touchend", function(e){keyEvent("w", "keyup")}, false);
forwardButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); document.body.appendChild(forwardButton);
document.body.appendChild(forwardButton); let rightButton = createTouchButton("rightButton", "inGame");
var rightButton = document.createElement('button'); rightButton.textContent = "▶";
rightButton.id = "hideButton" rightButton.style.cssText = "left:20vh;bottom:10vh;"
rightButton.textContent = "▶"; rightButton.addEventListener("touchstart", function(e){keyEvent("d", "keydown")}, false);
rightButton.style.cssText = "left:20vh;bottom:10vh;" rightButton.addEventListener("touchend", function(e){keyEvent("d", "keyup")}, false);
rightButton.addEventListener("touchstart", function(e){keyEvent("d", "keydown")}, false); document.body.appendChild(rightButton);
rightButton.addEventListener("touchend", function(e){keyEvent("d", "keyup")}, false); let leftButton = createTouchButton("leftButton", "inGame");
rightButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); leftButton.textContent = "◀";
document.body.appendChild(rightButton); leftButton.style.cssText = "left: 0vh; bottom:10vh;"
var leftButton = document.createElement('button'); leftButton.addEventListener("touchstart", function(e){keyEvent("a", "keydown")}, false);
leftButton.id = "hideButton" leftButton.addEventListener("touchend", function(e){keyEvent("a", "keyup")}, false);
leftButton.textContent = "◀"; document.body.appendChild(leftButton);
leftButton.style.cssText = "left: 0vh; bottom:10vh;" let backButton = createTouchButton("backButton", "inGame");
leftButton.addEventListener("touchstart", function(e){keyEvent("a", "keydown")}, false); backButton.textContent = "▼";
leftButton.addEventListener("touchend", function(e){keyEvent("a", "keyup")}, false); backButton.style.cssText = "left:10vh;bottom:0vh;"
leftButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); backButton.addEventListener("touchstart", function(e){keyEvent("s", "keydown")}, false);
document.body.appendChild(leftButton); backButton.addEventListener("touchend", function(e){keyEvent("s", "keyup")}, false);
var backButton = document.createElement('button'); document.body.appendChild(backButton);
backButton.id = "hideButton" let jumpButton = createTouchButton("jumpButton", "inGame");
backButton.textContent = "▼"; jumpButton.textContent = "⇧";
backButton.style.cssText = "left:10vh;bottom:0vh;" jumpButton.style.cssText = "right:10vh;bottom:10vh;"
backButton.addEventListener("touchstart", function(e){keyEvent("s", "keydown")}, false); jumpButton.addEventListener("touchstart", function(e){keyEvent(" ", "keydown")}, false);
backButton.addEventListener("touchend", function(e){keyEvent("s", "keyup")}, false); jumpButton.addEventListener("touchend", function(e){keyEvent(" ", "keyup")}, false);
backButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); document.body.appendChild(jumpButton);
document.body.appendChild(backButton); let crouchButton = createTouchButton("crouchButton", "inGame");
var jumpButton = document.createElement('button'); crouchButton.textContent = "⇩";
jumpButton.id = "hideButton" crouchButton.style.cssText = "left:10vh;bottom:10vh;"
jumpButton.textContent = "⇧"; crouchButton.addEventListener("touchstart", function(e){shiftKeyEvent("keydown")}, false);
jumpButton.style.cssText = "right:10vh;bottom:10vh;" crouchButton.addEventListener("touchend", function(e){shiftKeyEvent("keyup")}, false);
jumpButton.addEventListener("touchstart", function(e){keyEvent(" ", "keydown")}, false); document.body.appendChild(crouchButton);
jumpButton.addEventListener("touchend", function(e){keyEvent(" ", "keyup")}, false); let inventoryButton = createTouchButton("inventoryButton", "inGame");
jumpButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); inventoryButton.textContent = "🎒";
document.body.appendChild(jumpButton); inventoryButton.style.cssText = "right:0vh;bottom:0vh;"
var crouchButton = document.createElement('button'); inventoryButton.addEventListener("touchstart", function(e){keyEvent("e", "keydown")}, false);
crouchButton.id = "hideButton" inventoryButton.addEventListener("touchend", function(e){keyEvent("e", "keyup")}, false);
crouchButton.textContent = "⇩"; document.body.appendChild(inventoryButton);
crouchButton.style.cssText = "left:10vh;bottom:10vh;" let chatButton = createTouchButton("chatButton", "inGame");
crouchButton.addEventListener("touchstart", function(e){shiftKey("keydown")}, false); chatButton.textContent = "💬";
crouchButton.addEventListener("touchend", function(e){shiftKey("keyup")}, false); chatButton.style.cssText = "right:0vh;top:0vh;"
crouchButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); chatButton.addEventListener("touchstart", function(e){keyEvent("t", "keydown")}, false);
document.body.appendChild(crouchButton); chatButton.addEventListener("touchend", function(e){keyEvent("t", "keyup")}, false);
var inventoryButton = document.createElement('button'); document.body.appendChild(chatButton);
inventoryButton.id = "hideInventory" let exitButton = createTouchButton("exitButton", "inAll");
inventoryButton.textContent = "🎒"; exitButton.textContent = "⮐";
inventoryButton.style.cssText = "right:0vh;bottom:0vh;" exitButton.style.cssText = "left:0vh;top:0vh;"
inventoryButton.addEventListener("touchstart", function(e){ exitButton.addEventListener("touchstart", function(e){keyEvent("À", "keydown")}, false);
window.inInventory = (window.fakelock != null) exitButton.addEventListener("touchend", function(e){keyEvent("À", "keyup")}, false);
keyEvent("e", "keydown"); document.body.appendChild(exitButton);
}, false); // input for keyboard button
inventoryButton.addEventListener("touchend", function(e){keyEvent("e", "keyup")}, false); let hiddenInput = document.createElement('input');
inventoryButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); hiddenInput.id = "hiddenInput"
document.body.appendChild(inventoryButton); hiddenInput.style.cssText = "opacity:0;z-index:-99999";
var chatButton = document.createElement('button'); document.body.appendChild(hiddenInput);
chatButton.id = "hideButton" let keyboardButton = createTouchButton("keyboardButton", "inMenu");
chatButton.textContent = "💬"; keyboardButton.textContent = "⌨️";
chatButton.style.cssText = "right:0vh;top:0vh;" keyboardButton.style.cssText = "left:10vh;top:0vh;"
chatButton.addEventListener("touchstart", function(e){keyEvent("¿", "keydown")}, false); keyboardButton.addEventListener("touchstart", function(e){e.preventDefault();hiddenInput.blur()}, false);
chatButton.addEventListener("touchend", function(e){keyEvent("¿", "keydown")}, false); keyboardButton.addEventListener("touchend", function(e){hiddenInput.select()}, false);
chatButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); document.body.appendChild(keyboardButton);
document.body.appendChild(chatButton); let placeButton = createTouchButton("placeButton", "inGame");
var exitButton = document.createElement('button'); placeButton.textContent = "⊹";
exitButton.id = "exitButton" placeButton.style.cssText = "right:0vh;bottom:20vh;"
exitButton.textContent = "⮐"; placeButton.addEventListener("touchstart", function(e){mouseEvent(2, "mousedown", canvas)}, false);
exitButton.style.cssText = "left:0vh;top:0vh;" placeButton.addEventListener("touchend", function(e){mouseEvent(2, "mouseup", canvas)}, false);
exitButton.addEventListener("touchstart", function(e){keyEvent("À", "keydown")}, false); document.body.appendChild(placeButton);
exitButton.addEventListener("touchend", function(e){keyEvent("À", "keyup")}, false); let breakButton = createTouchButton("breakButton", "inGame");
exitButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); breakButton.textContent = "🗡";
document.body.appendChild(exitButton); breakButton.style.cssText = "right:10vh;bottom:20vh;"
var hiddenInput = document.createElement('input'); breakButton.addEventListener("touchstart", function(e){mouseEvent(0, "mousedown", canvas)}, false);
hiddenInput.id = "hiddenInput" breakButton.addEventListener("touchend", function(e){mouseEvent(0, "mouseup", canvas)}, false);
hiddenInput.style.cssText = "opacity:0;z-index:-99999"; document.body.appendChild(breakButton);
document.body.appendChild(hiddenInput); let selectButton = createTouchButton("selectButton", "inGame");
var keyboardButton = document.createElement('button'); selectButton.textContent = "⬚";
keyboardButton.id = "keyboardButton" selectButton.style.cssText = "right:20vh;bottom:20vh;"
keyboardButton.textContent = "⌨️"; selectButton.addEventListener("touchstart", function(e){mouseEvent(1, "mousedown", canvas)}, false);
keyboardButton.style.cssText = "left:10vh;top:0vh;" selectButton.addEventListener("touchend", function(e){mouseEvent(1, "mouseup", canvas)}, false);
keyboardButton.addEventListener("touchstart", function(e){e.preventDefault();hiddenInput.blur()}, false); document.body.appendChild(selectButton);
keyboardButton.addEventListener("touchend", function(e){hiddenInput.select()}, false); let scrollUpButton = createTouchButton("scrollUpButton", "inGame");
keyboardButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); scrollUpButton.textContent = "⇨";
document.body.appendChild(keyboardButton); scrollUpButton.style.cssText = "right:0vh;bottom:30vh;"
var placeButton = document.createElement('button'); scrollUpButton.addEventListener("touchstart", function(e){wheelEvent(canvas, -10)}, false);
placeButton.id = "hideButton" document.body.appendChild(scrollUpButton);
placeButton.textContent = "⊹"; let scrollDownButton = createTouchButton("scrollDownButton", "inGame");
placeButton.style.cssText = "right:0vh;bottom:20vh;" scrollDownButton.textContent = "⇦";
placeButton.addEventListener("touchstart", function(e){mouseEvent(2, "mousedown", canvas)}, false); scrollDownButton.style.cssText = "right:10vh;bottom:30vh;"
placeButton.addEventListener("touchend", function(e){mouseEvent(2, "mouseup", canvas)}, false); scrollDownButton.addEventListener("touchstart", function(e){wheelEvent(canvas, 10)}, false);
placeButton.addEventListener("touchmove", function(e){e.preventDefault()}, false); document.body.appendChild(scrollDownButton);
document.body.appendChild(placeButton); let throwButton = createTouchButton("throwButton", "inGame");
var breakButton = document.createElement('button'); throwButton.textContent = "Q";
breakButton.id = "hideButton" throwButton.style.cssText = "right:0vh;bottom:10vh;"
breakButton.textContent = "🗡"; throwButton.addEventListener("touchstart", function(e){keyEvent("q", "keydown")}, false);
breakButton.style.cssText = "right:10vh;bottom:20vh;" throwButton.addEventListener("touchend", function(e){keyEvent("q", "keyup")}, false);
breakButton.addEventListener("touchstart", function(e){mouseEvent(0, "mousedown", canvas)}, false); document.body.appendChild(throwButton);
breakButton.addEventListener("touchend", function(e){mouseEvent(0, "mouseup", canvas)}, false);
breakButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
document.body.appendChild(breakButton);
var selectButton = document.createElement('button');
selectButton.id = "hideButton"
selectButton.textContent = "⬚";
selectButton.style.cssText = "right:20vh;bottom:20vh;"
selectButton.addEventListener("touchstart", function(e){mouseEvent(1, "mousedown", canvas)}, false);
selectButton.addEventListener("touchend", function(e){mouseEvent(1, "mouseup", canvas)}, false);
selectButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
document.body.appendChild(selectButton);
var scrollUpButton = document.createElement('button');
scrollUpButton.id = "hideButton"
scrollUpButton.textContent = "⇨";
scrollUpButton.style.cssText = "right:0vh;bottom:30vh;"
scrollUpButton.addEventListener("touchstart", function(e){
canvas.dispatchEvent(new WheelEvent("wheel", {"wheelDeltaY": -10}))
}, false);
scrollUpButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
document.body.appendChild(scrollUpButton);
var scrollDownButton = document.createElement('button');
scrollDownButton.id = "hideButton"
scrollDownButton.textContent = "⇦";
scrollDownButton.style.cssText = "right:10vh;bottom:30vh;"
scrollDownButton.addEventListener("touchstart", function(e){
canvas.dispatchEvent(new WheelEvent("wheel", {"wheelDeltaY": 10}))
}, false);
scrollDownButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
document.body.appendChild(scrollDownButton);
var throwButton = document.createElement('button');
throwButton.id = "hideButton"
throwButton.textContent = "Q";
throwButton.style.cssText = "right:0vh;bottom:10vh;"
throwButton.addEventListener("touchstart", function(e){
window.inInventory = (window.fakelock != null)
keyEvent("q", "keydown");
}, false);
throwButton.addEventListener("touchend", function(e){keyEvent("q", "keyup")}, false);
throwButton.addEventListener("touchmove", function(e){e.preventDefault()}, false);
document.body.appendChild(throwButton);
} }