@webspatial/core-sdk 1.0.4 → 1.1.0

package/src/platform-adapter/android/AndroidPlatform.ts

@@ -0,0 +1,133 @@
+import { PlatformAbility, CommandResult } from '../interface'
+import {
+  CommandResultFailure,
+  CommandResultSuccess,
+} from '../CommandResultUtils'
+import { CheckWebViewCanCreateCommand } from '../../JSBCommand'
+import { SpatialWebEvent } from '../../SpatialWebEvent'
+
+interface JSBResponse {
+  success: boolean
+  data: any
+}
+type JSBError = {
+  code: string
+  message: string
+}
+
+let creatingElementCount = 0
+
+let requestId = 0
+
+const MAX_ID = 100000
+
+function nextRequestId() {
+  requestId = (requestId + 1) % MAX_ID
+  return `rId_${requestId}`
+}
+
+export class AndroidPlatform implements PlatformAbility {
+  async callJSB(cmd: string, msg: string): Promise<CommandResult> {
+    // android JS Bridge interface only support sync invoking
+    // in order to implement promise API, register every request by requestId and remove when resolve/reject.
+    return new Promise((resolve, reject) => {
+      try {
+        const rId = nextRequestId()
+
+        SpatialWebEvent.addEventReceiver(rId, (result: JSBResponse) => {
+          SpatialWebEvent.removeEventReceiver(rId)
+          if (result.success) {
+            resolve(CommandResultSuccess(result.data))
+          } else {
+            const { code, message } = result.data as JSBError
+            resolve(CommandResultFailure(code, message))
+          }
+        })
+
+        const ans = window.webspatialBridge.postMessage(rId, cmd, msg)
+        if (ans !== '') {
+          SpatialWebEvent.removeEventReceiver(rId)
+          // sync call
+          const result = JSON.parse(ans) as JSBResponse
+          if (result.success) {
+            resolve(CommandResultSuccess(result.data))
+          } else {
+            const { code, message } = result.data as JSBError
+            resolve(CommandResultFailure(code, message))
+          }
+        }
+      } catch (error: unknown) {
+        console.error(
+          `AndroidPlatform cmd: ${cmd}, msg: ${msg} error: ${error}`,
+        )
+        const { code, message } = error as JSBError
+        resolve(CommandResultFailure(code, message))
+      }
+    })
+  }
+
+  async callWebSpatialProtocol(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): Promise<CommandResult> {
+    // Waiting for request to create spatial div
+    await new Promise(resolve => setTimeout(resolve, 16 * creatingElementCount))
+    // Count the current total number of created spatial div queues
+    creatingElementCount++
+    // Create a spatial div through JSB polling request
+    let canCreate = await new CheckWebViewCanCreateCommand().execute()
+    while (!canCreate.data.can) {
+      await new Promise(resolve => setTimeout(resolve, 16))
+      canCreate = await new CheckWebViewCanCreateCommand().execute()
+    }
+    // Request successful, call window.open
+    const { windowProxy } = this.openWindow(command, query, target, features)
+    // Polling waiting for windowProxy to convert into a real window object
+    while (!windowProxy?.open) {
+      await new Promise(resolve => setTimeout(resolve, 16))
+    }
+    // Make the page renderable through window.open
+    windowProxy?.open('about:blank', '_self')
+    // Polling to check if SpatialId injection is successful
+    while (!windowProxy?.__SpatialId) {
+      await new Promise(resolve => setTimeout(resolve, 16))
+    }
+    let spatialId = windowProxy?.__SpatialId
+    creatingElementCount--
+    return Promise.resolve(
+      CommandResultSuccess({ windowProxy: windowProxy, id: spatialId }),
+    )
+  }
+
+  callWebSpatialProtocolSync(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): CommandResult {
+    const { spatialId: id = '', windowProxy } = this.openWindow(
+      command,
+      query,
+      target,
+      features,
+    )
+
+    return CommandResultSuccess({ windowProxy, id })
+  }
+
+  private openWindow(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ) {
+    const windowProxy = window.open(
+      `webspatial://${command}?${query || ''}`,
+      target,
+      features,
+    )
+    return { spatialId: '', windowProxy }
+  }
+}

package/src/platform-adapter/index.ts

@@ -0,0 +1,21 @@
+import { isSSREnv } from '../ssr-polyfill'
+import { PlatformAbility } from './interface'
+import { SSRPlatform } from './ssr/SSRPlatform'
+
+export function createPlatform(): PlatformAbility {
+  if (isSSREnv()) {
+    return new SSRPlatform()
+  }
+
+  if (
+    window.navigator.userAgent.includes('Android') ||
+    window.navigator.userAgent.includes('Linux')
+  ) {
+    const AndroidPlatform = require('./android/AndroidPlatform').AndroidPlatform
+    return new AndroidPlatform()
+  } else {
+    const VisionOSPlatform =
+      require('./vision-os/VisionOSPlatform').VisionOSPlatform
+    return new VisionOSPlatform()
+  }
+}

package/src/platform-adapter/interface.ts

@@ -0,0 +1,36 @@
+export interface CommandResult {
+  success: boolean
+  data: any
+  errorCode: string | undefined
+  errorMessage: string | undefined
+}
+
+export interface WebSpatialProtocolResult extends CommandResult {
+  success: boolean
+  data:
+    | {
+        windowProxy: WindowProxy
+        id: string
+      }
+    | undefined
+  errorCode: string | undefined
+  errorMessage: string | undefined
+}
+
+export interface PlatformAbility {
+  callJSB(cmd: string, msg: string): Promise<CommandResult>
+  callWebSpatialProtocol(
+    schema: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): Promise<WebSpatialProtocolResult>
+
+  callWebSpatialProtocolSync(
+    schema: string,
+    query?: string,
+    target?: string,
+    features?: string,
+    resultCallback?: (result: CommandResult) => void,
+  ): WebSpatialProtocolResult
+}

package/src/platform-adapter/ssr/SSRPlatform.ts

@@ -0,0 +1,43 @@
+import {
+  CommandResult,
+  PlatformAbility,
+  WebSpatialProtocolResult,
+} from '../interface'
+
+export class SSRPlatform implements PlatformAbility {
+  callJSB(cmd: string, msg: string): Promise<CommandResult> {
+    return Promise.resolve({
+      success: true,
+      data: undefined,
+      errorCode: undefined,
+      errorMessage: undefined,
+    })
+  }
+  callWebSpatialProtocol(
+    schema: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): Promise<WebSpatialProtocolResult> {
+    return Promise.resolve({
+      success: true,
+      data: undefined,
+      errorCode: undefined,
+      errorMessage: undefined,
+    })
+  }
+  callWebSpatialProtocolSync(
+    schema: string,
+    query?: string,
+    target?: string,
+    features?: string,
+    resultCallback?: (result: CommandResult) => void,
+  ): WebSpatialProtocolResult {
+    return {
+      success: true,
+      data: undefined,
+      errorCode: undefined,
+      errorMessage: undefined,
+    }
+  }
+}

package/src/platform-adapter/vision-os/VisionOSPlatform.ts

@@ -0,0 +1,77 @@
+import { PlatformAbility, CommandResult } from '../interface'
+import {
+  CommandResultFailure,
+  CommandResultSuccess,
+} from '../CommandResultUtils'
+
+
+type JSBError = {
+  message: string
+}
+
+export class VisionOSPlatform implements PlatformAbility {
+  async callJSB(cmd: string, msg: string): Promise<CommandResult> {
+    try {
+      const result = await window.webkit.messageHandlers.bridge.postMessage(
+        `${cmd}::${msg}`,
+      )
+      return CommandResultSuccess(result)
+    } catch (error: unknown) {
+      // console.error(`VisionOSPlatform cmd: ${cmd}, msg: ${msg} error: ${error}`)
+      const { code, message } = JSON.parse((error as JSBError).message)
+      return CommandResultFailure(code, message)
+    }
+  }
+
+  callWebSpatialProtocol(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): Promise<CommandResult> {
+    const { spatialId: id, windowProxy } = this.openWindow(
+      command,
+      query,
+      target,
+      features,
+    )
+    return Promise.resolve(
+      CommandResultSuccess({ windowProxy: windowProxy, id }),
+    )
+  }
+
+  callWebSpatialProtocolSync(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ): CommandResult {
+    const { spatialId: id = '', windowProxy } = this.openWindow(
+      command,
+      query,
+      target,
+      features,
+    )
+
+    return CommandResultSuccess({ windowProxy, id })
+  }
+
+  private openWindow(
+    command: string,
+    query?: string,
+    target?: string,
+    features?: string,
+  ) {
+    const windowProxy = window.open(
+      `webspatial://${command}?${query || ''}`,
+      target,
+      features,
+    )
+    const ua = windowProxy?.navigator.userAgent
+    const spatialId = ua?.match(
+      /\b([0-9A-F]{8}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{12})\b/gi,
+    )?.[0]
+
+    return { spatialId, windowProxy }
+  }
+}

package/src/reality/component/ModelComponent.ts

@@ -0,0 +1,11 @@
+import { ModelComponentOptions } from '../../types/types'
+import { SpatialComponent } from './SpatialComponent'
+
+export class ModelComponent extends SpatialComponent {
+  constructor(
+    id: string,
+    public options: ModelComponentOptions,
+  ) {
+    super(id)
+  }
+}

package/src/reality/component/SpatialComponent.ts

@@ -0,0 +1,17 @@
+import { SpatialObject } from '../../SpatialObject'
+import { SpatialWebEvent } from '../../SpatialWebEvent'
+import { ObjectDestroyMsg, SpatialWebMsgType } from '../../WebMsgCommand'
+
+export class SpatialComponent extends SpatialObject {
+  constructor(id: string) {
+    super(id)
+    SpatialWebEvent.addEventReceiver(id, this.onReceiveEvent)
+  }
+
+  private onReceiveEvent = (data: ObjectDestroyMsg) => {
+    const { type } = data
+    if (type === SpatialWebMsgType.objectdestroy) {
+      this.isDestroyed = true
+    }
+  }
+}

package/src/reality/component/index.ts

@@ -0,0 +1,2 @@
+export * from './SpatialComponent'
+export * from './ModelComponent'

package/src/reality/entity/SpatialEntity.ts

@@ -0,0 +1,259 @@
+import {
+  ConvertFromEntityToEntityCommand,
+  ConvertFromEntityToSceneCommand,
+  ConvertFromSceneToEntityCommand,
+  SetParentForEntityCommand,
+} from './../../JSBCommand'
+import {
+  SpatialEntityEventType,
+  SpatialEntityOrReality,
+  SpatialEntityUserData,
+  Vec3,
+} from '../../types/types'
+import {
+  AddComponentToEntityCommand,
+  AddEntityToEntityCommand,
+  RemoveEntityFromParentCommand,
+  UpdateEntityEventCommand,
+  UpdateEntityPropertiesCommand,
+} from '../../JSBCommand'
+import { SpatialObject } from '../../SpatialObject'
+import { SpatialEntityProperties } from '../../types/types'
+import { SpatialComponent } from '../component/SpatialComponent'
+import { SpatialWebEvent } from '../../SpatialWebEvent'
+import { createSpatialEvent } from '../../SpatialWebEventCreator'
+import {
+  CubeInfoMsg,
+  ObjectDestroyMsg,
+  SpatialDragEndMsg,
+  SpatialDragMsg,
+  SpatialMagnifyMsg,
+  SpatialRotateEndMsg,
+  SpatialRotateMsg,
+  SpatialTapMsg,
+  SpatialWebMsgType,
+  TransformMsg,
+} from '../../WebMsgCommand'
+
+export class SpatialEntity extends SpatialObject {
+  position: Vec3 = { x: 0, y: 0, z: 0 }
+  rotation: Vec3 = { x: 0, y: 0, z: 0 }
+  scale: Vec3 = { x: 1, y: 1, z: 1 }
+
+  events: Record<string, (data: any) => void> = {}
+  children: SpatialEntity[] = []
+  parent: SpatialEntityOrReality | null = null
+  constructor(
+    id: string,
+    public userData?: SpatialEntityUserData,
+  ) {
+    super(id)
+    SpatialWebEvent.addEventReceiver(id, this.onReceiveEvent)
+  }
+
+  async addComponent(component: SpatialComponent) {
+    return new AddComponentToEntityCommand(this, component).execute()
+  }
+  async setPosition(position: Vec3) {
+    return this.updateTransform({ position })
+  }
+  async setRotation(rotation: Vec3) {
+    return this.updateTransform({ rotation })
+  }
+  async setScale(scale: Vec3) {
+    return this.updateTransform({ scale })
+  }
+
+  async addEntity(ent: SpatialEntity) {
+    const ans = await new SetParentForEntityCommand(ent.id, this.id).execute()
+    this.children.push(ent)
+    ent.parent = this
+    return ans
+  }
+  async removeFromParent() {
+    const ans = await new SetParentForEntityCommand(
+      this.id,
+      undefined,
+    ).execute()
+    if (this.parent) {
+      this.parent.children = this.parent.children.filter(
+        child => child.id !== this.id,
+      )
+      this.parent = null
+    }
+    return ans
+  }
+
+  async updateTransform(properties: Partial<SpatialEntityProperties>) {
+    this.position = properties.position ?? this.position
+    this.rotation = properties.rotation ?? this.rotation
+    this.scale = properties.scale ?? this.scale
+    return new UpdateEntityPropertiesCommand(this, properties).execute()
+  }
+
+  async addEvent(type: SpatialEntityEventType, callback: (data: any) => void) {
+    if (this.events[type]) {
+      // replace if exist
+      this.events[type] = callback
+    } else {
+      try {
+        await this.updateEntityEvent(type, true)
+        this.events[type] = callback
+      } catch (error) {
+        console.error('addEvent failed', type)
+      }
+    }
+  }
+
+  async removeEvent(eventName: SpatialEntityEventType) {
+    if (this.events[eventName]) {
+      delete this.events[eventName]
+      try {
+        await this.updateEntityEvent(eventName, false)
+      } catch (error) {
+        console.error('removeEvent failed', eventName)
+      }
+    }
+  }
+
+  async updateEntityEvent(
+    eventName: SpatialEntityEventType,
+    isEnable: boolean,
+  ) {
+    return new UpdateEntityEventCommand(this, eventName, isEnable).execute()
+  }
+  private onReceiveEvent = (
+    data: // | CubeInfoMsg
+    // | TransformMsg
+    | SpatialTapMsg
+      // | SpatialDragMsg
+      // | SpatialDragEndMsg
+      // | SpatialRotateMsg
+      // | SpatialRotateEndMsg
+      | ObjectDestroyMsg,
+  ) => {
+    // console.log('SpatialEntityEvent', data)
+    const { type } = data
+    if (type === SpatialWebMsgType.objectdestroy) {
+      this.isDestroyed = true
+    }
+    // tap
+    else if (type === SpatialWebMsgType.spatialtap) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialtap,
+        (data as SpatialTapMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialdragstart) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialdragstart,
+        (data as SpatialDragMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialdrag) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialdrag,
+        (data as SpatialDragMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialdragend) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialdragend,
+        (data as SpatialDragEndMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    }
+    // rotate
+    else if (type === SpatialWebMsgType.spatialrotatestart) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialrotatestart,
+        (data as SpatialRotateMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialrotate) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialrotate,
+        (data as SpatialRotateMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialrotateend) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialrotateend,
+        (data as SpatialRotateEndMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    }
+    // magnify
+    else if (type === SpatialWebMsgType.spatialmagnifystart) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialmagnifystart,
+        (data as SpatialMagnifyMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialmagnify) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialmagnify,
+        (data as SpatialMagnifyMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    } else if (type === SpatialWebMsgType.spatialmagnifyend) {
+      const evt = createSpatialEvent(
+        SpatialWebMsgType.spatialmagnifyend,
+        (data as SpatialMagnifyMsg).detail,
+      )
+      this.dispatchEvent(evt)
+    }
+  }
+
+  dispatchEvent(evt: CustomEvent) {
+    // Set origin once at the first dispatch in the bubbling chain
+    if (!(evt as any).__origin) {
+      Object.defineProperty(evt, '__origin', { value: this, enumerable: false })
+    }
+    this.events[evt.type]?.(evt)
+    if (evt.bubbles && !evt.cancelBubble) {
+      if (this.parent && this.parent instanceof SpatialEntity) {
+        this.parent.dispatchEvent(evt)
+      }
+    }
+  }
+
+  protected onDestroy(): void {
+    SpatialWebEvent.removeEventReceiver(this.id)
+    // handle children
+    this.children.forEach(child => {
+      child.parent = null
+    })
+    this.children = []
+    // handle parent
+    if (this.parent) {
+      this.parent.children = this.parent.children.filter(
+        child => child.id !== this.id,
+      )
+      this.parent = null
+    }
+  }
+  // onUpdate(properties: SpatialEntityProperties) {
+  //   this.position = properties.position
+  //   this.rotation = properties.rotation
+  //   this.scale = properties.scale
+  // }
+  async convertFromEntityToEntity(
+    fromEntityId: string,
+    toEntityId: string,
+    position: Vec3,
+  ) {
+    return new ConvertFromEntityToEntityCommand(
+      fromEntityId,
+      toEntityId,
+      position,
+    ).execute()
+  }
+
+  async convertFromEntityToScene(fromEntityId: string, position: Vec3) {
+    return new ConvertFromEntityToSceneCommand(fromEntityId, position).execute()
+  }
+  async convertFromSceneToEntity(entityId: string, position: Vec3) {
+    return new ConvertFromSceneToEntityCommand(entityId, position).execute()
+  }
+}

package/src/reality/entity/SpatialModelEntity.ts

@@ -0,0 +1,15 @@
+import {
+  SpatialEntityUserData,
+  SpatialModelEntityCreationOptions,
+} from '../../types/types'
+import { SpatialEntity } from './SpatialEntity'
+
+export class SpatialModelEntity extends SpatialEntity {
+  constructor(
+    public id: string,
+    public options?: SpatialModelEntityCreationOptions,
+    public userData?: SpatialEntityUserData,
+  ) {
+    super(id, userData)
+  }
+}

package/src/reality/entity/index.ts

@@ -0,0 +1,2 @@
+export * from './SpatialEntity'
+export * from './SpatialModelEntity'

package/src/reality/geometry/SpatialBoxGeometry.ts

@@ -0,0 +1,12 @@
+import { SpatialBoxGeometryOptions, SpatialGeometryType } from '../../types/types'
+import { SpatialGeometry } from './SpatialGeometry'
+
+export class SpatialBoxGeometry extends SpatialGeometry {
+  static type: SpatialGeometryType = 'BoxGeometry'
+  constructor(
+    public id: string,
+    public options: SpatialBoxGeometryOptions,
+  ) {
+    super(id, options)
+  }
+}

package/src/reality/geometry/SpatialConeGeometry.ts

@@ -0,0 +1,15 @@
+import {
+  SpatialGeometryType,
+  SpatialConeGeometryOptions,
+} from '../../types/types'
+import { SpatialGeometry } from './SpatialGeometry'
+
+export class SpatialConeGeometry extends SpatialGeometry {
+  static type: SpatialGeometryType = 'ConeGeometry'
+  constructor(
+    public id: string,
+    public options: SpatialConeGeometryOptions,
+  ) {
+    super(id, options)
+  }
+}

package/src/reality/geometry/SpatialCylinderGeometry.ts

@@ -0,0 +1,15 @@
+import {
+  SpatialGeometryType,
+  SpatialCylinderGeometryOptions,
+} from '../../types/types'
+import { SpatialGeometry } from './SpatialGeometry'
+
+export class SpatialCylinderGeometry extends SpatialGeometry {
+  static type: SpatialGeometryType = 'CylinderGeometry'
+  constructor(
+    public id: string,
+    public options: SpatialCylinderGeometryOptions,
+  ) {
+    super(id, options)
+  }
+}

package/src/reality/geometry/SpatialGeometry.ts

@@ -0,0 +1,12 @@
+import { SpatialObject } from '../../SpatialObject'
+import { SpatialGeometryOptions, SpatialGeometryType } from '../../types/types'
+
+export class SpatialGeometry extends SpatialObject {
+  static type: SpatialGeometryType
+  constructor(
+    public id: string,
+    public options: SpatialGeometryOptions,
+  ) {
+    super(id)
+  }
+}