@novely/core 0.22.1 → 0.23.0

package/dist/index.d.ts

@@ -214,6 +214,7 @@ interface CharacterHandle {
     emotion: (emotion: string, render: boolean) => void;
     append: (className?: string, style?: string, restoring?: boolean) => void;
     remove: (className?: string, style?: string, duration?: number, restoring?: boolean) => Promise<void>;
+    animate: (timeout: number, classes: string[]) => void;
     emotions: Record<string, HTMLImageElement[]>;
 }
 type AudioHandle = {
@@ -223,23 +224,23 @@ type AudioHandle = {
 };
 type Renderer = {
     misc: {
-        /**
-         * Function to preload images async and await for all images to load or fail
-         * @param images Set of images to load
-         */
-        preloadImagesBlocking: (images: Set<string>) => Promise<PromiseSettledResult<unknown>[]>;
         /**
          * Function to preload image sync
          * @param image Image URL
          * @returns Image URL
          */
         preloadImage: <T extends string>(image: T) => T;
+        /**
+         * Function to preload image async
+         * @param image Image URL
+         * @returns Promise
+         */
+        preloadImageBlocking: (image: string) => Promise<void>;
         /**
          * Function to preload audio
-         * @param type kind of audio
          * @param source <url> pointing to the audio
          */
-        preloadAudioBlocking: (type: 'music', source: string) => Promise<void>;
+        preloadAudioBlocking: (source: string) => Promise<void>;
     };
     ui: {
         /**
@@ -308,7 +309,6 @@ type Renderer = {
         };
         store: unknown;
         setStore: unknown;
-        getCharacter: (character: string) => CharacterHandle | undefined;
     };
     removeContext: (context: string) => void;
 };
@@ -418,6 +418,11 @@ interface NovelyInit<Languages extends string, Characters extends Record<string,
      * @default 799
      */
     throttleTimeout?: number;
+    /**
+     * Limits how many assets can be downloaded parallelly
+     * @default 15
+     */
+    parallelAssetsDownloadLimit?: number;
     /**
      * Custom language detector
      * @param languages Supported languages aka `languages: []` in the config
@@ -445,8 +450,12 @@ interface NovelyInit<Languages extends string, Characters extends Record<string,
      * @default "lazy"
      */
     preloadAssets?: 'lazy' | 'blocking';
+    /**
+     * Fetching function
+     */
+    fetch?: typeof fetch;
 }
-declare const novely: <Languages extends string, Characters extends Record<string, Character<Languages>>, StateScheme extends State, DataScheme extends Data>({ characters, storage, storageDelay, renderer: createRenderer, initialScreen, translation, languages, state: defaultState, data: defaultData, autosaves, migrations, throttleTimeout, getLanguage, overrideLanguage, askBeforeExit, preloadAssets, }: NovelyInit<Languages, Characters, StateScheme, DataScheme>) => {
+declare const novely: <Languages extends string, Characters extends Record<string, Character<Languages>>, StateScheme extends State, DataScheme extends Data>({ characters, storage, storageDelay, renderer: createRenderer, initialScreen, translation, languages, state: defaultState, data: defaultData, autosaves, migrations, throttleTimeout, getLanguage, overrideLanguage, askBeforeExit, preloadAssets, parallelAssetsDownloadLimit, fetch: request }: NovelyInit<Languages, Characters, StateScheme, DataScheme>) => {
     /**
      * Function to set game script
      */
@@ -472,7 +481,12 @@ declare const novely: <Languages extends string, Characters extends Record<strin
     /**
      * Unwraps translatable content to a string value
      */
-    unwrap(content: string | (() => string) | Record<Languages, string> | Exclude<Record<Languages, string | (() => string)>, Record<string, string>>): string;
+    unwrap(content: string | (() => string) | Exclude<Record<Languages, string | (() => string)>, Record<string, string>> | Record<Languages, string>): string;
+    /**
+     * Cancel data loading, hide UI, ignore page change events
+     * Data updates still will work in case Novely already was loaded
+     */
+    destroy(): void;
 };
 
 export { type ActionProxyProvider, type AllowedContent, type AudioHandle, type BaseTranslationStrings, type Character, type CharacterHandle, type Context, type CoreData, type CustomHandler, type CustomHandlerFunctionGetFn, type CustomHandlerFunctionParameters, type CustomHandlerGetResult, type CustomHandlerGetResultDataFunction, type DefaultActionProxyProvider, EN, type Emotions, type FunctionableValue, type GetActionParameters, JP, KK, type Lang, type NovelyScreen, type Path, type PluralType, type Pluralization, RU, type Renderer, type RendererInit, type Save, type Storage, type StorageData, type StorageMeta, type Stored, type Story, type Thenable, type TranslationActions, type TypewriterSpeed, type Unwrappable, type ValidAction, localStorageStorage, novely };

package/dist/index.global.js

@@ -174,18 +174,62 @@ var Novely = (() => {
   ]);
   var EMPTY_SET = /* @__PURE__ */ new Set();
   var DEFAULT_TYPEWRITER_SPEED = "Medium";
+  var HOWLER_SUPPORTED_FILE_FORMATS = /* @__PURE__ */ new Set([
+    "mp3",
+    "mpeg",
+    "opus",
+    "ogg",
+    "oga",
+    "wav",
+    "aac",
+    "caf",
+    "m4a",
+    "m4b",
+    "mp4",
+    "weba",
+    "webm",
+    "dolby",
+    "flac"
+  ]);
+  var SUPPORTED_IMAGE_FILE_FORMATS = /* @__PURE__ */ new Set([
+    "apng",
+    "avif",
+    "gif",
+    "jpg",
+    "jpeg",
+    "jfif",
+    "pjpeg",
+    "pjp",
+    "png",
+    "svg",
+    "webp",
+    "bmp"
+  ]);
   var MAIN_CONTEXT_KEY = "$MAIN";
 
   // src/shared.ts
   var STACK_MAP = /* @__PURE__ */ new Map();
 
+  // ../../node_modules/.pnpm/esm-env@1.0.0/node_modules/esm-env/prod-ssr.js
+  var DEV = false;
+
   // src/utils.ts
-  var matchAction = (getContext, values) => {
+  var matchAction = ({ getContext, push, forward }, values) => {
     return (action, props, { ctx, data }) => {
       const context = typeof ctx === "string" ? getContext(ctx) : ctx;
       return values[action]({
         ctx: context,
-        data
+        data,
+        push() {
+          if (context.meta.preview)
+            return;
+          push(context);
+        },
+        forward() {
+          if (context.meta.preview)
+            return;
+          forward(context);
+        }
       }, props);
     };
   };
@@ -292,6 +336,9 @@ var Novely = (() => {
   var isSkippedDuringRestore = (item) => {
     return SKIPPED_DURING_RESTORE.has(item);
   };
+  var isAudioAction = (action) => {
+    return AUDIO_ACTIONS.has(action);
+  };
   var noop = () => {
   };
   var isAction = (element) => {
@@ -514,6 +561,53 @@ var Novely = (() => {
     };
     return useStack;
   };
+  var mapSet = (set, fn) => {
+    return [...set].map(fn);
+  };
+  var isImageAsset = (asset) => {
+    return isString(asset) && isCSSImage(asset);
+  };
+  var getUrlFileExtension = (address) => {
+    try {
+      const { pathname } = new URL(address, location.href);
+      return pathname.split(".").at(-1).split("!")[0].split(":")[0];
+    } catch (error) {
+      if (DEV) {
+        console.error(new Error(`Could not construct URL "${address}".`, { cause: error }));
+      }
+      return "";
+    }
+  };
+  var fetchContentType = async (request, url) => {
+    try {
+      const response = await request(url, {
+        method: "HEAD"
+      });
+      return response.headers.get("Content-Type") || "";
+    } catch (error) {
+      if (DEV) {
+        console.error(new Error(`Failed to fetch file at "${url}"`, { cause: error }));
+      }
+      return "";
+    }
+  };
+  var getResourseType = async (request, url) => {
+    const extension = getUrlFileExtension(url);
+    if (HOWLER_SUPPORTED_FILE_FORMATS.has(extension)) {
+      return "audio";
+    }
+    if (SUPPORTED_IMAGE_FILE_FORMATS.has(extension)) {
+      return "image";
+    }
+    const contentType = await fetchContentType(request, url);
+    if (contentType.includes("audio")) {
+      return "audio";
+    }
+    if (contentType.includes("image")) {
+      return "image";
+    }
+    return "other";
+  };
 
   // src/global.ts
   var PRELOADED_ASSETS = /* @__PURE__ */ new Set();
@@ -709,11 +803,6 @@ var Novely = (() => {
 
   // src/novely.ts
   var import_p_limit = __toESM(require_p_limit(), 1);
-
-  // ../../node_modules/.pnpm/esm-env@1.0.0/node_modules/esm-env/prod-ssr.js
-  var DEV = false;
-
-  // src/novely.ts
   var novely = ({
     characters,
     storage = localStorageStorage({ key: "novely-game-storage" }),
@@ -730,9 +819,12 @@ var Novely = (() => {
     getLanguage: getLanguage2 = getLanguage,
     overrideLanguage = false,
     askBeforeExit = true,
-    preloadAssets = "lazy"
+    preloadAssets = "lazy",
+    parallelAssetsDownloadLimit = 15,
+    fetch: request = fetch
   }) => {
     const limitScript = (0, import_p_limit.default)(1);
+    const limitAssetsDownload = (0, import_p_limit.default)(parallelAssetsDownloadLimit);
     const story = {};
     const times = /* @__PURE__ */ new Set();
     const ASSETS_TO_PRELOAD = /* @__PURE__ */ new Set();
@@ -748,7 +840,23 @@ var Novely = (() => {
       Object.assign(story, flattenStory(part));
       if (preloadAssets === "blocking" && ASSETS_TO_PRELOAD.size > 0) {
         renderer.ui.showScreen("loading");
-        await renderer.misc.preloadImagesBlocking(ASSETS_TO_PRELOAD);
+        const { preloadAudioBlocking, preloadImageBlocking } = renderer.misc;
+        const list = mapSet(ASSETS_TO_PRELOAD, (asset) => {
+          return limitAssetsDownload(async () => {
+            const type = await getResourseType(request, asset);
+            switch (type) {
+              case "audio": {
+                await preloadAudioBlocking(asset);
+                break;
+              }
+              case "image": {
+                await preloadImageBlocking(asset);
+                break;
+              }
+            }
+          });
+        });
+        await Promise.allSettled(list);
       }
       const screen = renderer.ui.getScreen();
       const nextScreen = scriptCalled ? screen : initialScreen;
@@ -769,13 +877,25 @@ var Novely = (() => {
       return limitScript(() => scriptBase(part));
     };
     const action = new Proxy({}, {
-      get(_, prop) {
+      get(_, action2) {
         return (...props) => {
           if (preloadAssets === "blocking") {
-            if (prop === "showBackground" && typeof props[0] === "string" && isCSSImage(props[0])) {
+            if (action2 === "showBackground") {
+              if (isImageAsset(props[0])) {
+                ASSETS_TO_PRELOAD.add(props[0]);
+              }
+              if (props[0] && typeof props[0] === "object") {
+                for (const value of Object.values(props[0])) {
+                  if (!isImageAsset(value))
+                    continue;
+                  ASSETS_TO_PRELOAD.add(value);
+                }
+              }
+            }
+            if (isAudioAction(action2) && isString(props[0])) {
               ASSETS_TO_PRELOAD.add(props[0]);
             }
-            if (prop === "showCharacter" && typeof props[0] === "string" && typeof props[1] === "string") {
+            if (action2 === "showCharacter" && isString(props[0]) && isString(props[1])) {
               const images = characters[props[0]].emotions[props[1]];
               if (Array.isArray(images)) {
                 for (const asset of images) {
@@ -786,7 +906,7 @@ var Novely = (() => {
               }
             }
           }
-          return [prop, ...props];
+          return [action2, ...props];
         };
       }
     });
@@ -853,11 +973,12 @@ var Novely = (() => {
     };
     storageDelay.then(getStoredData);
     const initial = getDefaultSave(klona(defaultState));
-    addEventListener("visibilitychange", () => {
+    const onVisibilityChange = () => {
       if (document.visibilityState === "hidden") {
         throttledEmergencyOnStorageDataChange();
       }
-    });
+    };
+    addEventListener("visibilitychange", onVisibilityChange);
     addEventListener("beforeunload", throttledEmergencyOnStorageDataChange);
     const save = (override = false, type = override ? "auto" : "manual") => {
       if (!$$.get().dataLoaded)
@@ -905,12 +1026,11 @@ var Novely = (() => {
         return;
       let latest = save2 || $.get().saves.at(-1);
       if (!latest) {
-        $.set({
-          saves: [initial],
-          data: klona(defaultData),
-          meta: [getLanguageWithoutParameters(), DEFAULT_TYPEWRITER_SPEED, 1, 1, 1]
-        });
         latest = klona(initial);
+        $.update((prev) => {
+          prev.saves.push(latest);
+          return prev;
+        });
       }
       const context = renderer.getContext(MAIN_CONTEXT_KEY);
       const stack = useStack(context);
@@ -946,7 +1066,7 @@ var Novely = (() => {
           data: latest[1]
         });
       });
-      context.meta.restoring = context.meta.restoring = false;
+      context.meta.restoring = context.meta.goingBack = false;
       render(context);
     };
     const refer = (path) => {
@@ -1014,7 +1134,7 @@ var Novely = (() => {
       ctx.meta.preview = true;
       const processor = createQueueProcessor(queue);
       await processor.run((action2, props) => {
-        if (AUDIO_ACTIONS.has(action2))
+        if (isAudioAction(action2))
           return;
         if (action2 === "vibrate")
           return;
@@ -1047,55 +1167,89 @@ var Novely = (() => {
     });
     const useStack = createUseStackFunction(renderer);
     useStack(MAIN_CONTEXT_KEY).push(initial);
-    renderer.ui.start();
-    const match = matchAction(renderer.getContext, {
-      wait({ ctx }, [time]) {
-        if (!ctx.meta.restoring)
-          setTimeout(push, isFunction(time) ? time() : time);
+    const UIInstance = renderer.ui.start();
+    const enmemory = (ctx) => {
+      if (ctx.meta.restoring)
+        return;
+      const stack = useStack(ctx);
+      const current = klona(stack.value);
+      current[2][1] = "auto";
+      stack.push(current);
+      save(true, "auto");
+    };
+    const next = (ctx) => {
+      const stack = useStack(ctx);
+      const path = stack.value[0];
+      const last = path.at(-1);
+      if (last && (isNull(last[0]) || last[0] === "jump") && isNumber(last[1])) {
+        last[1]++;
+      } else {
+        path.push([null, 0]);
+      }
+    };
+    const matchActionInit = {
+      getContext: renderer.getContext,
+      push(ctx) {
+        if (ctx.meta.restoring)
+          return;
+        next(ctx);
+        render(ctx);
+      },
+      forward(ctx) {
+        if (!ctx.meta.preview)
+          enmemory(ctx);
+        matchActionInit.push(ctx);
+        if (!ctx.meta.preview)
+          interactivity(true);
+      }
+    };
+    const match = matchAction(matchActionInit, {
+      wait({ ctx, push }, [time]) {
+        if (ctx.meta.restoring)
+          return;
+        setTimeout(push, isFunction(time) ? time() : time);
       },
-      showBackground({ ctx }, [background]) {
+      showBackground({ ctx, push }, [background]) {
         ctx.background(background);
-        push(ctx);
+        push();
       },
-      playMusic({ ctx }, [source]) {
+      playMusic({ ctx, push }, [source]) {
         ctx.audio.music(source, "music", true).play();
-        push(ctx);
+        push();
       },
-      stopMusic({ ctx }, [source]) {
+      stopMusic({ ctx, push }, [source]) {
         ctx.audio.music(source, "music").stop();
-        push(ctx);
+        push();
       },
-      playSound({ ctx }, [source, loop]) {
+      playSound({ ctx, push }, [source, loop]) {
         ctx.audio.music(source, "sound", loop || false).play();
-        push(ctx);
+        push();
       },
-      stopSound({ ctx }, [source]) {
+      stopSound({ ctx, push }, [source]) {
         ctx.audio.music(source, "sound").stop();
-        push(ctx);
+        push();
       },
-      voice({ ctx }, [source]) {
+      voice({ ctx, push }, [source]) {
         ctx.audio.voice(source);
-        push(ctx);
+        push();
       },
-      stopVoice({ ctx }) {
+      stopVoice({ ctx, push }) {
         ctx.audio.voiceStop();
-        push(ctx);
+        push();
       },
-      showCharacter({ ctx }, [character, emotion, className, style]) {
+      showCharacter({ ctx, push }, [character, emotion, className, style]) {
         if (DEV && !characters[character].emotions[emotion]) {
           throw new Error(`Attempt to show character "${character}" with unknown emotion "${emotion}"`);
         }
         const handle = ctx.character(character);
         handle.append(className, style, ctx.meta.restoring);
         handle.emotion(emotion, true);
-        push(ctx);
+        push();
       },
-      hideCharacter({ ctx }, [character, className, style, duration]) {
-        ctx.character(character).remove(className, style, duration, ctx.meta.restoring).then(() => {
-          push(ctx);
-        });
+      hideCharacter({ ctx, push }, [character, className, style, duration]) {
+        ctx.character(character).remove(className, style, duration, ctx.meta.restoring).then(push);
       },
-      dialog({ ctx, data: data2 }, [character, content, emotion]) {
+      dialog({ ctx, data: data2, forward }, [character, content, emotion]) {
         const name = (() => {
           const c = character;
           const cs = characters;
@@ -1116,13 +1270,13 @@ var Novely = (() => {
           unwrap2(name, data2),
           character,
           emotion,
-          () => forward(ctx)
+          forward
         );
       },
-      function({ ctx }, [fn]) {
+      function({ ctx, push }, [fn]) {
         const result = fn(ctx.meta.restoring, ctx.meta.goingBack, ctx.meta.preview);
         if (!ctx.meta.restoring) {
-          result ? result.then(() => push(ctx)) : push(ctx);
+          result ? result.then(push) : push();
         }
         return result;
       },
@@ -1172,13 +1326,13 @@ var Novely = (() => {
           data: data2
         });
       },
-      clear({ ctx }, [keep, characters2, audio]) {
+      clear({ ctx, push }, [keep, characters2, audio]) {
         ctx.vibrate(0);
         ctx.clear(
           keep || EMPTY_SET,
           characters2 || EMPTY_SET,
           audio || { music: EMPTY_SET, sounds: EMPTY_SET },
-          () => push(ctx)
+          push
         );
       },
       condition({ ctx }, [condition, variants]) {
@@ -1207,15 +1361,15 @@ var Novely = (() => {
         interactivity(false);
         times.clear();
       },
-      input({ ctx, data: data2 }, [question, onInput, setup]) {
+      input({ ctx, data: data2, forward }, [question, onInput, setup]) {
         ctx.input(
           unwrap2(question, data2),
           onInput,
           setup || noop,
-          () => forward(ctx)
+          forward
         );
       },
-      custom({ ctx }, [handler]) {
+      custom({ ctx, push }, [handler]) {
         const result = ctx.custom(handler, () => {
           if (ctx.meta.restoring)
             return;
@@ -1223,18 +1377,18 @@ var Novely = (() => {
             enmemory(ctx);
             interactivity(true);
           }
-          push(ctx);
+          push();
         });
         return result;
       },
-      vibrate({ ctx }, pattern) {
+      vibrate({ ctx, push }, pattern) {
         ctx.vibrate(pattern);
-        push(ctx);
+        push();
       },
-      next({ ctx }) {
-        push(ctx);
+      next({ push }) {
+        push();
       },
-      animateCharacter({ ctx, data: data2 }, [character, timeout, ...classes]) {
+      animateCharacter({ ctx, push }, [character, timeout, ...classes]) {
         if (DEV && classes.length === 0) {
           throw new Error("Attempt to use AnimateCharacter without classes. Classes should be provided [https://novely.pages.dev/guide/actions/animateCharacter.html]");
         }
@@ -1243,36 +1397,15 @@ var Novely = (() => {
         }
         if (ctx.meta.preview)
           return;
-        const handler = ({ get }) => {
-          const { clear } = get(false);
-          const char = ctx.getCharacter(character);
-          if (!char)
-            return;
-          const target = char.canvas;
-          if (!target)
-            return;
-          const classNames = classes.filter((className) => !target.classList.contains(className));
-          target.classList.add(...classNames);
-          const timeoutId = setTimeout(() => {
-            target.classList.remove(...classNames);
-          }, timeout);
-          clear(() => {
-            target.classList.remove(...classNames);
-            clearTimeout(timeoutId);
-          });
-        };
-        handler.key = "@@internal-animate-character";
-        match("custom", [handler], {
-          ctx,
-          data: data2
-        });
+        ctx.character(character).animate(timeout, classes);
+        push();
       },
-      text({ ctx, data: data2 }, text) {
+      text({ ctx, data: data2, forward }, text) {
         const string = text.map((content) => unwrap2(content, data2)).join(" ");
         if (DEV && string.length === 0) {
           throw new Error(`Action Text was called with empty string or array`);
         }
-        ctx.text(string, () => forward(ctx));
+        ctx.text(string, forward);
       },
       exit({ ctx, data: data2 }) {
         if (ctx.meta.restoring)
@@ -1321,11 +1454,11 @@ var Novely = (() => {
         }
         render(ctx);
       },
-      preload({ ctx }, [source]) {
+      preload({ ctx, push }, [source]) {
         if (!ctx.meta.goingBack && !ctx.meta.restoring && !PRELOADED_ASSETS.has(source)) {
           PRELOADED_ASSETS.add(renderer.misc.preloadImage(source));
         }
-        push(ctx);
+        push();
       },
       block({ ctx }, [scene]) {
         if (DEV && !story[scene]) {
@@ -1341,25 +1474,6 @@ var Novely = (() => {
         }
       }
     });
-    const enmemory = (ctx) => {
-      if (ctx.meta.restoring)
-        return;
-      const stack = useStack(ctx);
-      const current = klona(stack.value);
-      current[2][1] = "auto";
-      stack.push(current);
-      save(true, "auto");
-    };
-    const next = (ctx) => {
-      const stack = useStack(ctx);
-      const path = stack.value[0];
-      const last = path.at(-1);
-      if (last && (isNull(last[0]) || last[0] === "jump") && isNumber(last[1])) {
-        last[1]++;
-      } else {
-        path.push([null, 0]);
-      }
-    };
     const render = (ctx) => {
       const stack = useStack(ctx);
       const referred = refer(stack.value[0]);
@@ -1376,17 +1490,6 @@ var Novely = (() => {
         });
       }
     };
-    const push = (ctx) => {
-      if (!ctx.meta.restoring)
-        next(ctx), render(ctx);
-    };
-    const forward = (ctx) => {
-      if (!ctx.meta.preview)
-        enmemory(ctx);
-      push(ctx);
-      if (!ctx.meta.preview)
-        interactivity(true);
-    };
     const interactivity = (value = false) => {
       interacted = value ? interacted + 1 : 0;
     };
@@ -1436,6 +1539,16 @@ var Novely = (() => {
        */
       unwrap(content) {
         return unwrap2(content, $.get().data);
+      },
+      /**
+       * Cancel data loading, hide UI, ignore page change events
+       * Data updates still will work in case Novely already was loaded
+       */
+      destroy() {
+        dataLoaded.cancel();
+        UIInstance.unmount();
+        removeEventListener("visibilitychange", onVisibilityChange);
+        removeEventListener("beforeunload", throttledEmergencyOnStorageDataChange);
       }
     };
   };