medici/packages/core/src/event.ts

import { Dict } from '@medici/types';
import { SDK } from './sdk';
// import { getGlobalObject } from '@medici/utils';
// export
// const global = getGlobalObject<Window>();

// const eventSelect = "[class*='umami--']";
export class Eventer {
    protected _sdk: SDK;
    private _identifier: string;
    private _eventSelect: string;
    private eventClassValidate: RegExp;
    private listeners: Dict<any> = {};
    constructor(_sdk: SDK) {
        this._sdk = _sdk;
        this._identifier = 'mdc';
        this._eventSelect = `[class*='${this._identifier}--']`;
        this.eventClassValidate = /^mdc--([a-z]+)--([\w]+[\w-]*)$/;
    }
    updateIdentifier(identifier: string): void {
        this._identifier = identifier;
        this.eventClassValidate = new RegExp('^' + identifier + '--([a-z]+)--([w]+[w-]*)$');
    }
    get eventSelect(): string {
        return this._eventSelect;
    }

    initElementCssEvents(node: HTMLElement): void {
        const elements = node.querySelectorAll(this.eventSelect);
        console.log('initElementCssEvents-elements', elements);
        Array.prototype.forEach.call(elements, this.addCssEvent.bind(this));
    }

    addCssEvent(element: HTMLElement): void {
        (element.getAttribute('class') || '').split(' ').forEach((className) => {
            if (!this.eventClassValidate.test(className)) return;
            console.log('有效Node', element);
            const [, event, name] = className.split('--');
            console.log('addCssEvent', event, name);
            const listener = this.listeners[className]
                ? this.listeners[className]
                : (this.listeners[className] = () => {
                      console.log('trackEvent', event, name);
                      if (element.tagName === 'A') {
                          this._sdk.trackEvent(name, event);
                      } else {
                          this._sdk.trackEvent(name, event);
                      }
                  });
            // console.log('listener', listener);
            element.addEventListener(event, listener, true);
        });
    }
}