changelog

[sibelius]

can we add a changelog?

what are the breaking changes to v4 ?

[sibelius]

• related to how to use this package on web? escpos-buffer-image#2
• can we have a fallback to old version without sharp?

[mazinsw]

yes we can add a breaking changes, i will edit the release notes,
break changes are:

• add await for all print commands like await printer.writeln(...)
• some set properties are changed to function (allow async) like printer.align to await printer.setAlign(...) or printer.columns to await printer.setColumns(...)
• Printer contructor do not accept parameters, use await Printer.CONNECT(...)
• this library does not require fs or any image library anymore, use https://github.com/grandchef/escpos-buffer-image for nodejs or electron or you own implementation, for test we use escpos-buffer-image at development requirement only

[sibelius]

how can I load an image in the browser?

[mazinsw]

try someting like this (need refactor)

import { ImageData, Manager } from 'escpos-buffer';

export class ImageManager extends Manager {
  async function toBase64(url) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.readAsDataURL(url);
        reader.onload = () => resolve(reader.result);
        reader.onerror = error => reject(error);
    });
  }

  async function getImageDataFromBase64(base64Data) {
      return new Promise((resolve, reject) => {
          const img = new Image();
          img.onload = function () {
              const canvas = document.getElementById("secondaryCanvas");
              const ctx = canvas.getContext("2d");
              ctx.drawImage(img, 0, 0);
              resolve(ctx.getImageData(0, 0, 256, 256));
          }
          img.src = base64Data;
      });
  }

  async loadImage(filename: string): Promise<ImageData> {
    return this.loadImageFromBuffer(Buffer.from(await this.toBase64(filename), 'base64'));
  }
  async loadImageFromBuffer(data: Buffer): Promise<ImageData> {
    const image = await this.getImageDataFromBase64(data.toBuffer('base64'))
    return {
      width: image.info.width,
      height: image.info.height,
      data: image.data,
    };
  }
  async buildQrcodeImage(data: string, size: number): Promise<ImageData> {
    const buffer = await QRCode.toBuffer(data, { scale: size });
    return this.loadImageFromBuffer(buffer);
  }
}