Last active
September 2, 2024 14:15
-
-
Save Trass3r/ee62c5ce33d332e9b5ac14cafb2000a9 to your computer and use it in GitHub Desktop.
Babylon Playground Torch
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| class Torch { | |
| private holderInstance: BABYLON.InstancedMesh; // Instance of the torch holder | |
| private flameSprite: BABYLON.Sprite; // Sprite for the flame | |
| private torchLight: BABYLON.PointLight; // Light for the torch flame | |
| private torchTransform: BABYLON.TransformNode; // Transform node for grouping | |
| private static torchHolderBaseMesh: BABYLON.Mesh; | |
| private static flameManager: BABYLON.SpriteManager; | |
| constructor( | |
| scene: BABYLON.Scene, | |
| position: BABYLON.Vector3, | |
| color: BABYLON.Color4 = new BABYLON.Color4(1, 0.4, 0, 1) | |
| ) { | |
| if (Torch.torchHolderBaseMesh == null) { | |
| Torch.torchHolderBaseMesh = BABYLON.MeshBuilder.CreateCylinder("torchHolderBase", { height: 0.2, diameter: 0.025, tessellation: 8 }, scene); | |
| Torch.torchHolderBaseMesh.isVisible = false; // Hide the base mesh, only use instances | |
| Torch.flameManager = new BABYLON.SpriteManager("flameManager", "textures/Fire_SpriteSheet3_8x8.png", 64, 128, scene); | |
| } | |
| // Create a transform node as a parent for the torch components | |
| this.torchTransform = new BABYLON.TransformNode("torchTransform", scene); | |
| this.torchTransform.position = position; // Position in global space | |
| // Create an instance of the torch holder as a child of the transform node | |
| this.holderInstance = Torch.torchHolderBaseMesh.createInstance("torchHolderInstance"); | |
| this.holderInstance.parent = this.torchTransform; // Set parent to transform node | |
| this.holderInstance.position = new BABYLON.Vector3(0, 0, 0); // Position relative to the transform node | |
| this.holderInstance.rotation.x = Math.PI / 4; // Rotate to 45 degrees | |
| // Create a flame sprite at the tip of the torch holder | |
| this.flameSprite = new BABYLON.Sprite("flameSprite", Torch.flameManager); | |
| this.flameSprite.width = 0.5; // Scale up/down as needed | |
| this.flameSprite.height = 0.7; // Adjust height to match flame appearance | |
| this.flameSprite.position = position.add(new BABYLON.Vector3(0, 0.3, 0.05)); | |
| this.flameSprite.playAnimation(0, 63, true, 16); // Play all frames in loop with an appropriate frame rate | |
| this.flameSprite.color = color; // Set the flame color | |
| // Create a point light to simulate the flame's illumination | |
| this.torchLight = new BABYLON.PointLight("torchLight", new BABYLON.Vector3(0, 0.1, 0), scene); | |
| this.torchLight.parent = this.torchTransform; // Parent the light to the transform node | |
| this.torchLight.intensity = 5; // Increased intensity for stronger light effect | |
| this.torchLight.range = 1; // Larger light radius | |
| this.torchLight.specular = this.torchLight.diffuse = new BABYLON.Color3(color.r, color.g, color.b); | |
| // Animate torch flame flicker using registerBeforeRender | |
| /*scene.registerBeforeRender(() => { | |
| this.torchLight.intensity = 2.5 + Math.random() * 0.5; // Stronger flickering | |
| const flickerOffset = 0.03; | |
| this.torchLight.position.x = Math.random() * flickerOffset - flickerOffset / 2; | |
| this.torchLight.position.y = 0.75 + Math.random() * flickerOffset - flickerOffset / 2; | |
| });*/ | |
| const dragBehavior = new BABYLON.PointerDragBehavior(); | |
| this.torchTransform.addBehavior(dragBehavior); | |
| dragBehavior.onDragObservable.add((event) => { | |
| console.log("drag"); | |
| console.log(event); | |
| this.flameSprite.position.addInPlace(event.delta); | |
| }); | |
| } | |
| public moveTo(pos: BABYLON.Vector3) { | |
| this.torchTransform.position.copyFrom(pos); | |
| this.flameSprite.position = pos.add(new BABYLON.Vector3(0, 0.3, 0.05)); | |
| } | |
| } | |
| class Playground { | |
| public static CreateScene(engine: BABYLON.Engine, canvas: HTMLCanvasElement): BABYLON.Scene { | |
| // Create a basic Babylon Scene object | |
| const scene = new BABYLON.Scene(engine); | |
| // Add a camera to the scene and attach it to the canvas | |
| const camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 4, 5, BABYLON.Vector3.Zero(), scene); | |
| camera.attachControl(canvas, true); | |
| // Add a light to the scene (ambient light for overall illumination) | |
| const ambientLight = new BABYLON.HemisphericLight("ambientLight", new BABYLON.Vector3(0, 1, 0), scene); | |
| ambientLight.intensity = 0.3; // Dim ambient light | |
| // Create a wall using a box | |
| const wall = BABYLON.MeshBuilder.CreateBox("wall", { width: 2, height: 1, depth: 0.1 }, scene); | |
| wall.position.z = 1; // Position it in front of the origin | |
| wall.position.y = 0.5; | |
| // Add rock texture with normal map to the wall | |
| const wallMaterial = new BABYLON.StandardMaterial("wallMaterial", scene); | |
| wallMaterial.diffuseTexture = new BABYLON.Texture("textures/rock.png", scene); | |
| wallMaterial.bumpTexture = new BABYLON.Texture("textures/rockn.png", scene); // Normal map | |
| wall.material = wallMaterial; | |
| new Torch(scene, new BABYLON.Vector3(0, 0.5, 1.1)); | |
| return scene; | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment