R E D

NAME	SIZE	PERMISSION
touch	[ DIR ]	drwxr-xr-x
focusTrap.js	2.49 KB	-rwxr-xr-x
index.js	5.72 KB	-rwxr-xr-x
keycodes.js	920 B	-rwxr-xr-x
sanitizer.js	3.31 KB	-rwxr-xr-x
scrollbar.js	2.84 KB	-rwxr-xr-x
stack.js	2.47 KB	-rwxr-xr-x

Code Editor : stack.js

import SelectorEngine from '../dom/selector-engine';
import { isVisible, typeCheckConfig } from './index';

const NAME = 'Stack';

const DEFAULT_OPTIONS = {
  position: 'top',
  container: null,
  refresh: 1000,
  filter: (el) => {
    return el;
  },
};

const TYPE_OPTIONS = {
  position: 'string',
  container: '(undefined|null|string)',
  refresh: 'number',
  filter: 'function',
};

class Stack {
  constructor(element, selector, options) {
    this._element = element;
    this._selector = selector;
    this._options = this._getConfig(options);

this._offset = null;

if (this._options.container) {
      this._parent = SelectorEngine.findOne(this._options.container);
    }
  }

get stackableElements() {
    return SelectorEngine.find(this._selector)
      .filter((el, i) => this._options.filter(el, i))
      .map((el) => ({ el, rect: el.getBoundingClientRect() }))
      .filter(({ el, rect }) => {
        const basicCondition = el !== this._element && isVisible(el);
        if (this._offset === null) {
          return basicCondition;
        }

return basicCondition && this._getBoundryOffset(rect) < this._offset;
      })
      .sort((a, b) => {
        return this._getBoundryOffset(b.rect) - this._getBoundryOffset(a.rect);
      });
  }

get nextElements() {
    return SelectorEngine.find(this._selector)
      .filter((el) => el !== this._element)
      .filter((el, i) => this._options.filter(el, i))
      .filter((el) => {
        this._offset = null;
        return this._getBoundryOffset(el.getBoundingClientRect()) > this._offset;
      });
  }

_getConfig(options) {
    const config = {
      ...DEFAULT_OPTIONS,
      ...options,
    };

typeCheckConfig(NAME, config, TYPE_OPTIONS);

return config;
  }

_getBoundryOffset(rect) {
    const { position } = this._options;

let parentTopOffset = 0;
    let parentBottomBoundry = window.innerHeight;

if (this._parent) {
      const parentRect = this._parent.getBoundingClientRect();

parentTopOffset = parentRect.top;
      parentBottomBoundry = parentRect.bottom;
    }

if (position === 'top') {
      return rect.top - parentTopOffset;
    }
    return parentBottomBoundry - rect.bottom;
  }

calculateOffset() {
    const [previousElement] = this.stackableElements;

if (!previousElement) {
      this._offset = 0;
    } else {
      this._offset = this._getBoundryOffset(previousElement.rect) + previousElement.rect.height;
    }

return this._offset;
  }
}

export default Stack;

${this.title}

Code Editor : stack.js