Search the Community

I cant solve this problem: What i want to do is to create an FSP camera attached to a character and move character + camera with mouse ad keys. PS: I already read all similar posts but nothing really useful. Details (my thoughts): 1) Lock mouse in browser (v) 2) move camera with mouse: Works with free camera, if i parent mesh to camera, but in this way mesh moves not in regular way and i cant apply gravity, etc... I assume i should use FollowCamera, but in this way i cant move it with mouse anymore Maybe i will need create a new type of camera? (Becouse the idea is that the camera should be attached to mesh in some point and should be movable by mouse) 3) Mesh should move forward/backward/left/right accordingly to camera direction 4)If you need, here you are my stupid code: function CharacterController(character, scene){ //keys variables var forwardKey; var backwardKey; var leftwardKey; var rightwardKey; //settings var inAir = true; var speed = 5; var jumpHeight = 300; var runSpeed; var crouchSpeed; //gravity settings var mass; var friction; var restitution; //var controller; var camera; /*LOCAL FUNCTIONS*/ //create new following camera /*var attachCamera = function(target){ //create following camera var camera = new BABYLON.FollowCamera("FollowCam", new BABYLON.Vector3(5, 50, 45), scene); camera.target = target; // target any mesh or object with a "position" Vector3 camera.radius = 15; // how far from the object to follow camera.heightOffset = 8; // how high above the object to place the camera camera.rotationOffset = 180; // the viewing angle camera.cameraAcceleration = 0.05 // how fast to move camera.maxCameraSpeed = 20 // speed limit scene.activeCamera = camera; return camera; };*/ var attachCamera = function() { var cam = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(0, 5, -10), scene); cam.attachControl(scene.getEngine().getRenderingCanvas()); // Remap keys to move with ZQSD cam.keysUp = [87]; // W cam.keysDown = [83]; // S cam.keysLeft = [65]; // A cam.keysRight = [68]; // D cam.speed = 1; cam.inertia = 0.5; cam.angularSensibility = 1000; scene.activeCamera = cam; return cam; } //create custom physic settings for character var setCustomPhysicsState = function(newMass, newFriction, newRestitution){ character.setPhysicsState(BABYLON.PhysicsEngine.SphereImpostor, { mass: newMass, friction: newFriction, restitution: newRestitution }); }; //manage inputs var initPlayerActions = function(){ var forward = false; var turnLeft = false; var turnRight = false; scene.actionManager = new BABYLON.ActionManager(scene); scene.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnKeyDownTrigger, function (evt) { switch(evt.sourceEvent.keyCode){ //space button case 32: //character.jump(); break; //w button case 87: forward = true; break; //a button case 65: turnLeft = true; break; //d button case 68: turnRight = true; break; //s button case 83: //character.moveBackward(); break; } })); scene.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnKeyUpTrigger, function (evt) { switch(evt.sourceEvent.keyCode){ //space button case 32: //character.jump(); break; //w button case 87: forward = false; break; //a button case 65: turnLeft = false; break; //d button case 68: turnRight = false; break; //s button case 83: //character.moveBackward(); break; } })); scene.registerBeforeRender(function () { if(forward){ //player.position.z += 0.1; /*var forwards = new BABYLON.Vector3(parseFloat(Math.sin(player.rotation.y)) / speed, 0, parseFloat(Math.cos(player.rotation.y)) / speed); forwards.negate(); player.moveWithCollisions(forwards);*/ var posX = Math.sin(character.rotation.y) / speed; var posZ = Math.cos(character.rotation.y) / speed; //console.log(posX, posZ); character.position.x += posX; character.position.z += posZ; } if (turnLeft){ character.rotation.y += 0.1; } if (turnRight){ character.rotation.y -= 0.1 } }); }; var LockMousePointer = function() { // Request pointer lock var canvas = scene.getEngine().getRenderingCanvas(); // On click event, request pointer lock canvas.addEventListener("click", function(evt) { canvas.requestPointerLock = canvas.requestPointerLock || canvas.msRequestPointerLock || canvas.mozRequestPointerLock || canvas.webkitRequestPointerLock; if (canvas.requestPointerLock) { canvas.requestPointerLock(); } }, false); // Event listener when the pointerlock is updated (or removed by pressing ESC for example). var pointerlockchange = function (event) { controlEnabled = ( document.mozPointerLockElement === canvas || document.webkitPointerLockElement === canvas || document.msPointerLockElement === canvas || document.pointerLockElement === canvas); // If the user is alreday locked if (!controlEnabled) { camera.detachControl(canvas); } else { camera.attachControl(canvas); } }; // Attach events to the document document.addEventListener("pointerlockchange", pointerlockchange, false); document.addEventListener("mspointerlockchange", pointerlockchange, false); document.addEventListener("mozpointerlockchange", pointerlockchange, false); document.addEventListener("webkitpointerlockchange", pointerlockchange, false); } /*window.addEventListener("mousemove", function () { // We try to pick an object var pickResult = scene.pick(scene.pointerX, scene.pointerY); camera.rotationOffset += scene.pointerX/1000; console.log(scene.pointerX); //console.log(scene.pointerY); });*/ /*END LOCAL FUNCTIONS*/ var init = function(){ mass = 10; friction = 50; restitution = 0; LockMousePointer(); camera = attachCamera(character); character.position.z = 10; character.parent = camera; setCustomPhysicsState(mass, friction, restitution); //initPlayerActions(); }; init(); }