import Psd from "@webtoon/psd";

const inputEl: HTMLInputElement = document.querySelector("input[type='file']");
inputEl.addEventListener("change", async () => {
  const file = inputEl.files[0];

  const result = await file.arrayBuffer();
  const psdFile = Psd.parse(result);

  const canvasElement = document.createElement("canvas");
  const context = canvasElement.getContext("2d");
  const imageData = new ImageData(
    psdFile.composite(),
    psdFile.width,
    psdFile.height
  );

  canvasElement.width = psdFile.width;
  canvasElement.height = psdFile.height;

  context.putImageData(imageData, 0, 0);
  document.body.append(canvasElement);
});

import * as fs from "fs";
import Psd from "@webtoon/psd";

const psdData = fs.readFileSync("./my-file.psd");
// Pass the ArrayBuffer instance inside the Buffer
const psdFile = Psd.parse(psdData.buffer);

const Psd = await import("@webtoon/psd");

const psdFile = Psd.parse(myBuffer);

import Psd, {Group, Layer, Node} from "@webtoon/psd";

// Recursively traverse layers and layer groups
function traverseNode(node: Node) {
  if (node instanceof Group) {
    for (const child of node.children) {
      traverseNode(child);
    }
  } else if (node instanceof Layer) {
    // Do something with layer
  } else {
    throw new Error("Invalid node type");
  }
}

for (const node of psdFile.children) {
  traverseNode(node);
}

for (const layer of psdFile.layers) {
  doSomething(layer);
}

// Extract the pixel data of the entire image
pixelData = psd.composite();

// Extract the pixel data of a layer, with all layer and layer group effects applied
// (currently, only the opacity is supported)
layerPixelData = layer.composite();

// Extract the pixel data of a layer, with only the layer's own effects applied
layerPixelData = layer.composite(true, false);

// Extract the pixel data of a layer, without any effects
layerPixelData = layer.composite(false);