@webspatial/platform-visionos 1.0.4 → 1.1.0

package/web-spatial/views/ImmersiveView.swift

@@ -1,17 +0,0 @@
-import RealityKit
-import RealityKitContent
-import SwiftUI
-
-struct ImmersiveView: View {
-    var body: some View {
-        RealityView { content in
-            if let scene = try? await Entity(named: "Immersive", in: realityKitContentBundle) {
-                content.add(scene)
-            }
-        }
-    }
-}
-
-#Preview(immersionStyle: .mixed) {
-    ImmersiveView()
-}

package/web-spatial/views/OpenDismissHandlerUI.swift

@@ -1,45 +0,0 @@
-import SwiftUI
-
-struct OpenDismissHandlerUI: View {
-    @Environment(\.openImmersiveSpace) private var openImmersiveSpace
-    @Environment(\.dismissImmersiveSpace) private var dismissImmersiveSpace
-    @Environment(\.openWindow) private var openWindow
-    @Environment(\.dismissWindow) private var dismissWindow
-
-    @Environment(SpatialWindowContainer.self) var windowContainerContent: SpatialWindowContainer
-
-    @Environment(\.scenePhase) private var scenePhase
-
-    var body: some View {
-        VStack {}
-            .onAppear()
-            .onReceive(windowContainerContent.toggleImmersiveSpace) { v in
-                if v {
-                    Task {
-                        await openImmersiveSpace(id: "ImmersiveSpace")
-                    }
-                } else {
-                    Task {
-                        await dismissImmersiveSpace()
-                    }
-                }
-            }
-            .onReceive(windowContainerContent.openWindowData) { wd in
-                let _ = openWindow(id: wd.windowStyle, value: wd)
-            }
-            .onReceive(windowContainerContent.closeWindowData) { wd in
-                dismissWindow(id: wd.windowStyle, value: wd)
-            }
-            .onReceive(windowContainerContent.setLoadingWindowData) { wd in
-                if wd.method == .show {
-                    openWindow(id: "loading")
-                } else if wd.method == .hide {
-                    dismissWindow(id: "loading")
-                }
-            }
-
-            .onChange(of: scenePhase) { oldValue, newValue in
-                logger.debug("OpenDismissHandlerUI: Value changed from \(oldValue) to \(newValue)")
-            }
-    }
-}

package/web-spatial/views/PlainWindowContainerView.swift

@@ -1,132 +0,0 @@
-import RealityKit
-import SwiftUI
-
-struct PlainWindowContainerView: View {
-    @EnvironmentObject private var sceneDelegate: SceneDelegate
-    @Environment(SpatialWindowContainer.self) private var windowContainerContent: SpatialWindowContainer
-
-    @State private var windowResizeInProgress = false
-    @State private var timer: Timer?
-
-    private func setSize(size: CGSize) {
-        sceneDelegate.window?.windowScene?
-            .requestGeometryUpdate(
-                .Vision(
-                    size: size
-                )
-            )
-    }
-
-    private func setResizibility(resizingRestrictions: UIWindowScene.ResizingRestrictions) {
-        sceneDelegate.window?.windowScene?
-            .requestGeometryUpdate(
-                .Vision(
-                    resizingRestrictions: resizingRestrictions
-                )
-            )
-    }
-
-    private func setResizeRange(resizeRange: ResizeRange) {
-        DispatchQueue.main.asyncAfter(deadline: .now() + 0.0) {
-            sceneDelegate.window?.windowScene?
-                .requestGeometryUpdate(
-                    .Vision(
-                        minimumSize: CGSize(
-                            width: resizeRange.minWidth ?? 0,
-                            height: resizeRange
-                                .minHeight ?? 0
-                        ),
-                        maximumSize: CGSize(
-                            width: resizeRange.maxWidth ?? .infinity,
-                            height: resizeRange.maxHeight ?? .infinity
-                        )
-                    )
-                ) { error in
-                    print("error:", error)
-                }
-        }
-    }
-
-    var body: some View {
-        OpenDismissHandlerUI().environment(windowContainerContent).onDisappear {
-            windowContainerContent.destroy()
-        }
-
-        let rootEntity = windowContainerContent.getEntities().filter {
-            $0.value.getComponent(SpatialWindowComponent.self) != nil && $0.value.coordinateSpace == .ROOT
-        }.first?.value
-
-        GeometryReader { proxy3D in
-            ZStack {
-                if let e = rootEntity {
-                    let _ = e.forceUpdate ? 0 : 0
-                    let x = proxy3D.size.width / 2
-                    let y = proxy3D.size.height / 2
-                    let z = CGFloat(e.modelEntity.position.z)
-                    let width = proxy3D.size.width
-                    let height = proxy3D.size.height
-
-                    if windowResizeInProgress {
-                        VStack {}.frame(width: width, height: height).glassBackgroundEffect().padding3D(.front, -100_000)
-                            .position(x: x, y: y)
-                            .offset(z: z)
-                    } else {
-                        // Avoid showing webview until its loading completes
-                        let wc = e.getComponent(SpatialWindowComponent.self)
-                        let didFinishFirstLoad = wc != nil ? wc!.didFinishFirstLoad : false
-                        SpatialWebViewUI().environment(e)
-                            .frame(width: width, height: height).padding3D(.front, -100_000)
-                            .rotation3DEffect(Rotation3D(simd_quatf(ix: e.modelEntity.orientation.vector.x, iy: e.modelEntity.orientation.vector.y, iz: e.modelEntity.orientation.vector.z, r: e.modelEntity.orientation.vector.w)))
-                            .position(x: x, y: y)
-                            .offset(z: z)
-                            .opacity(didFinishFirstLoad ? 1.0 : 0.0)
-                            .animation(.linear(duration: 0.2), value: didFinishFirstLoad)
-                            .ornament(attachmentAnchor: .scene(.top), contentAlignment: .center) {
-                                if pwaManager.display != .fullscreen {
-                                    ZStack {
-                                        NavView(swc: wc, navInfo: wc!.navInfo).offset(y: -15)
-                                    }.frame(height: 100)
-                                }
-                            }
-                    }
-                }
-            }
-            .onReceive(windowContainerContent.setSize) { newSize in
-                setSize(size: newSize)
-            }
-            .onReceive(windowContainerContent.setResizeRange) { resizeRange in
-                self.setResizeRange(resizeRange: resizeRange)
-            }
-            .onAppear {
-                let wd = WindowContainerMgr.Instance.getValue()
-                if let range = wd.resizeRange {
-                    self.setResizeRange(resizeRange: range)
-                    if (range.minWidth != nil || range.minHeight != nil) && range.minWidth == range.maxWidth && range.minHeight == range.maxHeight {
-                        self.setResizibility(resizingRestrictions: .none)
-                    } else {
-                        self.setResizibility(resizingRestrictions: .freeform)
-                    }
-                }
-            }
-            .onChange(of: proxy3D.size) {
-                // WkWebview has an issue where it doesn't resize while the swift window is resized
-                // Treid to call didMoveToWindow to force redraw to occur but that seemed to cause rendering artifacts so that solution was rejected
-                // Now we use a windowResizeInProgress state to hide the webview (by removoving from the view) and other content (using opacity).
-                // After resize is completed the webview is added back to the page which causes a redraw at the correct dimensions/position
-                if let wv = rootEntity?.getComponent(SpatialWindowComponent.self) {
-                    windowResizeInProgress = true
-                    if timer != nil {
-                        timer!.invalidate()
-                    }
-                    // If we don't detect resolution change after x seconds we treat the resize as complete
-                    timer = Timer.scheduledTimer(withTimeInterval: 0.2, repeats: false) { _ in
-                        windowResizeInProgress = false
-                    }
-
-                    // Trigger resize in the webview's body width and fire a window resize event to get the JS on the page to update state while dragging occurs
-                    wv.evaluateJS(js: "var tempWidth_ = document.body.style.width;document.body.style.width='" + String(Float(proxy3D.size.width)) + "px'; window.dispatchEvent(new Event('resize'));")
-                }
-            }
-        }
-    }
-}

package/web-spatial/views/SpatialModel3DView.swift

@@ -1,187 +0,0 @@
-import RealityKit
-import SwiftUI
-
-class SpatialModel3DViewGestureData {
-    // for dragging state
-    var isDragging = false
-}
-
-struct SpatialModel3DView: View {
-    @Environment(SpatialEntity.self) var e: SpatialEntity
-    var parentYOffset = Float(0.0)
-
-    @State private var gestureData = SpatialModel3DViewGestureData()
-
-    var drag: some Gesture {
-        DragGesture()
-            .onChanged(onDragging)
-            .onEnded(onDraggingEnded)
-    }
-
-    var tapGesture: some Gesture {
-        TapGesture(count: 1)
-            .onEnded(onTapEnded)
-    }
-
-    var doubleTapGesture: some Gesture {
-        TapGesture(count: 2)
-            .onEnded(onDoubleTapEnded)
-    }
-
-    var longPressGesture: some Gesture {
-        LongPressGesture(minimumDuration: 1.0)
-            .onEnded(onLonePressEnded)
-    }
-
-    @ViewBuilder
-    var body: some View {
-        if e.coordinateSpace == .DOM {
-            if let childModel3DComponent = e.getComponent(SpatialModel3DComponent.self),
-               let url = URL(string: childModel3DComponent.modelURL)
-            {
-                let x = CGFloat(e.modelEntity.position.x)
-                let y = CGFloat(e.modelEntity.position.y - (childModel3DComponent.scrollWithParent ? parentYOffset : 0))
-                let z = CGFloat(e.modelEntity.position.z)
-                let width = CGFloat(childModel3DComponent.resolutionX)
-                let height = CGFloat(childModel3DComponent.resolutionY)
-                let anchor = childModel3DComponent.rotationAnchor
-                let opacity = childModel3DComponent.opacity
-                let resizable = childModel3DComponent.resizable
-                let aspectRatio: CGFloat? = childModel3DComponent.aspectRatio == nil ? nil : CGFloat(childModel3DComponent.aspectRatio!)
-                let contentMode = childModel3DComponent.contentMode
-
-                let enableTapEvent = childModel3DComponent.enableTapEvent
-                let enableDoubleTapEvent = childModel3DComponent.enableDoubleTapEvent
-                let enableDragEvent = childModel3DComponent.enableDragEvent
-                let enableLongPressEvent = childModel3DComponent.enableLongPressEvent
-
-                // Matrix = MTranslate X MRotate X MScale
-                Model3D(url: url) { newPhase in
-                    switch newPhase {
-                    case .empty:
-                        ProgressView()
-
-                    case let .success(resolvedModel3D):
-                        resolvedModel3D
-                            .resizable(resizable)
-                            .aspectRatio(
-                                aspectRatio,
-                                contentMode: contentMode
-                            )
-
-                            .onAppear {
-                                self.onLoadSuccess()
-                            }
-
-                    case let .failure(error):
-                        //                            use UIView.onAppear to notify error phase.
-                        Text("").onAppear {
-                            self.onLoadFailure(error.localizedDescription)
-                        }
-
-                    @unknown default:
-                        EmptyView()
-                    }
-                }
-                .frame(width: width, height: height)
-                //                    .background(Color.blue)
-                .scaleEffect(
-                    x: CGFloat(e.modelEntity.scale.x),
-                    y: CGFloat(e.modelEntity.scale.y),
-                    z: CGFloat(e.modelEntity.scale.z),
-                    anchor: anchor
-                )
-                .rotation3DEffect(
-                    Rotation3D(simd_quatf(
-                        ix: e.modelEntity.orientation.vector.x,
-                        iy: e.modelEntity.orientation.vector.y,
-                        iz: e.modelEntity.orientation.vector.z,
-                        r: e.modelEntity.orientation.vector.w
-                    )),
-                    anchor: anchor
-                )
-                .position(x: x, y: y)
-                .offset(z: z)
-                .frame(maxDepth: 0, alignment: .back)
-                .opacity(opacity)
-                .gesture(enableDragEvent ? drag : nil)
-                .gesture(enableDoubleTapEvent ?doubleTapGesture : nil)
-                .gesture(enableTapEvent ? tapGesture : nil)
-                .gesture(enableLongPressEvent ? longPressGesture : nil)
-                .hidden(!e.visible)
-            } else {
-                Text("").onAppear {
-                    self.onLoadFailure("invalid URL")
-                }
-            }
-        } else {
-            EmptyView()
-        }
-    }
-
-    private func onLoadSuccess() {
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let data = "{eventType: 'phase', value: 'success'}"
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-
-    private func onLoadFailure(_ error: String) {
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let data = "{eventType: 'phase', value: 'failure', error: '\(error)'} "
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-
-    private func onDragging(dragValue: DragGesture.Value) {
-        var eventType = "drag"
-        if !gestureData.isDragging {
-            gestureData.isDragging = true
-            eventType = "dragstart"
-        }
-        fireDragEvent(eventType, dragValue)
-    }
-
-    private func onDraggingEnded(dragValue: DragGesture.Value) {
-        gestureData.isDragging = false
-        let eventType = "dragend"
-        fireDragEvent(eventType, dragValue)
-    }
-
-    private func onTapEnded(_: TapGesture.Value) {
-        print("onTapEnded")
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let eventType = "tap"
-            let data = "{eventType: '\(eventType)' } "
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-
-    private func onDoubleTapEnded(_: TapGesture.Value) {
-        print("onDoubleTapEnded")
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let eventType = "doubletap"
-            let data = "{eventType: '\(eventType)' } "
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-
-    private func onLonePressEnded(_: LongPressGesture.Value) {
-        print("onLonePressEnded")
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let eventType = "longpress"
-            let data = "{eventType: '\(eventType)' } "
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-
-    private func fireDragEvent(_ eventType: String, _ value: DragGesture.Value) {
-        if let model3DComponent = e.getComponent(SpatialModel3DComponent.self) {
-            let startLocation3D = value.startLocation3D
-            let translation3D = value.translation3D
-
-            let data = "{eventType: '\(eventType)', value: { translation3D : { x: \(translation3D.x), y: \(translation3D.y), z: \(translation3D.z) }, startLocation3D: { x: \(startLocation3D.x), y: \(startLocation3D.y), z: \(startLocation3D.z)} } } "
-            model3DComponent.wv?.fireComponentEvent(componentId: model3DComponent.id, data: data)
-        }
-    }
-}

package/web-spatial/views/SpatialViewUI.swift

@@ -1,168 +0,0 @@
-//
-//  SpatialViewUI.swift
-//  web-spatial
-//
-//  Created by ByteDance on 11/6/24.
-//
-import RealityKit
-import SwiftUI
-
-extension View {
-    @ViewBuilder
-    func `if`<Content: View>(_ condition: Bool, transform: (Self) -> Content) -> some View {
-        if condition {
-            transform(self)
-        } else {
-            self
-        }
-    }
-}
-
-struct SpatialViewUI: View {
-    @Environment(SpatialEntity.self) var ent: SpatialEntity
-    @State var isRoot = false
-
-    // Entity which will contain all the content of this realityView and scale to fit frame
-    @State var world = Entity()
-    @State var portal = Entity()
-    @State var light = PointLight()
-    @State var portalModel = ModelComponent(
-        mesh: .generatePlane(width: 1.0, height: 1.0, cornerRadius: 0.0),
-        materials: [PortalMaterial()]
-    )
-    @State var worldComponent = WorldComponent()
-
-    private func toJson(val: SIMD3<Float>) -> String {
-        return "{x: " + String(val.x) + ",y: " + String(val.y) + ",z: " + String(val.z) + "}"
-    }
-
-    var dragGesture: some Gesture {
-        DragGesture(minimumDistance: 0).handActivationBehavior(.automatic)
-            .targetedToAnyEntity()
-            .onChanged { value in
-                let startPos = value.convert(value.startLocation3D, from: .local, to: .scene)
-                let translate = value.convert(value.location3D, from: .local, to: .scene)
-                let spatialEntity = value.entity.components[SpatialBridgeComponent.self]!.spatialEntity
-                let ic = spatialEntity.getComponent(SpatialInputComponent.self)!
-
-                if !ic.isDragging {
-                    ic.isDragging = true
-                    ic.trackedPosition = startPos
-                    let delta = translate - ic.trackedPosition
-                    ic.trackedPosition = translate
-
-                    ic.wv!.fireComponentEvent(componentId: ic.id, data: "{eventType: 'dragstart', translate: " + toJson(val: delta) + "}")
-                } else {
-                    let delta = translate - ic.trackedPosition
-                    ic.trackedPosition = translate
-                    ic.wv!.fireComponentEvent(componentId: ic.id, data: "{eventType: 'drag', translate: " + toJson(val: delta) + "}")
-                }
-            }
-            .onEnded { value in
-                let spatialEntity = value.entity.components[SpatialBridgeComponent.self]!.spatialEntity
-                let ic = spatialEntity.getComponent(SpatialInputComponent.self)!
-                ic.wv!.fireComponentEvent(componentId: ic.id, data: "{eventType: 'dragend'}")
-                ic.isDragging = false
-            }
-    }
-
-    var body: some View {
-        if let viewComponent = ent.getComponent(SpatialViewComponent.self) {
-            GeometryReader3D { proxy in
-                // Get dimensions of the frame
-                let proxySize3d = proxy.frame(in: .local)
-
-                RealityView { _, _ in
-                } update: { content, attachments in
-                    // Scale content so it will be a 1x1x1 space and not exceed the frame
-                    let viewSpaceDimensions = content.convert(proxySize3d, from: .local, to: content)
-                    let newScale = min(viewSpaceDimensions.extents.x, viewSpaceDimensions.extents.y)
-
-                    world.transform.scale.x = newScale
-                    world.transform.scale.y = newScale
-                    world.transform.scale.z = newScale
-                    portal.transform.scale.x = newScale
-                    portal.transform.scale.y = newScale
-                    portal.transform.scale.z = newScale
-
-                    if !isRoot {
-                        // Pull out content so volume sits in front of the page
-                        world.transform.translation.z = world.transform.scale.z / 2
-                    }
-
-                    for (_, entity) in ent.getEntities() {
-                        world.addChild(entity.modelEntity)
-                    }
-
-                    // Add attachments for window entities
-                    let entities = ent.getEntities().filter { _, entity in
-                        entity.coordinateSpace == .APP && entity.hasComponent(SpatialWindowComponent.self)
-                    }
-                    for key in Array(entities.keys) {
-                        let e = entities[key]!
-                        let windowComponent = e.getComponent(SpatialWindowComponent.self)
-                        if windowComponent != nil && e.coordinateSpace == .APP {
-                            if let windowAttachment = attachments.entity(for: key) {
-                                if e.modelEntity.children.count == 0 {
-                                    e.modelEntity.addChild(windowAttachment, preservingWorldTransform: false)
-
-                                    // Scale the window to fit the resolution to unit ratio as defined by setResolution API
-                                    let b = windowAttachment.attachment.bounds
-                                    let wv = e.getComponent(SpatialWindowComponent.self)!
-                                    let scaleFact = (Float(wv.resolutionX) / 1360.0) / (b.max.x - b.min.x)
-                                    windowAttachment.scale.x = scaleFact
-                                    windowAttachment.scale.y = scaleFact
-                                    windowAttachment.scale.z = scaleFact
-                                }
-                            }
-                        }
-                    }
-                    if viewComponent.isPortal {
-                        // Setup portal
-                        portal.components.set(portalModel)
-                        portal.transform.translation.z = 0.0001 // avoid z fighting
-                        if !portal.components.has(PortalComponent.self) {
-                            portal.components.set(PortalComponent(target: world))
-                        }
-
-                        // Setup default light
-                        light.light.intensity = 5000
-                        light.position.z = 2
-                        light.position.y = 1
-                        light.position.x = 0.5
-                        world.addChild(light)
-
-                        // Position volume behind portal instead of in front
-                        world.transform.translation.z *= -1
-
-                        // Add portal to scene
-                        world.components.set(worldComponent)
-                        content.add(portal)
-                    } else {
-                        // Remove portal elements/components
-                        content.remove(portal)
-                        world.components.remove(WorldComponent.self)
-                        world.removeChild(light)
-                    }
-
-                    content.add(world)
-                }
-                attachments: {
-                    // Create an attachment for each window component
-                    let entities = ent.getEntities().filter { _, entity in
-                        entity.coordinateSpace == .APP && entity.hasComponent(SpatialWindowComponent.self)
-                    }
-                    ForEach(Array(entities.keys), id: \.self) { key in
-                        let entity = entities[key]!
-                        let wv = entity.getComponent(SpatialWindowComponent.self)!
-                        Attachment(id: key) {
-                            SpatialWebViewUI().environment(entity).frame(width: wv.resolutionX, height: wv.resolutionY)
-                        }
-                    }
-                }.gesture(dragGesture).if(!isRoot) { view in
-                    view.clipped()
-                }
-            }
-        }
-    }
-}