0
\$\begingroup\$

I've been reading Timothy Wright's "Fundamental 2D Game Programming With Java". I'm trying to apply its principles to a Lunar Lander game - it's a JSFiddle for now, and can be found here.

The problem is with the collision function. It never returns true. I don't actually understand how it works, I just ported it from Java to JavaScript. It would be nice if someone could enlighten me. (I'm bad at math...)

The ship is just a 14x14 rectangle (with an antenna on top :) ). It is translated with a translation matrix according to the changing velocity.

function collision() {
  for(var i = 1; i < map.length; i++) {
    var largestMin = -Number.MAX_VALUE;
    var smallestMax = Number.MAX_VALUE;
    var start = new VectorPoint((i - 1) * 20, map[i-1]);
    var end = new VectorPoint(i * 20, map[i]);
    var d = VectorFunctions.sub(end, start);
    var len = VectorFunctions.len(d);
    d = VectorFunctions.norm(d);
    for(var j = 0; j < 2; j++) {
      var n = VectorFunctions.sub(shipCopy.body[j], shipCopy.body[j + 1]);
      n = VectorFunctions.norm(n);
      var sub1 = VectorFunctions.sub(shipCopy.body[j], start);
      var sub2 = VectorFunctions.sub(shipCopy.body[j+1], start);
      var e0 = VectorFunctions.dot(n, sub1);
      var e1 = VectorFunctions.dot(n, sub2);
      var f = VectorFunctions.dot(n, d);
      if(Math.abs(f) > EPSILON) {
        var t0 = e0 / f;
        var t1 = e1 / f;
        if(t0 > t1) {
          var swap = t0;
          t0 = t1;
          t1 = swap;
        }
        largestMin = Math.max(largestMin, t0);
        smallestMax = Math.min(smallestMax, t1);
        console.log(largestMin + ", " + smallestMax);
        if(largestMin > smallestMax) {
          return false;
        }
        if(smallestMax < 0) {
          return false;
        }
      }
      else if(e0 * e1 > 0) {
        return false;
      }
    }
  }
  var t = t0 > 0 ? t0 : t1;
  return true;
}

The VectorFunctions namespace is defined as follows:

var VectorFunctions = {
  // v1: VectorPoint
  // v2: VectorPoint
  add: function(v1, v2) {
    return new VectorPoint(v1.x + v2.x, v1.y + v2.y);
  },
  // v1: VectorPoint
  // v2: VectorPoint
  sub: function(v1, v2) {
    return new VectorPoint(v1.x - v2.x, v1.y - v2.y);
  },
  // v: VectorPoint
  // n: number
  div: function(v, n) {
    return new VectorPoint(v.x * n, v.y * n);
  },
  // v: VectorPoint
  len: function(v) {
    return Math.sqrt(v.x * v.x + v.y * v.y);
  },
  // v: VectorPoint
  norm: function(v) {
    return VectorFunctions.div(v, VectorFunctions.len(v));
  },
  // v1: VectorPoint
  // v2: VectorPoint
  dot: function(v1, v2) {
    return v1.x * v2.x + v1.y * v2.y;
  },
  // x: number, y: number, w: number
  vectorW: function(x, y, w) {
    var v = new VectorPoint(x, y);
    v.w = w;
    return v;
  }
};

The VectorPoint class is here...

// x: number
// y: number
function VectorPoint(x, y) {
  this.x = x;
  this.y = y;
  this.w = 1;
};
\$\endgroup\$

1 Answer 1

0
\$\begingroup\$

Same as your other question

Line rect intersection - lines behave like rays

  // v: VectorPoint
  // n: number
  div: function(v, n) {
    return new VectorPoint(v.x * n, v.y * n);
  },

You need to change the operators over to a divide.

Be aware of copy and pasting code, make sure all the building blocks are working first and foremost before tackling a higher-level problem. Unit testing would have caught this immediately.

Sorry for sounding like a nagging mum but it's problems like these that could waste you many hours.

\$\endgroup\$

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .