@vime/core/dist/cjs/withControlsCollisionDetection-7c7e2319.js

Customizable, extensible, accessible and framework agnostic media player.

'use strict';

const index = require('./index-86498cbd.js');
const withComponentRegistry = require('./withComponentRegistry-90ec334c.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() {
  index.writeTask(() => {
    controls.forEach(controlsEl => {
      const controlsHeight = parseFloat(window.getComputedStyle(controlsEl).height);
      watch.forEach(watchedEl => {
        const watchedElCollisions = collisions.get(watchedEl);
        const hasCollided = withComponentRegistry.isColliding(watchedEl, controlsEl);
        const willCollide = withComponentRegistry.isColliding(watchedEl, controlsEl, 0, controlsHeight) ||
          withComponentRegistry.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 = index.getElement(component);
  function getInnerEl() {
    return el.shadowRoot.querySelector('.controls');
  }
  withComponentRegistry.createStencilHook(component, () => {
    const innerEl = getInnerEl();
    if (!withComponentRegistry.isNull(innerEl)) {
      controls.add(innerEl);
      update();
    }
  }, () => {
    controls.delete(getInnerEl());
    update();
  });
  withComponentRegistry.wrapStencilHook(component, 'componentDidLoad', () => {
    controls.add(getInnerEl());
    update();
  });
  withComponentRegistry.wrapStencilHook(component, 'componentDidRender', update);
}
function withControlsCollisionDetection(component) {
  const el = index.getElement(component);
  withComponentRegistry.createStencilHook(component, () => {
    watch.add(el);
    collisions.set(el, new Map());
    update();
  }, () => {
    watch.delete(el);
    collisions.delete(el);
  });
}

exports.registerControlsForCollisionDetection = registerControlsForCollisionDetection;
exports.withControlsCollisionDetection = withControlsCollisionDetection;