• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

TypeScript utils.getOriginXY函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中@interactjs/utils.getOriginXY函数的典型用法代码示例。如果您正苦于以下问题:TypeScript getOriginXY函数的具体用法?TypeScript getOriginXY怎么用?TypeScript getOriginXY使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了getOriginXY函数的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: dropCheckMethod

function dropCheckMethod (
  interactable: Interact.Interactable,
  dragEvent: InteractEvent,
  event: Interact.PointerEventType,
  draggable: Interact.Interactable,
  draggableElement: Element,
  dropElement: Element,
  rect: any
) {
  let dropped = false

  // if the dropzone has no rect (eg. display: none)
  // call the custom dropChecker or just return false
  if (!(rect = rect || interactable.getRect(dropElement))) {
    return (interactable.options.drop.checker
      ? interactable.options.drop.checker(dragEvent, event, dropped, interactable, dropElement, draggable, draggableElement)
      : false)
  }

  const dropOverlap = interactable.options.drop.overlap

  if (dropOverlap === 'pointer') {
    const origin = utils.getOriginXY(draggable, draggableElement, 'drag')
    const page = utils.pointer.getPageXY(dragEvent)

    page.x += origin.x
    page.y += origin.y

    const horizontal = (page.x > rect.left) && (page.x < rect.right)
    const vertical   = (page.y > rect.top) && (page.y < rect.bottom)

    dropped = horizontal && vertical
  }

  const dragRect = draggable.getRect(draggableElement)

  if (dragRect && dropOverlap === 'center') {
    const cx = dragRect.left + dragRect.width  / 2
    const cy = dragRect.top  + dragRect.height / 2

    dropped = cx >= rect.left && cx <= rect.right && cy >= rect.top && cy <= rect.bottom
  }

  if (dragRect && utils.is.number(dropOverlap)) {
    const overlapArea  = (Math.max(0, Math.min(rect.right, dragRect.right) - Math.max(rect.left, dragRect.left)) *
                          Math.max(0, Math.min(rect.bottom, dragRect.bottom) - Math.max(rect.top, dragRect.top)))

    const overlapRatio = overlapArea / (dragRect.width * dragRect.height)

    dropped = overlapRatio >= dropOverlap
  }

  if (interactable.options.drop.checker) {
    dropped = interactable.options.drop.checker(dragEvent, event, dropped, interactable, dropElement, draggable, draggableElement)
  }

  return dropped
}
开发者ID:taye,项目名称:interact.js,代码行数:58,代码来源:index.ts


示例2: getOrigin

function getOrigin (arg: Partial<Interact.SignalArg>) {
  const optionsOrigin = utils.rect.rectToXY(
    utils.rect.resolveRectLike(arg.state.options.origin)
  )
  const origin = optionsOrigin || utils.getOriginXY(
    arg.interactable,
    arg.interaction.element,
    arg.interaction.prepared.name,
  )

  return origin
}
开发者ID:taye,项目名称:interact.js,代码行数:12,代码来源:pointer.ts


示例3: set

function set (arg: Interact.SignalArg) {
  const { interaction, coords, state } = arg
  const { options, offsets } = state

  const origin = utils.getOriginXY(interaction.interactable, interaction.element, interaction.prepared.name)
  const page = utils.extend({}, coords)
  const targets = []
  let target

  if (!options.offsetWithOrigin) {
    page.x -= origin.x
    page.y -= origin.y
  }

  state.realX = page.x
  state.realY = page.y

  for (const offset of offsets) {
    const relativeX = page.x - offset.x
    const relativeY = page.y - offset.y

    for (let index = 0, len = options.targets.length; index < len; index++) {
      const snapTarget = options.targets[index]
      if (utils.is.func(snapTarget)) {
        target = snapTarget(relativeX, relativeY, interaction, offset, index)
      }
      else {
        target = snapTarget
      }

      if (!target) { continue }

      targets.push({
        x: (utils.is.number(target.x) ? target.x : relativeX) + offset.x,
        y: (utils.is.number(target.y) ? target.y : relativeY) + offset.y,

        range: utils.is.number(target.range) ? target.range : options.range,
      })
    }
  }

  const closest = {
    target: null,
    inRange: false,
    distance: 0,
    range: 0,
    dx: 0,
    dy: 0,
  }

  for (let i = 0, len = targets.length; i < len; i++) {
    target = targets[i]

    const range = target.range
    const dx = target.x - page.x
    const dy = target.y - page.y
    const distance = utils.hypot(dx, dy)
    let inRange = distance <= range

    // Infinite targets count as being out of range
    // compared to non infinite ones that are in range
    if (range === Infinity && closest.inRange && closest.range !== Infinity) {
      inRange = false
    }

    if (!closest.target || (inRange
      // is the closest target in range?
      ? (closest.inRange && range !== Infinity
        // the pointer is relatively deeper in this target
        ? distance / range < closest.distance / closest.range
        // this target has Infinite range and the closest doesn't
        : (range === Infinity && closest.range !== Infinity) ||
          // OR this target is closer that the previous closest
          distance < closest.distance)
      // The other is not in range and the pointer is closer to this target
      : (!closest.inRange && distance < closest.distance))) {
      closest.target = target
      closest.distance = distance
      closest.range = range
      closest.inRange = inRange
      closest.dx = dx
      closest.dy = dy

      state.range = range
    }
  }

  if (closest.inRange) {
    coords.x = closest.target.x
    coords.y = closest.target.y
  }

  state.closest = closest
}
开发者ID:taye,项目名称:interact.js,代码行数:94,代码来源:pointer.ts


示例4: collectEventTargets

function fire<T extends string> (arg: {
  interaction: Interaction,
  pointer: Interact.PointerType,
  event: Interact.PointerEventType,
  eventTarget: Interact.EventTarget,
  targets?: EventTargetList,
  pointerEvent?: PointerEvent<T>,
  type: T
}, scope: Interact.Scope) {
  const {
    interaction, pointer, event, eventTarget,
    type = (arg as any).pointerEvent.type,
    targets = collectEventTargets(arg),
  } = arg

  const {
    pointerEvent = new PointerEvent(type, pointer, event, eventTarget, interaction, scope.now()),
  } = arg

  const signalArg = {
    interaction,
    pointer,
    event,
    eventTarget,
    targets,
    type,
    pointerEvent,
  }

  for (let i = 0; i < targets.length; i++) {
    const target = targets[i]

    for (const prop in target.props || {}) {
      (pointerEvent as any)[prop] = target.props[prop]
    }

    const origin = utils.getOriginXY(target.eventable, target.element)

    pointerEvent._subtractOrigin(origin)
    pointerEvent.eventable = target.eventable
    pointerEvent.currentTarget = target.element

    target.eventable.fire(pointerEvent)

    pointerEvent._addOrigin(origin)

    if (pointerEvent.immediatePropagationStopped ||
        (pointerEvent.propagationStopped &&
            (i + 1) < targets.length && targets[i + 1].element !== pointerEvent.currentTarget)) {
      break
    }
  }

  signals.fire('fired', signalArg)

  if (type === 'tap') {
    // if pointerEvent should make a double tap, create and fire a doubletap
    // PointerEvent and use that as the prevTap
    const prevTap = pointerEvent.double
      ? fire({
        interaction,
        pointer,
        event,
        eventTarget,
        type: 'doubletap',
      }, scope)
      : pointerEvent

    interaction.prevTap = prevTap
    interaction.tapTime = prevTap.timeStamp
  }

  return pointerEvent
}
开发者ID:taye,项目名称:interact.js,代码行数:74,代码来源:base.ts



注:本文中的@interactjs/utils.getOriginXY函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript utils.Signals类代码示例发布时间:2022-05-28
下一篇:
TypeScript utils.extend函数代码示例发布时间:2022-05-28
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap