Preview Images of the Custom-Improve Branch of the This Fork:

Template	Overlay

Pixel Info	Map Export (From the Share Dialog)

More Information Regarding this Fork Here.

One-click install: Click this link to Install Blue Marble directly: Original Ver. with Userscripts Support / Custom Mod Ver.

Bookmarklet version (and Custom Mod Ver.) is also available. To use it, copy the content and paste it in the URL field when creating a bookmark.

Blue Marble
Regarding this fork
Quick Guide
Overview
Installation Instructions
Script Settings
Template Settings
How Versioning Works
Licenses
FAQ
Is Blue Marble malware?
How can Blue Marble place pixels for me?
How do I hide the overlay?
Why do game notifications appear on top of the overlay?

Blue Marble

Regarding this fork

For users who do not want to purchase the TamperMonkey App from the App Store, which is a paid app unlike other browser platforms, the Userscripts app seems to be a free alternative as a userscript manager.

However, the supported GM API by Userscripts is much smaller than what TamperMonkey supports, especially for old synchronous APIs that Blue Marble uses that have been dropped by Greasemonkey in Greasemonkey 4.0+ that has to be replaced by alternatives:

• GM_addStyle → GM.addStyle
• GM_getValue → GM.getValue
• GM_getResourceText → Replaced (GM.getResourceText does not exist)

Check the Custom-Improve Branch for extra implemented features and improvements that are not yet in the original repository:

• Show Charges Count outside the Button that may be covered by Cloudflare Turnstile. (v0.85.3)
• Show Remaining Time to Full Charges. (v0.85.9)
• Display the palette hints as crosshair instead of a dot for better visibility. (v0.85.2)
• (Due to Mobile Safari's Canvas size limitation (4096x4096), the maximum zooming can only be 4 instead of 5)
• Remember the loaded tiles to prevent lag / redundant computations (whenever the Last-Modified header is unchanged) (v0.85.4)
• Fixed the non-persistent palette toggle bug. (v0.85.1)
• Fixed the bug that the count of total blocks to count being 1 or 2 after refresh. (v0.85.2)
• Fixed the bug that the "Enable All" and "Disable All" buttons do not persist. (v0.85.13)
• Fixed the color space conversion issue on Firefox. (v0.85.16)
• Show the filled count of each color. (v0.85.10)
• Directly teleport to one of the unfilled pixel when clicking on an unfinished color block in the filter. (v0.85.10)
• Allow teleporting to the given tile coordinates via the plane button next to the input boxes. (v0.85.9)
• Show also geographical coordinates besides tile coordinates. (v0.85.5)
• Optimize the for-loop for faster response. (v0.85.7)
• Allow multiple templates to be used at the same time. (v0.85.11)
• A button to teleport to the top-left corner of the selected template. (v0.85.12)
• Option to hide locked colors (colors that are not unlocked) from the color list. (v0.85.17)
• Provide the bookmarklet version. (v0.85.22)
• Allow completed colors to be hidden from the color list. (v0.85.23)
• Different options to change the display order of the colors, including (un)painted count, hue, and luminance. (v0.85.23)
• Progress bar behind each color in the list that shows the relative progress (v0.85.24)
• Allow different coordinate formats (`a, b, c, d`, `a b c d`, and `Tl X: a, Tl Y: b, Px X: c, Px Y: d`) to be pasted to the first coordinate textbox. (v0.85.28)
• Allow downloading artworks (in exact size) from the map via the Share Button by two coordinates of opposite corners (One from the textboxes, another from the pixel you pick from the map before clicking the "Share" button) (v0.85.28)
• Memory-saving Mode: Create ImageBitmap only when the templates are processed, and release them immediately afterwards to prevent using up all available memory. (v0.85.33)
• Allow setting the anchor for the coordinates specified for the template to be placed. (By default the coordinates are the top-left corner of the template) (v0.85.34)
• Support displaying the locations of Event Items. (Need to provide a JSON data provider (e.g. Wplace Archive pumpkin.json) for this feature to work) (v0.85.35)
• Allow only show the pixels of the currently selected color in Wplace automatically. (v0.85.37)
• Try to refresh the tiles when selected colors / templates changes as soon as possible. (v0.85.38)
• Try to refresh the tiles after pixel submission as soon as possible. (v0.85.39)
• Switching between Wplace's builtin themes. (v0.85.40)

Quick Guide

Press the arrows to reveal the option you want.

I want to download Blue Marble. ^{(Click to Expand)}

Click here to view the installation instructions.

I want to ask questions about Blue Marble. ^{(Click to Expand)}

Click here for the Discord server invite to the Blue Marble support server.
Click here for the GitHub help & question page for Blue Marble.

I want to report a bug. ^{(Click to Expand)}

Click here to report a bug, then choose the "Bug Report" option.

I want to suggest a feature. ^{(Click to Expand)}

Click here to suggest a feature, then choose the Feature Request" option.

I want to contribute. ^{(Click to Expand)}

Click here to read the contributing guidelines.

I want to report a vulnerability. ^{(Click to Expand)}

Click here to submit a vulnerability report.

I want to visit the website. ^{(Click to Expand)}

Click here to visit the official Blue Marble website.

Overview

Welcome to Blue Marble! Blue Marble is a userscript for the website wplace.live. The purpose of Blue Marble is to allow you to take an image, and layer it onto the canvas! That way, you can easily trace the image of your art, without having to look back and forth between multiple tabs/monitors. In addition, Blue Marble supports some neat extra features such as:

• Displaying the number of pixels you need to level up
• Displaying a simple coordinate system (tile coordinats & pixel coordinates)
• Allowing you to move the color palette to the top of the screen when placing pixels
• Allowing you to use the eyedropper on the template image, provided the colors are correct
• ...and more!

If you like this userscript, please ⭐ the repository! For more information and updates, visit the Blue Marble website. If you wish to contribute to Blue Marble, check out the CONTRIBUTING.md file in docs/.

Installation Instructions

Blue Marble has been verified to work on mobile devices. Blue Marble was designed on Chrome, but Blue Marble might work on "unsupported" browsers not listed above. Some versions/forks of Firefox work. Some versions/forks of Firefox do not work.
Installation instructions for Blue Marble are below. Click the arrows to expand the instructions you want to see. Blue text is a link.

Install Chrome ^{(Click to expand)}

1. Install the TamperMonkey extension for Chrome.
   
2. Right-click the extension.
   
3. Left-click "Manage Extension."
4. Enable "Developer Mode."
   
5. Enable "Allow user scripts."
6. One-click install: Click this link to Install Blue Marble directly: Install Blue Marble
   TamperMonkey will automatically detect the userscript and prompt you to Install it.
7. Refresh the wplace.live webpage.

Install on Microsoft Edge ^{(Click to expand)}

1. Install the TamperMonkey plugin for Microsoft Edge.
   
2. Right-click the extension.
   
3. Left-click "Manage Extension."
4. Enable "Developer Mode."
   
5. Download the BlueMarble.user.js file in the "Assets" of the latest release.
6. Open the TamperMonkey Dashboard.
   
7. Drag the BlueMarble.user.js file inside the dashboard of TamperMonkey.
   
8. Click the "Install" button to Install Blue Marble.
   
9. Enable Blue Marble inside the TamperMonkey dashboard.
   
10. Refresh the wplace.live webpage.

Install on Firefox ^{(Click to expand)}

1. Install the TamperMonkey plugin for Firefox.
   
2. One-click install: Click this link to Install Blue Marble directly: Install Blue Marble
   TamperMonkey will automatically detect the userscript and prompt you to install it.
3. Refresh the wplace.live webpage.

Install on Safari using Userscripts instead of TamperMonkey

1. Install the Userscripts App from App Store.
   Make sure that appropriate permissions have been given to the App and Safari is configured to enable the extension.


2. Download the Blue Marble script and save to the Save Location as specified by the App: Download Blue Marble
   Userscripts will automatically detect the userscript.
3. Refresh the wplace.live webpage.
4. Problems regarding the Installation and Usages of Userscripts should refer to: Userscripts's Repository Instead.

Template Instructions

Blue Marble will display your template as the same size. If your image is 500 pixels tall and 300 pixels wide, the template will be 500 pixels tall and 300 pixels wide. Here is the instructions to display a template image on the canvas:

1. Find the pixel of the top left corner. Fill in Tl X, Tl Y, Px X, and Px Y with the coordinates. You can use the "Pin" icon to auto-fill the coordinates after clicking the pixel.
   
2. Upload a PNG or WEBP image.
3. Click the "Create" button.
4. If your template still does not show, try clicking the "Enable" button.

Script Settings

There are many settings available for the Blue Marble userscript! Through these settings, you can control how the script behaves.

Template Settings

Transparent Pixels

Templates for Blue Marble work slightly different from normal. Since there is a "Transparent" color, and transparent pixels in templates are typically ignored, your template should have a custom color to signify "Transparent" colored pixels.

• If you want a specific pixel to be any color, it should be transparent in your template.
• If you want a specific pixel to be the "Transparent" color on the Wplace palette, it should have the #deface hex color.

Coordinates

Tile Coordinates

The coordinate system for wplace.live is unique. Instead of all pixels having a global coordinate number (x, y), the coordinate number is relative to the tile. This means you need to know the tile number and the coordinate number to do anything. In Blue Marble, the tile coordinates and the pixel coordinates are displayed when you click on a pixel. These are the coordinates you should use for aligning a template.

Template Coordinates

The template is aligned from the top left corner of the template. You can auto-fill this position using the "pin" (also called "waypoint") icon next to the coordinate input boxes.

How Versioning Works

The versioning system for this userscript follows the Semantic Versioning rules. As such, it is formatted in an X.Y.Z format where:

• X is the major version. This is incremented when a non-backward compatible update is pushed. This is for new features that break previous versions of the userscript. Additionally, if wplace.live breaks the userscript, this will be incremented.
• Y is the minor version. This is incremented whenever I push to GitHub. This is for stable bug-fixes and new (non-breaking) features.
• Z is the patch version. This is incremented whenever I launch a development version of the userscript to test a patch. This is for unstable bug-fixes/features.

Licenses

(Below, all mentions of the "userscript" refer to the "Blue Marble" userscript made by SwingTheVine)
Most of this userscript is licensed under the Mozilla Public License Version 2.0 (MPL-2.0). All software, code, and libraries in this repository are licensed under the MPL-2.0 license. However, the "Blue Marble" image in this userscript is owned by NASA and is licensed under the Creative Commons 0 1.0 Universal (CC0 1.0) license.

FAQ

Is Blue Marble malware?

A: Blue Marble does not contain malicious code. The Blue Marble code can be found in the src/ folder. If you worry about Blue Marble being malware, you can read the code, then bundle it yourself using the tools in build/.

How can Blue Marble place pixels for me?

A: Unfortunately, Blue Marble will not support the automatic placement of pixels without user interaction because it is not allowed by Wplace.

How do I hide the overlay?

A: Turn the userscript off and refresh the page.

How do I tell colors apart?

A: Find the color in the color filter list. Click the checkbox to turn the color on or off. If you want to work on only one color at a time (recommended), then click "Disable All" in the color filter. Finally, enable the checkbox next to the color you want to place. This way, only one color on your template will appear at a time.

How do get the color of a pixel?

A: Use the eyedropper in the palette menu of wplace. If your template colors match the wplace palette, you can select the template pixel dot to get the template's color for that pixel.

Why do game notifications appear on top of the overlay?

A: Game notifications only appear when they need immediate attention. Therefore, they have priority over the overlay (which typically needs no attention).