123

modules/Charactor.js

@@ -1,3 +1,5 @@
+import settings from "./utils/settings.js"
+
 export default class Charactor {
 
     constructor(newMeshes, particleSystems, skeletons, animationGroups) {
@@ -97,7 +99,7 @@ export default class Charactor {
         }
     }
     
-    walkByPath(charactorManager) {
+    async walkByPath(charactorManager) {
 
         let charactor = this
 
@@ -106,7 +108,9 @@ export default class Charactor {
         // 更新房间的视频贴图
         let video = charactor.walkData.pathArr[charactor.walkData.currentPoint].video
         charactorManager.app.updateHouseVideo(video)
+        // charactorManager.app.updateHouseVideoBlob(videoUrl, false)
 
+        // console.error(video.duration)
 
         let newPos = charactor.walkData.pathArr[charactor.walkData.currentPoint].point
 
@@ -130,7 +134,6 @@ export default class Charactor {
         startingPoint.y = newPos.y;
         let walkDirc = newPos.subtract(startingPoint).normalize();
 
-
         // 行走动画
         const walkAni = new BABYLON.Animation("walk", "position", charactorManager.frameRate, 
             BABYLON.Animation.ANIMATIONTYPE_VECTOR3, BABYLON.Animation.ANIMATIONLOOPMODE_RELATIVE);
@@ -163,7 +166,7 @@ export default class Charactor {
 
         turnAroundAni.setKeys(turnAroundFrames);
 
-
+        
         charactorManager.app.scene.beginDirectAnimation(charactor.mesh, [walkAni, turnAroundAni], 0, Math.max(walkFrameNum, turnAroundFrameNum), false, 1, 
             () => {
                 // 如果还有下一个点位就继续走，否则变为站立
@@ -171,6 +174,28 @@ export default class Charactor {
                     charactor.walkByPath(charactorManager)
                 } else {
                     charactor.AniTransfromTo("Idle")
+                    
+                    let endPointId = charactorManager.app.currentPoints[charactorManager.app.currentPoints.length - 1].id
+
+                    window.connection.socket.emit("getRotateVideo", {
+                        videoPath: endPointId + "/" + endPointId,
+                        sangle: 0,
+                        eangle: 360,
+                        reverses: false,
+                        sceneCode: settings.sceneCode,
+                        roomId: settings.roomId,
+                        userId: settings.userId,
+                    });
+                    window.connection.socket.emit("getRotateVideo", {
+                        videoPath: endPointId + "/" + endPointId,
+                        sangle: 0,
+                        eangle: 360,
+                        reverses: true,
+                        sceneCode: settings.sceneCode,
+                        roomId: settings.roomId,
+                        userId: settings.userId,
+                    });
+
                     charactorManager.app.cameraController.lockCamera(false)
                 }
             });

modules/CharactorManager.js

@@ -77,7 +77,7 @@ export default class CharactorManager {
                 // window.connection.socket.emit("getPush", sendData)
 
                 // todo
-                this.app.cameraController.rotateCamera(camera.alpha - cameraAlphaAmend, () => {
+                this.app.cameraController.rotateCamera(camera.alpha - cameraAlphaAmend, -Math.sign(camera.alpha - cameraAlphaAmend), () => {
                     this.charactorWalkTo(pickinfo.pickedPoint)
                 })
             }

modules/index.js

@@ -181,86 +181,86 @@ export default class App {
                 return URL.revokeObjectURL(url)
             }, 3000)
 
-            // this.cameraController.rotateCamera(this.cameraController.alphaOffset)
+            if(this.getWalkVideo) {
+
+                let path = this.currentPoints.map( (point, index) => { 
+                    return { 
+                        point: new BABYLON.Vector3(point.location.x, 0, point.location.z), 
+                        video: common.createVideoElement0(url)
+                    } 
+                })
+    
+                // 行走时锁定camera
+                this.cameraController.lockCamera(true)
+                this.charactorManager.charactor.startWalk(path, this.charactorManager)
+
+                this.getWalkVideo = false
 
-            if(this.isReverse) {
-                document.getElementById("houseTextureReverse").src = url
             } else {
-                document.getElementById("houseTexture").src = url
-            }
+                // this.cameraController.rotateCamera(this.cameraController.alphaOffset)
+
+                if(this.isReverse) {
+                    document.getElementById("houseTextureReverse").src = url
+                } else {
+                    document.getElementById("houseTexture").src = url
+                }
 
-            this.isReverse = !this.isReverse
+                this.isReverse = !this.isReverse
 
-            if(this.initVideo) {
-                this.updateHouseVideoBlob(url, true)
-                this.initVideo = false
+                if(this.initVideo) {
+                    this.updateHouseVideoBlob(url, true)
+                    this.initVideo = false
+                }
             }
         })
 
         // 获得行走视频
-        window.connection.socket.on('getVideo', async (jsonArr) => {
+        window.connection.socket.on('getVideo', async (data) => {
             
             console.log("[3D] getVideo: ", data)
 
-            let path = jsonArr.map( async (data, index) => { 
+            const blob = new Blob([data], { type: 'application/video' })
+            const url = URL.createObjectURL(blob)
+            setTimeout(function () {
+                URL.revokeObjectURL(url)
+            }, 3000)
 
-                const blob = new Blob([data.video], { type: 'application/video' })
-                const url = URL.createObjectURL(blob)
-                setTimeout(function () {
-                    return URL.revokeObjectURL(url)
-                }, 3000)
-    
-                return { 
-                    point: new BABYLON.Vector3(data.point.x, 0, data.point.z), 
-                    video: await common.createVideoElement(url)
-                } 
-            })
-
-            // 行走时锁定camera
-            this.cameraController.lockCamera(true)
-            this.charactorManager.charactor.startWalk(path, this)
+            // let path = this.currentPoints.map( (point, index) => { 
+            //     return { 
+            //         point: new BABYLON.Vector3(point.location.x, 0, point.location.z), 
+            //         video: url // await common.createVideoElement0(url)
+            //     } 
+            // })
+
+            // // 行走时锁定camera
+            // this.cameraController.lockCamera(true)
+            // this.charactorManager.charactor.startWalk(path, this.charactorManager)
         })
     
         // 获得行走路径
-        window.connection.socket.on("getRoute", (event) => {
-
-            console.log("[3D] getRoute", event);
-
-            let endPointId = 1
-
-            // window.connection.socket.emit("getRotateVideo", {
-            //     videoPath: endPointId + "/" + endPointId,
-            //     sangle: 0,
-            //     eangle: 359,
-            //     reverses: true,
-            //     sceneCode: settings.sceneCode,
-            //     roomId: settings.roomId,
-            //     userId: settings.userId,
-            // });
-            // window.connection.socket.emit("getRotateVideo", {
-            //     videoPath: endPointId + "/" + endPointId,
-            //     sangle: 0,
-            //     eangle: 359,
-            //     reverses: false,
-            //     sceneCode: settings.sceneCode,
-            //     roomId: settings.roomId,
-            //     userId: settings.userId,
-            // });
+        window.connection.socket.on("getRoute", (data) => {
 
+            console.log("[3D] getRoute", data);
+
+            if(data.length < 2) return
+
+            data = data.reverse()
+            this.currentPoints = data
+ 
             let dir = this.charactorManager.getVideoDirecNum()
 
-            let arr = []
             let videos = []
-            for(let i = 0; i < arr.length - 1; i++) {
-                videos.push(arr[i] + "/" + arr[i] + "_" + arr[i+1] + "_" + dir)
+            for(let i = 0; i < data.length - 1; i++) {
+                videos.push(data[i].id + "/" + data[i].id + "_" + data[i+1].id + "_" + dir)
             }
 
-            // connection.socket.emit("getVideo", {
-            //     videoList: ["0/0_1_0", "0/0_1_1", "0/0_1_2"],
-            //     sceneCode: testConfig.sceneCode,
-            //     roomId: testConfig.roomId,
-            //     userId: testConfig.userId,
-            // });
+            this.getWalkVideo = true
+            connection.socket.emit("getVideo", {
+                videoList: videos,
+                sceneCode: settings.sceneCode,
+                roomId: settings.roomId,
+                userId: settings.userId,
+            });
         });
     }
 
@@ -280,6 +280,7 @@ export default class App {
             mesh.material && mesh.material.setTexture("texture_video", videoTexture)
         })
         !notPlay && video.play()
+        return video
     }
 
 }

webrtc/connection.js

@@ -11,7 +11,7 @@ export class Connection {
   startSocket(config) {
     //192.168.0.52:9099/?userId=123
     console.log("init-startSocket");
-    const {  roomId, userId } = config;
+    const {  sceneCode, userId } = config;
     const socketUrl ='wss://demo-kms.4dage.com'
     // const socketUrl ='ws://192.168.0.152:9099'
     this.socket = io(socketUrl, {
@@ -19,7 +19,7 @@ export class Connection {
       transports: ["websocket"],
       query: {
         userId: userId,
-        roomId: roomId,
+        sceneCode: sceneCode,
       },
     });
     this.socket.on("connect", (data) => {