import { AffixTargetType } from "./AffixProps";

interface AffixManager {
  target: AffixTargetType;
  changeHandlers: {
    [affixId: string]: (event: Event) => void;
  };
  eventHandlers: {
    [event: string]: (event: Event) => void;
  };
}

const Events = [
  "resize",
  "scroll",
  "touchstart",
  "touchmove",
  "touchend",
  "pageshow",
  "load",
];

let managers: AffixManager[] = [];

function createManager(target: AffixTargetType): AffixManager {
  const manager: AffixManager = {
    target,
    changeHandlers: {},
    eventHandlers: {},
  };

  Events.forEach(type => {
    const listener = (event: Event) =>
      Object.values(manager.changeHandlers).forEach(
        handler => handler && handler(event)
      );
    target.addEventListener(type, listener);
    manager.eventHandlers[type] = listener;
  });

  return manager;
}

export function addListener(
  target: AffixTargetType,
  affixId: string,
  onChange: (event: Event) => void
): void {
  const manager =
    managers.find(manager => manager.target === target) ||
    createManager(target);
  manager.changeHandlers[affixId] = onChange;
}

export function removeListener(target: AffixTargetType, affixId: string) {
  const manager = managers.find(manager => manager.target === target);
  if (manager) {
    manager.changeHandlers[affixId] = undefined;
    if (Object.values(manager.changeHandlers).filter(i => !!i).length === 0) {
      Events.forEach(type =>
        target.removeEventListener(type, manager.eventHandlers[type])
      );
      managers = managers.filter(manager => manager.target !== target);
    }
  }
}