Camera

[Jim Thomson]

Hi

I've been away from coding in CoSpaces for a few weeks. So from what I see the camera must be manually placed in the scene now? This would break every existing student project I have.

[Benjamin Singh]

Hi Jim,

yes we're completely reworking the camera object and the corresponding API. The old API for the camera was immature and actually internal. This is why we removed it from the API documentation page early. The new camera object will have more functionalities and also will be easier to handle.

Unfortunately like you already said, if you used some of the old methods it can be that they break your script. I had a look at the Zombie game you shared with me previously and in this particular example the creation of the camera becomes obsolete.

//creates a camera and positions it

var camera = Scene.getCamera();

camera.setPosition(0, 0, 2);

camera.setPlayerCamera();

To make it work like before we can remove these lines from the script and drag and drop the new camera object with fixed position to the space instead. You can find the camera object in "Library -> Special".

Now the game works just like before.

The thing is that our scripting API is still in "Early Access". That means that the API will change and improve a lot in the future. If you just use the functions which are documented in the API documentation then you should be good to go. These methods should not change in the future, even though the API is still in the "Early Access" phase.

I don't know in how many projects you have now issues with the camera, but if you have any questions, just let me know. You can also send me the scripts and I can have a look at them.

Thanks,

Benjamin

[Jim Thomson]

Hi Ben

Yeah, I figured it out. The only problem with student projects is they've finished my course so I can tell them how to fix it. I understand about early access believe me.

I'm wondering about spawning purchased items with createItem. I purchased Snowman, but can't spawn it with Snowman or LP_Snowman, I just get a cube. I would like to do a variation of the game where the zombie snowmen throw snowballs at the player.

Still having fun with it!

Cheers

Jim

[Benjamin Singh]

Hi Jim,

ok I see the problem with the student projects now. We're using a lot of internal methods in our test scripts and some of those scripts are visible in our public Github repository. Please don't use them if you want to make sure that your script will always run in the future :) Just the ones in the API documentation and we will not run into the same issue again hopefully.

Regarding purchased items and the createItem() method. We're still working on it. Till then the only possibility is to place the snowman in the scene and reference it with the getItem() method.

So if we want to implement the "zombie" behaviour for the snowmen, instead of creating new instances of snowmen and deleting them repeatedly we can have an array of zombie snowmen and work on the elements of the array. E.g. setting new position, make them invisible by setting opacity to 0 etc. Example:

var player = Scene.createItem('LP_Wom', 0, 0, 0);

var snowmen = [

    Scene.getItem('snowman1'),

    Scene.getItem('snowman2'),

    Scene.getItem('snowman3'),

    Scene.getItem('snowman4')

];

function spawnSnowman(snowman) {

    var xSpawn = Math.random() * 30 - 15;

    var ySpawn = Math.random() * 30 - 15;

    snowman.setPosition(xSpawn, ySpawn, 0);

    snowman.moveTo(0, 0, 0);

}

function init() {

    snowmen.forEach(function(snowman) {

        spawnSnowman(snowman);

    });

}

init();

Scene.scheduleRepeating(function() {

    snowmen.forEach(function(snowman) {

        if(snowman.distanceToItem(player) < 1) {

            spawnSnowman(snowman);

        }

    });

}, 0);

Script in action: https://cospac.es/D7nv 

This way we can maybe get along without the createItem() method at the moment.

Thanks!

Benjamin

[Jim Thomson]

var player = Space.createItem('LP_Wom', 0, 0, 0);

var scoreBoard = Space.createTextBillboard(4,8,1);

    scoreBoard.setSize(2,1,2);

    var score = 0;

    scoreBoard.setText('Score' + '=' +score);

var snowmen = [

    Space.getItem('snowman1'),

    Space.getItem('snowman2'),

    Space.getItem('snowman3'),

    Space.getItem('snowman4'),

    Space.getItem('snowman5')

];

function spawnSnowman(snowman) {

    var xSpawn = Math.random() * 30 -15 ;

    var ySpawn = Math.random() * 30 - 15;

    snowman.setPosition(xSpawn, ySpawn, 0);

   

    snowman.moveTo(0,0,0);

    snowman.onActivate(function(){

        score++;

        scoreBoard.setText('Score'+ '=' + score);

        spawnSnowman(snowman);

    });

}

function init() {

    snowmen.forEach(function(snowman) {

        spawnSnowman(snowman);

    });

    

}

init();

Space.scheduleRepeating(function() {

    snowmen.forEach(function(snowman) {

        if(snowman.distanceToItem(player) < 1) {

            spawnSnowman(snowman);

        }

    });

}, 0);

Hi Ben

Tinkering with the Snowman code you sent. Trying to implement an onActivate but it's very buggy. First spawn they ignore the on Activate and continue to player, second spawn they run the onActivate() but it seems like the third spawn isn't running the MoveTo(). I imagine the buggy behaviour is because moveTo() is conflicting with the onActivate(). Would there be a way to safely interrupt MoveTo()?  See code above

.

[Benjamin Singh]

Hi Jim,

yes there is indeed an issue with that and the team has discussed it. While an object is moving (has not reached its destination) a setPosition() call will have no effect. Like you already said, what we need is a way to interrupt the movement. We made an internal method for it called stopMovement(). After that method was called it's possible to use setPosition() again.

var player = Scene.createItem('LP_Wom', 0, 0, 0);

var scoreBoard = Scene.createTextBillboard(4, 8, 1);

scoreBoard.setSize(2, 1, 2);

var score = 0;

scoreBoard.setText('Score' + ' = ' + score);

var snowmen = [

    Scene.getItem('snowman1'),

    Scene.getItem('snowman2'),

    Scene.getItem('snowman3'),

    Scene.getItem('snowman4'),

    Scene.getItem('snowman5')

];

function spawnSnowman(snowman) {

    var xSpawn = Math.random() * 30 - 15 ;

    var ySpawn = Math.random() * 30 - 15;

    snowman.setPosition(xSpawn, ySpawn, 0, true);

    snowman.moveTo(0, 0, 0);

}

function init() {

    snowmen.forEach(function(snowman) {

        spawnSnowman(snowman);

        snowman.onActivate(function(){

            snowman.stopMovement();

            score++;

            scoreBoard.setText('Score' + ' = ' + score);

            spawnSnowman(snowman);

        });

    });

}

init();

Scene.scheduleRepeating(function() {

    snowmen.forEach(function(snowman) {

        if(snowman.distanceToItem(player) < 1) {

            spawnSnowman(snowman);

        }

    });

}, 0);

This method is still internal and it might be changed or might not work in all cases like expected. It's also not working on mobile at the moment. For now there is no perfect solution but thank you for pointing it out, we're working on it. Another possibility is to write a custom move function in JavaScript as a short term workaround. Maybe I can do it today.

Thanks,

Benjamin

[Benjamin Singh]

Hi Jim,

I wrote 2 little workaround functions in JavaScript:

cMoveToItem(otherItem, speed)

cStopMovement()

You can set these methods on an object using the setCustomMoveMethods(obj) function I defined in the script above your code. With that it should also work on mobile and it should solve the issue till we have this functionality available via our public API.

Here is it integrated in the snowman example script. You can just ignore the helper functions defined above your code.

// helper functions

function Vector(x, y, z) {

  this.x = x || 0;

  this.y = y || 0;

  this.z = z || 0;

}

Vector.prototype.mult = function (s) {

  this.x = this.x * s;

  this.y = this.y * s;

  this.z = this.z * s;

};

Vector.prototype.mag = function () {

  return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);

};

Vector.prototype.normalize = function () {

  var mag = this.mag();

  this.x = this.x / mag;

  this.y = this.y / mag;

  this.z = this.z / mag;

};

Vector.sub = function (v1, v2) {

  return new Vector(v1.x - v2.x, v1.y - v2.y, v1.z - v2.z);

};

function setCustomMoveMethods(obj) {

  obj.cMoveToItem = function (otherItem, speed) {

    var self = this;

    this.faceTo(otherItem);

    this.pos = this.getPosition();

    var otherPos = otherItem.getPosition();

    var start = new Vector(this.pos.x, this.pos.y, this.pos.z);

    var dest = new Vector(otherPos.x, otherPos.y, otherPos.z);

    var dir = Vector.sub(dest, start);

    dir.normalize();

    dir.mult(0.03 * speed);

    this.update = Scene.scheduleRepeating(function () {

      self.pos = self.getPosition();

      self.setPosition(self.pos.x + dir.x, self.pos.y + dir.y, self.pos.z + dir.z);

      if (self.distanceToItem(otherItem) < 0.5) {

        self.update.dispose();

      }

    }, 0);

  };

  obj.cStopMovement = function () {

    this.update.dispose();

  };

}

// end helper functions

var player = Scene.createItem('LP_Wom', 0, 0, 0);

var scoreBoard = Scene.createTextBillboard(4, 8, 1);

scoreBoard.setSize(2, 1);

var score = 0;

scoreBoard.setText('Score' + ' = ' + score);

var snowmen = [

  Scene.getItem('snowman1'),

  Scene.getItem('snowman2'),

  Scene.getItem('snowman3'),

  Scene.getItem('snowman4'),

  Scene.getItem('snowman5')

];

function spawnSnowman(snowman) {

  var xSpawn = Math.random() * 30 - 15;

  var ySpawn = Math.random() * 30 - 15;

  snowman.setPosition(xSpawn, ySpawn, 0, true);

  snowman.cMoveToItem(player, 0.5);

}

function init() {

  snowmen.forEach(function (snowman) {

    setCustomMoveMethods(snowman);

    spawnSnowman(snowman);

    snowman.onActivate(function () {

      snowman.cStopMovement();

      score++;

      scoreBoard.setText('Score' + ' = ' + score);

      spawnSnowman(snowman);

    });

  });

}

init();

Scene.scheduleRepeating(function () {

  snowmen.forEach(function (snowman) {

    if (snowman.distanceToItem(player) < 0.5) {

      spawnSnowman(snowman);

    }

  });

}, 0);

Thanks,

Benjamin 

[Jim Thomson]

Hi Benjamin

Thanks for the scripts. I haven't had the chance to work on the my scene yet but will shortly. You've been a big help!

[Benjamin Singh]

Hi Jim,

your welcome! I haven't really tested it in and out, so if there are any issues just let me know.

Thanks,

Benjamin

[Daniel Pers]

Hi benjamin,

A camera is positioned by default at the center of the scene. It can be moved but must remain within the limits of the environment. If I remove the camera, I can have a much wider view, as if the camera was out of the limits. How to get this view with a camera ?

Daniel

[Benjamin Singh]

Hi Daniel,

for now you can use JavaScript for that. Just let the camera in the scene and set the camera position by calling the setPosition(xPos, yPos, zPos) method on the camera object. Example:

var cam = Scene.getCamera();

cam.setPosition(0, -60, 30);

Example space link:  https://cospac.es/6L4h

With that you can "escape" the boundaries. But please keep in mind that there are no public methods available for the camera object at the moment. You can use it but they can change anytime.

Kind regards,

Benjamin

[Daniel Pers]

In fact it doesn't work exactly as I thought. To have the same view when I switch to VR mode, I think I have to configure the camera as the main camera with a fixed position.

When I do so it seems to be OK but I still have a problem: I would like to tilt the camera down so that it targets the center of the scene and not straight ahead.

Thank you.

Daniel 

[Daniel Pers]

Sorry I deleted my first post. Your code in JavaScript works well (it's handy to be able to use it in a project at the same time as Blockly) but I can't understand how the tilt parameters of the camera are taken into account. Also when I leave the VR mode, I don't have the same view as at the beginning (before I choose VR mode).

Daniel

[Benjamin Singh]

Hi Daniel,

you can tilt the camera with the setCameraAH(azimuthalAngle, polarAngle) method. Angles are in radians using the spherical coordinate system. E.g. if you want the camera object to look 45 degrees down you write:

var cam = Scene.getCamera();

cam.setPosition(0, -60, 30);

cam.setCameraAH(0, -Math.PI / 4);

Link: https://cospac.es/6L4h 

Similarly, instead of using the setCameraAH(azimuthalAngle, polarAngle) method, you can initially rotate the camera in the inspector menu:

When you run the script, the camera should take the rotation into account.

Unfortunately, at the moment there are some issues when you switch into VR/gyroscope mode but it should work after the next update.

Thanks,

Benjamin

[Daniel Pers]

OK.

It works but not in VR mode (to tilt the main camera).

Thanks again.

Daniel

[Daniel Pers]

Hi,

It seems to me that .setCameraAH method does not work anymore. That's it ?

Daniel Pers

[Benjamin Singh]

Hi Daniel,

thats right. This internal method doesn't exist anymore. To get the same result you can use public methods now. For example:

var cam = Scene.getItem('Camera');

cam.addLocalRotation(0, 0, 0, 1, 0, 0, Math.PI / 4);

Benjamin