Popular Content

Showing content with the highest reputation on 10/12/18 in all areas

  1. 4 points

    Plane tangent to a sphere

    Hi there ! you can change the segment of the sphere to decided on number of planes. The solution uses facets normals- https://www.babylonjs-playground.com/#VDG184#7 Good day
  2. 2 points
    Back to the Lamps on Babylon / Open Contest! forum thread, I've commited myself to write a tutorial about my lightmap workflow. Here the demo: And here the first published version of the tutorial... but in french, for now 😄 https://www.nothing-is-3d.com/article25/de-blender-vers-babylonjs I will soon make available an english version, don't worry. [edit] english version is out: https://www.nothing-is-3d.com/article27/from-blender-to-babylonjs
  3. 1 point

    Phaser 3 - Video tutorial series Free

    I'm doing a video tutorial series for Phaser 3 since the only alternatives are paid Zenva courses(which aren't bad but not many can afford). I'm aiming to do videos once a week and if you want to help out, I'll be on discord open to discuss the scripts and what to go over.
  4. 1 point

    Libraries to use on Pixijs

    Hey guys, I've decided to use pixijs for my game. I've chosen it because I'm going to be making 2D boardgame and I like working with lower level codes instead of magic functions. My other option was phaser but it seems more magic and I want to be able to edit the frameworks I'm using. Anyhow I've ran across and played around with hexi(https://github.com/kittykatattack/hexi) and liked it. I'm also aware of the 3 other engines here: https://github.com/cursedcoder/awesome-pixijs I just wanted to make sure I'm not missing anything. Let me know what you think and which libraries I should use to make my boardgame. Thanks :)
  5. 1 point
    Spasibo Ivan!
  6. 1 point

    Fog Density

    You cannot have your file in a separate folder unfortunately. But you can trick it to make it work: Just add some code that will first do an xhr to read all your files and store the results in the Effect store.
  7. 1 point
    Of course pixi built-in interaction is not enough for serious cases like this. Your solution is good enough.
  8. 1 point

    Pixel perfection

    Hey ! Welcome to the forum Try this - http://jsfiddle.net/zmatocef/ and here's the PG- https://playground.babylonjs.com/#M9XT7F#3 as you can see, if you use diag, the FOV for 0px offset still leaves some area(coz of sq root) which is because of the fact (basic maths) let's say you render size was 500*500; diag = Math.sqrt(500*500 + 500*500) => 500 * Math.sqrt(2); because of this (sqr 2)1.41 there's some region left in the view area. (same case happen with Three.js; you can try yourself! ) This is how the formula is derived -> tan(x) = height/ base. Now for FOV ( we have to find 2tan(x)) In our case tan(x) = (renderHeight/2)/ (distance) ; //(distance btw camera and mesh; because camera is in middle) now x = tan-1(renderHeight/ 2* distance); and FOV = 2x; if you use diagonal; you can't get accurate result (x in this case)
  9. 1 point

    Dynamic Terrain

    Little uncomplete demo of a bat flight simulator in a cave : http://jerome.bousquie.fr/BJS/test/cave.html 2 dynamic terrains, one inverted
  10. 1 point

    Text as polygon mesh

    That shader code was stolen from the amazing CYOS (create your own shader) editor... https://cyos.babylonjs.com/ Default shader for CYOS. Ain't fake-chrome PRETTY? I used the ZIP option in CYOS, to insert that shader code into a giant string, and bring it home. Then I took the shader-code string and inserted it into a playground... for use in the BJS ShadersStore-method of storing shader code (which is the same method that the zip from CYOS uses). I think there are about 3-4 other ways to store shader code. One, is within files. Another... within an HTML script element, and also ShaderBuilder can store it in JS... in little pieces/values... and assemble/compile it at scene run-time or whenever needed. I THINK... a more-standard reflection-texture can be used instead-of a shader, and can look/act exactly the same chrome-like way... IF we correctly set the reflection-texture parameters, and maybe the texture's "coordinatesMode". But also... I think the "addressMode" used for texture wrapU, wrapV, and wrapR... is pertinent, too. In THIS effect, the reflection is mega-important. These advanced texture settings... aren't well-understood by noobs like me. We probably need a PBT (playground-based tutorial) to teach these advanced texture things. uv(w) offsets, scales, angs, wraps, and coordinatesModes... the big 5 "weird" texture knobs. Wraps and coordinatesModes... being the weirdest. Those 2 set which part of the texture to clamp (glue) to which part of the mesh, and which areas are allowed to stretch or compress, as best I know/can explain. The mesh's UVs are involved, too, if they are present. Yep, these meshWriter fonts/words/sentences... have a whole lot of reflection experiments that need to be performed/tested. Add-in another camera used to generate a renderTargetTexture (rtt)... put chrome words in front of it, and then use ITS texture on a different single-word mesh! OMG! For example... a child learning a word. The word sits in front of them... in big fat fonts... and in the reflection of the word's texture.... sentences are slowly scrolling-thru... showing the word properly used in example sentences. SO COOOOOOL! Further down the line... I believe .moveWithCollisions() works on letter shapes. Sooo... letters of a word... can bump into each other, and that can open-up a whole new world. AND... Jerome has basic SPS collisions already happening somewhat... without a physics engine (actually, with his own basic SPS physics engine). And there's scaling... making each letter of a word or word of a sentence... go squatty'n'wide, then tall'n'thin, back and forth, as it bounces along on the rolling plains. Nice. There's some serious (comedy) options for making text dance and sing, here. In a way, we are talking about meshWriter "behaviors" here, similar to camera behaviors. Or perhaps... array-of-mesh behaviors. For example... scale wide and squatty, then scale tall and thin, back and forth at some rate and some limits... is a "behavior" that can work on ANY array of mesh, not only a "group" of meshWriter characters or words. Many of @jerome's demented SPS experiments... could be considered SPS "behaviors", too, yes? It really depends upon how flexible we want to be... with the term/definition of a "behavior". So... we probably need to think about IF/NOT... meshWriter behaviors... and general array-of-mesh behaviors... are the same thing. Or... AT LEAST the two things might inherit from the same base class... should we decide to try array-of-mesh behaviors AT ALL. In a way, this is "advanced choreography", which will LIKELY involve the BJS animation system, AND might also apply to array-of-lights and to cameras, too. Scene.actionManager.choreographyManager ... v1.0 Not used too often for games, but instead... for shows and mesh parades.
  11. 1 point
    Groups in v3 don't work the same as in v2, they're not containers. If you call Group.setDepth it will (as the docs say) immediately set the depth value of each child. If it has no children, or a child is added after you call this (like in the code above), it won't make any difference.
  12. 1 point

    Plane tangent to a sphere

    Hi @ssaket, I needed to keep my latitude longitude approach but thanks to your suggestion, I managed to get the right formula: https://www.babylonjs-playground.com/#VDG184#9 Thanks, I didn't know about the alignWithNormal function but very useful! Cheerz
  13. 1 point
    @Deltakosh, thanks a lot for the tip. Seperating the leaves from the stems and setting different material attributes has given me the best of two worlds.
  14. 1 point
  15. 1 point
    The Leftover

    Text as polygon mesh

    Your Wingnut has now returned to an age-appropriate profile.
  16. 1 point
    The Leftover

    Text as polygon mesh

    Wingnut thanks for caring (heart heart heart). (I am working on being more emotive.) This must have emerged with the new release. It also appears in the playground of record, https://www.babylonjs-playground.com/#PL752W#1 Some sandpaper outa do it. Back soon.
  17. 1 point
    sprite.setData('anims', { down: 'alien:down' left: 'alien:left', right: 'alien:right', up: 'alien:up', });
  18. 1 point
    function update () { if (this.body.embedded) { this.body.touching.none = false; } if (body.touching.none && !this.body.wasTouching.none) { // Collision just ended } }
  19. 1 point

    glTF Validation Error

    @freetoplay @bghgary I just made an update to the 3ds Max Babylon exporter which now uses the KHR_lights_punctual extension and sets KHR_materials_unlit in extensionsUsed when exporting to glTF/glb
  20. 1 point

    BabylonCpp - A port of Babylon.js to C++

    Server-side physics calculations are necessary for multiplayer games to prevent cheating. Network lag - yes, but that's on a different layer than physics calculations; partly solvable with methods like prediction and correcting of wrong predictions. But that doesn't depend on the framework's language, you can implement server-side in Javascript or even Assembler and still have issues with the network lag that's just another task. I'm not very experienced in game frameworks, but most tutorials I see talk about taking a javascript engine, add node.js plus some magic and run in on a server-side, but I still believe javascript is not for the server-side for fast performance games like FPS. So somewhen you could say "hey, I have a C++ project which allows you to run thousands of simultaneous games on a single server".
  21. 1 point

    Screen fade/motion blur effect

    Received the book BabylonJs Essentials yesterday. Although some parts I already knew because I'm developing in BabylonJs already, no problem. There were still parts that I didn't know or didn't come about yet... so still useful. Plus the paperback book looks nice on my night cabinet. It's real 3D you know, real paper texture 🙂
  22. 1 point

    Quick poll

    I use https://preview.babylonjs.com/babylon.js but I'm still developing so production and testing is the same for me. 🙂 When I would decide to make a copy of the test of my game for real production/go live, then I'll probably stick to the most recent version at that time (so the code doesn't break on later updates).
  23. 1 point

    About updatePoseMatrix ()

    I have to create the function like that, I add all the sums and at the end they must be equal or different. Maybe we can do it differently, but like that, it works. I put my function here in case it interests someone. isPoseMatrixEqual(mesh) { let poseMatrix = 0; let computeMatrix = 0; for(let i = 0; i < mesh.getPoseMatrix().m.length; i++) { poseMatrix += Math.abs(mesh.getPoseMatrix().m[i]); } for(let i = 0; i < mesh.computeWorldMatrix().m.length; i++) { computeMatrix += Math.abs(mesh.computeWorldMatrix().m[i]); } if(poseMatrix === computeMatrix) return true; else return false; }
  24. 1 point

    BabylonJS Toolkit Problems

    You would use the SceneManager findSceneComponent function to find ANY component class on the specified OWER GAME OBJECT So for Example if i want t o get a reference to the BABYLON.AnimationState component that is on an OWNER GAME OBJECT let animator:BABYLON.AnimationState = this.manager.findSceneComponent("BABYLON.AnimationState", this.ownerMesh); If you are trying to get a reference to a component from a script that is ALSO on the same OWNER GAME OBJECT let animator:BABYLON.AnimationState = this.getComponent("BABYLON.AnimationState"); So to get a reference to Another Script Component on the SAME OWNER... Use this.getComponent... And to be to get a component from ANY game object use this.manager.findSceneComponent To Get Custom Script just use your for class name: let myComp = this.getComponent("PROJECT.MyScriptComponent"); myComp.ExampleMethodCall("blah"); Here is an example old ThirdPersonController script... Just take a look how i get references to OTHER Script Components protected ready() :void { // Setup animation state component this.animator = this.getComponent("BABYLON.AnimationState"); if (this.animator == null) { BABYLON.Tools.Warn("Failed to locate animation state for: " + this.mesh.name); } else { // Disable Auto-Ticking this.animator.autoTicking = false; } // Setup character controller component this.character = this.getComponent("BABYLON.CharacterController"); if (this.character == null) { BABYLON.Tools.Warn("Failed to locate character controller for: " + this.mesh.name); } else { this.baseFriction = this.character.getFriction(); this.frictionLevel = this.baseFriction; } } Complete ThirdPersonController Example Script: /* Babylon Mesh Component Template */ module BABYLON { export enum ThirdPersonLocomotion { Idle = 0, Walk = 1, Run = 2, Sprint = 3 } export enum ThirdPersonCameraShoulder { Right = 0, Left = 1 } export class ThirdPersonCameraSettings { public positionLeft:BABYLON.Vector3 = BABYLON.Vector3.Zero(); public positionRight:BABYLON.Vector3 = BABYLON.Vector3.Zero(); public lookXSensitivity:number = 2.5; public lookYSensitivity:number = 2.5; public minimumAngle:number = -30.0; public maximumAngle:number = 60.0; public rotationSpeed:number = 5.0; public fieldOfView:number = 70.0; public zoomFieldOfView:number = 30.0; public zooomSpeed:number = 3.0; public hideMeshDistance:number = 0.5; public movementLerpSpeed:number = 2.0; } export class ThirdPersonController extends BABYLON.MeshComponent { public movementVector:BABYLON.Vector3 = BABYLON.Vector3.Zero(); public runSpeed:number = 2.0; public walkSpeed:number = 1.0; public turnSpeed:number = 1.0; public jumpSpeed:number = 5.0; public sprintSpeed:number = 3.0; public enableInput:boolean = false; public rootMotion:boolean = false; public animator:BABYLON.AnimationState = null; public character:BABYLON.CharacterController = null; public cameraRig:BABYLON.AbstractMesh = null; public cameraPivot:BABYLON.AbstractMesh = null; public cameraSphere:BABYLON.AbstractMesh = null; public freeCamera:BABYLON.FreeCamera = null; public buttonJump:number = BABYLON.Xbox360Button.A; public keyboardJump:number = BABYLON.UserInputKey.SpaceBar; public buttonSprint:number = BABYLON.Xbox360Button.LeftStick; public keyboardSprint:number = BABYLON.UserInputKey.Shift; public buttonShoulder:number = BABYLON.Xbox360Button.Y; public keyboardShoulder:number = BABYLON.UserInputKey.Y; public baseFriction:number = 0.01; public frictionLevel:number = 0.0; public wheelInput:number = 0.0; public mouseXInput:number = 0.0; public mouseYInput:number = 0.0; public verticalInput:number = 0.0; public horizontalInput:number = 0.0; public cameraSettings:BABYLON.ThirdPersonCameraSettings = null; //public currentVelocity:BABYLON.Vector3 = BABYLON.Vector3.Zero(); //public currentDirection:BABYLON.ThirdPersonDirection = BABYLON.ThirdPersonDirection.Stationary; //public jumpingDirection:BABYLON.ThirdPersonDirection = BABYLON.ThirdPersonDirection.Stationary; public locomotionState:BABYLON.ThirdPersonLocomotion = BABYLON.ThirdPersonLocomotion.Idle; public locomotionSpeed:number = 0.0; private _meshRotator:BABYLON.MeshRotator = null; private _cameraRotation:BABYLON.Quaternion = BABYLON.Quaternion.Zero(); private _cameraRotationX:number = 0.0; private _cameraRotationY:number = 0.0; private _autoActivateCamera:boolean = false; private _isCharacterJumping:boolean = false; private _isCharacterFalling:boolean = false; private _isCharacterSliding:boolean = false; private _isCharacterGrounded:boolean = false; private _isCharacterCrouched:boolean = false; private _isCharacterJumpFrame:boolean = false; private _inputMoveSpeed:number = 0.0; private _inputMoveVector:BABYLON.Vector3 = BABYLON.Vector3.Zero(); private _meshEulerAngles:BABYLON.Vector3 = BABYLON.Vector3.Zero(); private _pivotEulerAngles:BABYLON.Vector3 = BABYLON.Vector3.Zero(); private _cameraDestination:BABYLON.Vector3 = BABYLON.Vector3.Zero(); private _followCameraOffset:BABYLON.Vector3 = BABYLON.Vector3.Zero(); private _followCameraShoulder:BABYLON.ThirdPersonCameraShoulder = BABYLON.ThirdPersonCameraShoulder.Right; public constructor(owner: BABYLON.AbstractMesh, scene: BABYLON.Scene, tick: boolean = true, propertyBag: any = {}) { super(owner, scene, tick, propertyBag); this._meshRotator = new BABYLON.MeshRotator(this.mesh); this._autoActivateCamera = this.getProperty("activateCamera", false); this.enableInput = this.getProperty("enableInput", false); this.rootMotion = this.getProperty("rootMotion", false); this.cameraSettings = new BABYLON.ThirdPersonCameraSettings(); // Built-In Follow Camera Options var cameraOptions:any = this.getProperty("cameraOptions") if (cameraOptions != null) { this.cameraSettings.lookXSensitivity = cameraOptions.lookXSensitivity; this.cameraSettings.lookYSensitivity = cameraOptions.lookYSensitivity; this.cameraSettings.minimumAngle = cameraOptions.minimumAngle; this.cameraSettings.maximumAngle = cameraOptions.maximumAngle; this.cameraSettings.rotationSpeed = cameraOptions.rotationSpeed; this.cameraSettings.fieldOfView = cameraOptions.fieldOfView; this.cameraSettings.zoomFieldOfView = cameraOptions.zoomFieldOfView; this.cameraSettings.zooomSpeed = cameraOptions.zooomSpeed; this.cameraSettings.hideMeshDistance = cameraOptions.hideMeshDistance; this.cameraSettings.movementLerpSpeed = cameraOptions.movementLerpSpeed; } // Built-In Follow Camera Position var cameraPosition:any = this.getProperty("cameraPosition") this.cameraSettings.positionRight = BABYLON.Utilities.ParseVector3(cameraPosition, new BABYLON.Vector3(0.75, 1.0, -2.5)); this.cameraSettings.positionLeft = new BABYLON.Vector3(-this.cameraSettings.positionRight.y, this.cameraSettings.positionRight.y, this.cameraSettings.positionRight.z); // Built-In Motor Options Support var motorProperties:any = this.getProperty("motorProperties") if (motorProperties != null) { this.runSpeed = motorProperties.runSpeed; this.walkSpeed = motorProperties.walkSpeed; this.turnSpeed = motorProperties.turnSpeed; this.jumpSpeed = motorProperties.jumpSpeed; this.sprintSpeed = motorProperties.sprintSpeed; } } protected ready() :void { // Setup animation state component this.animator = this.getComponent("BABYLON.AnimationState"); if (this.animator == null) { BABYLON.Tools.Warn("Failed to locate animation state for: " + this.mesh.name); } else { // Disable Auto-Ticking this.animator.autoTicking = false; } // Setup character conntroller component this.character = this.getComponent("BABYLON.CharacterController"); if (this.character == null) { BABYLON.Tools.Warn("Failed to locate character controller for: " + this.mesh.name); } else { this.baseFriction = this.character.getFriction(); this.frictionLevel = this.baseFriction; } // Setup character quaternion rotations if (this.mesh.rotationQuaternion == null) this.mesh.rotationQuaternion = BABYLON.Utilities.Euler(this.mesh.rotation.x, this.mesh.rotation.y, this.mesh.rotation.z); // Setup character controller camera rig this.cameraRig = new BABYLON.Mesh(this.mesh + "CameraRig", this.scene); this.cameraRig.position = this.mesh.position.clone(); if (this.cameraRig.rotationQuaternion == null) this.cameraRig.rotationQuaternion = BABYLON.Utilities.Euler(this.cameraRig.rotation.x, this.cameraRig.rotation.y, this.cameraRig.rotation.z); this._followCameraOffset = this.mesh.position.subtract(this.cameraRig.position); // Setup character controller camera pivot this.cameraPivot = new BABYLON.Mesh(this.mesh + "CameraPivot", this.scene, this.cameraRig); this.cameraPivot.position = BABYLON.Vector3.Zero(); if (this.cameraPivot.rotationQuaternion == null) this.cameraPivot.rotationQuaternion = BABYLON.Utilities.Euler(this.cameraPivot.rotation.x, this.cameraPivot.rotation.y, this.cameraPivot.rotation.z); // Setup third person free camera and sphere this.freeCamera = new BABYLON.FreeCamera(this.mesh + "FreeCamera", BABYLON.Vector3.Zero(), this.scene); this.freeCamera.position.copyFrom(this.cameraSettings.positionRight); this.freeCamera.rotationQuaternion = BABYLON.Quaternion.Zero(); this.freeCamera.parent = this.cameraPivot; this.cameraSphere = BABYLON.Mesh.CreateSphere(this.mesh + "CameraSphere", 12, 0.5, this.scene); this.cameraSphere.position = BABYLON.Vector3.Zero(); this.cameraSphere.isVisible = false; // DEBUG SETTING this.cameraSphere.visibility = 0.0 // DEBUG SETTING this.cameraSphere.parent = this.freeCamera; if (this._autoActivateCamera === true) this.scene.activeCamera = this.freeCamera; } protected update() :void { // Tick character controller this.updateCameraRotations(); this.updateCameraPositions(); this.updateCharacterMovement(); //console.log("Grounded: " + this._isCharacterGrounded.toString(), " -> Jumping: " + this._isCharacterJumping.toString(), " -> Falling: " + this._isCharacterFalling.toString() + " -> Sliding: " + this._isCharacterSliding.toString()); } protected after():void { // Process Locomotion Input this.frictionLevel = this.baseFriction; if (this.character == null) return; this._isCharacterJumping = this.character.isJumping(); this._isCharacterFalling = this.character.isFalling(); this._isCharacterSliding = this.character.isSliding(); this._isCharacterGrounded = this.character.isGrounded(); this._isCharacterCrouched = false; this._isCharacterJumpFrame = false; if (this.enableInput === true) { this.wheelInput = this.manager.getUserInput(BABYLON.UserInputAxis.Wheel); this.mouseXInput = this.manager.getUserInput(BABYLON.UserInputAxis.MouseX); this.mouseYInput = this.manager.getUserInput(BABYLON.UserInputAxis.MouseY); this.verticalInput = this.manager.getUserInput(BABYLON.UserInputAxis.Vertical); this.horizontalInput = this.manager.getUserInput(BABYLON.UserInputAxis.Horizontal); // Pseudo normalize dead zone input values var deadZone:number = BABYLON.UserInputOptions.GamepadDeadStickValue; if (this.horizontalInput >= -deadZone && this.horizontalInput <= deadZone) this.horizontalInput = 0.0; if (this.verticalInput >= -deadZone && this.verticalInput <= deadZone) this.verticalInput = 0.0; // Update diagonal movement scaling factor this._inputMoveVector.copyFromFloats(this.horizontalInput, 0.0, this.verticalInput); if (this._inputMoveVector.x !== 0.0 && this._inputMoveVector.z !== 0.0) { this._inputMoveVector.scaleInPlace(BABYLON.Constants.DiagonalSpeed); } // Update user input movement speed vector this._inputMoveSpeed = this._inputMoveVector.length(); if (this._inputMoveSpeed > 1.0) { BABYLON.Vector3.NormalizeToRef(this._inputMoveVector, this._inputMoveVector); this._inputMoveSpeed = this._inputMoveVector.length(); } // Update grounded locomotion movement states if (this._inputMoveVector.x || this._inputMoveVector.z) this.frictionLevel = 0.0; if (this._isCharacterGrounded === true) { var sprinting:boolean = (this.manager.getKeyboardInput(this.keyboardSprint) || this.manager.getGamepadButtonInput(this.buttonSprint)) if (this._inputMoveSpeed > 0.5) { this.locomotionState = (sprinting === true) ? BABYLON.ThirdPersonLocomotion.Sprint : BABYLON.ThirdPersonLocomotion.Run; } else if (this._inputMoveSpeed > 0.0) { this.locomotionState = BABYLON.ThirdPersonLocomotion.Walk; } else { this.locomotionState = BABYLON.ThirdPersonLocomotion.Idle; } this.locomotionSpeed = this.getLocomotionSpeed(); //var forward = BABYLON.Utilities.GetForwardVector(this.mesh); //var right = BABYLON.Utilities.GetRightVector(this.mesh); //var move = forward.scale(this._inputMoveVector.z).add(right.scale(this._inputMoveVector.x)); //this.movementVector.x = move.x; //this.movementVector.y = 0.0; //this.movementVector.z = move.z; // Update user input movement properties this.movementVector.x = this._inputMoveVector.x; this.movementVector.y = 0.0; this.movementVector.z = this._inputMoveVector.z; BABYLON.Utilities.TransformDirectionToRef(this.mesh, this.movementVector, this.movementVector); this.movementVector.scaleInPlace(this.locomotionSpeed); // Update user input jumping frame state this._isCharacterJumpFrame = (this.manager.getKeyboardInput(this.keyboardJump) || this.manager.getGamepadButtonInput(this.buttonJump)); if (this._isCharacterJumpFrame === true) { //this.jumpingDirection = this.currentDirection; } } } } protected destroy() :void { // Destroy character controller this.cameraSphere.dispose(); this.cameraSphere = null; this.cameraPivot.dispose(); this.cameraPivot = null; this.cameraRig.dispose(); this.cameraRig = null; this.freeCamera.dispose(); this.freeCamera = null; this.animator = null; this.character = null; } /* Private Character Controller Helper Functions */ private getLocomotionSpeed():number { var speed:number = 0.0; if (this.rootMotion === true) { var rootSpeed:number = 1.0; speed = rootSpeed * this._inputMoveSpeed; } else { switch (this.locomotionState) { case BABYLON.ThirdPersonLocomotion.Idle: speed = 0.0; break; case BABYLON.ThirdPersonLocomotion.Walk: speed = this.walkSpeed; break; case BABYLON.ThirdPersonLocomotion.Run: speed = this.runSpeed; break; case BABYLON.ThirdPersonLocomotion.Sprint: speed = this.sprintSpeed; break; } } return speed; } private updateCameraRotations():void { var deltaTime:number = this.manager.deltaTime; // Update camera left/right this._cameraRotationX += this.cameraSettings.lookXSensitivity * this.mouseXInput; this._cameraRotationX = BABYLON.Scalar.Repeat(this._cameraRotationX, 360); // Update camera up/down this._cameraRotationY += this.cameraSettings.lookYSensitivity * this.mouseYInput; this._cameraRotationY = BABYLON.Scalar.Clamp(this._cameraRotationY, this.cameraSettings.minimumAngle, this.cameraSettings.maximumAngle); // Update camera rotations BABYLON.Utilities.EulerToRef((this._cameraRotationY * BABYLON.Constants.Deg2Rad), (this._cameraRotationX * BABYLON.Constants.Deg2Rad), 0.0, this._cameraRotation); BABYLON.Quaternion.SlerpToRef(this.cameraPivot.rotationQuaternion, this._cameraRotation, this.cameraSettings.rotationSpeed * deltaTime, this.cameraPivot.rotationQuaternion); } private updateCameraPositions():void { var deltaTime:number = this.manager.deltaTime; // Updaye camera rig this.mesh.position.subtractToRef(this._followCameraOffset, this._cameraDestination); this.cameraRig.position.copyFrom(this._cameraDestination); //BABYLON.Vector3.LerpToRef(this.cameraRig.position, this._cameraDestination, (this.cameraSettings.movementLerpSpeed * deltaTime), this.cameraRig.position); // Updaye free camera var hit:boolean = false; // TODO: Dummy no hit if (this.cameraRig == null) { hit = true; } if (hit === true) { // Move Camera In Closer To Player } else { // Position free camera to current sholder if (this._followCameraShoulder === BABYLON.ThirdPersonCameraShoulder.Left) { BABYLON.Vector3.LerpToRef(this.freeCamera.position, this.cameraSettings.positionLeft, (this.cameraSettings.movementLerpSpeed * deltaTime), this.freeCamera.position); } else { BABYLON.Vector3.LerpToRef(this.freeCamera.position, this.cameraSettings.positionRight, (this.cameraSettings.movementLerpSpeed * deltaTime), this.freeCamera.position); } } } private updateCharacterMovement():void { // Update character rotation if (this.movementVector.x !== 0.0 || this.movementVector.z !== 0.0) { //this.mesh.rotationQuaternion.toEulerAnglesToRef(this._meshEulerAngles); //this.cameraPivot.rotationQuaternion.toEulerAnglesToRef(this._pivotEulerAngles); //BABYLON.Utilities.EulerToRef(this._meshEulerAngles.x, this._pivotEulerAngles.y, this._meshEulerAngles.z, this.mesh.rotationQuaternion); //var dir = new BABYLON.Vector3(-this.horizontalInput, 0, -this.verticalInput); //var pos = this.mesh.position.add(dir); //this._meshRotator.lookAtPosition(pos); } // Update character movement if (this.character != null) { //this.currentVelocity = this.character.getVelocity(); //this.movementVector.y = this.currentVelocity.y; this.character.move(this.movementVector, this.frictionLevel, ((this._isCharacterJumpFrame === true) ? this.jumpSpeed : 0.0)); } // Update character animation if (this.animator != null) { this.animator.setFloat("Locomotion", this.locomotionState as number); //this.animator.setFloat("Jumping", this.jumpingState as number); this.animator.setFloat("Forward", this._inputMoveVector.z); this.animator.setFloat("Turn", this._inputMoveVector.x); this.animator.setFloat("Speed", this._inputMoveSpeed); this.animator.setBool("isJumping", this._isCharacterJumping); this.animator.setBool("isFalling", this._isCharacterFalling); this.animator.setBool("isSliding", this._isCharacterSliding); this.animator.setBool("isCrouched", this._isCharacterCrouched); this.animator.setBool("isGrounded", this._isCharacterGrounded); if (this._isCharacterJumpFrame === true) { this.animator.setTrigger("Jump"); } // Note: Manually Ticking Anims this.animator.tickStateMachine(); } } } } Hope that helps you get going
  25. 1 point
    Well we have a set of tools to help in this situation: https://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered#things-to-do-and-not-to-do Technically, you can separate the leaves and make them transparent with a predepth pass. This way you could get both: correct z-sorting (prepass) + good AA
  26. 1 point

    SPS particles animation

    Jerome beat me to it. This one uses the box's horizontal position to determine the height fluctuation http://playground.babylonjs.com/indexStable.html#EFRPL2#5
  27. 1 point

    SPS particles animation

  28. 1 point
    I had a little play around, and this is how I guess it works. Collisions are done in order of collisionGroup. Box1 is in collisionGroup 1, so it's collision executes first on collision (before collisionGroup2). Now: If in the first collide() function, you move the body back outside the collision, when it's now turn for collisionGroup 2 to look for collisions, it no longer exists anymore. Does that make sense? You can change Box1 to collitionGroup 3, and you'll see that it's now Box2's text that shows up as it's now the 'first collision' in order. To stop this: You can make sure you don't move outside of the collision. So in Box1: collide event: Return false instead of true. collide: function(body) { if (body.collisionGroup === 2) { game.scene.Box1Text.text = 'Box1 is connect'; } return false; //return false. }, Panda docs say: ..whatever hit response is. I think it just means it will handle the collision by moving the bodies outside of each other. You may not want this. So alternatively, you can do something like this: collide: function(body) { if (body.collisionGroup === 2) { game.scene.Box1Text.text = 'Box1 is connect'; body.collide(this.body); } return true; }, Now: You still return true (so the bodies will move outside each other) but now you're manually calling the collision function on the other object.
  29. 1 point

    GLTF Extras

    There is no direct access from the mesh, you could nevertheless acces it through the gltf data available in a callback I ll make a playground as soon as i reach back home.
  30. 1 point
    I didn't get a chance to play around with code to look at this, so I can only give a few suggestions on a few things to try. I think these link should be helpful: (This one says that you need an html <input> tag to show the keybard. https://stackoverflow.com/questions/6837543/show-virtual-keyboard-on-mobile-phones-in-javascript (general html for showing/hiding getting input) https://stackoverflow.com/questions/21499402/how-to-use-a-textbox-with-html5-canvas-and-hide-it-when-not-needed And this link has the html5 markup for making the input a number only keyboard. e.g. <input type="number" pattern="[0-9]*"> Hope this helps get you going. I don't think there is a built-in Panda feature for this, so you'll have to add your own html to index.html, and write a few functions to help you out. Good luck!
  31. 1 point
    https://github.com/jsfehler/phaser-ui-tools This is something I worked on a few months ago to refine my javascript knowledge and eventually my ES6 knowledge. It came about after I realized I kept needing some of the same things in my Phaser projects. It contains the following classes to make building a UI in Phaser easier: - TextSprite - TextButton - Column - Row - Viewport - Scrollbar - Valuebar - Quantitybar - Wheel3D For many projects, it may make more sense to build the UI in HTML and overlay it. I'm not making an argument for that one way or another. These classes satisfied my use cases, and I hope someone else finds them useful. Phaser UI Tools is available under the MIT license, so feel free to use any parts of the code in your own projects in whatever way you'd like. However, if you do anything that improves or adds to what's here, I'd always appreciate a Pull Request. I consider this project relatively complete, so I won't be building any completely new features in the future, but I'll answer any questions and try fo fix any bugs that are reported.
  32. 1 point
    Buttons have useHandCursor=true by default, that's why it shows on https://samme.github.io/phaser-examples-mirror/buttons/disable button on click.html.
  33. 1 point

    Custom Builds?

    For anyone else coming to this, there is now a proper tutorial on how to do this. You can find it here.
  34. 1 point
    Hi SoulBeaver, I encountered this error also a few weeks ago. The simple fix for me was to make sure that no tiles in Tiled used 'rotation'. Phaser doesn't seem to recognize rotation in Tiled. It's best to create a new rotated file and add it to the tile set.