Even More Extras

src/driving/spaceTruckerDrivingScreen.js

@@ -4,25 +4,17 @@ import { Viewport } from "@babylonjs/core/Maths/math.viewport";
 import { Mesh } from "@babylonjs/core/Meshes/mesh";
 import { MeshBuilder } from "@babylonjs/core/Meshes/meshBuilder";
 import { Color3 } from "@babylonjs/core/Maths/math.color";
-import { StandardMaterial } from "@babylonjs/core/Materials/standardMaterial";
-import { Texture } from "@babylonjs/core/Materials/Textures/texture";
 import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
-import { CreatePlane } from "@babylonjs/core/Meshes/Builders/planeBuilder";
-import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder";
 import { CreateSphere } from "@babylonjs/core/Meshes/Builders/sphereBuilder";
-import { CreateCylinder } from "@babylonjs/core/Meshes/Builders/cylinderBuilder";
-import { CreateTorus } from "@babylonjs/core/Meshes/Builders/torusBuilder";
 import { Axis } from "@babylonjs/core/Maths/math.axis";
 import { Scalar } from "@babylonjs/core/Maths/math.scalar";
-import { Space } from "@babylonjs/core/"; // TODO: fix import
 import { Observable, setAndStartTimer } from "@babylonjs/core/Misc";
 import { ArcRotateCamera } from "@babylonjs/core/Cameras/arcRotateCamera";
 import { GridMaterial } from "@babylonjs/materials/grid";
 import { Quaternion } from "@babylonjs/core/Maths/math";
 import { Path3D } from "@babylonjs/core/Maths/math.path";
 import { ActionManager } from "@babylonjs/core/Actions/actionManager";
 import { ExecuteCodeAction } from "@babylonjs/core/Actions/directActions";
-import { PhysicsHelper } from "@babylonjs/core/Physics/physicsHelper";
 import { PhysicsImpostor } from "@babylonjs/core/Physics/physicsImpostor";
 import { AmmoJSPlugin } from "@babylonjs/core/Physics/Plugins/ammoJSPlugin";
 import "@babylonjs/core/Physics/physicsEngineComponent";

src/route-planning/cargoUnit.js

@@ -1,6 +1,7 @@
 import { PBRMaterial, TrailMesh, TransformNode } from "@babylonjs/core";
 import { Quaternion, Vector3 } from "@babylonjs/core/Maths/math.vector";
 import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder";
+import { Color3 } from "@babylonjs/core/Maths/math.color";
 
 import OrbitingGameObject from "../orbitingGameObject";
 import SpaceTruckerEncounterManager from "./spaceTruckerEncounterManager";
@@ -41,6 +42,7 @@ class CargoUnit extends OrbitingGameObject {
         this.encounterManager = new SpaceTruckerEncounterManager(this, scene);
         this.trailMeshMaterial = new PBRMaterial("cargoTrailMaterial", this.scene);
         this.mesh.material = this.trailMeshMaterial;
+        this.trailMeshMaterial.emissiveColor = new Color3(0.91, 0.91, 0.20);
 
     }
 

src/route-planning/route-plan-gui.js

@@ -1,15 +1,14 @@
 import { Rectangle } from "@babylonjs/gui/2D/controls/rectangle";
-import { Animation } from "@babylonjs/core/Animations/animation";
 import { AdvancedDynamicTexture } from "@babylonjs/gui/2D/advancedDynamicTexture";
 import { TextBlock } from "@babylonjs/gui/2D/controls/textBlock";
 import { Control } from "@babylonjs/gui/2D/controls/control";
-import { PLAN_STATE_KEYS, PLANNING_STATE } from "./spaceTruckerPlanningScreen";
-import { Grid, Image, Slider, StackPanel } from "@babylonjs/gui";
+import {  PLANNING_STATE } from "./spaceTruckerPlanningScreen";
+import { StackPanel } from "@babylonjs/gui";
 import { Scalar } from "@babylonjs/core/Maths/math.scalar";
-import { Tools } from "@babylonjs/core/Misc/tools";
 import guiScreen from "../guis/route-planning-gui.json";
-import { ArcRotateCamera } from "@babylonjs/core/Cameras/arcRotateCamera";
-import { Vector3 } from "@babylonjs/core";
+
+import { UtilityLayerRenderer } from "@babylonjs/core/Rendering/utilityLayerRenderer";
+import { RotationGizmo } from "@babylonjs/core/Gizmos/rotationGizmo";
 
 const GUI_LAYER_MASK = 2;
 class PlanningScreenGui {
@@ -23,6 +22,9 @@ class PlanningScreenGui {
     guiCamera;
 
     #launchSlider;
+    #cargoRotationGizmo;
+    #utilityLayer;
+
     get launchForce() {
         return this.#launchSlider.value;
     }
@@ -82,16 +84,15 @@ class PlanningScreenGui {
 
     constructor(planningScreen) {
         this.scene = planningScreen.scene;
-        //this.scene.autoClear = false;
 
+        this.#utilityLayer = UtilityLayerRenderer.DefaultUtilityLayer;
         this.planningScreen = planningScreen;
         let gui = this.gui = AdvancedDynamicTexture.CreateFullscreenUI("ui",
             true,
-            this.planningScreen.scene,
+            this.#utilityLayer.utilityLayerScene,
             AdvancedDynamicTexture.NEAREST_NEAREST,
             true);
         gui.parseContent(guiScreen);
-        gui.layer.layerMask = GUI_LAYER_MASK;
         this.#launchSlider = gui.getControlByName("launchSlider");
         this.#centerText = gui.getControlByName("centerText");
         this.#currentAccelerationText = gui.getControlByName("currentAccelerationText");
@@ -101,15 +102,6 @@ class PlanningScreenGui {
         this.#launchResetButton = gui.getControlByName("launchResetButton");
         this.#routeSimulationText = gui.getControlByName("routeSimulationText");
 
-        this.guiCamera = new ArcRotateCamera("guiCamera", 0, 0.8, 100, Vector3.Zero(), this.scene);
-        this.guiCamera.position = this.planningScreen.camera.position;
-        this.guiCamera.rotation = this.planningScreen.camera.rotation;
-        this.guiCamera.parent = this.planningScreen.camera;
-
-        this.guiCamera.layerMask = GUI_LAYER_MASK;
-        this.guiCamera.maxZ = 10;
-        this.scene.activeCameras.push(this.guiCamera);
-
     }
 
 
@@ -141,15 +133,22 @@ class PlanningScreenGui {
             case PLANNING_STATE.ReadyToLaunch:
                 this.centerText = "";
                 this.launchResetButton.text = "LAUNCH";
+                this.#cargoRotationGizmo.attachedMesh = this.planningScreen.cargo.mesh;
                 break;
             case PLANNING_STATE.InFlight:
                 this.centerText = "";
                 this.launchResetButton.text = "RESET";
+                this.#cargoRotationGizmo.attachedMesh = null;
                 break;
             case PLANNING_STATE.CargoDestroyed:
                 this.centerText = "Invalid Route - Cargo Destroyed";
                 this.launchResetButton.text = "RESET";
                 break;
+            case PLANNING_STATE.Paused:
+                this.centerText = "Paused";
+                this.launchResetButton.text = "RESET";
+                this.#cargoRotationGizmo.attachedMesh = null;
+                break;
             default:
                 break;
         }
@@ -158,7 +157,7 @@ class PlanningScreenGui {
     *routeSimulationTextCoroutine() {
         const routeSimulationCornerText = this.#routeSimulationText;
         let frameCount = 0;
-        const totalFrames = 30;
+        const totalFrames = 90;
         let direction = 1;
         while (true) {
             let { gameState } = this.planningScreen;
@@ -212,7 +211,18 @@ class PlanningScreenGui {
             }
 
         });
-
+        this.#launchResetButton.isHitTestVisible = true;
+        this.#launchResetButton.isPointerBlocker = true;
+        this.#launchResetButton.onPointerClickObservable.add(() => {
+            if (this.planningScreen.gameState === PLANNING_STATE.ReadyToLaunch) {
+                this.planningScreen.ACTIVATE(true);
+            }
+            else {
+                this.planningScreen.GO_BACK();
+            }
+        });
+        this.#launchSlider.isHitTestVisible = true;
+        this.#launchSlider.isPointerBlocker = true;
         this.#launchSlider.maximum = this.planningScreen.launchForceMax;
         this.#launchSlider.minimum = 10;
         this.#launchSlider.displayValueBar = true;
@@ -232,6 +242,17 @@ class PlanningScreenGui {
         });
         this.scene.onBeforeRenderObservable.runCoroutineAsync(this.routeSimulationTextCoroutine());
 
+
+        this.#cargoRotationGizmo = new RotationGizmo(this.#utilityLayer, null, null, 1.2);
+        this.#cargoRotationGizmo.scaleRatio = 1.15;
+        this.#cargoRotationGizmo.attachedMesh = cargo.mesh;
+
+        this.#cargoRotationGizmo.updateGizmoPositionToMatchAttachedMesh = true;
+        this.#cargoRotationGizmo.updateGizmoRotationToMatchAttachedMesh = true;
+        this.#cargoRotationGizmo.updateScale = true;
+
+
+
     }
 
     createDisplayCageUi(name) {

src/route-planning/spaceTruckerPlanningScreen.js

@@ -115,6 +115,7 @@ class SpaceTruckerPlanningScreen {
 
         this.scene = new Scene(engine);
         this.scene.onNewMeshAddedObservable.add(mesh => mesh.layerMask = PLANNING_SCREEN_LAYER_MASK);
+
 
         this.config = config;
         const { blurParameter, environmentTexture, IBLIntensity, lightIntensity, skyboxScale } = config.environment;
@@ -203,6 +204,7 @@ class SpaceTruckerPlanningScreen {
 
         this.scene.onReadyObservable.addOnce(() => {
             this.ui = new PlanningScreenGui(this);
+            this.scene.particleSystems.forEach(ps => ps.layerMask = PLANNING_SCREEN_LAYER_MASK);
             this.ui.bindToScreen();
             this.gameState = PLANNING_STATE.Initialized;
 
@@ -274,7 +276,7 @@ class SpaceTruckerPlanningScreen {
     }
 
     ACTIVATE(state, args) {
-        if (args.pointerType || this.gameState !== PLANNING_STATE.ReadyToLaunch) {
+        if (args?.pointerType || this.gameState !== PLANNING_STATE.ReadyToLaunch) {
             return;
         }
         console.log(state, args);

src/scoring/scoringDialog.js

@@ -56,7 +56,7 @@ function createScoringDialog(scoreData, drivingScreen) {
         let score = scoreData.finalScores['Final Total'];
         await scoreDialog.hide();
         let scoreScreen = HighScoreScreen(scene, score);
-        scoreScreen.onCancelledObservable.add(async () => {
+        scoreScreen.onAcceptedObservable.add(async () => {
             await scoreDialog.show();
         });
     });