From 6504b8c1d40ef6b7fec5386b51f90eefc7a59366 Mon Sep 17 00:00:00 2001 From: MiraclePatrickLumowa Date: Mon, 18 Aug 2025 21:53:23 +0800 Subject: [PATCH] Fixed wrong rgb code --- Auto-Image.js | 178 ++++++++++++++++++++++++++++++-------------------- 1 file changed, 107 insertions(+), 71 deletions(-) diff --git a/Auto-Image.js b/Auto-Image.js index 21cddd0..cf31729 100644 --- a/Auto-Image.js +++ b/Auto-Image.js @@ -23,66 +23,66 @@ 0: {id: 1, name: 'Black', rgb: {r: 0, g: 0, b: 0}}, 1: {id: 2, name: 'Dark Gray', rgb: {r: 60, g: 60, b: 60}}, 2: {id: 3, name: 'Gray', rgb: {r: 120, g: 120, b: 120}}, - 3: {id: 32, name: 'Medium Gray', rgb: {r: 160, g: 160, b: 160}}, - 4: {id: 4, name: 'Light Gray', rgb: {r: 210, g: 210, b: 210}}, - 5: {id: 5, name: 'White', rgb: {r: 255, g: 255, b: 255}}, - 6: {id: 6, name: 'Deep Red', rgb: {r: 96, g: 0, b: 24}}, - 7: {id: 33, name: 'Dark Red', rgb: {r: 128, g: 0, b: 0}}, - 8: {id: 7, name: 'Red', rgb: {r: 237, g: 28, b: 36}}, - 9: {id: 34, name: 'Light Red', rgb: {r: 255, g: 128, b: 128}}, - 10: {id: 35, name: 'Dark Orange', rgb: {r: 204, g: 85, b: 0}}, - 11: {id: 8, name: 'Orange', rgb: {r: 255, g: 127, b: 39}}, - 12: {id: 9, name: 'Gold', rgb: {r: 246, g: 170, b: 9}}, - 13: {id: 10, name: 'Yellow', rgb: {r: 249, g: 221, b: 59}}, - 14: {id: 11, name: 'Light Yellow', rgb: {r: 255, g: 250, b: 188}}, - 15: {id: 37, name: 'Dark Goldenrod', rgb: {r: 184, g: 134, b: 11}}, - 16: {id: 38, name: 'Goldenrod', rgb: {r: 218, g: 165, b: 32}}, - 17: {id: 39, name: 'Light Goldenrod', rgb: {r: 250, g: 250, b: 210}}, - 18: {id: 40, name: 'Dark Olive', rgb: {r: 85, g: 107, b: 47}}, - 19: {id: 41, name: 'Olive', rgb: {r: 128, g: 128, b: 0}}, - 20: {id: 42, name: 'Light Olive', rgb: {r: 192, g: 192, b: 128}}, - 21: {id: 12, name: 'Dark Green', rgb: {r: 14, g: 185, b: 104}}, - 22: {id: 13, name: 'Green', rgb: {r: 19, g: 230, b: 123}}, - 23: {id: 14, name: 'Light Green', rgb: {r: 135, g: 255, b: 94}}, - 24: {id: 15, name: 'Dark Teal', rgb: {r: 12, g: 129, b: 110}}, - 25: {id: 16, name: 'Teal', rgb: {r: 16, g: 174, b: 166}}, - 26: {id: 17, name: 'Light Teal', rgb: {r: 19, g: 225, b: 190}}, - 27: {id: 43, name: 'Dark Cyan', rgb: {r: 0, g: 139, b: 139}}, - 28: {id: 20, name: 'Cyan', rgb: {r: 96, g: 247, b: 242}}, - 29: {id: 44, name: 'Light Cyan', rgb: {r: 224, g: 255, b: 255}}, - 30: {id: 18, name: 'Dark Blue', rgb: {r: 40, g: 80, b: 158}}, - 31: {id: 19, name: 'Blue', rgb: {r: 64, g: 147, b: 228}}, - 32: {id: 45, name: 'Light Blue', rgb: {r: 173, g: 216, b: 230}}, - 33: {id: 46, name: 'Dark Indigo', rgb: {r: 75, g: 0, b: 130}}, - 34: {id: 21, name: 'Indigo', rgb: {r: 107, g: 80, b: 246}}, - 35: {id: 22, name: 'Light Indigo', rgb: {r: 153, g: 177, b: 251}}, - 36: {id: 47, name: 'Dark Slate Blue', rgb: {r: 72, g: 61, b: 139}}, - 37: {id: 48, name: 'Slate Blue', rgb: {r: 106, g: 90, b: 205}}, - 38: {id: 49, name: 'Light Slate Blue', rgb: {r: 132, g: 112, b: 255}}, - 39: {id: 23, name: 'Dark Purple', rgb: {r: 120, g: 12, b: 153}}, - 40: {id: 24, name: 'Purple', rgb: {r: 170, g: 56, b: 185}}, - 41: {id: 25, name: 'Light Purple', rgb: {r: 224, g: 159, b: 249}}, - 42: {id: 26, name: 'Dark Pink', rgb: {r: 203, g: 0, b: 122}}, - 43: {id: 27, name: 'Pink', rgb: {r: 236, g: 31, b: 128}}, - 44: {id: 28, name: 'Light Pink', rgb: {r: 243, g: 141, b: 169}}, - 45: {id: 53, name: 'Dark Peach', rgb: {r: 255, g: 140, b: 105}}, - 46: {id: 54, name: 'Peach', rgb: {r: 255, g: 218, b: 185}}, - 47: {id: 55, name: 'Light Peach', rgb: {r: 255, g: 239, b: 213}}, - 48: {id: 29, name: 'Dark Brown', rgb: {r: 104, g: 70, b: 52}}, - 49: {id: 30, name: 'Brown', rgb: {r: 149, g: 104, b: 42}}, - 50: {id: 50, name: 'Light Brown', rgb: {r: 205, g: 133, b: 63}}, - 51: {id: 56, name: 'Dark Tan', rgb: {r: 139, g: 69, b: 19}}, - 52: {id: 57, name: 'Tan', rgb: {r: 210, g: 180, b: 140}}, - 53: {id: 36, name: 'Light Tan', rgb: {r: 238, g: 203, b: 173}}, - 54: {id: 51, name: 'Dark Beige', rgb: {r: 160, g: 130, b: 98}}, - 55: {id: 31, name: 'Beige', rgb: {r: 248, g: 178, b: 119}}, - 56: {id: 52, name: 'Light Beige', rgb: {r: 255, g: 197, b: 165}}, - 57: {id: 61, name: 'Dark Stone', rgb: {r: 105, g: 105, b: 105}}, - 58: {id: 62, name: 'Stone', rgb: {r: 128, g: 128, b: 128}}, - 59: {id: 63, name: 'Light Stone', rgb: {r: 176, g: 176, b: 176}}, - 60: {id: 58, name: 'Dark Slate', rgb: {r: 47, g: 79, b: 79}}, - 61: {id: 59, name: 'Slate', rgb: {r: 112, g: 128, b: 144}}, - 62: {id: 60, name: 'Light Slate', rgb: {r: 176, g: 196, b: 222}}, + 3: {id: 4, name: 'Light Gray', rgb: {r: 210, g: 210, b: 210}}, + 4: {id: 5, name: 'White', rgb: {r: 255, g: 255, b: 255}}, + 5: {id: 6, name: 'Deep Red', rgb: {r: 96, g: 0, b: 24}}, + 6: {id: 7, name: 'Red', rgb: {r: 237, g: 28, b: 36}}, + 7: {id: 8, name: 'Orange', rgb: {r: 255, g: 127, b: 39}}, + 8: {id: 9, name: 'Gold', rgb: {r: 246, g: 170, b: 9}}, + 9: {id: 10, name: 'Yellow', rgb: {r: 249, g: 221, b: 59}}, + 10: {id: 11, name: 'Light Yellow', rgb: {r: 255, g: 250, b: 188}}, + 11: {id: 12, name: 'Dark Green', rgb: {r: 14, g: 185, b: 104}}, + 12: {id: 13, name: 'Green', rgb: {r: 19, g: 230, b: 123}}, + 13: {id: 14, name: 'Light Green', rgb: {r: 135, g: 255, b: 94}}, + 14: {id: 15, name: 'Dark Teal', rgb: {r: 12, g: 129, b: 110}}, + 15: {id: 16, name: 'Teal', rgb: {r: 16, g: 174, b: 166}}, + 16: {id: 17, name: 'Light Teal', rgb: {r: 19, g: 225, b: 190}}, + 17: {id: 20, name: 'Cyan', rgb: {r: 96, g: 247, b: 242}}, + 18: {id: 44, name: 'Light Cyan', rgb: {r: 187, g: 250, b: 242}}, + 19: {id: 18, name: 'Dark Blue', rgb: {r: 40, g: 80, b: 158}}, + 20: {id: 19, name: 'Blue', rgb: {r: 64, g: 147, b: 228}}, + 21: {id: 21, name: 'Indigo', rgb: {r: 107, g: 80, b: 246}}, + 22: {id: 22, name: 'Light Indigo', rgb: {r: 153, g: 177, b: 251}}, + 23: {id: 23, name: 'Dark Purple', rgb: {r: 120, g: 12, b: 153}}, + 24: {id: 24, name: 'Purple', rgb: {r: 170, g: 56, b: 185}}, + 25: {id: 25, name: 'Light Purple', rgb: {r: 224, g: 159, b: 249}}, + 26: {id: 26, name: 'Dark Pink', rgb: {r: 203, g: 0, b: 122}}, + 27: {id: 27, name: 'Pink', rgb: {r: 236, g: 31, b: 128}}, + 28: {id: 28, name: 'Light Pink', rgb: {r: 243, g: 141, b: 169}}, + 29: {id: 29, name: 'Dark Brown', rgb: {r: 104, g: 70, b: 52}}, + 30: {id: 30, name: 'Brown', rgb: {r: 149, g: 104, b: 42}}, + 31: {id: 31, name: 'Beige', rgb: {r: 248, g: 178, b: 119}}, + 32: {id: 52, name: 'Light Beige', rgb: {r: 255, g: 197, b: 165}}, + 33: {id: 32, name: 'Medium Gray', rgb: {r: 170, g: 170, b: 170}}, + 34: {id: 33, name: 'Dark Red', rgb: {r: 165, g: 14, b: 30}}, + 35: {id: 34, name: 'Light Red', rgb: {r: 250, g: 128, b: 114}}, + 36: {id: 35, name: 'Dark Orange', rgb: {r: 228, g: 92, b: 26}}, + 37: {id: 37, name: 'Dark Goldenrod', rgb: {r: 156, g: 132, b: 49}}, + 38: {id: 38, name: 'Goldenrod', rgb: {r: 197, g: 173, b: 49}}, + 39: {id: 39, name: 'Light Goldenrod', rgb: {r: 232, g: 212, b: 95}}, + 40: {id: 40, name: 'Dark Olive', rgb: {r: 74, g: 107, b: 58}}, + 41: {id: 41, name: 'Olive', rgb: {r: 90, g: 148, b: 74}}, + 42: {id: 42, name: 'Light Olive', rgb: {r: 132, g: 197, b: 115}}, + 43: {id: 43, name: 'Dark Cyan', rgb: {r: 15, g: 121, b: 159}}, + 44: {id: 45, name: 'Light Blue', rgb: {r: 125, g: 199, b: 255}}, + 45: {id: 46, name: 'Dark Indigo', rgb: {r: 77, g: 49, b: 184}}, + 46: {id: 47, name: 'Dark Slate Blue', rgb: {r: 74, g: 66, b: 132}}, + 47: {id: 48, name: 'Slate Blue', rgb: {r: 122, g: 113, b: 196}}, + 48: {id: 49, name: 'Light Slate Blue', rgb: {r: 181, g: 174, b: 241}}, + 49: {id: 53, name: 'Dark Peach', rgb: {r: 155, g: 82, b: 73}}, + 50: {id: 54, name: 'Peach', rgb: {r: 209, g: 128, b: 120}}, + 51: {id: 55, name: 'Light Peach', rgb: {r: 250, g: 182, b: 164}}, + 52: {id: 50, name: 'Light Brown', rgb: {r: 219, g: 164, b: 99}}, + 53: {id: 56, name: 'Dark Tan', rgb: {r: 123, g: 99, b: 82}}, + 54: {id: 57, name: 'Tan', rgb: {r: 156, g: 132, b: 107}}, + 55: {id: 36, name: 'Light Tan', rgb: {r: 214, g: 181, b: 148}}, + 56: {id: 51, name: 'Dark Beige', rgb: {r: 209, g: 128, b: 81}}, + 57: {id: 61, name: 'Dark Stone', rgb: {r: 109, g: 100, b: 63}}, + 58: {id: 62, name: 'Stone', rgb: {r: 148, g: 140, b: 107}}, + 59: {id: 63, name: 'Light Stone', rgb: {r: 205, g: 197, b: 158}}, + 60: {id: 58, name: 'Dark Slate', rgb: {r: 51, g: 57, b: 65}}, + 61: {id: 59, name: 'Slate', rgb: {r: 109, g: 117, b: 141}}, + 62: {id: 60, name: 'Light Slate', rgb: {r: 179, g: 185, b: 209}}, 63: {id: 0, name: 'Transparent', rgb: null} }, // --- END: Color data --- @@ -1139,18 +1139,55 @@ window.addEventListener('message', (event) => { extractAvailableColors: () => { const colorElements = document.querySelectorAll('[id^="color-"]') - return Array.from(colorElements) - .filter((el) => !el.querySelector("svg")) - .filter((el) => { - const id = Number.parseInt(el.id.replace("color-", "")) - return id !== 0 + + // Separate available and unavailable colors + const availableColors = [] + const unavailableColors = [] + + Array.from(colorElements).forEach((el) => { + const id = Number.parseInt(el.id.replace("color-", "")) + if (id === 0) return // Skip transparent color + + const rgbStr = el.style.backgroundColor.match(/\d+/g) + const rgb = rgbStr ? rgbStr.map(Number) : [0, 0, 0] + + // Find color name from COLOR_MAP + const colorInfo = Object.values(CONFIG.COLOR_MAP).find(color => color.id === id) + const name = colorInfo ? colorInfo.name : `Unknown Color ${id}` + + const colorData = { id, name, rgb } + + // Check if color is available (no SVG overlay means available) + if (!el.querySelector("svg")) { + availableColors.push(colorData) + } else { + unavailableColors.push(colorData) + } + }) + + // Console log detailed color information + console.log("=== CAPTURED COLORS STATUS ===") + console.log(`Total available colors: ${availableColors.length}`) + console.log(`Total unavailable colors: ${unavailableColors.length}`) + console.log(`Total colors scanned: ${availableColors.length + unavailableColors.length}`) + + if (availableColors.length > 0) { + console.log("\n--- AVAILABLE COLORS ---") + availableColors.forEach((color, index) => { + console.log(`${index + 1}. ID: ${color.id}, Name: "${color.name}", RGB: (${color.rgb[0]}, ${color.rgb[1]}, ${color.rgb[2]})`) }) - .map((el) => { - const id = Number.parseInt(el.id.replace("color-", "")) - const rgbStr = el.style.backgroundColor.match(/\d+/g) - const rgb = rgbStr ? rgbStr.map(Number) : [0, 0, 0] - return { id, rgb } + } + + if (unavailableColors.length > 0) { + console.log("\n--- UNAVAILABLE COLORS ---") + unavailableColors.forEach((color, index) => { + console.log(`${index + 1}. ID: ${color.id}, Name: "${color.name}", RGB: (${color.rgb[0]}, ${color.rgb[1]}, ${color.rgb[2]}) [LOCKED]`) }) + } + + console.log("=== END COLOR STATUS ===") + + return availableColors }, formatTime: (ms) => { @@ -4009,7 +4046,6 @@ window.addEventListener('message', (event) => { if (uploadBtn) { uploadBtn.addEventListener("click", async () => { const availableColors = Utils.extractAvailableColors(); - console.log("Captured available colors:", availableColors); // Debug log if (availableColors.length < 10) { updateUI("noColorsFound", "error"); Utils.showAlert(Utils.t("noColorsFound"), "error");