Closed 1j01 closed 3 years ago
Here's an example image. If you fill the blue and red rectangles with black, you can see the border revealed. The border color was sampled from the mspaint screenshot (right) and the fill from jspaint (left).
This may be the exact colors from mspaint, or may not:
It should be easier to check if they're correct than to try to extract them, so this could be helpful.
YES! I found the source code to mspaint, online! (from Windows NT 4.0, which is probably close enough for most things.) This will be super helpful.
(spacing of color components contrived for display on GitHub):
rgb( 0 , 0 , 0 )
Black
rgb(128,128,128)
Dark Gray
rgb(128, 0 , 0 )
Dark Red
rgb(128,128, 0 )
Pea Green
rgb( 0 ,128, 0 )
Dark Green
rgb( 0 ,128,128)
Slate
rgb( 0 , 0 ,128)
Dark Blue
rgb(128, 0 ,128)
Lavender
rgb(128,128, 64)
rgb( 0 , 64, 64)
rgb( 0 ,128,255)
rgb( 0 , 64,128)
rgb( 64, 0 ,255)
rgb(128, 64, 0 )
rgb(255,255,255)
White
rgb(192,192,192)
Light Gray
rgb(255, 0 , 0 )
Bright Red
rgb(255,255, 0 )
Yellow
rgb( 0 ,255, 0 )
Bright Green
rgb( 0 ,255,255)
Cyan
rgb( 0 , 0 ,255)
Bright Blue
rgb(255, 0 ,255)
Magenta
rgb(255,255,128)
rgb( 0 ,255,128)
rgb(128,255,255)
rgb(128,128,255)
rgb(255, 0 ,128)
rgb(255,128, 64)
const colorColorsDef = [
"rgb(0,0,0)", // Black
"rgb(128,128,128)", // Dark Gray
"rgb(128,0,0)", // Dark Red
"rgb(128,128,0)", // Pea Green
"rgb(0,128,0)", // Dark Green
"rgb(0,128,128)", // Slate
"rgb(0,0,128)", // Dark Blue
"rgb(128,0,128)", // Lavender
"rgb(128,128,64)", //
"rgb(0,64,64)", //
"rgb(0,128,255)", //
"rgb(0,64,128)", //
"rgb(64,0,255)", //
"rgb(128,64,0)", //
"rgb(255,255,255)", // White
"rgb(192,192,192)", // Light Gray
"rgb(255,0,0)", // Bright Red
"rgb(255,255,0)", // Yellow
"rgb(0,255,0)", // Bright Green
"rgb(0,255,255)", // Cyan
"rgb(0,0,255)", // Bright Blue
"rgb(255,0,255)", // Magenta
"rgb(255,255,128)", //
"rgb(0,255,128)", //
"rgb(128,255,255)", //
"rgb(128,128,255)", //
"rgb(255,0,128)", //
"rgb(255,128,64)", //
];
const bwColorsDef = [
"rgb(0,0,0)",
"rgb(9,9,9)",
"rgb(18,18,18)",
"rgb(27,27,27)",
"rgb(37,37,37)",
"rgb(46,46,46)",
"rgb(55,55,55)",
"rgb(63,63,63)",
"rgb(73,73,73)",
"rgb(82,82,82)",
"rgb(92,92,92)",
"rgb(101,101,101)",
"rgb(110,110,110)",
"rgb(119,119,119)",
"rgb(255,255,255)",
"rgb(250,250,250)",
"rgb(242,242,242)",
"rgb(212,212,212)",
"rgb(201,201,201)",
"rgb(191,191,191)",
"rgb(182,182,182)",
"rgb(159,159,159)",
"rgb(128,128,128)",
"rgb(173,173,173)",
"rgb(164,164,164)",
"rgb(155,155,155)",
"rgb(146,146,146)",
"rgb(137,137,137)",
];
The monochrome palette has a mapping between these grayscale values and patterns of black and white pixels. I currently treat the monochrome palette as a palette of patterns directly.
I decided against automatically upgrading the color palette of images when opening them. It was too slow, and I don't like the idea of it silently changing things, or using heuristics to decide whether to perform the upgrade. I introduced a slight threshold in the fill tool to fix https://github.com/1j01/jspaint/issues/184 and I might be able to increase it to handle the palette inconsistencies with old documents created in JS Paint vs JS Paint's new, correct palette. I'm not sure how different the colors are between the palettes. I don't want to increase it to the point that two visually distinct patches of color are filled as one.
.pal
file. JS Paint can read.pal
files. Or save a.bmp
from mspaint and extract the colors from that. Or pick colors from the screen with mspaint running, and not via a VM that might change the colors.