@vime/core/dist/esm/withControlsCollisionDetection-ebad8447.js

Customizable, extensible, accessible and framework agnostic media player.

import { g as getElement, w as writeTask } from './index-f5fd0f81.js';
import { j as createStencilHook, x as isNull, r as wrapStencilHook, y as isColliding } from './withComponentRegistry-28311671.js';

/* eslint-disable func-names */
const watch = new Set();
const controls = new Set();
// watchedEl -> (controlsEl -> controlsHeight) saved on collision. Basically keeps track of
// every collision with all controls for each watched element.
const collisions = new Map();
function update() {
  writeTask(() => {
    controls.forEach(controlsEl => {
      const controlsHeight = parseFloat(window.getComputedStyle(controlsEl).height);
      watch.forEach(watchedEl => {
        const watchedElCollisions = collisions.get(watchedEl);
        const hasCollided = isColliding(watchedEl, controlsEl);
        const willCollide = isColliding(watchedEl, controlsEl, 0, controlsHeight) ||
          isColliding(watchedEl, controlsEl, 0, -controlsHeight);
        watchedElCollisions.set(controlsEl, hasCollided || willCollide ? controlsHeight : 0);
      });
    });
    // Update after assessing all collisions so there are no glitchy movements.
    watch.forEach(watchedEl => {
      const watchedElCollisions = collisions.get(watchedEl);
      watchedEl.style.setProperty('--vm-controls-height', `${Math.max(0, Math.max(...watchedElCollisions.values()))}px`);
    });
  });
}
function registerControlsForCollisionDetection(component) {
  const el = getElement(component);
  function getInnerEl() {
    return el.shadowRoot.querySelector('.controls');
  }
  createStencilHook(component, () => {
    const innerEl = getInnerEl();
    if (!isNull(innerEl)) {
      controls.add(innerEl);
      update();
    }
  }, () => {
    controls.delete(getInnerEl());
    update();
  });
  wrapStencilHook(component, 'componentDidLoad', () => {
    controls.add(getInnerEl());
    update();
  });
  wrapStencilHook(component, 'componentDidRender', update);
}
function withControlsCollisionDetection(component) {
  const el = getElement(component);
  createStencilHook(component, () => {
    watch.add(el);
    collisions.set(el, new Map());
    update();
  }, () => {
    watch.delete(el);
    collisions.delete(el);
  });
}

export { registerControlsForCollisionDetection as r, withControlsCollisionDetection as w };