Question: Let's say I have this parent class `Vector2` defined as follows:

```
function Vector2 (x, y) {
  this.x = x;
  this.y = y;
}
Vector2.prototype.add = function(vec) {
  console.log(Reflect.getPrototypeOf(this));
  if (vec instanceof Vector2)
    return new Vector2(this.x + vec.x, this.y + vec.y);
  throw "This operation can only be performed on another Vector2. Recieved " + typeof vec;
};

```

And an extension of `Vector2` called `Size` that should inherit all the functional goodness of its parent, with the aditional ability to reference `x` and `y` as `w` and `h` respectively, like so:

```
function Size(x,y) {
  this.x = x;
  this.y = y;
}
Size.prototype = new Vector2;
Size.prototype.constructor = Size;
Size.prototype._super = Vector2.prototype;
Object.defineProperties(Size.prototype, {
  'w': {
    get: function() {
      return this.x;
    },
    set: function(w) {
      this.x = w;
    }
  },
  'h': {
    get: function() {
      return this.y;
    },
    set: function(h) {
      this.y = h;
    }
  }
});

```

Finally, I have a code snippet that creates two new instances of `Size`, adds them together, and attempts to read from the `w` property like so:

```
var s1 = new Size(2, 4);
var s2 = new Size(3, 7);
var s3 = s1.add(s2);
console.log(s3.w);
// 'undefined' because s3 is an instance Vector2, not Size

```

How can I modify `Vector2`'s `add` method to create a new instance of *whatever* the current class is rather than a generic one?

Answer: 
Adding to the answers here. 

1. You can get an 'editor'y feel using Nuclide and Atom , the links are found in the React VR docs [here](https://facebook.github.io/react-vr/docs/dev-tools.html)
2. In order to move the position of the camera, you can use a custom ThreeJS camera and add it to your scene, this way you can leave your VR elements untouched

`const vr = new VRInstance(bundle,"ReactVR",parent, {
 camera:customCamera,/*your custom threeJS camera*/
 ...options,
});`

Your custom camera could be like

```
import { PerspectiveCamera } from "three";

const VIEW_ANGLE = 60;
const ASPECT = document.body.clientWidth / document.body.clientHeight;
const NEAR = 0.1;
const FAR = 10000;

const camera = new PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR);

camera.name = "Custom3JSCamera";

camera.position.set(0,0,5);
export default camera;

```
For background information, in A-Frame, you can change to any camera you want or move the active camera wherever:

```
<a-scene>
  <a-entity position="0 0 -5"><a-entity id="camera1" camera="active: true"></a-entity>
  <a-entity position="5 0 5"><a-entity id="camera2" camera="active: false"></a-entity>
</a-scene>

<script>
  document.querySelector('#camera2').setAttribute('camera', 'active', true);
</script>

```