[Aetae]

class Drag {
  drop = drop_handler;
  dragover = dragover_handler;
  dragstart =dragstart_handler;
  dragend = dragend_handler;
  
  events = ['dragover', 'drop', 'dragstart', 'dragend'];
  
  constructor(targetSelector, elementSelector) {
    this.targetSelector = targetSelector;
    this.elementSelector = elementSelector;
    this.start();
  }
  
  handleEvent(event) {
    let { type, target } = event;

    switch(type) {
      case 'dragover':
      case 'drop':
        target = target.closest(this.targetSelector);
        break;
      case 'dragstart':
      case 'dragend':
        target = target.closest(this.elementSelector)
        break;
    }
    
    if(target)
      this[type].call(target, event);
  }

  start() {
    this.events.forEach(type => document.addEventListener(type, this));
    return this;
  }
  stop() { 
    this.events.forEach(type => document.removeEventListener(type, this));
    return this;
  }
}

const drag = new Drag('.drag-target', '.drag-element');