@infernus/progress

 !npm !npm bundle size

A progress bar based on LD_SPAC:white for precise control for samp-node.

Getting started

``sh
pnpm add @infernus/core @infernus/progress
`

Example

`ts
import { GameMode, PlayerEvent } from "@infernus/core";
import { ProgressBar, ProgressBarDirectionEnum } from "@infernus/progress";

const gBar: ProgressBar[] = [];
const gBarValue: number[] = [5.0, 5.0, 5.0, 5.0];
const gInc: number[] = [1.0, 1.0, 1.0, 1.0];

let timer: NodeJS.Timeout | null = null;

PlayerEvent.onConnect(({ player, next }) => {
player.charset = "iso-8859-1";

if (player.id !== 0) return next();

const centerX = 320.0;
const centerY = 240.0;
const barLength = 60.0;
const barThickness = 6.0;
const centerGap = 10.0;
const halfThickness = barThickness / 2;
const halfGap = centerGap / 2;

gBar[0] = new ProgressBar({
player,
x: centerX - barLength - halfGap,
y: centerY - halfThickness,
width: barLength,
height: barThickness,
color: 0x11acffff,
max: barLength,
min: 0,
direction: ProgressBarDirectionEnum.left,
value: barLength / 2,
show: true,
}).create();

gBar[1] = new ProgressBar({
player,
x: centerX - halfThickness,
y: centerY - barLength - halfGap,
width: barThickness,
height: barLength,
color: 0xcfcf11ff,
max: barLength,
min: 0,
direction: ProgressBarDirectionEnum.down,
value: barLength / 2,
show: true,
}).create();

gBar[2] = new ProgressBar({
player,
x: centerX - halfThickness,
y: centerY + halfGap,
width: barThickness,
height: barLength,
color: 0xac11ffff,
max: barLength,
min: 0,
direction: ProgressBarDirectionEnum.up,
value: barLength / 2,
show: true,
}).create();

gBar[3] = new ProgressBar({
player,
x: centerX + halfGap,
y: centerY - halfThickness,
width: barLength,
height: barThickness,
color: 0xcfcaf1ff,
max: barLength,
min: 0,
direction: ProgressBarDirectionEnum.right,
value: barLength / 2,
show: true,
}).create();

if (timer) clearInterval(timer);
timer = setInterval(updateBar, 100);

return next();
});

GameMode.onExit(({ next }) => {
if (timer) clearInterval(timer);
timer = null;
return next();
});

PlayerEvent.onDisconnect(({ player, next }) => {
if (player.id !== 0) return next();
if (timer) clearInterval(timer);
timer = null;
gBar.length = 0;
return next();
});

function updateBar() {
for (let i = 0; i < 4; i++) {
const max = gBar[i].getMaxValue();
const min = gBar[i].getMinValue();

if (gBarValue[i] >= max) gInc[i] = -1.0;
if (gBarValue[i] <= min) gInc[i] = 1.0;

gBarValue[i] += gInc[i];
gBar[i].setValue(gBarValue[i]);
}
}

PlayerEvent.onCommandText("showbar", ({ next }) => {
gBar.forEach((bar) => bar.show());
return next();
});

PlayerEvent.onCommandText("hidebar", ({ next }) => {
gBar.forEach((bar) => bar.hide());
return next();
});

PlayerEvent.onCommandText("delbar", ({ next }) => {
gBar.forEach((bar) => bar.destroy());
gBar.length = 0;
return next();
});

PlayerEvent.onCommandText("barv", ({ player, subcommand, next }) => {
const value = +subcommand[0] || 0;
gBar[0].setValue(value);
player.sendClientMessage(-1, Value: ${gBar[0].getValue()});
return next();
});

PlayerEvent.onCommandText("barm", ({ player, subcommand, next }) => {
const value = +subcommand[0] || 0;
gBar[0].setMaxValue(value);
player.sendClientMessage(-1, MaxValue: ${gBar[0].getMaxValue()});
return next();
});

PlayerEvent.onCommandText("barc", ({ subcommand, next }) => {
const value = +subcommand[0] || 0;
gBar[0].setColor(value);
return next();
});

PlayerEvent.onCommandText("barp", ({ player, subcommand, next }) => {
if (subcommand.length !== 4) {
player.sendClientMessage(-1, "Usage: /barp x y width height");
return next();
}
const [w, y, x, h] = subcommand.map((v) => +v || 0);
gBar[0].setPos(x, y);
gBar[0].setWidth(w);
gBar[0].setHeight(h);
return next();
});
``