@drincs/pixi-vn 0.8.4 → 0.8.9

package/dist/index.cjs

@@ -1607,14 +1607,14 @@ var init_uid = __esm({
 });
 
 // node_modules/pixi.js/lib/utils/logging/deprecation.mjs
-function deprecation(version, message, ignoreDepth = 3) {
+function deprecation(version2, message, ignoreDepth = 3) {
   if (warnings[message]) {
     return;
   }
   let stack = new Error().stack;
   if (typeof stack === "undefined") {
     console.warn("PixiJS Deprecation Warning: ", `${message}
-Deprecated since v${version}`);
+Deprecated since v${version2}`);
   } else {
     stack = stack.split("\n").splice(ignoreDepth).join("\n");
     if (console.groupCollapsed) {
@@ -1623,13 +1623,13 @@ Deprecated since v${version}`);
         "color:#614108;background:#fffbe6",
         "font-weight:normal;color:#614108;background:#fffbe6",
         `${message}
-Deprecated since v${version}`
+Deprecated since v${version2}`
       );
       console.warn(stack);
       console.groupEnd();
     } else {
       console.warn("PixiJS Deprecation Warning: ", `${message}
-Deprecated since v${version}`);
+Deprecated since v${version2}`);
       console.warn(stack);
     }
   }
@@ -42998,7 +42998,7 @@ var require_dom = __commonJS({
        * @see https://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-5CED94D7 DOM Level 1 Core
        * @see https://dom.spec.whatwg.org/#dom-domimplementation-hasfeature DOM Living Standard
        */
-      hasFeature: function(feature, version) {
+      hasFeature: function(feature, version2) {
         return true;
       },
       /**
@@ -43119,8 +43119,8 @@ var require_dom = __commonJS({
         }
       },
       // Introduced in DOM Level 2:
-      isSupported: function(feature, version) {
-        return this.ownerDocument.implementation.hasFeature(feature, version);
+      isSupported: function(feature, version2) {
+        return this.ownerDocument.implementation.hasFeature(feature, version2);
       },
       // Introduced in DOM Level 2:
       hasAttributes: function() {
@@ -54699,6 +54699,7 @@ var require_deep_diff = __commonJS({
 var src_exports = {};
 __export(src_exports, {
   Assets: () => Assets,
+  CANVAS_APP_STAGE_ALIAS: () => CANVAS_APP_STAGE_ALIAS,
   CanvasBase: () => CanvasBase2,
   CanvasContainer: () => CanvasContainer,
   CanvasEvent: () => CanvasEvent,
@@ -54760,6 +54761,8 @@ __export(src_exports, {
   narration: () => narration,
   newLabel: () => newLabel,
   pixivnTestStartLabel: () => pixivnTestStartLabel,
+  pushIn: () => pushIn,
+  pushOut: () => pushOut,
   removeCanvasElement: () => removeCanvasElement,
   removeWithDissolveTransition: () => removeWithDissolveTransition,
   removeWithFadeTransition: () => removeWithFadeTransition,
@@ -54768,6 +54771,7 @@ __export(src_exports, {
   setChoiceMenuOptions: () => setChoiceMenuOptions,
   setDialogue: () => setDialogue,
   setFlag: () => setFlag,
+  shakeEffect: () => shakeEffect,
   showImage: () => showImage,
   showVideo: () => showVideo,
   showWithDissolveTransition: () => showWithDissolveTransition,
@@ -57483,8 +57487,10 @@ extensions.add(soundAsset);
 // node_modules/@pixi/sound/lib/index.mjs
 var sound = setInstance(new SoundLibrary());
 
+// package.json
+var version = "0.8.9";
+
 // src/constants.ts
-var PIXIVN_VERSION = "0.8.3";
 var Repeat = "repeat";
 function Pause(duration) {
   return {
@@ -57603,6 +57609,7 @@ var videoFormats = [
   "asf",
   "vob"
 ];
+var CANVAS_APP_STAGE_ALIAS = "_stage_";
 
 // src/managers/CanvasManager.ts
 init_lib();
@@ -57955,7 +57962,7 @@ function createExportableElement(element) {
     let elementString = JSON.stringify(element);
     return JSON.parse(elementString);
   } catch (e2) {
-    console.error("[Pixi\u2019VN] Error creating exportable element", e2);
+    console.error("[Pixi\u2019VN] Error creating exportable element", element, e2);
     throw new Error("[Pixi\u2019VN] Error creating exportable element");
   }
 }
@@ -58388,6 +58395,10 @@ var CanvasManager = class {
    * ```
    */
   add(alias, canvasElement, options = {}) {
+    if (alias === CANVAS_APP_STAGE_ALIAS) {
+      console.error(`[Pixi\u2019VN] The alias ${CANVAS_APP_STAGE_ALIAS} is reserved`);
+      return;
+    }
     let ignoreOldStyle = options?.ignoreOldStyle;
     let oldCanvasElement = this.find(alias);
     if (oldCanvasElement) {
@@ -58418,6 +58429,10 @@ var CanvasManager = class {
    * ```
    */
   remove(alias, options = {}) {
+    if (alias === CANVAS_APP_STAGE_ALIAS) {
+      console.error(`[Pixi\u2019VN] The alias ${CANVAS_APP_STAGE_ALIAS} is reserved`);
+      return;
+    }
     let ignoreTickers = options.ignoreTickers;
     if (typeof alias === "string") {
       alias = [alias];
@@ -58446,6 +58461,9 @@ var CanvasManager = class {
    * ```
    */
   find(alias) {
+    if (alias === CANVAS_APP_STAGE_ALIAS) {
+      return this.app.stage;
+    }
     return CanvasManagerStatic._children[alias];
   }
   /**
@@ -58472,16 +58490,17 @@ var CanvasManager = class {
     this.removeAllTickers();
   }
   /**
-   * Edit the alias of a canvas element.
+   * Edit the alias of a canvas element. The tickers that are connected to the canvas element will be transferred.
    * @param oldAlias The old alias of the canvas element.
    * @param newAlias The new alias of the canvas element.
+   * @param options The options of the canvas element.
    */
-  editAlias(oldAlias, newAlias) {
+  editAlias(oldAlias, newAlias, options = {}) {
     if (CanvasManagerStatic._children[oldAlias]) {
       CanvasManagerStatic._children[newAlias] = CanvasManagerStatic._children[oldAlias];
       delete CanvasManagerStatic._children[oldAlias];
     }
-    this.transferTickers(oldAlias, newAlias, "move");
+    !options.ignoreTickers && this.transferTickers(oldAlias, newAlias, "move");
   }
   /** Edit Tickers Methods */
   /**
@@ -58556,12 +58575,16 @@ var CanvasManager = class {
   pushTicker(id3, tickerData, ticker) {
     CanvasManagerStatic._currentTickers[id3] = tickerData;
     tickerData.fn = (t2) => {
-      if (tickerData.createdByTicketSteps && this.isTickerPaused(tickerData.createdByTicketSteps.canvasElementAlias, tickerData.createdByTicketSteps.id)) {
-        return;
-      }
       let data = CanvasManagerStatic._currentTickers[id3];
       if (data) {
-        let canvasElementAliases = data.canvasElementAliases.filter((alias) => !this.isTickerPaused(alias, id3));
+        let canvasElementAliases = data.canvasElementAliases;
+        if (tickerData.createdByTicketSteps) {
+          if (this.isTickerPaused(tickerData.createdByTicketSteps.canvasElementAlias, tickerData.createdByTicketSteps.id)) {
+            return;
+          }
+        } else {
+          canvasElementAliases = canvasElementAliases.filter((alias) => !this.isTickerPaused(alias, id3));
+        }
         ticker?.fn(t2, data.args, canvasElementAliases, id3);
       }
     };
@@ -58908,15 +58931,19 @@ var CanvasManager = class {
     });
     CanvasManagerStatic._tickersMustBeCompletedBeforeNextStep.stepAlias.forEach(({ alias, id: id3 }) => {
       let ticker = CanvasManagerStatic._currentTickersSteps[alias];
-      if (ticker && ticker[id3] && !ticker[id3].steps.includes(Repeat)) {
-        ticker[id3].steps.forEach((step) => {
-          if (typeof step === "object" && "ticker" in step) {
-            let ticker2 = geTickerInstanceById(step.ticker, step.args, step.duration, step.priority);
-            if (ticker2) {
-              ticker2.onEndOfTicker([alias], id3, step.args);
+      if (ticker && ticker[id3]) {
+        if (ticker[id3].steps.includes(Repeat)) {
+          console.error(`[Pixi\u2019VN] The ticker alias: ${alias} id: ${id3} contains a RepeatType, so it can't be forced to complete`, ticker[id3]);
+        } else {
+          ticker[id3].steps.forEach((step) => {
+            if (typeof step === "object" && "ticker" in step) {
+              let ticker2 = geTickerInstanceById(step.ticker, step.args, step.duration, step.priority);
+              if (ticker2) {
+                ticker2.onEndOfTicker([alias], id3, step.args);
+              }
             }
-          }
-        });
+          });
+        }
       }
     });
     CanvasManagerStatic._tickersMustBeCompletedBeforeNextStep = { tikersIds: [], stepAlias: [] };
@@ -58957,6 +58984,7 @@ var CanvasManager = class {
       tickers: createExportableElement(CanvasManagerStatic.currentTickersWithoutCreatedBySteps),
       tickersSteps: createExportableElement(CanvasManagerStatic._currentTickersSteps),
       elements: createExportableElement(currentElements),
+      stage: createExportableElement(getMemoryContainer(this.app.stage)),
       elementAliasesOrder: createExportableElement(CanvasManagerStatic.childrenAliasesOrder),
       tickersOnPause: createExportableElement(CanvasManagerStatic._tickersOnPause)
     };
@@ -58990,6 +59018,11 @@ var CanvasManager = class {
         console.error("[Pixi\u2019VN] The data does not have the properties elementAliasesOrder and elements");
         return;
       }
+      if (data.hasOwnProperty("stage") && data.hasOwnProperty("stage")) {
+        setMemoryContainer(this.app.stage, data["stage"]);
+      } else {
+        console.error("[Pixi\u2019VN] The data does not have the properties stage");
+      }
       if (data.hasOwnProperty("tickers")) {
         let tickers = data["tickers"];
         Object.entries(tickers).forEach(([oldId, t2]) => {
@@ -59457,8 +59490,8 @@ function getExponentialProgression(number, progression, valueConvert) {
 // src/classes/ticker/MoveTicker.ts
 var MoveTicker = class extends TickerBase {
   fn(ticker, args, aliases, tickerId) {
-    let xSpeed = 1;
-    let ySpeed = 1;
+    let xSpeed = 10;
+    let ySpeed = 10;
     if (args.speed) {
       if (typeof args.speed === "number") {
         xSpeed = this.speedConvert(args.speed);
@@ -59522,6 +59555,10 @@ var MoveTicker = class extends TickerBase {
         let destination = args.destination;
         element.x = destination.x;
         element.y = destination.y;
+        if (args.isPushInOut && element.children.length > 0) {
+          let elementChild = element.children[0];
+          canvas.add(alias2, elementChild, { ignoreOldStyle: true });
+        }
       }
     });
     super.onEndOfTicker(alias, tickerId, args);
@@ -59712,6 +59749,88 @@ ZoomTicker = __decorateClass([
   tickerDecorator()
 ], ZoomTicker);
 
+// src/functions/canvas/canvas-effect.ts
+async function shakeEffect(alias, props = {}, priority) {
+  let elemet = canvas.find(alias);
+  if (!elemet) {
+    console.error(`[Pixi\u2019VN] The element with the alias ${alias} does not exist. So the shake effect can't be applied.`);
+    return;
+  }
+  let position = { x: elemet.position.x, y: elemet.position.y };
+  let speed = props.speed || 20;
+  let speedProgression = props.speedProgression || void 0;
+  let startOnlyIfHaveTexture = props.startOnlyIfHaveTexture || false;
+  let type = props.type || "horizontal";
+  let maximumShockSize = props.maximumShockSize || 10;
+  let shocksNumber = (props.shocksNumber || 10) - 1;
+  if (shocksNumber < 2) {
+    console.error("[Pixi\u2019VN] The number of shocks must be at least 3.");
+    return;
+  }
+  let upshocksNumber = Math.floor(shocksNumber / 2);
+  let downshocksNumber = Math.ceil(shocksNumber / 2);
+  let moveTickers = [];
+  for (let i3 = 0; i3 < upshocksNumber; i3++) {
+    let destination = { x: position.x, y: position.y };
+    let shockSize = maximumShockSize * (i3 + 1) / upshocksNumber;
+    if (type === "horizontal") {
+      if (i3 % 2 !== 0) {
+        destination.x = position.x + shockSize;
+      } else {
+        destination.x = position.x - shockSize;
+      }
+    } else {
+      if (i3 % 2 !== 0) {
+        destination.y = position.y + shockSize;
+      } else {
+        destination.y = position.y - shockSize;
+      }
+    }
+    moveTickers.push(new MoveTicker({
+      destination,
+      speed,
+      speedProgression,
+      startOnlyIfHaveTexture
+    }, void 0, priority));
+  }
+  let lastItemIsLeft = upshocksNumber % 2 === 0;
+  for (let i3 = downshocksNumber; i3 > 0; i3--) {
+    let destination = { x: position.x, y: position.y };
+    let shockSize = maximumShockSize * (i3 + 1) / (downshocksNumber - 1);
+    if (type === "horizontal") {
+      if (i3 % 2 === 0 && !lastItemIsLeft || i3 % 2 !== 0 && lastItemIsLeft) {
+        destination.x = position.x - shockSize;
+      } else {
+        destination.x = position.x + shockSize;
+      }
+    } else {
+      if (i3 % 2 === 0 && !lastItemIsLeft || i3 % 2 !== 0 && lastItemIsLeft) {
+        destination.y = position.y - shockSize;
+      } else {
+        destination.y = position.y + shockSize;
+      }
+    }
+    moveTickers.push(new MoveTicker({
+      destination,
+      speed,
+      speedProgression,
+      startOnlyIfHaveTexture
+    }, void 0, priority));
+  }
+  moveTickers.push(new MoveTicker({
+    destination: position,
+    speed,
+    speedProgression,
+    startOnlyIfHaveTexture,
+    tickerAliasToResume: alias
+  }, void 0, priority));
+  let id3 = canvas.addTickersSteps(alias, moveTickers);
+  if (id3) {
+    canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3, alias });
+    canvas.putOnPauseTicker(alias, id3);
+  }
+}
+
 // src/functions/canvas/image-utility.ts
 function addImage(alias, imageUrl) {
   let image = new CanvasImage();
@@ -59778,6 +59897,7 @@ async function showVideo(alias, videoUrl) {
 
 // src/functions/canvas/canvas-transition.ts
 async function showWithDissolveTransition(alias, image, props = {}, priority) {
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
   let oldCanvasAlias = void 0;
   if (canvas.find(alias)) {
     oldCanvasAlias = alias + "_temp_disolve";
@@ -59807,10 +59927,13 @@ async function showWithDissolveTransition(alias, image, props = {}, priority) {
     startOnlyIfHaveTexture: true
   }, 10, priority);
   let id3 = canvas.addTicker(alias, effect);
-  id3 && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
-  return;
+  if (id3) {
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
 }
 function removeWithDissolveTransition(alias, props = {}, priority) {
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
   if (typeof alias === "string") {
     alias = [alias];
   }
@@ -59820,12 +59943,17 @@ function removeWithDissolveTransition(alias, props = {}, priority) {
     aliasToRemoveAfter: alias,
     startOnlyIfHaveTexture: true
   }, 10, priority);
-  canvas.addTicker(alias, effect);
+  let id3 = canvas.addTicker(alias, effect);
+  if (id3) {
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
 }
 async function showWithFadeTransition(alias, image, props = {}, priority) {
   if (!canvas.find(alias)) {
     return showWithDissolveTransition(alias, image, props, priority);
   }
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
   let oldCanvasAlias = alias + "_temp_fade";
   canvas.editAlias(alias, oldCanvasAlias);
   let canvasElement;
@@ -59861,14 +59989,23 @@ async function showWithFadeTransition(alias, image, props = {}, priority) {
       aliasToRemoveAfter: oldCanvasAlias
     }, void 0, priority)
   ]);
-  id1 && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id1, alias });
-  id22 && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id22, alias });
+  let res = void 0;
+  if (id1) {
+    res = [id1];
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id1, alias });
+  }
+  if (id22) {
+    res ? res.push(id22) : res = [id22];
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id22, alias });
+  }
+  return res;
 }
 function removeWithFadeTransition(alias, props = {}, priority) {
   return removeWithDissolveTransition(alias, props, priority);
 }
 async function moveIn(alias, image, props = {}, priority) {
   let direction = props.direction || "right";
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
   let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
   tickerAliasToResume.push(alias);
   let canvasElement;
@@ -59909,10 +60046,15 @@ async function moveIn(alias, image, props = {}, priority) {
   let id3 = canvas.addTicker(alias, effect);
   if (id3) {
     canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
   }
 }
 function moveOut(alias, props = {}, priority) {
   let direction = props.direction || "right";
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
+  let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
+  tickerAliasToResume.push(alias);
   let canvasElement = canvas.find(alias);
   if (!canvasElement) {
     console.warn("[Pixi\u2019VN] The canvas element is not found.");
@@ -59935,13 +60077,20 @@ function moveOut(alias, props = {}, priority) {
   }
   let effect = new MoveTicker({
     ...props,
+    tickerAliasToResume,
     destination,
     startOnlyIfHaveTexture: true,
     aliasToRemoveAfter: alias
   }, void 0, priority);
-  canvas.addTicker(alias, effect);
+  let id3 = canvas.addTicker(alias, effect);
+  if (id3) {
+    canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
 }
 async function zoomIn(alias, image, props = { direction: "right" }, priority) {
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
   let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
   tickerAliasToResume.push(alias);
   let canvasElement;
@@ -59954,7 +60103,9 @@ async function zoomIn(alias, image, props = { direction: "right" }, priority) {
   } else {
     canvasElement = image;
   }
-  canvas.copyCanvasElementProperty(alias, canvasElement);
+  if (canvas.find(alias)) {
+    canvas.copyCanvasElementProperty(alias, canvasElement);
+  }
   let container = new CanvasContainer();
   container.addChild(canvasElement);
   container.height = canvas.canvasHeight;
@@ -59996,9 +60147,14 @@ async function zoomIn(alias, image, props = { direction: "right" }, priority) {
   let id3 = canvas.addTicker(alias, effect);
   if (id3) {
     canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
   }
 }
 function zoomOut(alias, props = { direction: "right" }, priority) {
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
+  let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
+  tickerAliasToResume.push(alias);
   let canvasElement = canvas.find(alias);
   if (!canvasElement) {
     console.warn("[Pixi\u2019VN] The canvas element is not found.");
@@ -60033,13 +60189,116 @@ function zoomOut(alias, props = { direction: "right" }, priority) {
   container.scale.set(1);
   let effect = new ZoomTicker({
     ...props,
+    tickerAliasToResume,
     startOnlyIfHaveTexture: true,
     type: "unzoom",
     limit: 0,
     aliasToRemoveAfter: alias,
     isZoomInOut: true
   }, void 0, priority);
-  canvas.addTicker(alias, effect);
+  let id3 = canvas.addTicker(alias, effect);
+  if (id3) {
+    canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
+}
+async function pushIn(alias, image, props = { direction: "right" }, priority) {
+  let oldCanvasAlias = alias + "_temp_push";
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
+  let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
+  tickerAliasToResume.push(alias);
+  let canvasElement;
+  if (typeof image === "string") {
+    if (checkIfVideo(image)) {
+      canvasElement = new CanvasVideo({}, image);
+    } else {
+      canvasElement = new CanvasImage({}, image);
+    }
+  } else {
+    canvasElement = image;
+  }
+  let oldCanvas = canvas.find(alias);
+  if (oldCanvas) {
+    canvas.copyCanvasElementProperty(oldCanvas, canvasElement);
+    canvas.editAlias(alias, oldCanvasAlias, { ignoreTickers: true });
+    pushOut(oldCanvasAlias, props, priority);
+  }
+  let container = new CanvasContainer();
+  container.height = canvas.canvasHeight;
+  container.width = canvas.canvasWidth;
+  container.addChild(canvasElement);
+  canvas.add(alias, container, { ignoreOldStyle: true });
+  if (canvasElement instanceof CanvasImage && canvasElement.texture?.label == "EMPTY") {
+    await canvasElement.load();
+  }
+  if (props.direction == "up") {
+    container.x = 0;
+    container.y = -canvas.canvasHeight;
+  } else if (props.direction == "down") {
+    container.x = 0;
+    container.y = canvas.canvasHeight;
+  } else if (props.direction == "left") {
+    container.x = canvas.canvasWidth;
+    container.y = 0;
+  } else if (props.direction == "right") {
+    container.x = -canvas.canvasWidth;
+    container.y = 0;
+  }
+  let effect = new MoveTicker({
+    ...props,
+    tickerAliasToResume,
+    startOnlyIfHaveTexture: true,
+    isPushInOut: true,
+    destination: { x: 0, y: 0 }
+  }, void 0, priority);
+  let id3 = canvas.addTicker(alias, effect);
+  if (id3) {
+    canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
+}
+function pushOut(alias, props = { direction: "right" }, priority) {
+  let mustBeCompletedBeforeNextStep = props.mustBeCompletedBeforeNextStep ?? true;
+  let tickerAliasToResume = typeof props.tickerAliasToResume === "string" ? [props.tickerAliasToResume] : props.tickerAliasToResume || [];
+  tickerAliasToResume.push(alias);
+  let canvasElement = canvas.find(alias);
+  if (!canvasElement) {
+    console.warn("[Pixi\u2019VN] The canvas element is not found.");
+    return;
+  }
+  let container = new CanvasContainer();
+  container.pivot.x = 0;
+  container.pivot.y = 0;
+  container.x = 0;
+  container.y = 0;
+  container.addChild(canvasElement);
+  canvas.add(alias, container, { ignoreOldStyle: true });
+  let destination = { x: 0, y: 0 };
+  if (props.direction == "up") {
+    destination.y = canvas.canvasHeight;
+  } else if (props.direction == "down") {
+    destination.y = -canvas.canvasHeight;
+  } else if (props.direction == "left") {
+    destination.x = -canvas.canvasWidth;
+  } else if (props.direction == "right") {
+    destination.x = canvas.canvasWidth;
+  }
+  let effect = new MoveTicker({
+    ...props,
+    tickerAliasToResume,
+    startOnlyIfHaveTexture: true,
+    destination,
+    aliasToRemoveAfter: alias,
+    isPushInOut: true
+  }, void 0, priority);
+  let id3 = canvas.addTicker(alias, effect);
+  if (id3) {
+    canvas.putOnPauseTicker(alias, id3);
+    mustBeCompletedBeforeNextStep && canvas.addTickerMustBeCompletedBeforeNextStep({ id: id3 });
+    return [id3];
+  }
 }
 
 // src/functions/dialogue-utility.ts
@@ -60102,7 +60361,7 @@ function getGamePath() {
 // src/functions/saves-utility.ts
 function getSaveData() {
   return {
-    pixivn_version: PIXIVN_VERSION,
+    pixivn_version: version,
     stepData: narration.export(),
     storageData: storage.export(),
     canvasData: canvas.export(),
@@ -60341,6 +60600,7 @@ var NarrationManagerStatic = class _NarrationManagerStatic {
         canvas: {
           elementAliasesOrder: [],
           elements: {},
+          stage: {},
           tickers: {},
           tickersSteps: {},
           tickersOnPause: {}
@@ -60920,8 +61180,10 @@ var NarrationManager = class {
           console.warn("[Pixi\u2019VN] stepSha not found");
         }
         try {
+          if (NarrationManagerStatic.stepsRunning === 0) {
+            canvas.forceCompletionOfReportedTickers();
+          }
           NarrationManagerStatic.stepsRunning++;
-          canvas.forceCompletionOfReportedTickers();
           let result = await step(props);
           if (this.choiceMenuOptions?.length === 1 && this.choiceMenuOptions[0].autoSelect) {
             let choice = this.choiceMenuOptions[0];
@@ -62302,7 +62564,7 @@ var StoredClassModel = class {
     if (Object.keys(storageValue[this.id]).length === 0) {
       delete storageValue[this.id];
     }
-    storageValue.setVariable(this.categoryId, storageValue);
+    storage.setVariable(this.categoryId, storageValue);
   }
   /**
    * Get a property from the storage.
@@ -62773,7 +63035,7 @@ var AlienTintingTest = class extends CanvasSprite {
   turningSpeed = 0;
   speed = 0;
   static from(source7, skipCache) {
-    let sprite = Sprite.from(source7, skipCache);
+    let sprite = CanvasSprite.from(source7, skipCache);
     let mySprite = new AlienTintingTest();
     mySprite.texture = sprite.texture;
     return mySprite;
@@ -62878,6 +63140,8 @@ var imagesAnimationsTest = newLabel(IMAGE_ANIMAIONS_TEST_LABEL, [
       new ChoiceMenuOption("Zoom", imagesZoomTest, {}),
       new ChoiceMenuOption("Move in/out", imagesMoveInOutTest, {}),
       new ChoiceMenuOption("Zoom in/out", imagesZoomInOutTest, {}),
+      new ChoiceMenuOption("Push in/out", imagesPushInOutTest, {}),
+      new ChoiceMenuOption("Shake", shakeStageTest, {}),
       new ChoiceMenuOption("Add same alias", imagesAddSameAliasTestLabel, {}),
       new ChoiceMenuOptionClose("Cancel", { closeCurrentLabel: true })
     ];
@@ -63210,6 +63474,44 @@ var imagesZoomInOutTest = newLabel("___pixi_vn_images_zoom_in_out_test___", [
     });
   }
 ]);
+var imagesPushInOutTest = newLabel("___pixi_vn_images_push_in_out_test___", [
+  async () => {
+    narration.dialogue = {
+      character: juliette,
+      text: `Here's what's going to happen:`
+    };
+    let eggHead = new CanvasImage({ x: 100, y: 100 }, eggHeadImage);
+    let flowerTop = new CanvasImage({ x: 300, y: 100 }, flowerTopImage);
+    let helmlok = new CanvasImage({ x: 100, y: 300 }, helmlokImage);
+    let skully = new CanvasImage({ x: 300, y: 300 }, skullyImage);
+    pushIn("eggHead", eggHead, { speed: 20, direction: "down" });
+    pushIn("flowerTop", flowerTop, {
+      speed: 3,
+      direction: "left",
+      speedProgression: { type: "exponential", percentage: 0.02 }
+    });
+    pushIn("helmlok", helmlok, { speed: 30, direction: "right" });
+    pushIn("skully", skully, {
+      speed: 3,
+      direction: "up",
+      speedProgression: { type: "exponential", percentage: 0.02 }
+    });
+  },
+  async () => {
+    pushOut("eggHead", {
+      speed: 3,
+      direction: "down",
+      speedProgression: { type: "exponential", percentage: 0.02 }
+    });
+    pushOut("flowerTop", { speed: 30, direction: "left" });
+    pushOut("helmlok", { speed: 10, direction: "right" });
+    pushOut("skully", {
+      speed: 3,
+      direction: "up",
+      speedProgression: { type: "exponential", percentage: 0.02 }
+    });
+  }
+]);
 var imagesAddSameAliasTestLabel = newLabel("___pixi_vn_images_add_same_tag_test___", [
   () => {
     narration.dialogue = {
@@ -63251,7 +63553,24 @@ var imagesAddSameAliasTestLabel = newLabel("___pixi_vn_images_add_same_tag_test_
   async () => await showWithDissolveTransition("eggHead", helmlokImage),
   async () => await showWithFadeTransition("eggHead", skullyImage),
   async () => await moveIn("eggHead", eggHeadImage, { speed: 100 }),
-  async () => await zoomIn("eggHead", eggHeadImage)
+  async () => await zoomIn("eggHead", eggHeadImage),
+  async () => await pushIn("eggHead", eggHeadImage)
+]);
+var shakeStageTest = newLabel("___pixi_vn_images_shake_stage_test___", [
+  () => {
+    narration.dialogue = {
+      character: juliette,
+      text: `Ok this is a test for the shake effect. The ${eggHeadName} will shake.`
+    };
+    shakeEffect("eggHead");
+  },
+  () => {
+    narration.dialogue = {
+      character: juliette,
+      text: `Now the whole stage will shake.`
+    };
+    shakeEffect(CANVAS_APP_STAGE_ALIAS);
+  }
 ]);
 
 // src/labels/InputTestLabel.ts
@@ -63481,7 +63800,7 @@ var pixivnTestStartLabel = newLabel(
       }
       narration.dialogue = { character: juliette, text: `Good ${currentTimeName}! I'm ${juliette.name}, your virtual assistant. I'm here to help you with your tests.` };
     },
-    () => narration.dialogue = { character: juliette, text: `You are running the Pixi\u2019VN v${PIXIVN_VERSION} test. This test will guide you through the different features of the library.` },
+    () => narration.dialogue = { character: juliette, text: `You are running the Pixi\u2019VN v${version} test. This test will guide you through the different features of the library.` },
     (props) => narration.jumpLabel(pixivnTestStartLabel2, props)
   ]
 );
@@ -63522,6 +63841,7 @@ var pixivnTestStartLabel2 = newLabel(
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Assets,
+  CANVAS_APP_STAGE_ALIAS,
   CanvasBase,
   CanvasContainer,
   CanvasEvent,
@@ -63583,6 +63903,8 @@ var pixivnTestStartLabel2 = newLabel(
   narration,
   newLabel,
   pixivnTestStartLabel,
+  pushIn,
+  pushOut,
   removeCanvasElement,
   removeWithDissolveTransition,
   removeWithFadeTransition,
@@ -63591,6 +63913,7 @@ var pixivnTestStartLabel2 = newLabel(
   setChoiceMenuOptions,
   setDialogue,
   setFlag,
+  shakeEffect,
   showImage,
   showVideo,
   showWithDissolveTransition,