@drincs/pixi-vn 0.6.4 → 0.6.5

package/README.md

@@ -1,13 +1,16 @@
 # Pixi'VN - PixiJS Visual Novel Engine
 
-Pixi'VN is a npm package that provides various features for creating visual novels.
+Pixi’VN is a npm package that provides various features for creating visual novels, has functions to manage story steps, saving and loading, variable storage, dialogues, character,canvas management, and much more.
 
-Pixi'VN has functions to manage story steps, saving and loading, variable storage, dialogues, and character creation.
+Pixi’VN + [Templates](https://pixi-vn.web.app/start/getting-started.html#pivi-vn-templates) provides a complete solution and is in effect a visual novel engine.
 
-Pixi'VN is based on [Pixi.js](https://pixijs.com/), a modern 2D rendering engine, expanding the features by adding a save and load system, and functions to simplify the addition of images and animations.
+It is designed for web developers, with basic experience in JavaScript/TypeScript, who want to create a visual novel with a modern 2D rendering engine and their favorite JavaScript framework.
 
-In addition to managing the Pixi.js "Canvas", Pixi'VN offers the possibility of adding an HTML Element with the same dimensions as the "Canvas" to add interactions with the user.
-This allows the use of systems such as React, Vue, Angular, etc. to create much more complex interfaces with excellent performance.
+It is based on [Pixi.js](https://pixijs.com/), a rendering engine that allows you to create fast 2D graphics. It is based on WebGL and is very fast and efficient. It is used by many developers to create games, websites, and applications.
+
+In addition to managing the Pixi.js "Canvas", Pixi’VN offers the possibility of adding an HTML Element with the same dimensions as the "Canvas" to add interactions with the user.
+
+This allows the use of systems such as React, Vue, Angular, etc. to create much more complex **interface screens** with excellent performance.
 
 ## Wiki
 

package/dist/LabelProps-CFV-zRjG.d.ts

@@ -0,0 +1,113 @@
+import { LabelIdType } from './types/LabelIdType.js';
+import { StepLabelType } from './types/StepLabelType.js';
+import { StepHistoryDataType } from './types/StepHistoryDataType.js';
+
+/**
+ * Label is a class that contains a list of steps, which will be performed as the game continues.
+ * For Ren'py this is the equivalent of a label.
+ * @example
+ * ```typescript
+ * const START_LABEL_ID = "StartLabel"
+ *
+ * export const startLabel = newLabel(START_LABEL_ID,
+ *     [
+ *         (props) => {
+ *             GameWindowManager.clear()
+ *             setDialogue({ character: liam, text: "Which test do you want to perform?" })
+ *             setChoiceMenuOptions([
+ *                 new ChoiceMenuOption("Events Test", eventsTestLabel),
+ *                 new ChoiceMenuOption("Show Image Test", showImageTest),
+ *             ])
+ *         },
+ *         (props) => GameStepManager.jumpLabel(START_LABEL_ID, props),
+ *     ]
+ * )
+ *
+ * GameStepManager.callLabel(StartLabel)
+ * ```
+ */
+declare class Label<T extends {} = {}> {
+    /**
+     * @param id is the id of the label
+     * @param steps is the list of steps that the label will perform
+     * @param props is the properties of the label
+     */
+    constructor(id: LabelIdType, steps: StepLabelType<T>[] | (() => StepLabelType<T>[]), props?: LabelProps<T>);
+    private _id;
+    /**
+     * Get the id of the label. This variable is used in the system to get the label by id, {@link getLabelById}
+     */
+    get id(): LabelIdType;
+    private _steps;
+    /**
+     * Get the steps of the label.
+     * This class should be extended and the steps method should be overridden.
+     * Every time you update this list will also be updated when the other game versions load.
+     */
+    get steps(): StepLabelType<T>[];
+    /**
+     * Get the corresponding steps number
+     * @param externalSteps
+     * @returns Numer of corresponding steps, for example, if externalSteps is [ABC, DEF, GHI] and the steps of the label is [ABC, GHT], the result will be 1
+     */
+    getCorrespondingStepsNumber(externalSteps: StepHistoryDataType[] | StepLabelType[]): number;
+    private _onStepStart;
+    /**
+     * Is a function that will be executed in {@link Label#onStepStart} and when the user goes back to it or when the user laods a save file.
+     * @returns Promise<void> or void
+     */
+    get onStepStart(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _onLoadStep;
+    /**
+     * Get the function that will be executed a old step is reloaded. A step is reloaded when the user goes back to it or when the user laods a save file.
+     * @returns Promise<void> or void
+     */
+    get onLoadStep(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _onStepEnd;
+    /**
+     * Is a function that will be executed when the step ends.
+     * @returns Promise<void> or void
+     */
+    get onStepEnd(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _choiseIndex;
+    get choiseIndex(): number | undefined;
+}
+
+interface LabelProps<T extends {}> {
+    /**
+     * Is a function that will be executed before any step is executed, is useful for example to make sure all images used have been cached.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     * @example
+     * ```typescript
+     * newLabel("id", [], {
+     *     onStepStart: async (stepIndex, label) => {
+     *         await Assets.load('path/to/image1.png')
+     *         await Assets.load('path/to/image2.png')
+     *     }
+     * })
+     * ```
+     */
+    onStepStart?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is a function that will be executed in {@link Label#onStepStart} and when the user goes back to it or when the user laods a save file.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     */
+    onLoadStep?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is a function that will be executed when the step ends.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     */
+    onStepEnd?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is the index of the choice that the label will perform. This variable is used in the system.
+     */
+    choiseIndex?: number;
+}
+
+export { Label as L, type LabelProps as a };

package/dist/LabelProps-CmRpvUJm.d.mts

@@ -0,0 +1,113 @@
+import { LabelIdType } from './types/LabelIdType.mjs';
+import { StepLabelType } from './types/StepLabelType.mjs';
+import { StepHistoryDataType } from './types/StepHistoryDataType.mjs';
+
+/**
+ * Label is a class that contains a list of steps, which will be performed as the game continues.
+ * For Ren'py this is the equivalent of a label.
+ * @example
+ * ```typescript
+ * const START_LABEL_ID = "StartLabel"
+ *
+ * export const startLabel = newLabel(START_LABEL_ID,
+ *     [
+ *         (props) => {
+ *             GameWindowManager.clear()
+ *             setDialogue({ character: liam, text: "Which test do you want to perform?" })
+ *             setChoiceMenuOptions([
+ *                 new ChoiceMenuOption("Events Test", eventsTestLabel),
+ *                 new ChoiceMenuOption("Show Image Test", showImageTest),
+ *             ])
+ *         },
+ *         (props) => GameStepManager.jumpLabel(START_LABEL_ID, props),
+ *     ]
+ * )
+ *
+ * GameStepManager.callLabel(StartLabel)
+ * ```
+ */
+declare class Label<T extends {} = {}> {
+    /**
+     * @param id is the id of the label
+     * @param steps is the list of steps that the label will perform
+     * @param props is the properties of the label
+     */
+    constructor(id: LabelIdType, steps: StepLabelType<T>[] | (() => StepLabelType<T>[]), props?: LabelProps<T>);
+    private _id;
+    /**
+     * Get the id of the label. This variable is used in the system to get the label by id, {@link getLabelById}
+     */
+    get id(): LabelIdType;
+    private _steps;
+    /**
+     * Get the steps of the label.
+     * This class should be extended and the steps method should be overridden.
+     * Every time you update this list will also be updated when the other game versions load.
+     */
+    get steps(): StepLabelType<T>[];
+    /**
+     * Get the corresponding steps number
+     * @param externalSteps
+     * @returns Numer of corresponding steps, for example, if externalSteps is [ABC, DEF, GHI] and the steps of the label is [ABC, GHT], the result will be 1
+     */
+    getCorrespondingStepsNumber(externalSteps: StepHistoryDataType[] | StepLabelType[]): number;
+    private _onStepStart;
+    /**
+     * Is a function that will be executed in {@link Label#onStepStart} and when the user goes back to it or when the user laods a save file.
+     * @returns Promise<void> or void
+     */
+    get onStepStart(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _onLoadStep;
+    /**
+     * Get the function that will be executed a old step is reloaded. A step is reloaded when the user goes back to it or when the user laods a save file.
+     * @returns Promise<void> or void
+     */
+    get onLoadStep(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _onStepEnd;
+    /**
+     * Is a function that will be executed when the step ends.
+     * @returns Promise<void> or void
+     */
+    get onStepEnd(): ((stepIndex: number, label: Label<T>) => void | Promise<void>) | undefined;
+    private _choiseIndex;
+    get choiseIndex(): number | undefined;
+}
+
+interface LabelProps<T extends {}> {
+    /**
+     * Is a function that will be executed before any step is executed, is useful for example to make sure all images used have been cached.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     * @example
+     * ```typescript
+     * newLabel("id", [], {
+     *     onStepStart: async (stepIndex, label) => {
+     *         await Assets.load('path/to/image1.png')
+     *         await Assets.load('path/to/image2.png')
+     *     }
+     * })
+     * ```
+     */
+    onStepStart?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is a function that will be executed in {@link Label#onStepStart} and when the user goes back to it or when the user laods a save file.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     */
+    onLoadStep?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is a function that will be executed when the step ends.
+     * @param stepIndex Step index
+     * @param label Label
+     * @returns
+     */
+    onStepEnd?: (stepIndex: number, label: Label<T>) => void | Promise<void>;
+    /**
+     * Is the index of the choice that the label will perform. This variable is used in the system.
+     */
+    choiseIndex?: number;
+}
+
+export { Label as L, type LabelProps as a };

package/dist/classes/CharacterBaseModel.js

@@ -133,8 +133,6 @@ function getMemoryContainer(element) {
   };
 }
 function setMemoryContainer(element, memory) {
-  memory.width && (element.width = memory.width);
-  memory.height && (element.height = memory.height);
   memory.isRenderGroup && (element.isRenderGroup = memory.isRenderGroup);
   memory.blendMode && (element.blendMode = memory.blendMode);
   memory.tint && (element.tint = memory.tint);
@@ -167,6 +165,8 @@ function setMemoryContainer(element, memory) {
   memory.interactive && (element.interactive = memory.interactive);
   memory.interactiveChildren && (element.interactiveChildren = memory.interactiveChildren);
   memory.hitArea && (element.hitArea = memory.hitArea);
+  memory.width && (element.width = memory.width);
+  memory.height && (element.height = memory.height);
 }
 function getTexture(imageUrl) {
   return __async(this, null, function* () {
@@ -702,8 +702,9 @@ FadeAlphaTicker = __decorateClass([
 ], FadeAlphaTicker);
 
 // src/functions/TickerUtility.ts
-function updateTickerProgression(args, propertyName, progression) {
-  if (args[propertyName] === void 0 || !progression || args[propertyName] === progression.limit) {
+function updateTickerProgression(args, propertyName, progression, valueConvert) {
+  let limit = valueConvert && progression.limit ? valueConvert(progression.limit) : progression.limit;
+  if (args[propertyName] === void 0 || !progression || args[propertyName] === limit) {
     return;
   }
   if (typeof args[propertyName] === "number") {
@@ -722,22 +723,25 @@ function updateTickerProgression(args, propertyName, progression) {
     }
   }
 }
-function getLinearProgression(number, progression) {
-  if (progression.limit !== void 0) {
-    if (number > progression.limit && progression.amt > 0) {
-      return progression.limit;
-    } else if (number < progression.limit && progression.amt < 0) {
-      return progression.limit;
+function getLinearProgression(number, progression, valueConvert) {
+  let limit = valueConvert && progression.limit ? valueConvert(progression.limit) : progression.limit;
+  let amt = valueConvert ? valueConvert(progression.amt) : progression.amt;
+  if (limit !== void 0) {
+    if (number > limit && amt > 0) {
+      return limit;
+    } else if (number < limit && amt < 0) {
+      return limit;
     }
   }
-  return number + progression.amt / 60;
+  return number + amt;
 }
-function getExponentialProgression(number, progression) {
-  if (progression.limit !== void 0) {
-    if (number > progression.limit && progression.percentage > 0) {
-      return progression.limit;
-    } else if (number < progression.limit && progression.percentage < 0) {
-      return progression.limit;
+function getExponentialProgression(number, progression, valueConvert) {
+  let limit = valueConvert && progression.limit ? valueConvert(progression.limit) : progression.limit;
+  if (limit !== void 0) {
+    if (number > limit && progression.percentage > 0) {
+      return limit;
+    } else if (number < limit && progression.percentage < 0) {
+      return limit;
     }
   }
   return number + number * progression.percentage;
@@ -750,15 +754,13 @@ var MoveTicker = class extends TickerBase {
     let ySpeed = 1;
     if (args.speed) {
       if (typeof args.speed === "number") {
-        xSpeed = args.speed;
-        ySpeed = args.speed;
+        xSpeed = this.speedConvert(args.speed);
+        ySpeed = this.speedConvert(args.speed);
       } else {
-        xSpeed = args.speed.x;
-        ySpeed = args.speed.y;
+        xSpeed = this.speedConvert(args.speed.x);
+        ySpeed = this.speedConvert(args.speed.y);
       }
     }
-    xSpeed /= 60;
-    ySpeed /= 60;
     let destination = args.destination;
     let tagToRemoveAfter2 = args.tagToRemoveAfter || [];
     if (typeof tagToRemoveAfter2 === "string") {
@@ -798,7 +800,10 @@ var MoveTicker = class extends TickerBase {
       }
     });
     if (args.speedProgression)
-      updateTickerProgression(args, "speed", args.speedProgression);
+      updateTickerProgression(args, "speed", args.speedProgression, this.speedConvert);
+  }
+  speedConvert(speed) {
+    return speed / 6;
   }
 };
 MoveTicker = __decorateClass([
@@ -806,7 +811,7 @@ MoveTicker = __decorateClass([
 ], MoveTicker);
 var RotateTicker = class extends TickerBase {
   fn(ticker, args, tags, tickerId) {
-    let speed = (args.speed === void 0 ? 1 : args.speed) / 60;
+    let speed = this.speedConvert(args.speed === void 0 ? 1 : args.speed);
     let clockwise = args.clockwise === void 0 ? true : args.clockwise;
     let tagToRemoveAfter2 = args.tagToRemoveAfter || [];
     if (typeof tagToRemoveAfter2 === "string") {
@@ -834,7 +839,10 @@ var RotateTicker = class extends TickerBase {
       }
     });
     if (args.speedProgression)
-      updateTickerProgression(args, "speed", args.speedProgression);
+      updateTickerProgression(args, "speed", args.speedProgression, this.speedConvert);
+  }
+  speedConvert(speed) {
+    return speed / 60;
   }
 };
 RotateTicker = __decorateClass([
@@ -846,15 +854,13 @@ var ZoomTicker = class extends TickerBase {
     let ySpeed = 0.1;
     if (args.speed) {
       if (typeof args.speed === "number") {
-        xSpeed = args.speed;
-        ySpeed = args.speed;
+        xSpeed = this.speedConvert(args.speed);
+        ySpeed = this.speedConvert(args.speed);
       } else {
-        xSpeed = args.speed.x;
-        ySpeed = args.speed.y;
+        xSpeed = this.speedConvert(args.speed.x);
+        ySpeed = this.speedConvert(args.speed.y);
       }
     }
-    xSpeed /= 60;
-    ySpeed /= 60;
     let tagToRemoveAfter2 = args.tagToRemoveAfter || [];
     if (typeof tagToRemoveAfter2 === "string") {
       tagToRemoveAfter2 = [tagToRemoveAfter2];
@@ -921,7 +927,10 @@ var ZoomTicker = class extends TickerBase {
       }
     });
     if (args.speedProgression)
-      updateTickerProgression(args, "speed", args.speedProgression);
+      updateTickerProgression(args, "speed", args.speedProgression, this.speedConvert);
+  }
+  speedConvert(speed) {
+    return speed / 60;
   }
   onEndOfTicker(tag, tickerId, _element, tagToRemoveAfter2) {
     GameWindowManager.onEndOfTicker(tag, this, tagToRemoveAfter2, tickerId);