@kupola/kupola 1.2.0 → 1.4.0

package/js/global-events.js

@@ -1,203 +1,296 @@
-class GlobalEventManager {
-  constructor() {
-    this.listeners = new Map();
-    this.scopes = new Map();
-  }
-
-  on(target, eventType, handler, options = {}) {
-    const key = this._getKey(target, eventType);
-    
-    if (!this.listeners.has(key)) {
-      this.listeners.set(key, []);
-    }
-    
-    const wrapper = (e) => {
-      if (handler.before && typeof handler.before === 'function') {
-        handler.before(e);
-      }
-      
-      const result = handler(e);
-      
-      if (handler.after && typeof handler.after === 'function') {
-        handler.after(e, result);
-      }
-      
-      return result;
-    };
-    
-    const listener = {
-      handler,
-      wrapper,
-      options,
-      active: true
-    };
-    
-    this.listeners.get(key).push(listener);
-    
-    if (options.scope) {
-      if (!this.scopes.has(options.scope)) {
-        this.scopes.set(options.scope, []);
-      }
-      this.scopes.get(options.scope).push({ target, eventType, handler, wrapper });
-    }
-    
-    target.addEventListener(eventType, wrapper, options);
-    
-    const unsubscribe = () => {
-      target.removeEventListener(eventType, wrapper, options);
-      if (this.listeners.has(key)) {
-        const list = this.listeners.get(key);
-        const idx = list.indexOf(listener);
-        if (idx !== -1) {
-          list.splice(idx, 1);
+class GlobalEvents {
+    constructor() {
+        this._listeners = new Map();
+        this._scopeListeners = new Map();
+    }
+
+    on(target, eventName, handler, options = {}) {
+        const { scope = null, once = false, passive = false, capture = false } = options;
+        
+        const listenerId = this._generateId();
+        
+        const listener = {
+            id: listenerId,
+            target,
+            eventName,
+            handler,
+            scope,
+            once,
+            wrappedHandler: null
+        };
+
+        listener.wrappedHandler = (event) => {
+            if (once) {
+                this.offById(listenerId);
+            }
+            handler.call(target, event);
+        };
+
+        const eventKey = this._getEventKey(target, eventName);
+        
+        if (!this._listeners.has(eventKey)) {
+            this._listeners.set(eventKey, []);
         }
-      }
-      if (options.scope && this.scopes.has(options.scope)) {
-        const scopeList = this.scopes.get(options.scope);
-        const idx = scopeList.findIndex(
-          s => s.target === target && s.eventType === eventType && s.handler === handler
-        );
-        if (idx !== -1) {
-          scopeList.splice(idx, 1);
+        this._listeners.get(eventKey).push(listener);
+
+        if (scope) {
+            if (!this._scopeListeners.has(scope)) {
+                this._scopeListeners.set(scope, []);
+            }
+            this._scopeListeners.get(scope).push(listenerId);
         }
-      }
-      listener.active = false;
-    };
-    
-    listener.unsubscribe = unsubscribe;
-    
-    return listener;
-  }
-
-  off(target, eventType, handler) {
-    const key = this._getKey(target, eventType);
-    
-    if (!this.listeners.has(key)) return;
-    
-    const listenerList = this.listeners.get(key);
-    const index = listenerList.findIndex(l => l.handler === handler);
-    
-    if (index !== -1) {
-      const listener = listenerList[index];
-      target.removeEventListener(eventType, listener.wrapper, listener.options);
-      listener.active = false;
-      listenerList.splice(index, 1);
-      
-      if (listener.options.scope) {
-        this._removeFromScope(listener.options.scope, target, eventType, handler);
-      }
-    }
-  }
-
-  once(target, eventType, handler, options = {}) {
-    const onceHandler = (e) => {
-      this.off(target, eventType, onceHandler);
-      return handler(e);
-    };
-    
-    return this.on(target, eventType, onceHandler, options);
-  }
-
-  clearScope(scope) {
-    if (!this.scopes.has(scope)) return;
-    
-    const scopeListeners = this.scopes.get(scope);
-    
-    scopeListeners.forEach(({ target, eventType, handler, wrapper }) => {
-      target.removeEventListener(eventType, wrapper);
-      
-      const key = this._getKey(target, eventType);
-      if (this.listeners.has(key)) {
-        const listenerList = this.listeners.get(key);
-        const index = listenerList.findIndex(l => l.handler === handler);
-        if (index !== -1) {
-          listenerList[index].active = false;
-          listenerList.splice(index, 1);
+
+        target.addEventListener(eventName, listener.wrappedHandler, {
+            passive,
+            capture
+        });
+
+        return {
+            unsubscribe: () => this.offById(listenerId)
+        };
+    }
+
+    once(target, eventName, handler, options = {}) {
+        return this.on(target, eventName, handler, { ...options, once: true });
+    }
+
+    off(target, eventName, handler) {
+        const eventKey = this._getEventKey(target, eventName);
+        
+        if (!this._listeners.has(eventKey)) return;
+
+        const listeners = this._listeners.get(eventKey);
+        const filtered = listeners.filter(listener => listener.handler !== handler);
+        
+        listeners.forEach(listener => {
+            if (listener.handler === handler) {
+                target.removeEventListener(eventName, listener.wrappedHandler);
+                this._removeFromScope(listener);
+            }
+        });
+
+        if (filtered.length === 0) {
+            this._listeners.delete(eventKey);
+        } else {
+            this._listeners.set(eventKey, filtered);
+        }
+    }
+
+    offById(listenerId) {
+        for (const [eventKey, listeners] of this._listeners) {
+            const index = listeners.findIndex(l => l.id === listenerId);
+            
+            if (index !== -1) {
+                const listener = listeners[index];
+                listener.target.removeEventListener(listener.eventName, listener.wrappedHandler);
+                
+                listeners.splice(index, 1);
+                
+                if (listeners.length === 0) {
+                    this._listeners.delete(eventKey);
+                }
+                
+                this._removeFromScope(listener);
+                
+                return true;
+            }
+        }
+        return false;
+    }
+
+    offByScope(scope) {
+        if (!this._scopeListeners.has(scope)) return;
+
+        const listenerIds = this._scopeListeners.get(scope);
+        
+        listenerIds.forEach(listenerId => {
+            this.offById(listenerId);
+        });
+        
+        this._scopeListeners.delete(scope);
+    }
+
+    offAll(target, eventName = null) {
+        if (eventName) {
+            const eventKey = this._getEventKey(target, eventName);
+            
+            if (!this._listeners.has(eventKey)) return;
+            
+            const listeners = this._listeners.get(eventKey);
+            
+            listeners.forEach(listener => {
+                target.removeEventListener(eventName, listener.wrappedHandler);
+                this._removeFromScope(listener);
+            });
+            
+            this._listeners.delete(eventKey);
+        } else {
+            for (const [eventKey, listeners] of this._listeners) {
+                const [targetId] = eventKey.split(':');
+                
+                if (this._getTargetId(target) === targetId) {
+                    listeners.forEach(listener => {
+                        target.removeEventListener(listener.eventName, listener.wrappedHandler);
+                        this._removeFromScope(listener);
+                    });
+                    
+                    this._listeners.delete(eventKey);
+                }
+            }
+        }
+    }
+
+    emit(target, eventName, detail = {}) {
+        const event = new CustomEvent(eventName, {
+            detail,
+            bubbles: true,
+            cancelable: true
+        });
+        
+        target.dispatchEvent(event);
+        return event;
+    }
+
+    emitGlobal(eventName, detail = {}) {
+        return this.emit(document, eventName, detail);
+    }
+
+    emitToScope(scope, eventName, detail = {}) {
+        if (!this._scopeListeners.has(scope)) return;
+
+        const listenerIds = this._scopeListeners.get(scope);
+        const targets = new Set();
+        
+        for (const [eventKey, listeners] of this._listeners) {
+            listeners.forEach(listener => {
+                if (listenerIds.includes(listener.id)) {
+                    targets.add(listener.target);
+                }
+            });
         }
-      }
-    });
-    
-    this.scopes.delete(scope);
-  }
-
-  _removeFromScope(scope, target, eventType, handler) {
-    if (!this.scopes.has(scope)) return;
-    
-    const scopeListeners = this.scopes.get(scope);
-    const index = scopeListeners.findIndex(
-      l => l.target === target && l.eventType === eventType && l.handler === handler
-    );
-    
-    if (index !== -1) {
-      scopeListeners.splice(index, 1);
-    }
-  }
-
-  _getKey(target, eventType) {
-    const targetName = target === document ? 'document' : 
-                       target === window ? 'window' : 
-                       target === document.body ? 'body' : 
-                       target.nodeName ? target.nodeName : 
-                       'unknown';
-    
-    return `${targetName}:${eventType}`;
-  }
-
-  getListenerCount(target, eventType) {
-    const key = this._getKey(target, eventType);
-    return this.listeners.has(key) ? this.listeners.get(key).length : 0;
-  }
-
-  getAllListenerCounts() {
-    const counts = {};
-    this.listeners.forEach((listeners, key) => {
-      counts[key] = listeners.filter(l => l.active).length;
-    });
-    return counts;
-  }
-
-  cleanup() {
-    this.listeners.forEach((listenerList, key) => {
-      const [targetName, eventType] = key.split(':');
-      let target;
-      
-      if (targetName === 'document') target = document;
-      else if (targetName === 'window') target = window;
-      else if (targetName === 'body') target = document.body;
-      
-      if (target) {
-        listenerList.forEach(listener => {
-          target.removeEventListener(eventType, listener.wrapper, listener.options);
+        
+        targets.forEach(target => {
+            this.emit(target, eventName, detail);
         });
-      }
-    });
-    
-    this.listeners.clear();
-    this.scopes.clear();
-  }
+    }
+
+    getListenerCount(target, eventName = null) {
+        if (eventName) {
+            const eventKey = this._getEventKey(target, eventName);
+            return this._listeners.has(eventKey) ? this._listeners.get(eventKey).length : 0;
+        }
+        
+        let count = 0;
+        const targetId = this._getTargetId(target);
+        
+        for (const [eventKey, listeners] of this._listeners) {
+            const [keyTargetId] = eventKey.split(':');
+            if (keyTargetId === targetId) {
+                count += listeners.length;
+            }
+        }
+        
+        return count;
+    }
+
+    getScopeListenerCount(scope) {
+        return this._scopeListeners.has(scope) ? this._scopeListeners.get(scope).length : 0;
+    }
+
+    hasListeners(target, eventName = null) {
+        return this.getListenerCount(target, eventName) > 0;
+    }
+
+    _getEventKey(target, eventName) {
+        return `${this._getTargetId(target)}:${eventName}`;
+    }
+
+    _getTargetId(target) {
+        if (target === document) return 'document';
+        if (target === window) return 'window';
+        if (target === document.body) return 'body';
+        if (target._kupolaId) return target._kupolaId;
+        
+        target._kupolaId = this._generateId();
+        return target._kupolaId;
+    }
+
+    _generateId() {
+        return `ge-${Math.random().toString(36).substr(2, 9)}-${Date.now()}`;
+    }
+
+    _removeFromScope(listener) {
+        if (!listener.scope || !this._scopeListeners.has(listener.scope)) return;
+        
+        const scopeListeners = this._scopeListeners.get(listener.scope);
+        const index = scopeListeners.indexOf(listener.id);
+        
+        if (index !== -1) {
+            scopeListeners.splice(index, 1);
+            
+            if (scopeListeners.length === 0) {
+                this._scopeListeners.delete(listener.scope);
+            }
+        }
+    }
+
+    destroy() {
+        for (const [eventKey, listeners] of this._listeners) {
+            listeners.forEach(listener => {
+                listener.target.removeEventListener(listener.eventName, listener.wrappedHandler);
+            });
+        }
+        
+        this._listeners.clear();
+        this._scopeListeners.clear();
+    }
+}
+
+const globalEvents = new GlobalEvents();
+
+function on(target, eventName, handler, options) {
+    return globalEvents.on(target, eventName, handler, options);
+}
+
+function once(target, eventName, handler, options) {
+    return globalEvents.once(target, eventName, handler, options);
 }
 
-const globalEvents = new GlobalEventManager();
+function off(target, eventName, handler) {
+    globalEvents.off(target, eventName, handler);
+}
+
+function emit(target, eventName, detail) {
+    return globalEvents.emit(target, eventName, detail);
+}
 
-function on(target, eventType, handler, options) {
-  return globalEvents.on(target, eventType, handler, options);
+function emitGlobal(eventName, detail) {
+    return globalEvents.emitGlobal(eventName, detail);
 }
 
-function off(target, eventType, handler) {
-  globalEvents.off(target, eventType, handler);
+function offByScope(scope) {
+    globalEvents.offByScope(scope);
 }
 
-function once(target, eventType, handler, options) {
-  return globalEvents.once(target, eventType, handler, options);
+function offAll(target, eventName) {
+    globalEvents.offAll(target, eventName);
 }
 
-function clearScope(scope) {
-  globalEvents.clearScope(scope);
+function getListenerCount(target, eventName) {
+    return globalEvents.getListenerCount(target, eventName);
 }
 
-window.GlobalEventManager = GlobalEventManager;
-window.globalEvents = globalEvents;
-window.on = on;
-window.off = off;
-window.once = once;
-window.clearScope = clearScope;
+export { GlobalEvents, globalEvents, on, once, off, emit, emitGlobal, offByScope, offAll, getListenerCount };
+
+if (typeof window !== 'undefined') {
+    window.GlobalEvents = GlobalEvents;
+    window.globalEvents = globalEvents;
+    window.kupolaOn = on;
+    window.kupolaOnce = once;
+    window.kupolaOff = off;
+    window.kupolaEmit = emit;
+    window.kupolaEmitGlobal = emitGlobal;
+    window.kupolaOffByScope = offByScope;
+    window.kupolaOffAll = offAll;
+    window.kupolaGetListenerCount = getListenerCount;
+}

package/js/heatmap.js

@@ -392,14 +392,17 @@ function createHeatmap(selector, options = {}) {
   return null;
 }
 
-if (typeof module !== 'undefined' && module.exports) {
-  module.exports = { Heatmap, initHeatmaps, initHeatmap, cleanupHeatmap, createHeatmap, generateMockHeatmapData };
-} else {
+export { Heatmap, initHeatmaps, initHeatmap, cleanupHeatmap, createHeatmap, generateMockHeatmapData };
+
+if (typeof window !== 'undefined') {
   window.Heatmap = Heatmap;
   window.initHeatmap = initHeatmap;
   window.cleanupHeatmap = cleanupHeatmap;
-}
-
-if (window.kupolaInitializer) {
-  window.kupolaInitializer.register('heatmap', initHeatmap, cleanupHeatmap);
+  window.initHeatmaps = initHeatmaps;
+  window.createHeatmap = createHeatmap;
+  window.generateMockHeatmapData = generateMockHeatmapData;
+  
+  if (window.kupolaInitializer) {
+    window.kupolaInitializer.register('heatmap', initHeatmap, cleanupHeatmap);
+  }
 }

package/js/i18n.js

@@ -216,13 +216,21 @@ function formatCurrency(number, currency, options = {}) {
   return kupolaI18n.formatCurrency(number, currency, options);
 }
 
-window.KupolaI18n = KupolaI18n;
-window.kupolaI18n = kupolaI18n;
-window.createI18n = createI18n;
-window.t = t;
-window.n = n;
-window.setLocale = setLocale;
-window.getLocale = getLocale;
-window.formatDate = formatDate;
-window.formatNumber = formatNumber;
-window.formatCurrency = formatCurrency;
+export { 
+  KupolaI18n, kupolaI18n, createI18n, 
+  t, n, setLocale, getLocale,
+  formatDate, formatNumber, formatCurrency 
+};
+
+if (typeof window !== 'undefined') {
+  window.KupolaI18n = KupolaI18n;
+  window.kupolaI18n = kupolaI18n;
+  window.createI18n = createI18n;
+  window.t = t;
+  window.n = n;
+  window.setLocale = setLocale;
+  window.getLocale = getLocale;
+  window.formatDate = formatDate;
+  window.formatNumber = formatNumber;
+  window.formatCurrency = formatCurrency;
+}