mirror of
https://github.com/SwingTheVine/Wplace-BlueMarble.git
synced 2026-05-08 01:09:41 +00:00
updated color palette and counts for transparent pixels
This commit is contained in:
parent
c53bfed433
commit
7a705c4f1c
3 changed files with 95 additions and 275 deletions
|
|
@ -52,12 +52,22 @@ export default class Template {
|
|||
.filter(c => (c?.name || '').toLowerCase() !== 'transparent' && Array.isArray(c?.rgb))
|
||||
.map(c => `${c.rgb[0]},${c.rgb[1]},${c.rgb[2]}`)
|
||||
);
|
||||
// Ensure template #deface marker is treated as allowed (maps to Transparent color)
|
||||
const defaceKey = '222,250,206';
|
||||
this.allowedColorsSet.add(defaceKey);
|
||||
// Map rgb-> {id, premium}
|
||||
this.rgbToMeta = new Map(
|
||||
allowed
|
||||
.filter(c => Array.isArray(c?.rgb))
|
||||
.map(c => [ `${c.rgb[0]},${c.rgb[1]},${c.rgb[2]}`, { id: c.id, premium: !!c.premium, name: c.name } ])
|
||||
);
|
||||
// Map #deface to Transparent meta for UI naming and ID continuity
|
||||
try {
|
||||
const transparent = allowed.find(c => (c?.name || '').toLowerCase() === 'transparent');
|
||||
if (transparent && Array.isArray(transparent.rgb)) {
|
||||
this.rgbToMeta.set(defaceKey, { id: transparent.id, premium: !!transparent.premium, name: transparent.name });
|
||||
}
|
||||
} catch (_) {}
|
||||
}
|
||||
|
||||
/** Creates chunks of the template for each tile.
|
||||
|
|
@ -102,12 +112,9 @@ export default class Template {
|
|||
const b = inspectData[idx + 2];
|
||||
const a = inspectData[idx + 3];
|
||||
if (a === 0) { continue; } // Ignored transparent pixel
|
||||
if (r === 222 && g === 250 && b === 206) { // #deface
|
||||
deface++;
|
||||
continue; // Do not include in required count so progress reflects paintable pixels
|
||||
}
|
||||
const key = `${r},${g},${b}`;
|
||||
if (!this.allowedColorsSet.has(key)) { continue; } // Skip non-palette colors
|
||||
if (r === 222 && g === 250 && b === 206) { deface++; }
|
||||
if (!this.allowedColorsSet.has(key)) { continue; } // Skip non-palette colors (but #deface added to allowed)
|
||||
required++;
|
||||
paletteMap.set(key, (paletteMap.get(key) || 0) + 1);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -339,10 +339,24 @@ export default class TemplateManager {
|
|||
const tg = tData[tIdx + 1];
|
||||
const tb = tData[tIdx + 2];
|
||||
const ta = tData[tIdx + 3];
|
||||
// Ignore transparent and semi-transparent (deface checkerboard uses alpha 32)
|
||||
if (ta < 64) { continue; }
|
||||
// Ignore #deface explicitly if it sneaks through with higher alpha
|
||||
if (tr === 222 && tg === 250 && tb === 206) { continue; }
|
||||
// Handle template transparent pixel (alpha < 64): wrong if board has any site palette color here
|
||||
if (ta < 64) {
|
||||
try {
|
||||
const activeTemplate = this.templatesArray?.[0];
|
||||
const tileIdx = (gy * drawSize + gx) * 4;
|
||||
const pr = tilePixels[tileIdx];
|
||||
const pg = tilePixels[tileIdx + 1];
|
||||
const pb = tilePixels[tileIdx + 2];
|
||||
const pa = tilePixels[tileIdx + 3];
|
||||
const key = `${pr},${pg},${pb}`;
|
||||
const isSiteColor = activeTemplate?.allowedColorsSet ? activeTemplate.allowedColorsSet.has(key) : false;
|
||||
if (pa >= 64 && isSiteColor) {
|
||||
wrongCount++;
|
||||
}
|
||||
} catch (_) {}
|
||||
continue;
|
||||
}
|
||||
// Treat #deface as Transparent palette color (required and paintable)
|
||||
// Ignore non-palette colors (match against allowed set when available)
|
||||
try {
|
||||
const activeTemplate = this.templatesArray?.[0];
|
||||
|
|
|
|||
331
src/utils.js
331
src/utils.js
|
|
@ -135,271 +135,70 @@ export function base64ToUint8(base64) {
|
|||
* console.log(utils[5]?.rgb); // [255, 255, 255]
|
||||
*/
|
||||
export const colorpalette = [
|
||||
{
|
||||
"name": "Transparent",
|
||||
"rgb": [0, 0, 0]
|
||||
},
|
||||
{
|
||||
"name": "Black",
|
||||
"rgb": [0, 0, 0]
|
||||
},
|
||||
{
|
||||
"name": "Dark Gray",
|
||||
"rgb": [60, 60, 60]
|
||||
},
|
||||
{
|
||||
"name": "Gray",
|
||||
"rgb": [120, 120, 120]
|
||||
},
|
||||
{
|
||||
"name": "Light Gray",
|
||||
"rgb": [210, 210, 210]
|
||||
},
|
||||
{
|
||||
"name": "White",
|
||||
"rgb": [255, 255, 255]
|
||||
},
|
||||
{
|
||||
"name": "Deep Red",
|
||||
"rgb": [96, 0, 24]
|
||||
},
|
||||
{
|
||||
"name": "Red",
|
||||
"rgb": [237, 28, 36]
|
||||
},
|
||||
{
|
||||
"name": "Orange",
|
||||
"rgb": [255, 127, 39]
|
||||
},
|
||||
{
|
||||
"name": "Gold",
|
||||
"rgb": [246, 170, 9]
|
||||
},
|
||||
{
|
||||
"name": "Yellow",
|
||||
"rgb": [249, 221, 59]
|
||||
},
|
||||
{
|
||||
"name": "Light Yellow",
|
||||
"rgb": [255, 250, 188]
|
||||
},
|
||||
{
|
||||
"name": "Dark Green",
|
||||
"rgb": [14, 185, 104]
|
||||
},
|
||||
{
|
||||
"name": "Green",
|
||||
"rgb": [19, 230, 123]
|
||||
},
|
||||
{
|
||||
"name": "Light Green",
|
||||
"rgb": [135, 255, 94]
|
||||
},
|
||||
{
|
||||
"name": "Dark Teal",
|
||||
"rgb": [12, 129, 110]
|
||||
},
|
||||
{
|
||||
"name": "Teal",
|
||||
"rgb": [16, 174, 166]
|
||||
},
|
||||
{
|
||||
"name": "Light Teal",
|
||||
"rgb": [19, 225, 190]
|
||||
},
|
||||
{
|
||||
"name": "Dark Blue",
|
||||
"rgb": [40, 80, 158]
|
||||
},
|
||||
{
|
||||
"name": "Blue",
|
||||
"rgb": [64, 147, 228]
|
||||
},
|
||||
{
|
||||
"name": "Cyan",
|
||||
"rgb": [96, 247, 242]
|
||||
},
|
||||
{
|
||||
"name": "Indigo",
|
||||
"rgb": [107, 80, 246]
|
||||
},
|
||||
{
|
||||
"name": "Light Indigo",
|
||||
"rgb": [153, 177, 251]
|
||||
},
|
||||
{
|
||||
"name": "Dark Purple",
|
||||
"rgb": [120, 12, 153]
|
||||
},
|
||||
{
|
||||
"name": "Purple",
|
||||
"rgb": [170, 56, 185]
|
||||
},
|
||||
{
|
||||
"name": "Light Purple",
|
||||
"rgb": [224, 159, 249]
|
||||
},
|
||||
{
|
||||
"name": "Dark Pink",
|
||||
"rgb": [203, 0, 122]
|
||||
},
|
||||
{
|
||||
"name": "Pink",
|
||||
"rgb": [236, 31, 128]
|
||||
},
|
||||
{
|
||||
"name": "Light Pink",
|
||||
"rgb": [243, 141, 169]
|
||||
},
|
||||
{
|
||||
"name": "Dark Brown",
|
||||
"rgb": [104, 70, 52]
|
||||
},
|
||||
{
|
||||
"name": "Brown",
|
||||
"rgb": [149, 104, 42]
|
||||
},
|
||||
{
|
||||
"name": "Beige",
|
||||
"rgb": [248, 178, 119]
|
||||
},
|
||||
{
|
||||
"name": "Medium Gray",
|
||||
"rgb": [170, 170, 170]
|
||||
},
|
||||
{
|
||||
"name": "Dark Red",
|
||||
"rgb": [165, 14, 30]
|
||||
},
|
||||
{
|
||||
"name": "Light Red",
|
||||
"rgb": [250, 128, 114]
|
||||
},
|
||||
{
|
||||
"name": "Dark Orange",
|
||||
"rgb": [228, 92, 26]
|
||||
},
|
||||
{
|
||||
"name": "Light Tan",
|
||||
"rgb": [214, 181, 148]
|
||||
},
|
||||
{
|
||||
"name": "Dark Goldenrod",
|
||||
"rgb": [156, 132, 49]
|
||||
},
|
||||
{
|
||||
"name": "Goldenrod",
|
||||
"rgb": [197, 173, 49]
|
||||
},
|
||||
{
|
||||
"name": "Light Goldenrod",
|
||||
"rgb": [232, 212, 95]
|
||||
},
|
||||
{
|
||||
"name": "Dark Olive",
|
||||
"rgb": [74, 107, 58]
|
||||
},
|
||||
{
|
||||
"name": "Olive",
|
||||
"rgb": [90, 148, 74]
|
||||
},
|
||||
{
|
||||
"name": "Light Olive",
|
||||
"rgb": [132, 197, 115]
|
||||
},
|
||||
{
|
||||
"name": "Dark Cyan",
|
||||
"rgb": [15, 121, 159]
|
||||
},
|
||||
{
|
||||
"name": "Light Cyan",
|
||||
"rgb": [187, 250, 242]
|
||||
},
|
||||
{
|
||||
"name": "Light Blue",
|
||||
"rgb": [125, 199, 255]
|
||||
},
|
||||
{
|
||||
"name": "Dark Indigo",
|
||||
"rgb": [77, 49, 184]
|
||||
},
|
||||
{
|
||||
"name": "Dark Slate Blue",
|
||||
"rgb": [74, 66, 132]
|
||||
},
|
||||
{
|
||||
"name": "Slate Blue",
|
||||
"rgb": [122, 113, 196]
|
||||
},
|
||||
{
|
||||
"name": "Light Slate Blue",
|
||||
"rgb": [181, 174, 241]
|
||||
},
|
||||
{
|
||||
"name": "Light Brown",
|
||||
"rgb": [219, 164, 99]
|
||||
},
|
||||
{
|
||||
"name": "Dark Beige",
|
||||
"rgb": [209, 128, 81]
|
||||
},
|
||||
{
|
||||
"name": "Light Beige",
|
||||
"rgb": [255, 197, 165]
|
||||
},
|
||||
{
|
||||
"name": "Dark Peach",
|
||||
"rgb": [155, 82, 73]
|
||||
},
|
||||
{
|
||||
"name": "Peach",
|
||||
"rgb": [209, 128, 120]
|
||||
},
|
||||
{
|
||||
"name": "Light Peach",
|
||||
"rgb": [250, 182, 164]
|
||||
},
|
||||
{
|
||||
"name": "Dark Tan",
|
||||
"rgb": [123, 99, 82]
|
||||
},
|
||||
{
|
||||
"name": "Tan",
|
||||
"rgb": [156, 132, 107]
|
||||
},
|
||||
{
|
||||
"name": "Dark Slate",
|
||||
"rgb": [51, 57, 65]
|
||||
},
|
||||
{
|
||||
"name": "Slate",
|
||||
"rgb": [109, 117, 141]
|
||||
},
|
||||
{
|
||||
"name": "Light Slate",
|
||||
"rgb": [179, 185, 209]
|
||||
},
|
||||
{
|
||||
"name": "Dark Stone",
|
||||
"rgb": [109, 100, 63]
|
||||
},
|
||||
{
|
||||
"name": "Stone",
|
||||
"rgb": [148, 140, 107]
|
||||
},
|
||||
{
|
||||
"name": "Light Stone",
|
||||
"rgb": [205, 197, 158]
|
||||
}
|
||||
{ "id": 0, "premium": false, "name": "Transparent", "rgb": [0, 0, 0] },
|
||||
{ "id": 1, "premium": false, "name": "Black", "rgb": [0, 0, 0] },
|
||||
{ "id": 2, "premium": false, "name": "Dark Gray", "rgb": [60, 60, 60] },
|
||||
{ "id": 3, "premium": false, "name": "Gray", "rgb": [120, 120, 120] },
|
||||
{ "id": 4, "premium": false, "name": "Light Gray", "rgb": [210, 210, 210] },
|
||||
{ "id": 5, "premium": false, "name": "White", "rgb": [255, 255, 255] },
|
||||
{ "id": 6, "premium": false, "name": "Deep Red", "rgb": [96, 0, 24] },
|
||||
{ "id": 7, "premium": false, "name": "Red", "rgb": [237, 28, 36] },
|
||||
{ "id": 8, "premium": false, "name": "Orange", "rgb": [255, 127, 39] },
|
||||
{ "id": 9, "premium": false, "name": "Gold", "rgb": [246, 170, 9] },
|
||||
{ "id": 10, "premium": false, "name": "Yellow", "rgb": [249, 221, 59] },
|
||||
{ "id": 11, "premium": false, "name": "Light Yellow", "rgb": [255, 250, 188] },
|
||||
{ "id": 12, "premium": false, "name": "Dark Green", "rgb": [14, 185, 104] },
|
||||
{ "id": 13, "premium": false, "name": "Green", "rgb": [19, 230, 123] },
|
||||
{ "id": 14, "premium": false, "name": "Light Green", "rgb": [135, 255, 94] },
|
||||
{ "id": 15, "premium": false, "name": "Dark Teal", "rgb": [12, 129, 110] },
|
||||
{ "id": 16, "premium": false, "name": "Teal", "rgb": [16, 174, 166] },
|
||||
{ "id": 17, "premium": false, "name": "Light Teal", "rgb": [19, 225, 190] },
|
||||
{ "id": 18, "premium": false, "name": "Dark Blue", "rgb": [40, 80, 158] },
|
||||
{ "id": 19, "premium": false, "name": "Blue", "rgb": [64, 147, 228] },
|
||||
{ "id": 20, "premium": false, "name": "Cyan", "rgb": [96, 247, 242] },
|
||||
{ "id": 21, "premium": false, "name": "Indigo", "rgb": [107, 80, 246] },
|
||||
{ "id": 22, "premium": false, "name": "Light Indigo", "rgb": [153, 177, 251] },
|
||||
{ "id": 23, "premium": false, "name": "Dark Purple", "rgb": [120, 12, 153] },
|
||||
{ "id": 24, "premium": false, "name": "Purple", "rgb": [170, 56, 185] },
|
||||
{ "id": 25, "premium": false, "name": "Light Purple", "rgb": [224, 159, 249] },
|
||||
{ "id": 26, "premium": false, "name": "Dark Pink", "rgb": [203, 0, 122] },
|
||||
{ "id": 27, "premium": false, "name": "Pink", "rgb": [236, 31, 128] },
|
||||
{ "id": 28, "premium": false, "name": "Light Pink", "rgb": [243, 141, 169] },
|
||||
{ "id": 29, "premium": false, "name": "Dark Brown", "rgb": [104, 70, 52] },
|
||||
{ "id": 30, "premium": false, "name": "Brown", "rgb": [149, 104, 42] },
|
||||
{ "id": 31, "premium": false, "name": "Beige", "rgb": [248, 178, 119] },
|
||||
{ "id": 32, "premium": true, "name": "Medium Gray", "rgb": [170, 170, 170] },
|
||||
{ "id": 33, "premium": true, "name": "Dark Red", "rgb": [165, 14, 30] },
|
||||
{ "id": 34, "premium": true, "name": "Light Red", "rgb": [250, 128, 114] },
|
||||
{ "id": 35, "premium": true, "name": "Dark Orange", "rgb": [228, 92, 26] },
|
||||
{ "id": 36, "premium": true, "name": "Light Tan", "rgb": [214, 181, 148] },
|
||||
{ "id": 37, "premium": true, "name": "Dark Goldenrod","rgb": [156, 132, 49] },
|
||||
{ "id": 38, "premium": true, "name": "Goldenrod", "rgb": [197, 173, 49] },
|
||||
{ "id": 39, "premium": true, "name": "Light Goldenrod","rgb": [232, 212, 95] },
|
||||
{ "id": 40, "premium": true, "name": "Dark Olive", "rgb": [74, 107, 58] },
|
||||
{ "id": 41, "premium": true, "name": "Olive", "rgb": [90, 148, 74] },
|
||||
{ "id": 42, "premium": true, "name": "Light Olive", "rgb": [132, 197, 115] },
|
||||
{ "id": 43, "premium": true, "name": "Dark Cyan", "rgb": [15, 121, 159] },
|
||||
{ "id": 44, "premium": true, "name": "Light Cyan", "rgb": [187, 250, 242] },
|
||||
{ "id": 45, "premium": true, "name": "Light Blue", "rgb": [125, 199, 255] },
|
||||
{ "id": 46, "premium": true, "name": "Dark Indigo", "rgb": [77, 49, 184] },
|
||||
{ "id": 47, "premium": true, "name": "Dark Slate Blue","rgb": [74, 66, 132] },
|
||||
{ "id": 48, "premium": true, "name": "Slate Blue", "rgb": [122, 113, 196] },
|
||||
{ "id": 49, "premium": true, "name": "Light Slate Blue","rgb": [181, 174, 241] },
|
||||
{ "id": 50, "premium": true, "name": "Light Brown", "rgb": [219, 164, 99] },
|
||||
{ "id": 51, "premium": true, "name": "Dark Beige", "rgb": [209, 128, 81] },
|
||||
{ "id": 52, "premium": true, "name": "Light Beige", "rgb": [255, 197, 165] },
|
||||
{ "id": 53, "premium": true, "name": "Dark Peach", "rgb": [155, 82, 73] },
|
||||
{ "id": 54, "premium": true, "name": "Peach", "rgb": [209, 128, 120] },
|
||||
{ "id": 55, "premium": true, "name": "Light Peach", "rgb": [250, 182, 164] },
|
||||
{ "id": 56, "premium": true, "name": "Dark Tan", "rgb": [123, 99, 82] },
|
||||
{ "id": 57, "premium": true, "name": "Tan", "rgb": [156, 132, 107] },
|
||||
{ "id": 58, "premium": true, "name": "Dark Slate", "rgb": [51, 57, 65] },
|
||||
{ "id": 59, "premium": true, "name": "Slate", "rgb": [109, 117, 141] },
|
||||
{ "id": 60, "premium": true, "name": "Light Slate", "rgb": [179, 185, 209] },
|
||||
{ "id": 61, "premium": true, "name": "Dark Stone", "rgb": [109, 100, 63] },
|
||||
{ "id": 62, "premium": true, "name": "Stone", "rgb": [148, 140, 107] },
|
||||
{ "id": 63, "premium": true, "name": "Light Stone", "rgb": [205, 197, 158] }
|
||||
];
|
||||
|
||||
// Annotate palette entries with ID (index) and premium flag.
|
||||
try {
|
||||
for (let i = 0; i < colorpalette.length; i++) {
|
||||
const c = colorpalette[i];
|
||||
if (c && typeof c === 'object') {
|
||||
c.id = i;
|
||||
c.premium = i >= 32; // Premium colors are indices 32–63 (0-based)
|
||||
}
|
||||
}
|
||||
} catch (_) { /* no-op */ }
|
||||
// All entries include fixed id (index-based) and premium flag by design.
|
||||
Loading…
Reference in a new issue