@dxtmisha/constructor 0.23.0 → 0.39.3

package/src/constructors/Window/WindowPosition.ts

@@ -1,358 +0,0 @@
-import { getElement, isDomRuntime } from '@dxtmisha/functional'
-
-import { WindowClient } from './WindowClient'
-import { WindowElement } from './WindowElement'
-import { WindowCoordinates } from './WindowCoordinates'
-
-import type { WindowProps } from './props'
-
-/**
- * A class for working with position.
- *
- * Класс для работы с позицией.
- */
-export class WindowPosition {
-  protected x: number = 0
-  protected y: number = 0
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param client object for working with mouse pointer coordinates/ объект для работы с координатами указателя мыши
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   * @param coordinates object for working with coordinates/ объект для работы с координатами
-   */
-
-  constructor(
-    protected readonly props: WindowProps,
-    protected readonly client: WindowClient,
-    protected readonly element: WindowElement,
-    protected readonly coordinates: WindowCoordinates
-  ) {
-  }
-
-  /**
-   * Checks if the alignment type is above the element.
-   *
-   * Проверяет, является ли тип выравнивания над элементом.
-   */
-  isOver(): boolean {
-    return this.props.axis === 'on'
-  }
-
-  /**
-   * Returns the X position.
-   *
-   * Возвращает позицию X.
-   */
-  getX(): number {
-    return this.x
-  }
-
-  /**
-   * Returns the Y position.
-   *
-   * Возвращает позицию Y.
-   */
-  getY(): number {
-    return this.y
-  }
-
-  /**
-   * Returns the X position for styles.
-   *
-   * Возвращает позицию X для стилей.
-   */
-  getStyleX(): string {
-    return `${this.x}px`
-  }
-
-  /**
-   * Returns the Y position for styles.
-   *
-   * Возвращает позицию Y для стилей.
-   */
-  getStyleY(): string {
-    return `${this.y}px`
-  }
-
-  /**
-   * Update of the element's position coordinates.
-   *
-   * Обновление координаты положения элемента.
-   */
-  update(): boolean {
-    if (this.coordinates.update()) {
-      this.setX()
-      this.setY()
-
-      return true
-    }
-
-    return false
-  }
-
-  /**
-   * Updates the scroll position if an element is selected.
-   *
-   * Обновляет место скрола, если выбран элемент.
-   */
-  updateScroll(): void {
-    const elementBodyContext = this.element.getBodyContext()
-
-    if (
-      this.isOver()
-      && this.props.overElement
-      && elementBodyContext
-      && elementBodyContext.scrollHeight > elementBodyContext.offsetHeight
-    ) {
-      const rect = getElement(this.props.overElement)?.getBoundingClientRect()
-      const rectBody = this.element.getBody()?.getBoundingClientRect()
-      const rectBodyContext = elementBodyContext?.getBoundingClientRect()
-      const rectControl = this.element.getControl()?.getBoundingClientRect()
-
-      if (
-        elementBodyContext
-        && rect
-        && rectBody
-        && rectBodyContext
-      ) {
-        const center = rect.height / 2
-        const shift = rect.top - rectBodyContext.top
-
-        if (
-          rectControl
-          && this.coordinates.getMaxHeight() === rectBody.height
-        ) {
-          if (rectControl.top + center < rectBody.top) {
-            elementBodyContext.scrollTop += shift
-            return
-          }
-
-          if (rectControl.bottom - center > rectBody.bottom) {
-            elementBodyContext.scrollTop += shift - rectBodyContext.height + rect.height
-            return
-          }
-
-          elementBodyContext.scrollTop += shift - (rectControl.top - rectBodyContext.top) - (rectControl.height / 2) + center
-          return
-        }
-
-        elementBodyContext.scrollTop += shift - (rectBodyContext.height / 2) + center
-      }
-    }
-  }
-
-  /**
-   * Updates the scroll display status of the element.
-   *
-   * Обновляет статус отображения скролла у элемента.
-   */
-  updateBody(): void {
-    if (isDomRuntime()) {
-      const body = document.body
-      const value = body.offsetHeight > window.innerHeight ? 'scroll' : 'none'
-
-      if (body.dataset.scroll !== value) {
-        body.dataset.scroll = value
-      }
-    }
-  }
-
-  /**
-   * Returns the axis alignment values.
-   *
-   * Возвращает значения оси выравнивания.
-   */
-  protected getAxis(): WindowProps['axis'] {
-    return this.isOver() ? 'y' : (this.props?.axis ?? 'y')
-  }
-
-  /**
-   * Returns the margins from the control element.
-   *
-   * Возвращает отступы от элемента управления.
-   * @param axis the axis of alignment of the element/ ось выравнивания элемента
-   */
-  protected getIndent(axis: string): number {
-    return this.getAxis() === axis ? (this.props.indent ?? 4) : 0
-  }
-
-  /**
-   * Calculation of the position for window alignment.
-   *
-   * Вычисление места положения для выравнивания окна.
-   * @param rectTop high control coordinates/ высокие координаты контрола
-   * @param rectBottom lower control coordinates/ нижние координаты контрола
-   */
-  protected getOverHeight(
-    rectTop: number,
-    rectBottom: number
-  ) {
-    const over = (rectBottom - rectTop) / 2
-
-    if (this.props.overElement) {
-      const rect = getElement(this.props.overElement)?.getBoundingClientRect()
-      const rectBody = this.element.getBody()?.getBoundingClientRect()
-
-      if (rect && rectBody) {
-        const top = rect.top - rectBody.top
-        const height = rect.height / 2
-
-        return rectBottom - top - height - over
-      }
-    }
-
-    const height = this.coordinates.getHeight() / 2
-
-    return rectBottom - over - height
-  }
-
-  /**
-   * Changes in position along the X coordinate.
-   *
-   * Изменения положения по координате X.
-   */
-  protected setX(): this {
-    const element = this.element.getMain()
-
-    if (element) {
-      const indent = this.getIndent('x')
-      const rectRight = this.props.contextmenu ? this.client.getX() : this.coordinates.getRight() + indent
-      const rectLeft = this.props.contextmenu ? this.client.getX() : this.coordinates.getLeft() - indent
-      const argumentValues: number[] = []
-
-      if (this.getAxis() === 'x') {
-        argumentValues.push(rectRight, rectLeft)
-      } else {
-        argumentValues.push(rectLeft, rectRight)
-      }
-
-      this.x = this.calculationInner(
-        argumentValues[0] as number,
-        argumentValues[1] as number,
-        element.offsetWidth,
-        window.innerWidth,
-        this.coordinates.getWidth()
-      )
-    }
-
-    return this
-  }
-
-  /**
-   * Changes in position along the Y coordinate.
-   *
-   * Изменения положения по координате Y.
-   */
-  protected setY(): this {
-    const element = this.element.getMain()
-
-    if (element) {
-      const indent = this.getIndent('y')
-      const rectTop = this.props.contextmenu ? this.client.getY() : this.coordinates.getTop() - indent
-      const rectBottom = this.props.contextmenu ? this.client.getY() : this.coordinates.getBottom() + indent
-      const argumentValues: number[] = []
-
-      if (this.isOver()) {
-        this.y = this.calculationOver(
-          this.getOverHeight(rectTop, rectBottom),
-          rectTop,
-          rectBottom,
-          element.offsetHeight,
-          window.innerHeight
-        )
-
-        return this
-      } else if (this.getAxis() !== 'x') {
-        argumentValues.push(rectBottom, rectTop)
-      } else {
-        argumentValues.push(rectTop, rectBottom)
-      }
-
-      this.y = this.calculationInner(
-        argumentValues[0] as number,
-        argumentValues[1] as number,
-        element.offsetHeight,
-        window.innerHeight,
-        this.coordinates.getHeight()
-      )
-    }
-
-    return this
-  }
-
-  /**
-   * Calculation of the element's position.
-   *
-   * Вычисление положения элемента.
-   * @param inValue initial values/ начальные значения
-   * @param outValue final values/ конечные значения
-   * @param length length of the object/ длина объекта
-   * @param innerLength length of the indentation/ длина отступа
-   * @param maxSize maximum length/ максимальная длина
-   */
-  protected calculationInner(
-    inValue: number,
-    outValue: number,
-    length: number,
-    innerLength: number,
-    maxSize: number
-  ): number {
-    const padding = this.coordinates.getPadding()
-
-    if (inValue + length <= innerLength - padding) {
-      return inValue
-    }
-
-    if (outValue - length > padding) {
-      return outValue - length
-    }
-
-    return (innerLength / 2) - (maxSize / 2)
-  }
-
-  /**
-   * Calculation of the element's position.
-   *
-   * Вычисление положения над элемента.
-   * @param value initial values/ начальные значения
-   * @param top high control coordinates/ высокие координаты контрола
-   * @param bottom lower control coordinates/ нижние координаты контрола
-   * @param length length of the object/ длина объекта
-   * @param innerLength length of the indentation/ длина отступа
-   */
-  protected calculationOver(
-    value: number,
-    top: number,
-    bottom: number,
-    length: number,
-    innerLength: number
-  ): number {
-    const padding = this.coordinates.getPadding()
-
-    if (bottom < padding) {
-      return bottom
-    }
-
-    if (top > innerLength - padding) {
-      const data = top - length - padding
-
-      if (data < padding) {
-        return padding
-      }
-
-      return data
-    }
-
-    if (value < padding) {
-      return padding
-    }
-
-    if (value + length <= innerLength - padding) {
-      return value
-    }
-
-    return innerLength - length - padding
-  }
-}

package/src/constructors/Window/WindowStatic.ts

@@ -1,102 +0,0 @@
-import { ref, type ToRefs, watch } from 'vue'
-import { EventItem, setRef } from '@dxtmisha/functional'
-
-import { WindowElement } from './WindowElement'
-
-import type { WindowProps } from './props'
-
-/**
- * Class for working with a static window.
- *
- * Класс для работы со статичным окном.
- */
-export class WindowStatic {
-  protected event?: EventItem<Window, Event>
-
-  readonly item = ref<boolean>(false)
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param refs input data in the form of reactive elements/ входные данные в виде реактивных элементов
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   */
-  constructor(
-    protected readonly props: WindowProps,
-    refs: ToRefs<WindowProps>,
-    protected readonly element: WindowElement
-  ) {
-    watch([refs.staticMode], this.make, { immediate: true })
-  }
-
-  /**
-   * Checks if the static mode is enabled.
-   *
-   * Проверяет, включен ли режим статичности.
-   */
-  isStaticMod(): boolean {
-    return Boolean(this.props.staticMode)
-  }
-
-  /**
-   * Starts the status tracking event.
-   *
-   * Стартует событие слежения за статусами.
-   */
-  start(): void {
-    if (!this.event) {
-      this.event = new EventItem(window, ['resize'], this.listener)
-    }
-
-    this.event.start()
-  }
-
-  /**
-   * Restores the data to its previous state.
-   *
-   * Восстанавливает данные в прежнее состояние.
-   */
-  stop(): void {
-    if (this.event) {
-      this.event.stop()
-      this.event = undefined
-    }
-  }
-
-  /**
-   * Checks if the static window is active.
-   *
-   * Проверяет, активно ли статичное окно.
-   */
-  protected isStatic(): boolean {
-    const element = this.element.getMain()
-
-    return Boolean(
-      element
-      && getComputedStyle(element).content === '"--STATIC--"'
-    )
-  }
-
-  /**
-   * The function called when an event is triggered.
-   *
-   * Вызываемая функция при срабатывании события.
-   */
-  protected readonly listener = (): void => {
-    setRef(this.item, this.isStatic())
-  }
-
-  /**
-   * Performs status check and activates events when turned on.
-   *
-   * Выполняет проверку статуса и активизирует события при включении.
-   */
-  protected readonly make = (): void => {
-    if (this.isStaticMod()) {
-      this.start()
-      requestAnimationFrame(this.listener)
-    } else {
-      this.stop()
-    }
-  }
-}

package/src/constructors/Window/WindowStatus.ts

@@ -1,138 +0,0 @@
-import { ref } from 'vue'
-
-import { WindowElement } from './WindowElement'
-
-import { WindowStatusItem } from './basicTypes'
-
-/**
- * A class that changes the status of the current component. This is needed for
- * working with animation and behavior of the element when opening/closing.
- *
- * Класс, отвечающий за изменение статуса текущего компонента. Это нужно для работы
- * с анимацией и поведением элемента при открытии/закрытии.
- */
-export class WindowStatus {
-  readonly item = ref<WindowStatusItem>(WindowStatusItem.close)
-
-  /**
-   * Constructor
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   */
-  constructor(
-    protected readonly element: WindowElement
-  ) {
-  }
-
-  /**
-   * Checks if the current status is closed (hide).
-   *
-   * Проверяет, является ли текущий статус закрытым (hide).
-   */
-  isHide(): boolean {
-    return this.item.value === WindowStatusItem.hide
-  }
-
-  /**
-   * Checks if the current status is open (open/flash).
-   *
-   * Проверяет, является ли текущий статус открытым (open/flash).
-   */
-  isOpen(): boolean {
-    return this.item.value === WindowStatusItem.open || this.item.value === WindowStatusItem.flash
-  }
-
-  /**
-   * Change the current status.
-   *
-   * Изменить текущий статус.
-   * @param value value/ значение
-   */
-  set(value: WindowStatusItem): this {
-    this.item.value = value
-    this.update()
-
-    return this
-  }
-
-  /**
-   * Translates status to display.
-   *
-   * Переводит статус в display.
-   */
-  toDisplay(): this {
-    this.set(WindowStatusItem.display)
-    return this
-  }
-
-  /**
-   * Translates status to preparation.
-   *
-   * Переводит статус в preparation.
-   */
-  toPreparation(): this {
-    this.set(WindowStatusItem.preparation)
-    return this
-  }
-
-  /**
-   * Translates status to flash.
-   *
-   * Переводит статус в flash.
-   */
-  toFlash(): this {
-    this.set(WindowStatusItem.flash)
-    return this
-  }
-
-  /**
-   * Translates status to open.
-   *
-   * Переводит статус в open.
-   */
-  toOpen(): this {
-    this.set(WindowStatusItem.open)
-    return this
-  }
-
-  /**
-   * Translates status to hide.
-   *
-   * Переводит статус в hide.
-   */
-  toHide(): this {
-    this.set(WindowStatusItem.hide)
-    return this
-  }
-
-  /**
-   * Translates status to close.
-   *
-   * Переводит статус в close.
-   */
-  toClose(): this {
-    this.set(WindowStatusItem.close)
-    return this
-  }
-
-  /**
-   * Updates the data-status attribute on the main element and teleport element.
-   *
-   * Обновляет атрибут data-status на основном элементе и элементе телепорта.
-   */
-  update(): void {
-    const element = this.element.getMain()
-
-    if (element) {
-      const teleportElement = element.parentElement
-
-      element.dataset.status = this.item.value
-
-      if (
-        teleportElement
-        && teleportElement.dataset.windowTeleport
-      ) {
-        teleportElement.dataset.status = this.item.value
-      }
-    }
-  }
-}

package/src/constructors/Window/WindowStyles.ts

@@ -1,78 +0,0 @@
-import { watch } from 'vue'
-
-import { WindowElement } from './WindowElement'
-import { WindowCoordinates } from './WindowCoordinates'
-import { WindowPosition } from './WindowPosition'
-import { WindowOrigin } from './WindowOrigin'
-
-/**
- * Style management class.
- *
- * Класс управления стилями.
- */
-export class WindowStyles {
-  /**
-   * Constructor
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   * @param coordinates object for working with coordinates/ объект для работы с координатами
-   * @param position object for working with the position of the element/ объект для работы с положением элемента
-   * @param origin the object for work is in the initial position upon opening/ объект для работы в начальной позиции при открытии
-   * @param className class name/ название класса
-   */
-  constructor(
-    protected readonly element: WindowElement,
-    protected readonly coordinates: WindowCoordinates,
-    protected readonly position: WindowPosition,
-    protected readonly origin: WindowOrigin,
-    protected readonly className: string
-  ) {
-    watch(this.element.element, () => this.update())
-  }
-
-  /**
-   * Data update.
-   *
-   * Обновление данных.
-   */
-  update(): void {
-    const element = this.element.getMain()
-
-    if (element) {
-      element.style.setProperty(`--${this.className}-sys-inset-x`, this.position.getStyleX())
-      element.style.setProperty(`--${this.className}-sys-inset-y`, this.position.getStyleY())
-      element.style.setProperty(`--${this.className}-origin-x`, this.origin.getStyleX())
-      element.style.setProperty(`--${this.className}-origin-y`, this.origin.getStyleY())
-      element.style.setProperty(`--${this.className}-sys-control-width`, `${this.coordinates.getControlWidth()}px`)
-      element.style.setProperty(`--${this.className}-sys-control-height`, `${this.coordinates.getControlHeight()}px`)
-      element.style.setProperty(`--${this.className}-sys-location`, this.coordinates.getLocation())
-    }
-  }
-
-  /**
-   * Updates the window type (menu or modal).
-   *
-   * Обновляет тип окна (меню или модальное).
-   * @param isMenu whether the window is a menu/ является ли окно меню
-   */
-  updateType(isMenu: boolean): void {
-    const element = this.element.getMain()
-
-    if (
-      element && (
-        (isMenu && (element.dataset.windowMenu !== 'menu'))
-        || (!isMenu && (element.dataset.windowMenu === 'menu'))
-      )
-    ) {
-      const teleportElement = element.parentElement
-
-      element.dataset.windowMenu = isMenu ? 'menu' : 'modal'
-
-      if (
-        teleportElement
-        && teleportElement.dataset.windowTeleport
-      ) {
-        teleportElement.dataset.windowMenu = element.dataset.windowMenu
-      }
-    }
-  }
-}