Page.ts 10.1 KB
Newer Older
fxy060608's avatar
fxy060608 已提交
1
import { queuePostFlushCb } from 'vue'
fxy060608's avatar
fxy060608 已提交
2
import { isPlainObject } from '@vue/shared'
fxy060608's avatar
fxy060608 已提交
3 4 5 6 7
import {
  UniNode,
  NODE_TYPE_PAGE,
  UniBaseNode,
  IUniPageNode,
fxy060608's avatar
fxy060608 已提交
8
  formatLog,
fxy060608's avatar
fxy060608 已提交
9
  UniEvent,
fxy060608's avatar
fxy060608 已提交
10
  UniNodeJSON,
fxy060608's avatar
fxy060608 已提交
11
  ACTION_TYPE_ADD_EVENT,
fxy060608's avatar
fxy060608 已提交
12 13
  ACTION_TYPE_CREATE,
  ACTION_TYPE_INSERT,
fxy060608's avatar
fxy060608 已提交
14 15
  ACTION_TYPE_PAGE_CREATE,
  ACTION_TYPE_PAGE_CREATED,
fxy060608's avatar
fxy060608 已提交
16 17
  ACTION_TYPE_REMOVE,
  ACTION_TYPE_REMOVE_ATTRIBUTE,
fxy060608's avatar
fxy060608 已提交
18 19
  ACTION_TYPE_REMOVE_EVENT,
  ACTION_TYPE_SET_ATTRIBUTE,
fxy060608's avatar
fxy060608 已提交
20
  ACTION_TYPE_SET_TEXT,
fxy060608's avatar
fxy060608 已提交
21
  CreateAction,
fxy060608's avatar
fxy060608 已提交
22 23 24
  PageAction,
  PageCreateAction,
  PageCreatedAction,
fxy060608's avatar
fxy060608 已提交
25
  PageScrollAction,
fxy060608's avatar
fxy060608 已提交
26
  PageNodeOptions,
fxy060608's avatar
fxy060608 已提交
27 28 29
  ON_PAGE_SCROLL,
  ON_REACH_BOTTOM,
  ACTION_TYPE_PAGE_SCROLL,
fxy060608's avatar
fxy060608 已提交
30
  ACTION_TYPE_ADD_WXS_EVENT,
fxy060608's avatar
fxy060608 已提交
31 32
} from '@dcloudio/uni-shared'

fxy060608's avatar
fxy060608 已提交
33 34
import { getPageById } from '@dcloudio/uni-core'

fxy060608's avatar
fxy060608 已提交
35 36 37 38 39 40 41 42
import {
  ACTION_MINIFY,
  ACTION_TYPE_DICT,
  DictAction,
  Dictionary,
  Value,
  VD_SYNC,
} from '../../../constants'
fxy060608's avatar
fxy060608 已提交
43 44 45 46

export default class UniPageNode extends UniNode implements IUniPageNode {
  pageId: number
  private _id: number = 1
fxy060608's avatar
fxy060608 已提交
47
  private _created: boolean = false
fxy060608's avatar
fxy060608 已提交
48
  private options: PageNodeOptions
fxy060608's avatar
fxy060608 已提交
49 50
  private createAction: PageCreateAction
  private createdAction: PageCreatedAction
fxy060608's avatar
fxy060608 已提交
51
  private scrollAction?: PageScrollAction
fxy060608's avatar
fxy060608 已提交
52
  private _createActionMap = new Map<number, CreateAction>()
fxy060608's avatar
fxy060608 已提交
53 54 55 56 57 58 59 60
  public updateActions: (PageAction | DictAction)[] = []

  public dicts: Dictionary = []

  public normalizeDict: (
    value: unknown,
    normalizeValue?: boolean
  ) => any | number
fxy060608's avatar
fxy060608 已提交
61

fxy060608's avatar
fxy060608 已提交
62 63
  public isUnmounted: boolean

fxy060608's avatar
fxy060608 已提交
64 65
  private _update: () => void

fxy060608's avatar
fxy060608 已提交
66 67 68 69 70 71 72 73 74
  constructor(
    pageId: number,
    options: PageNodeOptions,
    setup: boolean = false
  ) {
    super(NODE_TYPE_PAGE, '#page', null as unknown as IUniPageNode)
    this.nodeId = 0
    this.pageId = pageId
    this.pageNode = this
fxy060608's avatar
fxy060608 已提交
75
    this.options = options
fxy060608's avatar
fxy060608 已提交
76

fxy060608's avatar
fxy060608 已提交
77 78
    this.isUnmounted = false

fxy060608's avatar
fxy060608 已提交
79 80 81
    this.createAction = [ACTION_TYPE_PAGE_CREATE, options]
    this.createdAction = [ACTION_TYPE_PAGE_CREATED]

fxy060608's avatar
fxy060608 已提交
82 83
    this.normalizeDict = this._normalizeDict.bind(this)

fxy060608's avatar
fxy060608 已提交
84 85
    this._update = this.update.bind(this)

fxy060608's avatar
fxy060608 已提交
86 87
    setup && this.setup()
  }
fxy060608's avatar
fxy060608 已提交
88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118
  _normalizeDict(value: unknown, normalizeValue: boolean = true) {
    if (!ACTION_MINIFY) {
      return value
    }
    if (!isPlainObject(value)) {
      return this.addDict(value as Value)
    }
    const dictArray: [number, number][] = []
    Object.keys(value).forEach((n) => {
      const dict = [this.addDict(n) as number]
      const v = value[n as keyof typeof value] as Value
      if (normalizeValue) {
        dict.push(this.addDict(v) as number)
      } else {
        dict.push(v as number)
      }
      dictArray.push(dict as [number, number])
    })
    return dictArray
  }
  addDict<T extends Value>(value: T): T | number {
    if (!ACTION_MINIFY) {
      return value
    }
    const { dicts } = this
    const index = dicts.indexOf(value)
    if (index > -1) {
      return index
    }
    return dicts.push(value) - 1
  }
fxy060608's avatar
fxy060608 已提交
119 120 121 122 123 124 125 126 127 128 129 130
  onInjectHook(hook: string) {
    if (
      (hook === ON_PAGE_SCROLL || hook === ON_REACH_BOTTOM) &&
      !this.scrollAction
    ) {
      this.scrollAction = [
        ACTION_TYPE_PAGE_SCROLL,
        this.options.onReachBottomDistance,
      ]
      this.push(this.scrollAction)
    }
  }
fxy060608's avatar
fxy060608 已提交
131 132 133 134
  onCreate(thisNode: UniNode, nodeName: string | number) {
    pushCreateAction(this, thisNode.nodeId!, nodeName)
    return thisNode
  }
fxy060608's avatar
fxy060608 已提交
135 136 137 138 139 140 141 142 143 144 145
  onInsertBefore(
    thisNode: UniNode,
    newChild: UniNode,
    refChild: UniNode | null
  ) {
    pushInsertAction(
      this,
      newChild as UniBaseNode,
      thisNode.nodeId!,
      (refChild && refChild.nodeId!) || -1
    )
fxy060608's avatar
fxy060608 已提交
146 147
    return newChild
  }
fxy060608's avatar
fxy060608 已提交
148 149
  onRemoveChild(oldChild: UniNode) {
    pushRemoveAction(this, oldChild.nodeId!)
fxy060608's avatar
fxy060608 已提交
150 151
    return oldChild
  }
fxy060608's avatar
fxy060608 已提交
152 153 154 155 156
  onAddEvent(thisNode: UniNode, name: string, flag: number) {
    if (thisNode.parentNode) {
      pushAddEventAction(this, thisNode.nodeId!, name, flag)
    }
  }
fxy060608's avatar
fxy060608 已提交
157 158 159 160 161 162 163 164 165 166
  onAddWxsEvent(
    thisNode: UniNode,
    name: string,
    wxsEvent: string,
    flag: number
  ) {
    if (thisNode.parentNode) {
      pushAddWxsEventAction(this, thisNode.nodeId!, name, wxsEvent, flag)
    }
  }
fxy060608's avatar
fxy060608 已提交
167 168 169 170 171
  onRemoveEvent(thisNode: UniNode, name: string) {
    if (thisNode.parentNode) {
      pushRemoveEventAction(this, thisNode.nodeId!, name)
    }
  }
fxy060608's avatar
fxy060608 已提交
172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194
  onSetAttribute(thisNode: UniNode, qualifiedName: string, value: unknown) {
    if (thisNode.parentNode) {
      pushSetAttributeAction(this, thisNode.nodeId!, qualifiedName, value)
    }
  }
  onRemoveAttribute(thisNode: UniNode, qualifiedName: string) {
    if (thisNode.parentNode) {
      pushRemoveAttributeAction(this, thisNode.nodeId!, qualifiedName)
    }
  }
  onTextContent(thisNode: UniNode, text: string) {
    if (thisNode.parentNode) {
      pushSetTextAction(this, thisNode.nodeId!, text)
    }
  }
  onNodeValue(thisNode: UniNode, val: string | null) {
    if (thisNode.parentNode) {
      pushSetTextAction(this, thisNode.nodeId!, val as string)
    }
  }
  genId() {
    return this._id++
  }
fxy060608's avatar
fxy060608 已提交
195
  push(action: PageAction, extras?: unknown) {
fxy060608's avatar
fxy060608 已提交
196 197 198 199 200 201
    if (this.isUnmounted) {
      if (__DEV__) {
        console.log(formatLog('PageNode', 'push.prevent', action))
      }
      return
    }
fxy060608's avatar
fxy060608 已提交
202 203 204 205 206 207 208
    switch (action[0]) {
      case ACTION_TYPE_CREATE:
        this._createActionMap.set(action[1], action)
        break
      case ACTION_TYPE_INSERT:
        const createAction = this._createActionMap.get(action[1])
        if (createAction) {
fxy060608's avatar
fxy060608 已提交
209
          createAction[3] = action[2] // parentNodeId
fxy060608's avatar
fxy060608 已提交
210
          createAction[4] = action[3] // anchorId
fxy060608's avatar
fxy060608 已提交
211
          if (extras) {
fxy060608's avatar
fxy060608 已提交
212
            createAction[5] = extras as UniNodeJSON
fxy060608's avatar
fxy060608 已提交
213
          }
fxy060608's avatar
fxy060608 已提交
214 215 216 217 218 219 220
        } else {
          if (__DEV__) {
            console.error(formatLog(`Insert`, action, 'not found createAction'))
          }
        }
        break
    }
fxy060608's avatar
fxy060608 已提交
221 222 223 224
    // insert 被合并进 create
    if (action[0] !== ACTION_TYPE_INSERT) {
      this.updateActions.push(action)
    }
fxy060608's avatar
fxy060608 已提交
225
    queuePostFlushCb(this._update)
fxy060608's avatar
fxy060608 已提交
226 227 228
  }
  restore() {
    this.push(this.createAction)
fxy060608's avatar
fxy060608 已提交
229 230 231
    if (this.scrollAction) {
      this.push(this.scrollAction)
    }
fxy060608's avatar
fxy060608 已提交
232 233 234 235 236 237 238
    // TODO restore children
    this.push(this.createdAction)
  }
  setup() {
    this.send([this.createAction])
  }
  update() {
fxy060608's avatar
fxy060608 已提交
239
    const { dicts, updateActions, _createActionMap } = this
fxy060608's avatar
fxy060608 已提交
240
    if (__DEV__) {
fxy060608's avatar
fxy060608 已提交
241 242 243 244 245 246 247 248
      console.log(
        formatLog(
          'PageNode',
          'update',
          updateActions.length,
          _createActionMap.size
        )
      )
fxy060608's avatar
fxy060608 已提交
249
    }
fxy060608's avatar
fxy060608 已提交
250
    _createActionMap.clear()
fxy060608's avatar
fxy060608 已提交
251 252 253 254 255
    // 首次
    if (!this._created) {
      this._created = true
      updateActions.push(this.createdAction)
    }
fxy060608's avatar
fxy060608 已提交
256
    if (updateActions.length) {
fxy060608's avatar
fxy060608 已提交
257 258 259
      if (dicts.length) {
        updateActions.unshift([ACTION_TYPE_DICT, dicts])
      }
fxy060608's avatar
fxy060608 已提交
260
      this.send(updateActions)
fxy060608's avatar
fxy060608 已提交
261
      dicts.length = 0
fxy060608's avatar
fxy060608 已提交
262 263 264
      updateActions.length = 0
    }
  }
fxy060608's avatar
fxy060608 已提交
265
  send(action: (PageAction | DictAction)[]) {
fxy060608's avatar
fxy060608 已提交
266
    UniServiceJSBridge.publishHandler(VD_SYNC, action, this.pageId)
fxy060608's avatar
fxy060608 已提交
267
  }
fxy060608's avatar
fxy060608 已提交
268 269 270 271 272 273 274 275 276
  fireEvent(id: number, evt: UniEvent) {
    const node = findNodeById(id, this)
    if (node) {
      node.dispatchEvent(evt)
    } else if (__DEV__) {
      console.error(formatLog('PageNode', 'fireEvent', id, 'not found', evt))
    }
  }
}
fxy060608's avatar
fxy060608 已提交
277 278 279 280 281
export function getPageNode(pageId: number): UniPageNode | null {
  const page = getPageById(pageId)
  if (!page) return null
  return (page as any).__page_container__ as UniPageNode
}
fxy060608's avatar
fxy060608 已提交
282

fxy060608's avatar
fxy060608 已提交
283 284 285 286 287 288 289 290 291
function findNode(
  name: 'nodeId' | 'nodeName',
  value: string | number,
  uniNode: UniNode | number
): UniNode | null {
  if (typeof uniNode === 'number') {
    uniNode = getPageNode(uniNode) as UniNode
  }
  if (uniNode[name] === value) {
fxy060608's avatar
fxy060608 已提交
292 293 294 295
    return uniNode
  }
  const { childNodes } = uniNode
  for (let i = 0; i < childNodes.length; i++) {
fxy060608's avatar
fxy060608 已提交
296
    const uniNode = findNode(name, value, childNodes[i])
fxy060608's avatar
fxy060608 已提交
297 298 299 300 301
    if (uniNode) {
      return uniNode
    }
  }
  return null
fxy060608's avatar
fxy060608 已提交
302 303
}

fxy060608's avatar
fxy060608 已提交
304 305 306 307 308 309 310 311 312 313 314
export function findNodeById(nodeId: number, uniNode: UniNode | number) {
  return findNode('nodeId', nodeId, uniNode)
}

export function findNodeByTagName(
  tagName: string,
  uniNode: UniNode | number
): UniNode | null {
  return findNode('nodeName', tagName.toUpperCase(), uniNode)
}

fxy060608's avatar
fxy060608 已提交
315 316 317 318 319
function pushCreateAction(
  pageNode: UniPageNode,
  nodeId: number,
  nodeName: string | number
) {
fxy060608's avatar
fxy060608 已提交
320 321 322 323 324 325 326
  pageNode.push([
    ACTION_TYPE_CREATE,
    nodeId,
    pageNode.addDict(nodeName),
    -1,
    -1,
  ])
fxy060608's avatar
fxy060608 已提交
327 328 329 330 331 332
}

function pushInsertAction(
  pageNode: UniPageNode,
  newChild: UniBaseNode,
  parentNodeId: number,
fxy060608's avatar
fxy060608 已提交
333
  refChildId: number
fxy060608's avatar
fxy060608 已提交
334
) {
fxy060608's avatar
fxy060608 已提交
335 336 337 338
  const nodeJson = newChild.toJSON({
    attr: true,
    normalize: pageNode.normalizeDict,
  })
fxy060608's avatar
fxy060608 已提交
339 340 341 342
  pageNode.push(
    [ACTION_TYPE_INSERT, newChild.nodeId!, parentNodeId, refChildId],
    Object.keys(nodeJson).length ? nodeJson : undefined
  )
fxy060608's avatar
fxy060608 已提交
343 344
}

fxy060608's avatar
fxy060608 已提交
345 346
function pushRemoveAction(pageNode: UniPageNode, nodeId: number) {
  pageNode.push([ACTION_TYPE_REMOVE, nodeId])
fxy060608's avatar
fxy060608 已提交
347 348
}

fxy060608's avatar
fxy060608 已提交
349 350 351 352 353 354
function pushAddEventAction(
  pageNode: UniPageNode,
  nodeId: number,
  name: string,
  value: number
) {
fxy060608's avatar
fxy060608 已提交
355
  pageNode.push([ACTION_TYPE_ADD_EVENT, nodeId, pageNode.addDict(name), value])
fxy060608's avatar
fxy060608 已提交
356 357
}

fxy060608's avatar
fxy060608 已提交
358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373
function pushAddWxsEventAction(
  pageNode: UniPageNode,
  nodeId: number,
  name: string,
  wxsEvent: string,
  value: number
) {
  pageNode.push([
    ACTION_TYPE_ADD_WXS_EVENT,
    nodeId,
    pageNode.addDict(name),
    pageNode.addDict(wxsEvent),
    value,
  ])
}

fxy060608's avatar
fxy060608 已提交
374 375 376 377 378
function pushRemoveEventAction(
  pageNode: UniPageNode,
  nodeId: number,
  name: string
) {
fxy060608's avatar
fxy060608 已提交
379
  pageNode.push([ACTION_TYPE_REMOVE_EVENT, nodeId, pageNode.addDict(name)])
fxy060608's avatar
fxy060608 已提交
380 381
}

fxy060608's avatar
fxy060608 已提交
382 383 384 385 386 387 388 389 390 391
function normalizeAttrValue(
  pageNode: UniPageNode,
  name: string,
  value: unknown
) {
  return name === 'style' && isPlainObject(value)
    ? pageNode.normalizeDict(value)
    : pageNode.addDict(value as Value)
}

fxy060608's avatar
fxy060608 已提交
392 393 394 395 396 397
function pushSetAttributeAction(
  pageNode: UniPageNode,
  nodeId: number,
  name: string,
  value: unknown
) {
fxy060608's avatar
fxy060608 已提交
398 399 400 401
  pageNode.push([
    ACTION_TYPE_SET_ATTRIBUTE,
    nodeId,
    pageNode.addDict(name),
fxy060608's avatar
fxy060608 已提交
402
    normalizeAttrValue(pageNode, name, value),
fxy060608's avatar
fxy060608 已提交
403
  ])
fxy060608's avatar
fxy060608 已提交
404 405 406 407 408 409 410
}

function pushRemoveAttributeAction(
  pageNode: UniPageNode,
  nodeId: number,
  name: string
) {
fxy060608's avatar
fxy060608 已提交
411
  pageNode.push([ACTION_TYPE_REMOVE_ATTRIBUTE, nodeId, pageNode.addDict(name)])
fxy060608's avatar
fxy060608 已提交
412 413 414 415 416 417 418
}

function pushSetTextAction(
  pageNode: UniPageNode,
  nodeId: number,
  text: string
) {
fxy060608's avatar
fxy060608 已提交
419
  pageNode.push([ACTION_TYPE_SET_TEXT, nodeId, pageNode.addDict(text)])
fxy060608's avatar
fxy060608 已提交
420 421 422 423 424 425 426 427 428
}

export function createPageNode(
  pageId: number,
  pageOptions: PageNodeOptions,
  setup?: boolean
) {
  return new UniPageNode(pageId, pageOptions, setup)
}