diff --git a/dist/BlueMarble.user.js b/dist/BlueMarble.user.js index e0690a3..fee6ea0 100644 --- a/dist/BlueMarble.user.js +++ b/dist/BlueMarble.user.js @@ -1,7 +1,7 @@ // ==UserScript== // @name Blue Marble // @namespace https://github.com/SwingTheVine/ -// @version 0.25.4 +// @version 0.25.6 // @description A userscript to automate and/or enhance the user experience on Wplace.live. Make sure to comply with the site's Terms of Service, and rules! This script is not affiliated with Wplace.live in any way, use at your own risk. This script is not affiliated with TamperMonkey. The author of this userscript is not responsible for any damages, issues, loss of data, or punishment that may occur as a result of using this script. This script is provided "as is" under the MPL-2.0 license. The "Blue Marble" icon is licensed under CC0 1.0 Universal (CC0 1.0) Public Domain Dedication. The image is owned by NASA. // @author SwingTheVine // @license MPL-2.0 @@ -20,4 +20,4 @@ // Wplace --> https://wplace.live // License --> https://www.mozilla.org/en-US/MPL/2.0/ -(()=>{var d=class{constructor(e,n){this.name=e,this.version=n}create(){let e=document.createElement("div");e.id="bm-overlay",e.style.top="10px",e.style.right="75px";let n=document.createElement("div");n.id="bm-contain-header";let t=document.createElement("div");t.id="bm-bar-drag",n.appendChild(t);let s=document.createElement("img");s.src="https://raw.githubusercontent.com/SwingTheVine/Wplace-BlueMarble/main/src/assets/Favicon.png",s.alt="Blue Marble Icon",n.appendChild(s);let a=document.createElement("h1");a.textContent=this.name,n.appendChild(a);let o=document.createElement("div");o.id="bm-contain-userinfo";let c=document.createElement("p");c.id="bm-user-name",c.textContent="Username:",o.appendChild(c);let u=document.createElement("p");u.id="bm-user-droplets",u.textContent="Droplets:",o.appendChild(u);let p=document.createElement("p");p.id="bm-user-nextlevel",p.textContent="Next level in...",o.appendChild(p);let m=document.createElement("div");m.id="bm-contain-automation";let h=document.createElement("label");h.textContent=" Stealth Mode";let f=document.createElement("input");f.type="checkbox",f.id="bm-input-stealth",h.prepend(f),m.appendChild(h),e.appendChild(n),e.appendChild(document.createElement("hr")),e.appendChild(o),e.appendChild(document.createElement("hr")),e.appendChild(m),document.body.appendChild(e),this.handleDrag(e,t)}updateInnerHTML(e,n,t=!1){let s=document.getElementById(e);s&&(t?s.textContent=n:s.innerHTML=n)}handleDrag(e,n){let t=!1,s,a=0;n.addEventListener("mousedown",function(o){t=!0,s=o.clientX-e.getBoundingClientRect().left,a=o.clientY-e.getBoundingClientRect().top,document.body.style.userSelect="none",n.classList.add("dragging")}),n.addEventListener("touchstart",function(o){t=!0;let c=o?.touches?.[0];c&&(s=c.clientX-e.getBoundingClientRect().left,a=c.clientY-e.getBoundingClientRect().top,document.body.style.userSelect="none",n.classList.add("dragging"))},{passive:!1}),document.addEventListener("mousemove",function(o){t&&(e.style.left=o.clientX-s+"px",e.style.top=o.clientY-a+"px",e.style.right="")}),document.addEventListener("touchmove",function(o){if(t){let c=o?.touches?.[0];if(!c)return;e.style.left=c.clientX-s+"px",e.style.top=c.clientY-a+"px",o.preventDefault()}},{passive:!1}),document.addEventListener("mouseup",function(){t=!1,document.body.style.userSelect="",n.classList.remove("dragging")}),document.addEventListener("touchend",function(){t=!1,document.body.style.userSelect="",n.classList.remove("dragging")}),document.addEventListener("touchcancel",function(){t=!1,document.body.style.userSelect="",n.classList.remove("dragging")})}};var r=class{constructor(){this.disableAll=!1}spontaneousResponseListener(e){window.addEventListener("message",n=>{let t=n.data;if(t&&t.source==="blue-marble")switch(t.endpoint){case"me":let s=Math.ceil(Math.pow(Math.floor(t.jsonData?.level)*Math.pow(30,.65),1.5384615384615383)-t.jsonData?.pixelsPainted);e.updateInnerHTML("bm-user-name",`Username: ${t.jsonData?.name}`),e.updateInnerHTML("bm-user-droplets",`Droplets: ${new Intl.NumberFormat().format(t.jsonData?.droplets)}`),e.updateInnerHTML("bm-user-nextlevel",`Next level in ${new Intl.NumberFormat().format(s)} pixel${s==1?"":"s"}`);break;case"robots":this.disableAll=t.jsonData?.userscript?.toString().toLowerCase()=="false"}})}};var g=GM_info.script.name.toString(),b=GM_info.script.version.toString();function v(i){let e=document.createElement("script");e.textContent=`(${i})();`,document.documentElement.appendChild(e),e.remove()}v(()=>{let i=window.fetch;window.fetch=async function(...e){let n=await i.apply(this,e),t=n.clone();if((t.headers.get("content-type")||"").includes("application/json")){let a=(e[0]instanceof Request?e[0]?.url:e[0])||"ignore";a=a.split("/").filter(Boolean).pop()||"ignore",console.log(`Sending JSON message about endpoint "${a}"`),t.json().then(o=>{window.postMessage({source:"blue-marble",endpoint:a,jsonData:o},"*")}).catch(o=>{console.error("BM - Failed to parse JSON:",o)})}return n}});var y=GM_getResourceText("CSS-Overlay");GM_addStyle(y);var l=document.createElement("link");l.href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap";l.rel="preload";l.as="style";l.onload="this.onload=null;this.rel='stylesheet'";document.head.appendChild(l);var C=new d(g,b);C.create();var x=new r;x.spontaneousResponseListener(C);console.log(`${g} (${b}) userscript has loaded!`);})(); +(()=>{var u=class{constructor(t,e){this.name=t,this.version=e}create(){let t="bm-output-status",e=document.createElement("div");e.id="bm-overlay",e.style.top="10px",e.style.right="75px";let n=document.createElement("div");n.id="bm-contain-header";let o=document.createElement("div");o.id="bm-bar-drag",n.appendChild(o);let a=document.createElement("img");a.src="https://raw.githubusercontent.com/SwingTheVine/Wplace-BlueMarble/main/src/assets/Favicon.png",a.alt="Blue Marble Icon",n.appendChild(a);let s=document.createElement("h1");s.textContent=this.name,n.appendChild(s);let c=document.createElement("div");c.id="bm-contain-userinfo";let m=document.createElement("p");m.id="bm-user-name",m.textContent="Username:",c.appendChild(m);let h=document.createElement("p");h.id="bm-user-droplets",h.textContent="Droplets:",c.appendChild(h);let f=document.createElement("p");f.id="bm-user-nextlevel",f.textContent="Next level in...",c.appendChild(f);let d=document.createElement("div");d.id="bm-contain-automation";let g=document.createElement("label");g.textContent="Stealth Mode";let r=document.createElement("input");r.type="checkbox",r.id="bm-input-stealth",r.checked=!0,g.prepend(r),d.appendChild(g),d.appendChild(this.createQuestionBox("bm-help-stealth","Waits for the website to make the request, instead of sending a request.",t)),e.appendChild(n),e.appendChild(document.createElement("hr")),e.appendChild(c),e.appendChild(document.createElement("hr")),e.appendChild(d),document.body.appendChild(e),this.handleDrag(e,o)}updateInnerHTML(t,e,n=!1){let o=document.getElementById(t);o&&(n?o.textContent=e:o.innerHTML=e)}createQuestionBox(t,e,n){let o=document.createElement("button");return o.id=t,o.className="bm-help",o.textContent="?",o.title=e,o.onclick=()=>{this.updateInnerHTML(n,e)},o}handleDrag(t,e){let n=!1,o,a=0;e.addEventListener("mousedown",function(s){n=!0,o=s.clientX-t.getBoundingClientRect().left,a=s.clientY-t.getBoundingClientRect().top,document.body.style.userSelect="none",e.classList.add("dragging")}),e.addEventListener("touchstart",function(s){n=!0;let c=s?.touches?.[0];c&&(o=c.clientX-t.getBoundingClientRect().left,a=c.clientY-t.getBoundingClientRect().top,document.body.style.userSelect="none",e.classList.add("dragging"))},{passive:!1}),document.addEventListener("mousemove",function(s){n&&(t.style.left=s.clientX-o+"px",t.style.top=s.clientY-a+"px",t.style.right="")}),document.addEventListener("touchmove",function(s){if(n){let c=s?.touches?.[0];if(!c)return;t.style.left=c.clientX-o+"px",t.style.top=c.clientY-a+"px",s.preventDefault()}},{passive:!1}),document.addEventListener("mouseup",function(){n=!1,document.body.style.userSelect="",e.classList.remove("dragging")}),document.addEventListener("touchend",function(){n=!1,document.body.style.userSelect="",e.classList.remove("dragging")}),document.addEventListener("touchcancel",function(){n=!1,document.body.style.userSelect="",e.classList.remove("dragging")})}};var p=class{constructor(){this.disableAll=!1}spontaneousResponseListener(t){window.addEventListener("message",e=>{let n=e.data;if(n&&n.source==="blue-marble")switch(n.endpoint){case"me":let o=Math.ceil(Math.pow(Math.floor(n.jsonData?.level)*Math.pow(30,.65),1.5384615384615383)-n.jsonData?.pixelsPainted);t.updateInnerHTML("bm-user-name",`Username: ${n.jsonData?.name}`),t.updateInnerHTML("bm-user-droplets",`Droplets: ${new Intl.NumberFormat().format(n.jsonData?.droplets)}`),t.updateInnerHTML("bm-user-nextlevel",`Next level in ${new Intl.NumberFormat().format(o)} pixel${o==1?"":"s"}`);break;case"robots":this.disableAll=n.jsonData?.userscript?.toString().toLowerCase()=="false"}})}};var b=GM_info.script.name.toString(),x=GM_info.script.version.toString();function v(i){let t=document.createElement("script");t.textContent=`(${i})();`,document.documentElement.appendChild(t),t.remove()}v(()=>{let i=window.fetch;window.fetch=async function(...t){let e=await i.apply(this,t),n=e.clone();if((n.headers.get("content-type")||"").includes("application/json")){let a=(t[0]instanceof Request?t[0]?.url:t[0])||"ignore";a=a.split("/").filter(Boolean).pop()||"ignore",console.log(`Sending JSON message about endpoint "${a}"`),n.json().then(s=>{window.postMessage({source:"blue-marble",endpoint:a,jsonData:s},"*")}).catch(s=>{console.error("BM - Failed to parse JSON:",s)})}return e}});var y=GM_getResourceText("CSS-Overlay");GM_addStyle(y);var l=document.createElement("link");l.href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap";l.rel="preload";l.as="style";l.onload="this.onload=null;this.rel='stylesheet'";document.head.appendChild(l);var C=new u(b,x);C.create();var E=new p;E.spontaneousResponseListener(C);console.log(`${b} (${x}) userscript has loaded!`);})(); diff --git a/docs/README.md b/docs/README.md index 8614e54..0afd6be 100644 --- a/docs/README.md +++ b/docs/README.md @@ -23,7 +23,7 @@ Software License: MPL-2.0 Contact Me WakaTime -Total Patches +Total Patches Total Lines of Code Total Comments Build diff --git a/package-lock.json b/package-lock.json index 917185a..1911100 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,7 +7,7 @@ "devDependencies": { "esbuild": "^0.25.0" }, - "version": "0.25.4" + "version": "0.25.6" }, "node_modules/@esbuild/aix-ppc64": { "version": "0.25.8", @@ -467,5 +467,5 @@ } } }, - "version": "0.25.4" + "version": "0.25.6" } diff --git a/package.json b/package.json index 0903168..1953353 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "wplace-bluemarble", - "version": "0.25.4", + "version": "0.25.6", "type": "module", "scripts": { "build": "node build/build.js", diff --git a/src/BlueMarble.meta.js b/src/BlueMarble.meta.js index aad6d83..e589ace 100644 --- a/src/BlueMarble.meta.js +++ b/src/BlueMarble.meta.js @@ -1,7 +1,7 @@ // ==UserScript== // @name Blue Marble // @namespace https://github.com/SwingTheVine/ -// @version 0.25.4 +// @version 0.25.6 // @description A userscript to automate and/or enhance the user experience on Wplace.live. Make sure to comply with the site's Terms of Service, and rules! This script is not affiliated with Wplace.live in any way, use at your own risk. This script is not affiliated with TamperMonkey. The author of this userscript is not responsible for any damages, issues, loss of data, or punishment that may occur as a result of using this script. This script is provided "as is" under the MPL-2.0 license. The "Blue Marble" icon is licensed under CC0 1.0 Universal (CC0 1.0) Public Domain Dedication. The image is owned by NASA. // @author SwingTheVine // @license MPL-2.0 diff --git a/src/overlay.css b/src/overlay.css index 43ac9fa..2f2ace2 100644 --- a/src/overlay.css +++ b/src/overlay.css @@ -59,4 +59,18 @@ div#bm-overlay { #bm-contain-automation input[type="checkbox"] { vertical-align: middle; margin-right: 0.5ch; +} + +#bm-contain-automation label { + margin-right: 0.5ch; +} + +.bm-help { + border: white 1px solid; + border-radius: 1em; + height: 1.25em; + width: 1.25em; + margin-top: 2px; + text-align: center; + line-height: 1.25em; } \ No newline at end of file diff --git a/src/overlay.js b/src/overlay.js index 9e2d0b1..49aeb69 100644 --- a/src/overlay.js +++ b/src/overlay.js @@ -20,6 +20,8 @@ export class Overlay { */ create() { + const outputStatusId = 'bm-output-status'; // ID for status element + const overlay = document.createElement('div'); // Creates a new
element for the overlay overlay.id = 'bm-overlay'; overlay.style.top = '10px'; // Position from top of viewport @@ -68,9 +70,17 @@ export class Overlay { const inputStealthMode = document.createElement('input'); // Stealth Mode checkbox inputStealthMode.type = 'checkbox'; inputStealthMode.id = 'bm-input-stealth'; + inputStealthMode.checked = true; // Checkbox checked by default labelStealthMode.prepend(inputStealthMode); // Adds the input to the label containerAutomation.appendChild(labelStealthMode); // Adds the label & checkbox to the automation container + // Adds the help icon for stealth mode + containerAutomation.appendChild(this.createQuestionBox( + 'bm-help-stealth', + 'Waits for the website to make the request, instead of sending a request.', + outputStatusId + )); + // Construction of the overlay element overlay.appendChild(containerOverlayHeader); // Adds the overlay header container to the overlay overlay.appendChild(document.createElement('hr')); // Adds a horizontal line to the overlay @@ -101,6 +111,27 @@ export class Overlay { } } + /** Creates a help icon. + * When clicked, it will populate the text content of the outputId element with the tooltip. + * On hover, it will generate a tooltip. + * @param {string} id - ID of the help icon + * @param {string} tooltip - Flavor message + * @param {string} outputId - ID of the element to populate the text content with + * @returns {HTMLButtonElement} HTML Button Element + * @since 0.25.5 + */ + createQuestionBox(id, tooltip, outputId) { + const questionBox = document.createElement('button'); + questionBox.id = id; + questionBox.className = 'bm-help'; + questionBox.textContent = '?'; + questionBox.title = tooltip; // Tooltip on hover + questionBox.onclick = () => { + this.updateInnerHTML(outputId, tooltip); // Update output element text with tooltip on click + } + return questionBox; + } + /** Handles dragging of the overlay. * @param {HTMLElement} overlay - The overlay element to be moved. * @param {HTMLElement} barDrag - The element that acts as the drag handle.