feat: loadJSON can accept also a string array and an optional index p…

…arameter

core/main/src/Core/Loader.ts

@@ -2,9 +2,9 @@ import { Container } from "./Container";
 import type { IOptions } from "../Options/Interfaces/IOptions";
 import type { RecursivePartial } from "../Types";
 import { Constants, Utils } from "../Utils";
-import { Particle } from "./Particle";
-import { ICoordinates } from "./Interfaces/ICoordinates";
-import { SingleOrMultiple } from "../Types/SingleOrMultiple";
+import type { Particle } from "./Particle";
+import type { ICoordinates } from "./Interfaces/ICoordinates";
+import type { SingleOrMultiple } from "../Types";
 
 const tsParticlesDom: Container[] = [];
 
@@ -168,11 +168,15 @@ export class Loader {
      * Loads the provided json with a GET request. The content will be used to create a [[Container]] object.
      * This method is async, so if you need a callback refer to JavaScript function `fetch`
      * @param tagId the particles container element id
-     * @param jsonUrl the json path to use in the GET request
+     * @param jsonUrl the json path (or paths array) to use in the GET request
+     * @param index the index of the paths array, if a single path is passed this value is ignored
+     * @returns A Promise with the [[Container]] object created
      */
-    public static async loadJSON(tagId: string, jsonUrl: string): Promise<Container | undefined> {
+    public static async loadJSON(tagId: string, jsonUrl: SingleOrMultiple<string>, index?: number): Promise<Container | undefined> {
+        const url = jsonUrl instanceof Array ? Utils.itemFromArray(jsonUrl, index) : jsonUrl;
+
         /* load json config */
-        const response = await fetch(jsonUrl);
+        const response = await fetch(url);
 
         if (response.ok) {
             return Loader.load(tagId, await response.json());

core/main/src/main.slim.ts

@@ -12,16 +12,16 @@ import type { IOptions } from "./Options/Interfaces/IOptions";
 import type { Container } from "./Core/Container";
 import { Loader } from "./Core/Loader";
 import type { IShapeDrawer } from "./Core/Interfaces/IShapeDrawer";
-import {
+import type {
     ShapeDrawerAfterEffectFunction,
     ShapeDrawerDestroyFunction,
     ShapeDrawerDrawFunction,
     ShapeDrawerInitFunction,
     RecursivePartial,
+    SingleOrMultiple,
 } from "./Types";
 import type { IPlugin } from "./Core/Interfaces/IPlugin";
-import { Particle } from "./Core/Particle";
-import { SingleOrMultiple } from "./Types/SingleOrMultiple";
+import type { Particle } from "./Core/Particle";
 
 /**
  * Main class for creating the singleton on window.
@@ -106,11 +106,12 @@ export class MainSlim {
      * Loads the provided json with a GET request. The content will be used to create a [[Container]] object.
      * This method is async, so if you need a callback refer to JavaScript function `fetch`
      * @param tagId the particles container element id
-     * @param pathConfigJson the json path to use in the GET request
+     * @param pathConfigJson the json path (or paths array) to use in the GET request
+     * @param index the index of the paths array, if a single path is passed this value is ignored
      * @returns A Promise with the [[Container]] object created
      */
-    public loadJSON(tagId: string, pathConfigJson: string): Promise<Container | undefined> {
-        return Loader.loadJSON(tagId, pathConfigJson);
+    public loadJSON(tagId: string, pathConfigJson: SingleOrMultiple<string>, index?: number): Promise<Container | undefined> {
+        return Loader.loadJSON(tagId, pathConfigJson, index);
     }
 
     /**