import {
Utils,
RequestCommandId,
ResponseCommandId,
NiimbotBluetoothClient,
ImageEncoder,
NiimbotSerialClient,
} from "@mmote/niimbluelib";

let client = null;

const bleConnectButton = document.querySelector("button.connect.ble");
const serialConnectButton = document.querySelector("button.connect.serial");
const disconnectButton = document.querySelector("button.disconnect");
const printButton = document.querySelector("button.print");
const logPane = document.querySelector(".logger");
const canvas = document.querySelector("canvas");

/** Draw canvas test content */
const repaint = () => {
const ctx = canvas.getContext("2d");

ctx.fillStyle = "white";
ctx.lineWidth = 3;

// fill background
ctx.fillRect(0, 0, canvas.width, canvas.height);

// draw diagonal line
ctx.beginPath();
ctx.moveTo(0, ctx.lineWidth / 2);
ctx.lineTo(canvas.width, canvas.height-ctx.lineWidth / 2);
ctx.stroke();

// draw border
ctx.strokeRect(0.5, 0.5, canvas.width - 1, canvas.height - 1);
};

/** Add text to log pane */
const logger = (text) => {
console.log(text);
logPane.innerText += text + "\n";
logPane.scrollTop = logPane.scrollHeight;
};


/** Instantiate client */
const newClient = (transport) => {
if (client) {
client.disconnect();
}

if (transport === "ble") {
client = new NiimbotBluetoothClient();
} else if (transport === "serial") {
client = new NiimbotSerialClient();
}

client.on("packetsent", (e) => {
logger(`>> ${Utils.bufToHex(e.packet.toBytes())} (${RequestCommandId[e.packet.command]})`);
});

client.on("packetreceived", (e) => {
logger(`<< ${Utils.bufToHex(e.packet.toBytes())} (${ResponseCommandId[e.packet.command]})`);
});

client.on("connect", () => {
logger("connected");
disconnectButton.disabled = false;
printButton.disabled = false;
bleConnectButton.disabled = true;
serialConnectButton.disabled = true;
});

client.on("disconnect", () => {
logger("disconnected");
disconnectButton.disabled = true;
printButton.disabled = true;
bleConnectButton.disabled = false;
serialConnectButton.disabled = false;
});

client.on("printprogress", (e) => {
logger(`Page ${e.page}/${e.pagesTotal}, Page print ${e.pagePrintProgress}%, Page feed ${e.pageFeedProgress}%`);
});
};

/** On "Disconnect" clicked */
disconnectButton.onclick = () => {
client.disconnect();
client = null;
}

/** On "Connect BLE" clicked */
bleConnectButton.onclick = async () => {
newClient("ble");

try {
await client.connect();
} catch (e) {
alert(e);
}
};

/** On "Connect Serial" clicked */
serialConnectButton.onclick = async () => {
newClient("serial");

try {
await client.connect();
} catch (e) {
alert(e);
}
};

/** On "Print" clicked */
printButton.onclick = async () => {
/** left or top */
const printDirection = "left";
const quantity = 1;

/** Convert image to black and white bits */
const encoded = ImageEncoder.encodeCanvas(canvas, printDirection);

/** todo: Auto-detection works only for a small set of printers so manual user selection is required */
const printTaskName = client.getPrintTaskType() ?? "D110";

const printTask = client.abstraction.newPrintTask(printTaskName, {
totalPages: quantity,
statusPollIntervalMs: 100,
statusTimeoutMs: 8_000,
});

try {
await printTask.printInit();
await printTask.printPage(encoded, quantity);
await printTask.waitForFinished();
} catch (e) {
alert(e);
} finally {
await client.abstraction.printEnd();
}
};

repaint();

Index

Client

Events

Helpers

Image encoder

Other

Packets

Print tasks

Printer model library