How to use the @fullcalendar/core.computeRect function in @fullcalendar/core

To help you get started, we’ve selected a few @fullcalendar/core examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github fullcalendar / fullcalendar / packages / daygrid / src / DayGrid.ts View on Github external
this.props.cells[row][_col].date,
          segs
        )
      },
      hide: () => {
        this.segPopoverTile.destroy()
        this.segPopoverTile = null
        this.segPopover.destroy()
        this.segPopover = null
      }
    }

    // Determine horizontal coordinate.
    // We use the moreWrap instead of the <td> to avoid border confusion.
    if (isRtl) {
      options.right = computeRect(moreWrap).right + 1 // +1 to be over cell border
    } else {
      options.left = computeRect(moreWrap).left - 1 // -1 to be over cell border
    }

    this.segPopover = new Popover(options)
    this.segPopover.show()
    calendar.releaseAfterSizingTriggers() // hack for eventPositioned
  }
github fullcalendar / fullcalendar / packages / daygrid / src / DayGrid.ts View on Github external
let { calendar, view, theme, isRtl } = this.context
    let _col = isRtl ? this.colCnt - col - 1 : col // HACK: props.cells has different dir system?
    let moreWrap = moreLink.parentNode as HTMLElement // the <div> wrapper around the <a>
    let topEl: HTMLElement // the element we want to match the top coordinate of
    let options

    if (this.rowCnt === 1) {
      topEl = view.el // will cause the popover to cover any sort of header
    } else {
      topEl = this.rowEls[row] // will align with top of row
    }

    options = {
      className: 'fc-more-popover ' + theme.getClass('popover'),
      parentEl: view.el, // will be outside of all scrollers within the view
      top: computeRect(topEl).top,
      autoHide: true, // when the user clicks elsewhere, hide the popover
      content: (el) => {
        this.segPopoverTile = new DayTile(el)
        this.updateSegPopoverTile(
          this.props.cells[row][_col].date,
          segs
        )
      },
      hide: () => {
        this.segPopoverTile.destroy()
        this.segPopoverTile = null
        this.segPopover.destroy()
        this.segPopover = null
      }
    }
github fullcalendar / fullcalendar / packages / interaction / src / OffsetTracker.ts View on Github external
constructor(el: HTMLElement) {
    this.origRect = computeRect(el)

    // will work fine for divs that have overflow:hidden
    this.scrollCaches = getClippingParents(el).map(function(el) {
      return new ElementScrollGeomCache(el, true) // listen=true
    })
  }
github fullcalendar / fullcalendar / packages / daygrid / src / Popover.ts View on Github external
position() {
    let options = this.options
    let el = this.el
    let elDims = el.getBoundingClientRect() // only used for width,height
    let origin = computeRect(el.offsetParent)
    let clippingRect = computeClippingRect(options.parentEl)
    let top // the "position" (not "offset") values for the popover
    let left //

    // compute top and left
    top = options.top || 0
    if (options.left !== undefined) {
      left = options.left
    } else if (options.right !== undefined) {
      left = options.right - elDims.width // derive the left value from the right value
    } else {
      left = 0
    }

    // constrain to the view port. if constrained by two edges, give precedence to top/left
    top = Math.min(top, clippingRect.bottom - elDims.height - this.margin)
github avpeery / Moon-Phase-Tracker / static / fullcalendar / packages / daygrid / main.esm.js View on Github external
_this.updateSegPopoverTile(_this.props.cells[row][_col].date, segs);
            },
            hide: function () {
                _this.segPopoverTile.destroy();
                _this.segPopoverTile = null;
                _this.segPopover.destroy();
                _this.segPopover = null;
            }
        };
        // Determine horizontal coordinate.
        // We use the moreWrap instead of the <td> to avoid border confusion.
        if (this.isRtl) {
            options.right = computeRect(moreWrap).right + 1; // +1 to be over cell border
        }
        else {
            options.left = computeRect(moreWrap).left - 1; // -1 to be over cell border
        }
        this.segPopover = new Popover(options);
        this.segPopover.show();
        calendar.releaseAfterSizingTriggers(); // hack for eventPositioned
    };
    // Given the events within an array of segment objects, reslice them to be in a single day
github avpeery / Moon-Phase-Tracker / static / fullcalendar / packages / daygrid / main.esm.js View on Github external
autoHide: true,
            content: function (el) {
                _this.segPopoverTile = new DayTile(_this.context, el);
                _this.updateSegPopoverTile(_this.props.cells[row][_col].date, segs);
            },
            hide: function () {
                _this.segPopoverTile.destroy();
                _this.segPopoverTile = null;
                _this.segPopover.destroy();
                _this.segPopover = null;
            }
        };
        // Determine horizontal coordinate.
        // We use the moreWrap instead of the <td> to avoid border confusion.
        if (this.isRtl) {
            options.right = computeRect(moreWrap).right + 1; // +1 to be over cell border
        }
        else {
            options.left = computeRect(moreWrap).left - 1; // -1 to be over cell border
        }
        this.segPopover = new Popover(options);
        this.segPopover.show();
        calendar.releaseAfterSizingTriggers(); // hack for eventPositioned
    };
    // Given the events within an array of segment objects, reslice them to be in a single day
github fullcalendar / fullcalendar / packages / interaction / src / interactions / HitDragging.ts View on Github external
processFirstCoord(ev: PointerDragEvent) {
    let origPoint = { left: ev.pageX, top: ev.pageY }
    let adjustedPoint = origPoint
    let subjectEl = ev.subjectEl
    let subjectRect

    if (subjectEl !== document) {
      subjectRect = computeRect(subjectEl)
      adjustedPoint = constrainPoint(adjustedPoint, subjectRect)
    }

    let initialHit = this.initialHit = this.queryHitForOffset(adjustedPoint.left, adjustedPoint.top)

    if (initialHit) {
      if (this.useSubjectCenter && subjectRect) {
        let slicedSubjectRect = intersectRects(subjectRect, initialHit.rect)
        if (slicedSubjectRect) {
          adjustedPoint = getRectCenter(slicedSubjectRect)
        }
      }

      this.coordAdjust = diffPoints(adjustedPoint, origPoint)
    } else {
      this.coordAdjust = { left: 0, top: 0 }
github avpeery / Moon-Phase-Tracker / static / fullcalendar / packages / interaction / main.esm.js View on Github external
HitDragging.prototype.processFirstCoord = function (ev) {
        var origPoint = { left: ev.pageX, top: ev.pageY };
        var adjustedPoint = origPoint;
        var subjectEl = ev.subjectEl;
        var subjectRect;
        if (subjectEl !== document) {
            subjectRect = computeRect(subjectEl);
            adjustedPoint = constrainPoint(adjustedPoint, subjectRect);
        }
        var initialHit = this.initialHit = this.queryHitForOffset(adjustedPoint.left, adjustedPoint.top);
        if (initialHit) {
            if (this.useSubjectCenter && subjectRect) {
                var slicedSubjectRect = intersectRects(subjectRect, initialHit.rect);
                if (slicedSubjectRect) {
                    adjustedPoint = getRectCenter(slicedSubjectRect);
                }
            }
            this.coordAdjust = diffPoints(adjustedPoint, origPoint);
        }
        else {
            this.coordAdjust = { left: 0, top: 0 };
        }
    };