change README, add preview and loading tiles for pc and pz mirrors, add utils script for initial image upload

README.md

@@ -127,7 +127,7 @@ Meaning of some values:
 
 | Key    | Description                                       |
 |--------|:--------------------------------------------------|
-| itent  | Unique character used in the url                  |
+| ident  | Unique character used in the url                  |
 | title  | Title                                             |
 | size   | canvas size, power of 4 and between 256 and 65536 |
 | bcd    | Base cooldown for unset pixels                    |
@@ -139,6 +139,7 @@ Meaning of some values:
 | sd     | Start-date of the canvas for historical view      |
 | desc   | Small desctiption text                            |
 | v      | If 3D voxel canvas (boolean)                      |
+| hid    | Hidden canvases, can be just seen by pressing P   |
 
 The canvas size limit can be surpassed by changing the websocket packages in src/socket/packages/ to send chunk coordinates in 16bit.
 req is an integer and if >0 is the amount of total pixels placed before being allowed to play there,  if -1 it has no requirement and if 0 it is limited to registered users. 

utils/README.md

@@ -60,3 +60,6 @@ center logo of pixelplanet
 
 ## change-canvasbackup
 just a script that got run once to add the missing tiles in historical view when  increasing the size of the moon canvas.
+
+## uploadImage.js
+nodejs script to upload a Image to the canvas without checks and without caring about what was previously there, don't use it for anything other than initially loading a very large image to the canvas.

utils/uploadImage.js

@@ -0,0 +1,109 @@
+/*
+ * upload image to canvs in console
+ * doesn't care about previous data
+ * no checks - don't use if you can use Admintools
+ */
+
+import redis from 'redis';
+import sharp from 'sharp';
+import bluebird from 'bluebird';
+
+import canvases from '../src/canvases.json';
+import Palette from '../src/core/Palette';
+import {
+  getChunkOfPixel,
+} from '../src/core/utils';
+import {
+  TILE_SIZE,
+} from '../src/core/constants';
+
+bluebird.promisifyAll(redis.RedisClient.prototype);
+bluebird.promisifyAll(redis.Multi.prototype);
+//ATTENTION Make suer to set the rdis URLs right!!!
+const redisurl = "redis://localhost:6379";
+const redisCanvas = redis.createClient(redisurl, { return_buffers: true });
+
+/*
+ * copied and modified from src/core/Image.js
+ */
+async function imageABGR2Canvas(
+  canvasId: number,
+  x: number,
+  y: number,
+  data: Buffer,
+  width: number,
+  height: number,
+) {
+  console.log(
+    `Loading image with dim ${width}/${height} to ${x}/${y}/${canvasId}`,
+  );
+  const canvas = canvases[canvasId];
+  const { colors, cli, size } = canvas;
+  const palette = new Palette(colors);
+  const canvasMinXY = -(size / 2);
+  const imageData = new Uint32Array(data.buffer);
+
+  const [ucx, ucy] = getChunkOfPixel(size, x, y);
+  const [lcx, lcy] = getChunkOfPixel(size, x + width, y + height);
+
+  let totalPxlCnt = 0;
+  console.log(`Loading to chunks from ${ucx} / ${ucy} to ${lcx} / ${lcy} ...`);
+  let chunk;
+  for (let cx = ucx; cx <= lcx; cx += 1) {
+    for (let cy = ucy; cy <= lcy; cy += 1) {
+      chunk = new Uint8Array(TILE_SIZE * TILE_SIZE);
+      // offset of chunk in image
+      const cOffX = cx * TILE_SIZE + canvasMinXY - x;
+      const cOffY = cy * TILE_SIZE + canvasMinXY - y;
+      let cOff = 0;
+      let pxlCnt = 0;
+      for (let py = 0; py < TILE_SIZE; py += 1) {
+        for (let px = 0; px < TILE_SIZE; px += 1) {
+          const clrX = cOffX + px;
+          const clrY = cOffY + py;
+          if (clrX >= 0 && clrY >= 0 && clrX < width && clrY < height) {
+            const clr = imageData[clrX + clrY * width];
+            const clrIndex = palette.abgr.indexOf(clr);
+            if (clrIndex !== -1) {
+              chunk[cOff] = clrIndex;
+              pxlCnt += 1;
+            }
+          }
+          cOff += 1;
+        }
+      }
+      if (pxlCnt) {
+        const key = `ch:${canvasId}:${cx}:${cy}`;
+        await redisCanvas.setAsync(key, Buffer.from(chunk.buffer));
+        console.log(`Loaded ${pxlCnt} pixels into chunk ${cx}, ${cy}.`);
+        totalPxlCnt += pxlCnt;
+      }
+      chunk = null;
+    }
+  }
+  console.log('Image loading done.');
+  return totalPxlCnt;
+}
+
+
+async function uploadImage(
+  path,
+  canvasId,
+  x,
+  y,
+) {
+  const { data, info } = await sharp(path)
+    .ensureAlpha()
+    .raw()
+    .toBuffer({ resolveWithObject: true });
+
+  const pxlCount = await imageABGR2Canvas(
+    canvasId,
+    x, y,
+    data,
+    info.width, info.height,
+  );
+}
+
+uploadImage('PZ.png', '5', -4096, -4096);
+//uploadImage('PC.png', '6', -7000, -7000)