Skip to content

Commit

Permalink
More Extras (#110)
Browse files Browse the repository at this point in the history 
* Set PS Layer mask; emissive color for trail

* Add rotation gizmo+util layer to planning screen

* Make slider, launch button hit test visible for pointer

* Move RP GUI to UtilityLayer

* Fixes Earning a High Score doesn't allow high score entry #109
  • Loading branch information
@jelster
jelster authored Jul 29, 2022
1 parent 4d6aa54 commit 4c4e1bd
Show file tree
Hide file tree
Showing 5 changed files with 47 additions and 30 deletions.
8 changes: 0 additions & 8 deletions src/driving/spaceTruckerDrivingScreen.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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";
Expand Down
2 changes: 2 additions & 0 deletions src/route-planning/cargoUnit.js
View file
Original file line number Diff line number Diff line change
@@ -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";
Expand Down Expand Up @@ -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);

}

Expand Down
61 changes: 41 additions & 20 deletions src/route-planning/route-plan-gui.js
View file
Original file line number Diff line number Diff line change
@@ -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 {
Expand All @@ -23,6 +22,9 @@ class PlanningScreenGui {
guiCamera;

#launchSlider;
#cargoRotationGizmo;
#utilityLayer;

get launchForce() {
return this.#launchSlider.value;
}
Expand Down Expand Up @@ -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");
Expand All @@ -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);

}


Expand Down Expand Up @@ -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;
}
Expand All @@ -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;
Expand Down Expand Up @@ -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;
Expand All @@ -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) {
Expand Down
4 changes: 3 additions & 1 deletion src/route-planning/spaceTruckerPlanningScreen.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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;

Expand Down Expand Up @@ -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);
Expand Down
2 changes: 1 addition & 1 deletion src/scoring/scoringDialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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();
});
});
Expand Down

0 comments on commit 4c4e1bd

Please sign in to comment.