diff --git a/src/client.js b/src/client.js index 6f7860f..1a39a14 100644 --- a/src/client.js +++ b/src/client.js @@ -1,80 +1,75 @@ -import observer from '@cocreate/observer'; +import observer from "@cocreate/observer"; function listen(name, callback, selector) { + async function observerCallback({ target }) { + if (!window.CoCreate) window.CoCreate = {}; - async function observerCallback({ target }) { - if (!window.CoCreate) - window.CoCreate = {} + if (window.CoCreate[name]) return; + window.CoCreate[name] = {}; + observer.uninit(observerCallback); - if (window.CoCreate[name]) - return - window.CoCreate[name] = {} - observer.uninit(observerCallback) + const module = await callback(); + observer.uninit(observerCallback); + window.CoCreate[name] = module.default || module; - const module = await callback() - observer.uninit(observerCallback) - window.CoCreate[name] = module.default || module + dispatchComponentLoaded(name); + } - dispatchComponentLoaded(name) - } - - observer.init({ - name: 'lazyloadObserver', - observe: ['childList'], - selector, - callback: observerCallback - }) - - let selectorAttributes = []; - let attributes = selector.split(",") - for (let attribute of attributes) { - let attr = attribute.trim() - if (attr.startsWith("[")) { - let pos = attr.indexOf("*") - if (pos == -1) - pos = attr.indexOf("=") - if (pos !== -1) { - attr = attr.slice(1, pos) - } else { - attr = attr.slice(1, -1) - } - selectorAttributes.push(attr) - } - - } - if (selectorAttributes.length > 0) - observer.init({ - name: 'lazyloadAttributeObserver', - observe: ['attributes'], - attributeName: selectorAttributes, - selector, - callback: observerCallback - }); + observer.init({ + name: "lazyloadObserver", + observe: ["childList"], + selector, + callback: observerCallback + }); + let selectorAttributes = []; + let attributes = selector.split(","); + for (let attribute of attributes) { + let attr = attribute.trim(); + if (attr.startsWith("[")) { + let pos = attr.indexOf("*"); + if (pos == -1) pos = attr.indexOf("="); + if (pos !== -1) { + attr = attr.slice(1, pos); + } else { + attr = attr.slice(1, -1); + } + selectorAttributes.push(attr); + } + } + if (selectorAttributes.length > 0) + observer.init({ + name: "lazyloadAttributeObserver", + observe: ["attributes"], + attributeName: selectorAttributes, + selector, + callback: observerCallback + }); } export async function lazyLoad(name, selector, callback) { - if (document.querySelector(selector)) - await dependency(name, await callback()) - else - listen(name, callback, selector) + if (document.querySelector(selector)) + await dependency(name, await callback()); + else listen(name, callback, selector); } export async function dependency(name, promise) { - try { - let component = await promise; - if (!window.CoCreate) - window.CoCreate = {} - - window.CoCreate[name] = component.default || component - dispatchComponentLoaded(name) - } catch (error) { - console.error('error loading chunck: ', error) - } + try { + let component = await promise; + if (!window.CoCreate) window.CoCreate = {}; + if (!window.CoCreate[name]) { + window.CoCreate[name] = component.default || component; + dispatchComponentLoaded(name); + } + } catch (error) { + console.error("error loading chunck: ", error); + } } function dispatchComponentLoaded(name) { - document.dispatchEvent(new CustomEvent(name + 'Loaded', { - detail: { name } - })); + document.dispatchEvent( + new CustomEvent(name + "Loaded", { + detail: { name } + }) + ); }