Vector based camera. Weird yaw.
authorEugen Sawin <sawine@me73.com>
Thu, 21 Apr 2011 03:12:51 +0200
changeset 1915d61d76daa1
parent 18 92eb274bc564
child 20 46b2839f6f50
Vector based camera. Weird yaw.
scripts/machine.js
     1.1 --- a/scripts/machine.js	Mon Apr 18 15:30:47 2011 +0200
     1.2 +++ b/scripts/machine.js	Thu Apr 21 03:12:51 2011 +0200
     1.3 @@ -2,7 +2,7 @@
     1.4  var renderer;
     1.5  var controller;
     1.6  var camera;
     1.7 -var cameraSpeed = {"x": 0.1, "y": 0.1, "z": 0.5, "pitch": 0.5, "yaw": 0.5};
     1.8 +var cameraSpeed = {"h": 0.1, "v": 0.1, "zoom": 0.5, "pitch": 0.5, "yaw": 0.5};
     1.9  var keyActionMap = {'A': moveCameraLeft,
    1.10  		 'D': moveCameraRight,
    1.11  		 'W': moveCameraUp,
    1.12 @@ -57,72 +57,80 @@
    1.13  
    1.14  function Camera(speed)
    1.15  {
    1.16 -    this.x = 0.0;
    1.17 -    this.y = 0.0;
    1.18 -    this.z = 7.0;
    1.19 -    this.pitch = 0.0;
    1.20 -    this.yaw = 0.0;
    1.21      this.speed = speed;
    1.22 -    this.rotMatrix = mat4.create();
    1.23 -    this.transMatrix = mat4.create();
    1.24 +    this.pos = vec3.create([0, 0, 7]);
    1.25 +    this.up = vec3.create([0, 1, 0]);
    1.26 +    this.right = vec3.create([1, 0, 0]);
    1.27 +    this.target = vec3.create([0, 0, 1]);
    1.28      this.matrix = mat4.create();
    1.29 -    mat4.identity(this.rotMatrix);
    1.30 -    mat4.identity(this.transMatrix);
    1.31 -    mat4.identity(this.matrix);
    1.32  }
    1.33  Camera.prototype.moveLeft = function()
    1.34  {
    1.35 -    var d = 1 - Math.sin(this.yaw);
    1.36 -    this.x -= d * this.speed.x;
    1.37 -    this.z += (1 - d) * this.speed.z;
    1.38 +    var dir = vec3.create(this.right);
    1.39 +    vec3.scale(dir, -this.speed.h);
    1.40 +    vec3.add(this.pos, dir);
    1.41  }
    1.42  Camera.prototype.moveRight = function()
    1.43  {
    1.44 -    var d = 1 - Math.sin(this.yaw);
    1.45 -    this.x += d * this.speed.x;
    1.46 -    this.z -= (1 - d) * this.speed.z;
    1.47 +    var dir = vec3.create(this.right);
    1.48 +    vec3.scale(dir, this.speed.h);
    1.49 +    vec3.add(this.pos, dir);
    1.50  }
    1.51  Camera.prototype.moveUp = function()
    1.52 -{
    1.53 -    this.y += this.speed.y;
    1.54 +{  
    1.55 +    var dir = vec3.create(this.up);
    1.56 +    vec3.scale(dir, this.speed.v);
    1.57 +    vec3.add(this.pos, dir);
    1.58  }
    1.59  Camera.prototype.moveDown = function()
    1.60 -{
    1.61 -    this.y -= this.speed.y;
    1.62 +{ 
    1.63 +    var dir = vec3.create(this.up);
    1.64 +    vec3.scale(dir, -this.speed.v);
    1.65 +    vec3.add(this.pos, dir);
    1.66  }
    1.67  Camera.prototype.zoom = function(delta) 
    1.68  {
    1.69 -    this.x -= Math.sin(this.yaw) * this.speed.x * delta;
    1.70 -    this.y -= Math.sin(this.pitch) * this.speed.y * delta;
    1.71 -    this.z -= Math.cos(this.yaw) * Math.cos(this.pitch) * this.speed.z * delta;
    1.72 +    var dir = vec3.create(this.target);
    1.73 +    vec3.scale(dir, -delta * this.speed.zoom);
    1.74 +    vec3.add(this.pos, dir); 
    1.75  }
    1.76 -Camera.prototype.changePitch = function(delta)
    1.77 +Camera.prototype.pitch = function(delta)
    1.78  {
    1.79 -    this.pitch += this.speed.pitch * delta;
    1.80 +   
    1.81  }
    1.82 -Camera.prototype.changeYaw = function(delta)
    1.83 +Camera.prototype.yaw = function(delta)
    1.84  {
    1.85 -    this.yaw += this.speed.yaw * delta;
    1.86 +    delta *= this.speed.yaw;
    1.87 +    var right = vec3.create(this.right);
    1.88 +    vec3.scale(right, Math.cos(delta));
    1.89 +    var target = vec3.create(this.target);
    1.90 +    vec3.scale(target, Math.sin(delta));
    1.91 +    vec3.add(right, target);
    1.92 +    vec3.normalize(right);
    1.93 +    this.right = right;
    1.94 +    vec3.cross(this.right, this.up, target);
    1.95 +    this.target = target;
    1.96 +    vec3.normalize(this.target);
    1.97 +}
    1.98 +Camera.prototype.roll = function(delta)
    1.99 +{
   1.100 +    
   1.101  }
   1.102  Camera.prototype.update = function()
   1.103  {
   1.104 -    //mat4.rotate(this.rotMatrix, -this.pitch, [1, 0, 0]);
   1.105 -    //mat4.rotate(this.rotMatrix, -this.yaw, [0, 1, 0]);
   1.106 -    //mat4.translate(this.transMatrix, [-this.x, -this.y, -this.z]);
   1.107 -    mat4.translate(this.matrix, [-this.x, -this.y, -this.z]);
   1.108 -    //mat4.rotate(this.matrix, -this.pitch, [1, 0, 0]);
   1.109 -    //mat4.rotate(this.matrix, -this.yaw, [0, 1, 0]);
   1.110 +    var x = vec3.dot(this.right, this.pos);
   1.111 +    var y = vec3.dot(this.up, this.pos);
   1.112 +    var z = vec3.dot(this.target, this.pos);
   1.113 +    this.matrix = mat4.create([this.right[0], this.up[0], -this.target[0], 0,
   1.114 +			       this.right[1], this.up[1], -this.target[1], 0,
   1.115 +			       this.right[2], this.up[2], -this.target[2], 0,
   1.116 +			       -x, -y, -z, 1]);
   1.117      
   1.118 -    
   1.119 -    this.clear();
   1.120 -    //mat4.rotate(mvMatrix, -camera.pitch, [1, 0, 0]);
   1.121 -    //mat4.rotate(mvMatrix, -camera.yaw, [0, 1, 0]);
   1.122 -    //mat4.translate(mvMatrix, [-camera.x, -camera.y, -camera.z]);
   1.123  }
   1.124  Camera.prototype.clear = function()
   1.125  {
   1.126      //this.x = this.y = this.z = 0;
   1.127 -   //this.pitch = this.yaw = 0;
   1.128 +    //this.pitch = this.yaw = 0;
   1.129  }
   1.130  
   1.131  function Controller(keyActionMap, mouseActionMap, camera, machine, renderer)
   1.132 @@ -257,11 +265,13 @@
   1.133      mat4.perspective(45, viewport.width / viewport.height, 0.1, 100.0, pMatrix);
   1.134  
   1.135      mat4.identity(mvMatrix);
   1.136 +    mat4.multiply(mvMatrix, camera.matrix);
   1.137      //mat4.multiply(mvMatrix, camera.rotMatrix);
   1.138      //mat4.multiply(mvMatrix, camera.transMatrix);
   1.139 -    mat4.rotate(mvMatrix, -camera.pitch, [1, 0, 0]);
   1.140 -    mat4.rotate(mvMatrix, -camera.yaw, [0, 1, 0]);
   1.141 -    mat4.translate(mvMatrix, [-camera.x, -camera.y, -camera.z]);
   1.142 +    //mat4.rotate(mvMatrix, -camera.pitch, [1, 0, 0]);
   1.143 +    //mat4.rotate(mvMatrix, -camera.yaw, [0, 1, 0]);
   1.144 +    
   1.145 +    //mat4.translate(mvMatrix, [-camera.pos[0], -camera.pos[1], -camera.pos[2]]);
   1.146      //mat4.multiply(mvMatrix, camera.matrix);
   1.147      //mat4.rotate(camera.matrix, -camera.pitch, [1, 0, 0]);
   1.148      //mat4.rotate(camera.matrix, -camera.yaw, [0, 1, 0]);
   1.149 @@ -541,12 +551,12 @@
   1.150  
   1.151  function pitchCamera(delta)
   1.152  {
   1.153 -    camera.changePitch(delta);
   1.154 +    camera.pitch(delta);
   1.155  }
   1.156  
   1.157  function yawCamera(delta)
   1.158  {
   1.159 -    camera.changeYaw(delta);
   1.160 +    camera.yaw(delta);
   1.161  }
   1.162  
   1.163  function handleKeyDown(event)