import { Container } from "./Container"; import { generatedAttribute } from "./Utils/Constants"; import { getRandom } from "../Utils/NumberUtils"; import { itemFromSingleOrMultiple } from "../Utils/Utils"; async function getDataFromUrl(jsonUrl, index) { const url = itemFromSingleOrMultiple(jsonUrl, index); if (!url) { return; } const response = await fetch(url); if (response.ok) { return response.json(); } console.error(`tsParticles - Error ${response.status} while retrieving config file`); } export class Loader { constructor(engine) { this._engine = engine; } load(tagId, options, index) { const params = { index, remote: false }; if (typeof tagId === "string") { params.tagId = tagId; } else { params.options = tagId; } if (typeof options === "number") { params.index = options; } else { params.options = options !== null && options !== void 0 ? options : params.options; } return this.loadOptions(params); } async loadJSON(tagId, jsonUrl, index) { let url, id; if (typeof jsonUrl === "number" || jsonUrl === undefined) { url = tagId; } else { id = tagId; url = jsonUrl; } return this.loadRemoteOptions({ tagId: id, url, index, remote: true }); } async loadOptions(params) { var _a, _b, _c; const tagId = (_a = params.tagId) !== null && _a !== void 0 ? _a : `tsparticles${Math.floor(getRandom() * 10000)}`, { index, url: jsonUrl, remote } = params, options = remote ? await getDataFromUrl(jsonUrl, index) : params.options; let domContainer = (_b = params.element) !== null && _b !== void 0 ? _b : document.getElementById(tagId); if (!domContainer) { domContainer = document.createElement("div"); domContainer.id = tagId; (_c = document.querySelector("body")) === null || _c === void 0 ? void 0 : _c.append(domContainer); } const currentOptions = itemFromSingleOrMultiple(options, index), dom = this._engine.dom(), oldIndex = dom.findIndex((v) => v.id === tagId); if (oldIndex >= 0) { const old = this._engine.domItem(oldIndex); if (old && !old.destroyed) { old.destroy(); dom.splice(oldIndex, 1); } } let canvasEl; if (domContainer.tagName.toLowerCase() === "canvas") { canvasEl = domContainer; canvasEl.dataset[generatedAttribute] = "false"; } else { const existingCanvases = domContainer.getElementsByTagName("canvas"); if (existingCanvases.length) { canvasEl = existingCanvases[0]; canvasEl.dataset[generatedAttribute] = "false"; } else { canvasEl = document.createElement("canvas"); canvasEl.dataset[generatedAttribute] = "true"; domContainer.appendChild(canvasEl); } } if (!canvasEl.style.width) { canvasEl.style.width = "100%"; } if (!canvasEl.style.height) { canvasEl.style.height = "100%"; } const newItem = new Container(this._engine, tagId, currentOptions); if (oldIndex >= 0) { dom.splice(oldIndex, 0, newItem); } else { dom.push(newItem); } newItem.canvas.loadCanvas(canvasEl); await newItem.start(); return newItem; } async loadRemoteOptions(params) { return this.loadOptions(params); } async set(id, domContainer, options, index) { const params = { index, remote: false }; if (typeof id === "string") { params.tagId = id; } else { params.element = id; } if (domContainer instanceof HTMLElement) { params.element = domContainer; } else { params.options = domContainer; } if (typeof options === "number") { params.index = options; } else { params.options = options !== null && options !== void 0 ? options : params.options; } return this.loadOptions(params); } async setJSON(id, domContainer, jsonUrl, index) { let url, newId, newIndex, element; if (id instanceof HTMLElement) { element = id; url = domContainer; newIndex = jsonUrl; } else { newId = id; element = domContainer; url = jsonUrl; newIndex = index; } return this.loadRemoteOptions({ tagId: newId, url, index: newIndex, element, remote: true }); } }