cbvirtua 1.0.106 → 1.0.107

package/better-scroll-dev/better-scroll-dev/packages/nested-scroll/src/index.ts

@@ -0,0 +1,398 @@
+import BScroll, { MountedBScrollHTMLElement } from '@better-scroll/core'
+import {
+  Direction,
+  EventEmitter,
+  extend,
+  warn,
+  findIndex,
+} from '@better-scroll/shared-utils'
+import BScrollFamily from './BScrollFamily'
+import propertiesConfig from './propertiesConfig'
+
+export const DEFAUL_GROUP_ID = 'INTERNAL_NESTED_SCROLL'
+
+export type NestedScrollGroupId = string | number
+
+export interface NestedScrollConfig {
+  groupId: NestedScrollGroupId
+}
+
+export type NestedScrollOptions = NestedScrollConfig | true
+
+declare module '@better-scroll/core' {
+  interface CustomOptions {
+    nestedScroll?: NestedScrollOptions
+  }
+  interface CustomAPI {
+    nestedScroll: PluginAPI
+  }
+}
+
+interface PluginAPI {
+  purgeNestedScroll(groupId: NestedScrollGroupId): void
+}
+
+interface NestedScrollInstancesMap {
+  [key: string]: NestedScroll
+  [index: number]: NestedScroll
+}
+
+const forceScrollStopHandler = (scrolls: BScroll[]) => {
+  scrolls.forEach((scroll) => {
+    if (scroll.pending) {
+      scroll.stop()
+      scroll.resetPosition()
+    }
+  })
+}
+
+const enableScrollHander = (scrolls: BScroll[]) => {
+  scrolls.forEach((scroll) => {
+    scroll.enable()
+  })
+}
+
+const disableScrollHander = (scrolls: BScroll[], currentScroll: BScroll) => {
+  scrolls.forEach((scroll) => {
+    if (
+      scroll.hasHorizontalScroll === currentScroll.hasHorizontalScroll ||
+      scroll.hasVerticalScroll === currentScroll.hasVerticalScroll
+    ) {
+      scroll.disable()
+    }
+  })
+}
+
+const syncTouchstartData = (scrolls: BScroll[]) => {
+  scrolls.forEach((scroll) => {
+    const { actions, scrollBehaviorX, scrollBehaviorY } = scroll.scroller
+
+    // prevent click triggering many times
+    actions.fingerMoved = true
+    actions.contentMoved = false
+
+    actions.directionLockAction.reset()
+
+    scrollBehaviorX.start()
+    scrollBehaviorY.start()
+
+    scrollBehaviorX.resetStartPos()
+    scrollBehaviorY.resetStartPos()
+
+    actions.startTime = +new Date()
+  })
+}
+
+const isOutOfBoundary = (scroll: BScroll): boolean => {
+  const {
+    hasHorizontalScroll,
+    hasVerticalScroll,
+    x,
+    y,
+    minScrollX,
+    maxScrollX,
+    minScrollY,
+    maxScrollY,
+    movingDirectionX,
+    movingDirectionY,
+  } = scroll
+  let ret = false
+
+  const outOfLeftBoundary =
+    x >= minScrollX && movingDirectionX === Direction.Negative
+  const outOfRightBoundary =
+    x <= maxScrollX && movingDirectionX === Direction.Positive
+  const outOfTopBoundary =
+    y >= minScrollY && movingDirectionY === Direction.Negative
+  const outOfBottomBoundary =
+    y <= maxScrollY && movingDirectionY === Direction.Positive
+
+  if (hasVerticalScroll) {
+    ret = outOfTopBoundary || outOfBottomBoundary
+  } else if (hasHorizontalScroll) {
+    ret = outOfLeftBoundary || outOfRightBoundary
+  }
+
+  return ret
+}
+
+const isResettingPosition = (scroll: BScroll): boolean => {
+  const {
+    hasHorizontalScroll,
+    hasVerticalScroll,
+    x,
+    y,
+    minScrollX,
+    maxScrollX,
+    minScrollY,
+    maxScrollY,
+  } = scroll
+  let ret = false
+
+  const outOfLeftBoundary = x > minScrollX
+  const outOfRightBoundary = x < maxScrollX
+  const outOfTopBoundary = y > minScrollY
+  const outOfBottomBoundary = y < maxScrollY
+
+  if (hasVerticalScroll) {
+    ret = outOfTopBoundary || outOfBottomBoundary
+  } else if (hasHorizontalScroll) {
+    ret = outOfLeftBoundary || outOfRightBoundary
+  }
+
+  return ret
+}
+
+const resetPositionHandler = (scroll: BScroll) => {
+  scroll.scroller.reflow()
+  scroll.resetPosition(0 /* Immediately */)
+}
+
+const calculateDistance = (
+  childNode: HTMLElement,
+  parentNode: HTMLElement
+): number => {
+  let distance = 0
+  let parent = childNode.parentNode
+  while (parent && parent !== parentNode) {
+    distance++
+    parent = parent.parentNode
+  }
+  return distance
+}
+
+export default class NestedScroll implements PluginAPI {
+  static pluginName = 'nestedScroll'
+  static instancesMap: NestedScrollInstancesMap = {}
+  store: BScrollFamily[]
+  options: NestedScrollConfig
+  private hooksFn: Array<[EventEmitter, string, Function]>
+  constructor(scroll: BScroll) {
+    const groupId = this.handleOptions(scroll)
+    let instance = NestedScroll.instancesMap[groupId]
+    if (!instance) {
+      instance = NestedScroll.instancesMap[groupId] = this
+      instance.store = []
+      instance.hooksFn = []
+    }
+
+    instance.init(scroll)
+
+    return instance
+  }
+
+  static getAllNestedScrolls(): NestedScroll[] {
+    const instancesMap = NestedScroll.instancesMap
+    return Object.keys(instancesMap).map((key) => instancesMap[key])
+  }
+
+  static purgeAllNestedScrolls() {
+    const nestedScrolls = NestedScroll.getAllNestedScrolls()
+    nestedScrolls.forEach((ns) => ns.purgeNestedScroll())
+  }
+
+  private handleOptions(scroll: BScroll): number | string {
+    const userOptions = (scroll.options.nestedScroll === true
+      ? {}
+      : scroll.options.nestedScroll) as NestedScrollConfig
+    const defaultOptions: NestedScrollConfig = {
+      groupId: DEFAUL_GROUP_ID,
+    }
+    this.options = extend(defaultOptions, userOptions)
+
+    const groupIdType = typeof this.options.groupId
+    if (groupIdType !== 'string' && groupIdType !== 'number') {
+      warn('groupId must be string or number for NestedScroll plugin')
+    }
+
+    return this.options.groupId
+  }
+
+  private init(scroll: BScroll) {
+    scroll.proxy(propertiesConfig)
+    this.addBScroll(scroll)
+    this.buildBScrollGraph()
+    this.analyzeBScrollGraph()
+    this.ensureEventInvokeSequence()
+    this.handleHooks(scroll)
+  }
+
+  private handleHooks(scroll: BScroll) {
+    this.registerHooks(scroll.hooks, scroll.hooks.eventTypes.destroy, () => {
+      this.deleteScroll(scroll)
+    })
+  }
+
+  deleteScroll(scroll: BScroll) {
+    const wrapper = scroll.wrapper as MountedBScrollHTMLElement
+    wrapper.isBScrollContainer = undefined
+    const store = this.store
+    const hooksFn = this.hooksFn
+    const i = findIndex(store, (bscrollFamily) => {
+      return bscrollFamily.selfScroll === scroll
+    })
+    if (i > -1) {
+      const bscrollFamily = store[i]
+      bscrollFamily.purge()
+      store.splice(i, 1)
+    }
+    const k = findIndex(hooksFn, ([hooks]) => {
+      return hooks === scroll.hooks
+    })
+    if (k > -1) {
+      const [hooks, eventType, handler] = hooksFn[k]
+      hooks.off(eventType, handler)
+      hooksFn.splice(k, 1)
+    }
+  }
+
+  addBScroll(scroll: BScroll) {
+    this.store.push(BScrollFamily.create(scroll))
+  }
+
+  private buildBScrollGraph() {
+    const store = this.store
+
+    let bf1: BScrollFamily
+    let bf2: BScrollFamily
+    let wrapper1: MountedBScrollHTMLElement
+    let wrapper2: MountedBScrollHTMLElement
+    let len = this.store.length
+
+    // build graph
+    for (let i = 0; i < len; i++) {
+      bf1 = store[i]
+      wrapper1 = bf1.selfScroll.wrapper
+      for (let j = 0; j < len; j++) {
+        bf2 = store[j]
+        wrapper2 = bf2.selfScroll.wrapper
+
+        // same bs
+        if (bf1 === bf2) continue
+
+        if (!wrapper1.contains(wrapper2)) continue
+
+        // bs1 contains bs2
+        const distance = calculateDistance(wrapper2, wrapper1)
+        if (!bf1.hasDescendants(bf2)) {
+          bf1.addDescendant(bf2, distance)
+        }
+
+        if (!bf2.hasAncestors(bf1)) {
+          bf2.addAncestor(bf1, distance)
+        }
+      }
+    }
+  }
+
+  private analyzeBScrollGraph() {
+    this.store.forEach((bscrollFamily) => {
+      if (bscrollFamily.analyzed) {
+        return
+      }
+
+      const {
+        ancestors,
+        descendants,
+        selfScroll: currentScroll,
+      } = bscrollFamily
+
+      const beforeScrollStartHandler = () => {
+        // always get the latest scroll
+        const ancestorScrolls = ancestors.map(
+          ([bscrollFamily]) => bscrollFamily.selfScroll
+        )
+        const descendantScrolls = descendants.map(
+          ([bscrollFamily]) => bscrollFamily.selfScroll
+        )
+        forceScrollStopHandler([...ancestorScrolls, ...descendantScrolls])
+
+        if (isResettingPosition(currentScroll)) {
+          resetPositionHandler(currentScroll)
+        }
+        syncTouchstartData(ancestorScrolls)
+        disableScrollHander(ancestorScrolls, currentScroll)
+      }
+
+      const touchEndHandler = () => {
+        const ancestorScrolls = ancestors.map(
+          ([bscrollFamily]) => bscrollFamily.selfScroll
+        )
+        const descendantScrolls = descendants.map(
+          ([bscrollFamily]) => bscrollFamily.selfScroll
+        )
+        enableScrollHander([...ancestorScrolls, ...descendantScrolls])
+      }
+
+      bscrollFamily.registerHooks(
+        currentScroll,
+        currentScroll.eventTypes.beforeScrollStart,
+        beforeScrollStartHandler
+      )
+      bscrollFamily.registerHooks(
+        currentScroll,
+        currentScroll.eventTypes.touchEnd,
+        touchEndHandler
+      )
+
+      const selfActionsHooks = currentScroll.scroller.actions.hooks
+      bscrollFamily.registerHooks(
+        selfActionsHooks,
+        selfActionsHooks.eventTypes.detectMovingDirection,
+        () => {
+          const ancestorScrolls = ancestors.map(
+            ([bscrollFamily]) => bscrollFamily.selfScroll
+          )
+          const parentScroll = ancestorScrolls[0]
+          const otherAncestorScrolls = ancestorScrolls.slice(1)
+          const contentMoved = currentScroll.scroller.actions.contentMoved
+          const isTopScroll = ancestorScrolls.length === 0
+          if (contentMoved) {
+            disableScrollHander(ancestorScrolls, currentScroll)
+          } else if (!isTopScroll) {
+            if (isOutOfBoundary(currentScroll)) {
+              disableScrollHander([currentScroll], currentScroll)
+              if (parentScroll) {
+                enableScrollHander([parentScroll])
+              }
+              disableScrollHander(otherAncestorScrolls, currentScroll)
+              return true
+            }
+          }
+        }
+      )
+      bscrollFamily.setAnalyzed(true)
+    })
+  }
+  // make sure touchmove|touchend invoke from child to parent
+  private ensureEventInvokeSequence() {
+    const copied = this.store.slice()
+    const sequencedScroll = copied.sort((a, b) => {
+      return a.descendants.length - b.descendants.length
+    })
+    sequencedScroll.forEach((bscrollFamily) => {
+      const scroll = bscrollFamily.selfScroll
+      scroll.scroller.actionsHandler.rebindDOMEvents()
+    })
+  }
+
+  private registerHooks(hooks: EventEmitter, name: string, handler: Function) {
+    hooks.on(name, handler, this)
+    this.hooksFn.push([hooks, name, handler])
+  }
+
+  purgeNestedScroll() {
+    const groupId = this.options.groupId
+    this.store.forEach((bscrollFamily) => {
+      bscrollFamily.purge()
+    })
+    this.store = []
+
+    this.hooksFn.forEach(([hooks, eventType, handler]) => {
+      hooks.off(eventType, handler)
+    })
+    this.hooksFn = []
+
+    delete NestedScroll.instancesMap[groupId]
+  }
+}

package/better-scroll-dev/better-scroll-dev/packages/nested-scroll/src/propertiesConfig.ts

@@ -0,0 +1,15 @@
+const sourcePrefix = 'plugins.nestedScroll'
+
+const propertiesMap = [
+  {
+    key: 'purgeNestedScroll',
+    name: 'purgeNestedScroll',
+  },
+]
+
+export default propertiesMap.map((item) => {
+  return {
+    key: item.key,
+    sourceKey: `${sourcePrefix}.${item.name}`,
+  }
+})

package/better-scroll-dev/better-scroll-dev/packages/observe-dom/README.md

@@ -0,0 +1,19 @@
+# @better-scroll/observe-dom
+
+[中文文档](https://github.com/ustbhuangyi/better-scroll/blob/master/packages/observe-dom/README_zh-CN.md)
+
+recaculating BetterScroll's scrollHeight or scrollWidth by `MutationObserver`, with this, you don't care when BetterScroll's scrollHeight or scrollWidth have changed. Plugin has done it for you.
+
+> **if current browser does not surpport `MutationObserver`, it will fallback to `setTimeout` in recursion**
+
+## Usage
+
+```js
+import BScroll from '@better-scroll/core'
+import ObserveDom from '@better-scroll/observe-dom'
+BScroll.use(ObserveDom)
+
+const bs = new BScroll('.wrapper', {
+  observeDOM: true
+})
+```

package/better-scroll-dev/better-scroll-dev/packages/observe-dom/README_zh-CN.md

@@ -0,0 +1,17 @@
+# @better-scroll/observe-dom
+
+动态计算 BetterScroll 的可滚动高度或者宽度，你并不需要自己在高度或者宽度发生变化的时候，手动调用 `refresh()` 方法。插件通过 `MutationObserver` 帮你完成了。
+
+> **如果当前你的浏览器不支持 `MutationObserver`，会降级使用 `setTimeout`。**
+
+## 使用
+
+```js
+import BScroll from '@better-scroll/core'
+import ObserveDom from '@better-scroll/observe-dom'
+BScroll.use(ObserveDom)
+
+const bs = new BScroll('.wrapper', {
+  observeDOM: true
+})
+```

package/better-scroll-dev/better-scroll-dev/packages/observe-dom/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@better-scroll/observe-dom",
+  "version": "2.5.1",
+  "description": "Dynamic recalculating container's size for BetterScroll",
+  "author": {
+    "name": "jizhi",
+    "email": "theniceangel@163.com"
+  },
+  "main": "dist/observe-dom.min.js",
+  "module": "dist/observe-dom.esm.js",
+  "typings": "dist/types/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "bugs": {
+    "url": "https://github.com/ustbhuangyi/better-scroll/issues"
+  },
+  "homepage": "https://github.com/ustbhuangyi/better-scroll",
+  "keywords": [
+    "scroll",
+    "iscroll",
+    "javascript",
+    "typescript",
+    "ios"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com/ustbhuangyi/better-scroll.git",
+    "directory": "packages/observe-dom"
+  },
+  "dependencies": {
+    "@better-scroll/core": "^2.5.1"
+  },
+  "gitHead": "f441227b6137d44ba0b44b97ed4cd49de9386130"
+}

package/better-scroll-dev/better-scroll-dev/packages/observe-dom/src/__tests__/index.spec.ts

@@ -0,0 +1,207 @@
+import BScroll from '@better-scroll/core'
+import ObserveDOM from '../index'
+import {
+  mockDomOffset,
+  CustomHTMLDivElement,
+} from '@better-scroll/core/src/__tests__/__utils__/layout'
+
+jest.mock('@better-scroll/core')
+
+const addProperties = <T extends Object, K extends Object>(
+  target: T,
+  source: K
+) => {
+  for (const key in source) {
+    ;(target as any)[key] = source[key]
+  }
+  return target
+}
+
+const createObserveDOMElements = () => {
+  const wrapper = document.createElement('div')
+  const content = document.createElement('div')
+  wrapper.appendChild(content)
+  return { wrapper }
+}
+
+describe('observe dom', () => {
+  let scroll: BScroll
+  let observeDOM: ObserveDOM
+  let mockMutationObserver: jest.Mock
+  let mockObserve: jest.Mock
+  let mockDisconnect: jest.Mock
+  let triggerMutation: Function
+
+  beforeAll(() => {
+    jest.useFakeTimers()
+  })
+
+  beforeEach(() => {
+    mockObserve = jest.fn()
+    mockDisconnect = jest.fn()
+    mockMutationObserver = jest.fn().mockImplementation((cb) => {
+      triggerMutation = (mutations: any, timer: number) => {
+        cb(mutations, timer)
+      }
+      return {
+        observe: mockObserve,
+        disconnect: mockDisconnect,
+      }
+    })
+    Object.defineProperty(window, 'MutationObserver', {
+      get: function () {
+        return mockMutationObserver
+      },
+    })
+
+    const { wrapper } = createObserveDOMElements()
+    scroll = new BScroll(wrapper, {})
+    observeDOM = new ObserveDOM(scroll)
+  })
+
+  afterEach(() => {
+    jest.clearAllMocks()
+    jest.clearAllTimers()
+  })
+
+  it('observe without MutationObserver', () => {
+    // set MutationObserver to undefined
+    Object.defineProperty(window, 'MutationObserver', {
+      get: function () {
+        return undefined
+      },
+    })
+
+    observeDOM = new ObserveDOM(scroll)
+
+    expect(observeDOM.observer).toBeFalsy()
+
+    mockDomOffset(scroll.scroller.content as CustomHTMLDivElement, {
+      width: 400,
+    })
+    jest.advanceTimersByTime(1000)
+    expect(scroll.refresh).toBeCalled()
+
+    // destroy
+    scroll.hooks.trigger('destroy')
+    mockDomOffset(scroll.scroller.content as CustomHTMLDivElement, {
+      width: 500,
+    })
+    jest.advanceTimersByTime(1000)
+    expect(scroll.refresh).toHaveBeenCalledTimes(1)
+  })
+
+  it('observe with MutationObserver', () => {
+    expect(scroll.hooks.events.enable.length).toBe(1)
+    expect(scroll.hooks.events.disable.length).toBe(1)
+    expect(scroll.hooks.events.destroy.length).toBe(1)
+    expect(mockObserve).toHaveBeenCalledWith(scroll.scroller.content, {
+      attributes: true,
+      childList: true,
+      subtree: true,
+    })
+
+    // init can't be call again when it is observing
+    const init = jest.spyOn(observeDOM, 'init')
+    scroll.hooks.trigger(scroll.hooks.eventTypes.enabled)
+    expect(init).not.toHaveBeenCalled()
+    init.mockReset()
+
+    addProperties(scroll.scroller.scrollBehaviorX, {
+      currentPos: -12,
+      minScrollPos: 0,
+      maxScrollPos: -100,
+    })
+
+    addProperties(scroll.scroller.scrollBehaviorY, {
+      currentPos: -12,
+      minScrollPos: 0,
+      maxScrollPos: -100,
+    })
+
+    addProperties(scroll.scroller.animater, {
+      pending: false,
+    })
+
+    triggerMutation(
+      [
+        {
+          type: 'test',
+        },
+      ],
+      300
+    )
+    expect(scroll.refresh).toBeCalledTimes(1)
+
+    // attributes change & target is scroller.content
+    triggerMutation(
+      [
+        {
+          type: 'attributes',
+          target: scroll.scroller.content,
+        },
+      ],
+      300
+    )
+    expect(scroll.refresh).toBeCalledTimes(1)
+
+    // attributes change & target is not scroller.content
+    triggerMutation(
+      [
+        {
+          type: 'attributes',
+          target: '',
+        },
+      ],
+      300
+    )
+    expect(scroll.refresh).toBeCalledTimes(1)
+    jest.advanceTimersByTime(61)
+    expect(scroll.refresh).toBeCalledTimes(2)
+
+    // pedding
+    addProperties(scroll.scroller.animater, {
+      pending: true,
+    })
+    triggerMutation(
+      [
+        {
+          type: 'test',
+        },
+      ],
+      300
+    )
+    expect(scroll.refresh).toBeCalledTimes(2)
+
+    // out of boundary
+    addProperties(scroll.scroller.scrollBehaviorY, {
+      currentPos: -12,
+      minScrollPos: 0,
+      maxScrollPos: -10,
+    })
+    triggerMutation(
+      [
+        {
+          type: 'test',
+        },
+      ],
+      300
+    )
+    expect(scroll.refresh).toBeCalledTimes(2)
+
+    // destroy
+    scroll.hooks.trigger(scroll.hooks.eventTypes.destroy)
+    expect(mockDisconnect).toBeCalled()
+    expect(scroll.hooks.events.enable.length).toBe(0)
+    expect(scroll.hooks.events.disable.length).toBe(0)
+    expect(scroll.hooks.events.destroy.length).toBe(0)
+  })
+
+  it('enable/disable', () => {
+    scroll.hooks.trigger(scroll.hooks.eventTypes.disable)
+    expect(mockDisconnect).toBeCalled()
+
+    scroll.hooks.trigger(scroll.hooks.eventTypes.enable)
+    expect(mockObserve).toBeCalled()
+  })
+})