Compare commits

...

3 Commits

Author SHA1 Message Date
Holly Stubbs e3fb938117
logging 2024-05-07 22:17:30 +01:00
Holly Stubbs bc7fb72800
prevent group names from overflowing 2024-05-07 21:52:46 +01:00
Holly Stubbs 1f920c018c
styling fixes mainly for 001b hub 2024-05-07 21:46:52 +01:00
1 changed files with 50 additions and 14 deletions

View File

@ -32,8 +32,11 @@ if (!window.TE_ACTIVE) {
setInterval(nukeCC, 1000);
}
const windowLocation = window.location.href;
window.multiprobe_debug = false;
console.log("[MP] MultiProbe init");
(function() {
'use strict';
@ -60,6 +63,7 @@ window.multiprobe_debug = false;
};
let cursorImageI = window.getComputedStyle(document.body).cursor;
console.log("[MP] Injecting custom styles...");
const styles = document.createElement("style");
styles.innerHTML = `
html {
@ -75,6 +79,8 @@ html {
z-index: 999999999;
pointer-events: none;
overflow:hidden;
text-shadow: none!important;
font-family: Arial,sans-serif;
}
#otherCursors img {
@ -118,6 +124,9 @@ html {
background-color: black;
color: white;
z-index:9999998;
text-shadow: none!important;
font-family: Arial,sans-serif;
font-size: unset !important;
}
.groupui-popper {
@ -141,6 +150,7 @@ html {
height: 2rem;
line-height: 2rem;
background-color: rgba(255,255,255,0.1);
overflow:hidden;
}
.groupui-scrollbox {
@ -150,6 +160,8 @@ html {
width: 100%;
height: calc(100% - 2rem);
overflow-y: scroll;
font-family: Arial,sans-serif;
font-size: unset !important;
}
.groupui-user {
@ -195,6 +207,8 @@ kbd {
line-height: 1;
padding: 2px 4px;
white-space: nowrap;
font-family: Arial,sans-serif;
font-size: unset !important;
}
.mplink, .mplink:visited {
@ -213,10 +227,13 @@ kbd {
localStorage["mpconnectonload"] = true;
}
const bodyMargin = parseInt(window.getComputedStyle(document.body).marginTop.replace("px", ""));
let marginComputedStyle = window.getComputedStyle(document.body);
const bodyMarginTop = parseInt(marginComputedStyle.marginTop.replace("px", ""));
const bodyMarginLeft = parseInt(marginComputedStyle.marginLeft.replace("px", ""));
const bodyMarginRight = parseInt(marginComputedStyle.marginRight.replace("px", ""));
const otherCursors = document.createElement("div");
otherCursors.style.top = `-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMargin)}px`;
otherCursors.style.top = `-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMarginTop)}px`;
otherCursors.id = "otherCursors";
document.body.appendChild(otherCursors);
@ -267,22 +284,25 @@ kbd {
setInterval(() => {
if (document.body.scrollHeight > window.innerHeight) {
otherCursors.style = `width:${clientWidth = document.body.getBoundingClientRect().width}px;height:${document.body.scrollHeight}px;top:-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMargin)}px`;
otherCursors.style = `width:${clientWidth = (document.body.getBoundingClientRect().width + bodyMarginRight + bodyMarginLeft)}px;height:${document.body.scrollHeight}px;top:-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMarginTop)}px;cursor: ${cursorImageI};`;
} else {
otherCursors.style = `width:${clientWidth = document.body.getBoundingClientRect().width}px;height:${window.innerHeight}px;top:-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMargin)}px`;
otherCursors.style = `width:${clientWidth = (document.body.getBoundingClientRect().width + bodyMarginRight + bodyMarginLeft)}px;height:${window.innerHeight}px;top:-${((window.scrollY + document.body.getBoundingClientRect().top) - bodyMarginTop)}px;cursor: ${cursorImageI};`;
}
}, 1000);
let needsToUpdate = false;
const versionFetchAddress = window.location.href.replace("127.0.0.1", "localhost").includes("//localhost:") ? "http://localhost:38194/api/version" : "https://multiprobe.eusv.net/api/version";
console.log("[MP] Checking for new versions...");
const versionFetchAddress = windowLocation.replace("127.0.0.1", "localhost").includes("//localhost:") ? "http://localhost:38194/api/version" : "https://multiprobe.eusv.net/api/version";
fetch(versionFetchAddress, { method: "post" }).then(response => {
console.log("hi");
response.text().then(versionNumberRaw => {
const versionNumber = parseInt(versionNumberRaw);
if (versionNumber > USERSCRIPT_VERSION) {
// We're out of date >:(
needsToUpdate = true;
createUpdateDialog(`${versionNumberRaw.slice(0, versionNumberRaw.length - 1)}.${versionNumberRaw.slice(-1)}`);
console.log("[MP] We're out of date :(");
} else {
console.log("[MP] We're up to date!");
}
});
});
@ -427,6 +447,13 @@ kbd {
}
}
window.onkeydown = (e) => {
if (!windowContainer && e.key === "F1") {
localStorage["mpshowfirsttime"] = "true";
createFirstTimeDialog();
}
};
function lerp(value1, value2, amount) {
return value1 + (value2 - value1) * amount;
}
@ -469,15 +496,17 @@ kbd {
function doConnect(apiKey) {
const Buffer = getBufferClass();
ws = new WebSocket(window.location.href.includes("//localhost:") ? "ws://localhost:38195" : "wss://ws.eusv.net/t00mp");
console.log("[MP] Connecting to realtime server...");
ws = new WebSocket(windowLocation.includes("//localhost:") ? "ws://localhost:38195" : "wss://ws.eusv.net/t00mp");
let keepAliveInterval;
ws.onopen = () => {
console.log("[MP] Connected! Authenticating...");
otherCursors.innerHTML = "";
selfCursor = new RemoteClient(localStorage["t00mp_username"]);
selfCursor.probeImage.style.visibility = "hidden";
selfCursor.element.style.visibility = localStorage["t00mp_cursorStyle"] ?? "hidden";
selfCursor.hasBeenMoved = true;
const currentPage = window.location.href.split("/").slice(3).join("/");
const currentPage = windowLocation.split("/").slice(3).join("/");
ws.send(createWriter(Endian.LE, 4 + apiKey.length + currentPage.length)
.writeByte(MessageType.ClientDetails)
.writeShortString(apiKey)
@ -512,6 +541,7 @@ kbd {
if (!needsToUpdate) {
createFirstTimeDialog();
}
console.log("[MP] Authenticated!");
break;
}
case MessageType.ClientJoined:
@ -598,7 +628,7 @@ kbd {
function createOnlineDialog() {
const bg = document.createElement("div");
windowContainer = bg;
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5)";
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5);text-shadow: none!important;font-family: Arial,sans-serif;font-size: unset !important;";
const dialog = document.createElement("div");
dialog.style = "position:absolute;top:50%;left:50%;min-width:15rem;background-color:#343434;padding:1rem;transform:translate(-50%,-50%);text-align:center;color:white";
bg.appendChild(dialog);
@ -659,7 +689,7 @@ kbd {
function createUpdateDialog(versionNumber) {
const bg = document.createElement("div");
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5)";
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5);text-shadow: none!important;font-family: Arial,sans-serif;font-size: unset !important;";
const dialog = document.createElement("div");
dialog.style = "position:absolute;top:50%;left:50%;min-width:15rem;background-color:#343434;padding:1rem;transform:translate(-50%,-50%);text-align:center;color:white";
bg.appendChild(dialog);
@ -694,7 +724,7 @@ kbd {
const bg = document.createElement("div");
windowContainer = bg;
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5)";
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5);text-shadow: none!important;font-family: Arial,sans-serif;font-size: unset !important;";
const dialog = document.createElement("div");
dialog.style = "position:absolute;top:50%;left:50%;min-width:15rem;background-color:#343434;padding:1rem;transform:translate(-50%,-50%);text-align:center;color:white";
bg.appendChild(dialog);
@ -719,6 +749,10 @@ kbd {
groupLI.innerHTML = "You can show/hide the party sidebar if you are in one by pressing <kbd>G</kbd>";
actionList.appendChild(groupLI);
const helpTip = document.createElement("li");
helpTip.innerHTML = "If you press <kbd>F1</kbd> you can open this help again.";
actionList.appendChild(helpTip);
const buttons = document.createElement("div");
buttons.style.marginTop = "1rem";
@ -739,7 +773,7 @@ kbd {
function createLoginDialog() {
const bg = document.createElement("div");
windowContainer = bg;
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5)";
bg.style = "z-index:1000000000;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:rgba(0,0,0,0.5);text-shadow: none!important;font-family: Arial,sans-serif;font-size: unset !important;";
const dialog = document.createElement("div");
dialog.style = "position:absolute;top:50%;left:50%;width:15rem;background-color:#343434;padding-bottom:1rem;transform:translate(-50%,-50%);text-align:center;color:white";
bg.appendChild(dialog);
@ -791,7 +825,7 @@ kbd {
doNotButton.disabled = true;
title.innerText = "Authenticating...";
fetch(window.location.href.replace("127.0.0.1", "localhost").includes("//localhost:") ? "http://localhost:38194/api/login" : "https://multiprobe.eusv.net/api/login", {
fetch(windowLocation.replace("127.0.0.1", "localhost").includes("//localhost:") ? "http://localhost:38194/api/login" : "https://multiprobe.eusv.net/api/login", {
method: "POST",
body: `username=${encodeURIComponent(username.value)}&password=${encodeURIComponent(password.value)}`,
headers: {
@ -825,7 +859,7 @@ kbd {
}
const openMenuButton = document.createElement("button");
openMenuButton.style = "opacity:0.25;position:fixed;top:0px;right:0px;z-index:9999999;margin:4px;background-color:black;color:white;border:1px solid white";
openMenuButton.style = "opacity:0.25;position:fixed;top:0px;right:0px;z-index:9999999;margin:4px;background-color:black;color:white;border:1px solid white;text-shadow: none!important;font-family: Arial,sans-serif;font-size: unset !important;";
openMenuButton.innerText = "MultiProbe Menu";
openMenuButton.onclick = () => {
if (ws || localStorage["mpapikey"]) {
@ -839,4 +873,6 @@ kbd {
if (localStorage["mpapikey"] && localStorage["mpapikey"] !== "" && localStorage["mpconnectonload"] === "true") {
doConnect(localStorage["mpapikey"]);
}
console.log("[MP] Init complete.");
})();