ppfun
/
pixelplanet
13
Fork 18
Code Issues 24 Pull Requests Releases 2 Activity

refactor and clean up Palette and buffer2RGB functions

This commit is contained in:
HF 2022-06-21 12:14:57 +02:00
parent 8745603309
commit 4293ff2a01
3 changed files with 42 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
src/core/Palette.js
View File

@ -100,128 +100,6 @@ class Palette {
}
return closestIndex;
}
/*
* Take a buffer of indexed pixels and output it as ABGR Array
* @param chunkBuffer Buffer of indexed pixels
* @return ABRG Buffer
*/
buffer2ABGR(chunkBuffer) {
const { length } = chunkBuffer;
const colors = new Uint32Array(length);
const { abgr } = this;
let value;
let pos = 0;
for (let i = 0; i < length; i++) {
value = (chunkBuffer[i] & 0x3F);
colors[pos++] = abgr[value];
}
return colors;
}
/*
* Take a buffer of indexed pixels and output it as RGB Array
* @param chunkBuffer Buffer of indexed pixels
* @param targetLength Optional integer of length of chunk
* (will be padded or cut to its size)
* @return RGB Buffer
*/
buffer2RGB(chunkBuffer, targetLength = null) {
let minLength = chunkBuffer.length;
let length = minLength;
if (targetLength) {
minLength = Math.min(targetLength, minLength);
length = targetLength;
}
const colors = new Uint8Array(length * 3);
let color;
let value;
const { rgb } = this;
let c = 0;
for (let i = 0; i < minLength; i++) {
value = chunkBuffer[i];
color = (value & 0x3F) * 3;
colors[c++] = rgb[color++];
colors[c++] = rgb[color++];
colors[c++] = rgb[color];
}
if (minLength < length) {
const blankR = rgb[0];
const blankG = rgb[1];
const blankB = rgb[2];
for (let i = minLength; i < length; i += 1) {
colors[c++] = blankR;
colors[c++] = blankG;
colors[c++] = blankB;
}
}
return colors;
}
/*
* Create a RGB Buffer of a specific size with just one color
* @param color Color Index of color to use
* @param length Length of needed Buffer
* @return RGB Buffer of wanted size with just one color
*/
oneColorBuffer(color, length) {
const buffer = new Uint8Array(length * 3);
const r = this.rgb[color * 3];
const g = this.rgb[color * 3 + 1];
const b = this.rgb[color * 3 + 2];
let pos = 0;
for (let i = 0; i < length; i++) {
buffer[pos++] = r;
buffer[pos++] = g;
buffer[pos++] = b;
}
return buffer;
}
}
export const COLORS_RGB = new Uint8Array([
202, 227, 255, // first color is unset pixel in ocean
255, 255, 255, // second color is unset pixel on land
255, 255, 255, // white
228, 228, 228, // light gray
196, 196, 196, // silver
136, 136, 136, // dark gray
78, 78, 78, // darker gray
0, 0, 0, // black
244, 179, 174, // skin
255, 167, 209, // light pink
255, 84, 178, // pink
255, 101, 101, // peach
229, 0, 0, // red
154, 0, 0, // dark red
254, 164, 96, // light brown
229, 149, 0, // orange
160, 106, 66, // brown
96, 64, 40, // dark brown
245, 223, 176, // sand
255, 248, 137, // khaki
229, 217, 0, // yellow
148, 224, 68, // light green
2, 190, 1, // green
104, 131, 56, // olive
0, 101, 19, // dark green
202, 227, 255, // sky blue
0, 211, 221, // light blue
0, 131, 199, // dark blue
0, 0, 234, // blue
25, 25, 115, // darker blue
207, 110, 228, // light violette
130, 0, 128, // violette
]);
export const COLORS_AMOUNT = COLORS_RGB.length / 3;
export const COLORS = new Array(COLORS_AMOUNT);
export const COLORS_ABGR = new Uint32Array(COLORS_AMOUNT);
export const TRANSPARENT = 0;
export default Palette;

35
src/core/tilesBackup.js
View File

@ -225,6 +225,39 @@ export async function incrementialBackupRedis(
}
}
/*
* Take a buffer of indexed pixels and output it as RGB Array
* of full chunk size
* @param chunkBuffer Buffer of indexed pixels
* @param palette
* @return RGB Buffer
*/
function buffer2RGB(palette, chunkBuffer) {
const length = TILE_SIZE ** 2;
const minLength = Math.min(chunkBuffer.length, length);
const colors = new Uint8Array(length * 3);
const { rgb } = palette;
let color;
let c = 0;
for (let i = 0; i < minLength; i++) {
color = (chunkBuffer[i] & 0x3F) * 3;
colors[c++] = rgb[color++];
colors[c++] = rgb[color++];
colors[c++] = rgb[color];
}
if (minLength < length) {
const blankR = rgb[0];
const blankG = rgb[1];
const blankB = rgb[2];
for (let i = minLength; i < length; i += 1) {
colors[c++] = blankR;
colors[c++] = blankG;
colors[c++] = blankB;
}
}
return colors;
}
/*
* Backup all tiles as PNG files into folder
@ -279,7 +312,7 @@ export async function createPngBackup(
}
if (chunk && chunk.length) {
try {
const tileBuffer = palette.buffer2RGB(chunk, TILE_SIZE ** 2);
const tileBuffer = buffer2RGB(palette, chunk);
const filename = `${xBackupDir}/${y}.png`;
// eslint-disable-next-line no-await-in-loop

16
src/ui/ChunkRGB.js
View File

@ -43,16 +43,16 @@ class ChunkRGB {
fromBuffer(chunkBuffer) {
const imageData = new ImageData(TILE_SIZE, TILE_SIZE);
const imageView = new Uint32Array(imageData.data.buffer);
const colors = this.palette.buffer2ABGR(chunkBuffer);
colors.forEach((color, index) => {
imageView[index] = color;
});
const { abgr } = this.palette;
let bufferLength = chunkBuffer.byteLength;
for (let i = 0; i < bufferLength; i += 1) {
imageView[i] = abgr[chunkBuffer[i] & 0x3F];
}
const neededLength = TILE_SIZE ** 2;
let padding = chunkBuffer.byteLength;
const background = this.palette.abgr[0];
while (padding < neededLength) {
imageView[padding] = background;
padding += 1;
while (bufferLength < neededLength) {
imageView[bufferLength] = background;
bufferLength += 1;
}
const ctx = this.image.getContext('2d');
ctx.putImageData(imageData, 0, 0);