fixed camera not updating on first toggle switch

Author: Butanium

engine/community-modules/camera/src/main/resources/view/camera-module/CameraModule.js

@@ -30,9 +30,9 @@ export class CameraModule {
 
     setActive(active) {
         this.viewerActive = active
-        if (this.currentUpdateProgress !== undefined) {
-            this.lastFrame = -2
-            this.updateScene(this.previousUpdateData, this.currentUpdateFrame, this.currentUpdateProgress)
+        this.lastFrame = -2
+        if (this.previousUpdateData !== undefined) {
+            this.updateScene(this.previousUpdateData, this.currentUpdateFrame, this.currentUpdateProgress || 1)
         }
     }
 
@@ -46,14 +46,18 @@ export class CameraModule {
             y += root.currentState.y
             root = root.parent
             debug++
-            if (debug > 10) {
-                throw new Error("this is too long")
+            if (debug > 500) {
+                throw new Error("this is too long") // break point to be sure the program doesn't
+                // loop infinitely, should never be triggered
             }
         }
         return {x, y}
     }
 
     updateScene(previousData, currentData, progress) {
+        this.currentUpdateFrame = currentData
+        this.currentUpdateProgress = progress
+        this.previousUpdateData = previousData
         const isActive = (currentData.registered.size !== 0) && (currentData.container.entity !== null)
         if (!(currentData.active && this.viewerActive)) {
             if (isActive) {
@@ -62,56 +66,59 @@ export class CameraModule {
             }
             return
         }
-        this.currentUpdateFrame = currentData
-        this.currentUpdateProgress = progress
-        this.previousUpdateData = previousData
-        if (this.lastFrame !== currentData.number) {
-            if (isActive) {
-                this.oldCameraState = {...this.currentCameraState}
-                let maxX, minX, minY, maxY;
-                let first = true;
-                entityModule.entities.forEach(
-                    entity => {
-
-                        if (currentData.registered.get(entity.id + "")) {
-                            const relativePos = this.getRelativePosFromContainer(entity, currentData.container.entity.id)
-                            if (first) {
-                                minX = maxX = relativePos.x
-                                minY = maxY = relativePos.y
-                                first = false
-                            } else {
-                                minX = Math.min(minX, relativePos.x)
-                                minY = Math.min(minY, relativePos.y)
-                                maxX = Math.max(maxX, relativePos.x)
-                                maxY = Math.max(maxY, relativePos.y)
-                            }
+        if (!isActive) {
+            const boundSize = {x: 1920, y: 1080}
+            const position = {x: 0, y: 0}
+            this.oldCameraState = {boundSize, position}
+        }
 
+        if (this.lastFrame !== currentData.number && isActive) {
+            this.oldCameraState = {...this.currentCameraState}
+            let maxX, minX, minY, maxY;
+            let first = true;
+            entityModule.entities.forEach(
+                entity => {
+
+                    if (currentData.registered.get(entity.id + "")) {
+                        const relativePos = this.getRelativePosFromContainer(entity, currentData.container.entity.id)
+                        if (first) {
+                            minX = maxX = relativePos.x
+                            minY = maxY = relativePos.y
+                            first = false
+                        } else {
+                            minX = Math.min(minX, relativePos.x)
+                            minY = Math.min(minY, relativePos.y)
+                            maxX = Math.max(maxX, relativePos.x)
+                            maxY = Math.max(maxY, relativePos.y)
                         }
+
                     }
-                )
-                const averagePoint = {x: (maxX + minX) / 2, y: (maxY + minY) / 2}
-                const boundSize = {x: maxX - minX, y: maxY - minY}
-                const containerState = currentData.container.entity.currentState
-                const scale2 = Math.min(HEIGHT / (boundSize.y + currentData.cameraOffset), WIDTH / (boundSize.x + currentData.cameraOffset))
-                const scale = {x: scale2 / containerState.scaleX, y: scale2 / containerState.scaleY}
-                this.cameraEndScale = scale
-
-                const newX = ((currentData.container.sizeX / 2 - averagePoint.x) * scale2
-                    - (scale2 - 1) * currentData.container.sizeX / 2
-                    + (WIDTH / 2 - (containerState.x + currentData.container.sizeX / 2))) / containerState.scaleX
-
-                const newY = ((currentData.container.sizeY / 2 - averagePoint.y) * scale2
-                    - (scale2 - 1) * currentData.container.sizeY / 2
-                    + (HEIGHT / 2 - (containerState.y + currentData.container.sizeY / 2))) / containerState.scaleY
-
-                this.cameraEndPosition = {x: newX, y: newY}
-                const position = averagePoint
-                this.cameraCurve = (position.x - this.oldZoomState.position.x) ** 2 +
-                (position.y - this.oldZoomState.position.y) ** 2 >= currentData.cameraOffset ** 2
-                || Math.max(Math.abs(boundSize.x - this.oldZoomState.boundSize.x),
-                    Math.abs(boundSize.y - this.oldZoomState.boundSize.y)) > currentData.cameraOffset ? easeOut : t => t
-                this.oldZoomState = {boundSize, position}
-            }
+                }
+            )
+            const averagePoint = {x: (maxX + minX) / 2, y: (maxY + minY) / 2}
+            const boundSize = {x: maxX - minX, y: maxY - minY}
+            const containerState = currentData.container.entity.currentState
+            const scale2 = Math.min(HEIGHT / (boundSize.y + currentData.cameraOffset), WIDTH / (boundSize.x + currentData.cameraOffset))
+            const scale = {x: scale2 / containerState.scaleX, y: scale2 / containerState.scaleY}
+            this.cameraEndScale = scale
+
+            const newX = ((currentData.container.sizeX / 2 - averagePoint.x) * scale2
+                - (scale2 - 1) * currentData.container.sizeX / 2
+                + (WIDTH / 2 - (containerState.x + currentData.container.sizeX / 2))) / containerState.scaleX
+
+            const newY = ((currentData.container.sizeY / 2 - averagePoint.y) * scale2
+                - (scale2 - 1) * currentData.container.sizeY / 2
+                + (HEIGHT / 2 - (containerState.y + currentData.container.sizeY / 2))) / containerState.scaleY
+
+            // currentData.container.entity.graphics.scale.x = currentData.container.entity.graphics.scale.y = 0.5
+            this.cameraEndPosition = {x: newX, y: newY}
+            //console.log(`frame ${currentData.number}, ${Math.round(progress*100)/100}%,container to x : ${newX}, y : ${newY}, scale : ${scale}`)
+            const position = averagePoint
+            this.cameraCurve = (position.x - this.oldZoomState.position.x) ** 2 +
+            (position.y - this.oldZoomState.position.y) ** 2 >= currentData.cameraOffset ** 2
+            || Math.max(Math.abs(boundSize.x - this.oldZoomState.boundSize.x),
+                Math.abs(boundSize.y - this.oldZoomState.boundSize.y)) > currentData.cameraOffset ? easeOut : t => t
+            this.oldZoomState = {boundSize, position}
 
         }
         const realProgress = Math.abs(currentData.number - this.lastFrame) > 1 ? 1 : progress