Camera Control Exploration

<p onclick="window.setCameraPosition('Fixed Cam 1')" style="cursor: pointer; background: black; color: white; font-size: 18px; padding: 4px; margin: 10px;">

Camera 1

</p>

<p onclick="window.setCameraPosition('Fixed Cam 2')" style="cursor: pointer; background: black; color: white; font-size: 18px; padding: 4px; margin: 10px;">

Camera 2

</p>

<p onclick="window.setCameraPosition('Fixed Cam 3')" style="cursor: pointer; background: black; color: white; font-size: 18px; padding: 4px; margin: 10px;">

Camera 3

</p>

<script>

'use strict';

/* global goo */

var setup = function (args, ctx) {

window.setCameraPosition = function (name) {

var cam = ctx.world.by.name(name).first();

if (cam) {

var targetPos = args.targetLookat.getTranslation();

var dist = cam.getTranslation().sub(targetPos).length();

var angles = cam.getRotation();

var camCtx = args.targetCamera.scriptComponent.scripts[0].context;

camCtx.targetSpherical.setDirect(

dist,

goo.MathUtils.moduloPositive(-angles.y + Math.PI / 2, Math.PI * 2),

goo.MathUtils.moduloPositive(-angles.x, Math.PI * 2)

);

camCtx.goingToLookAt.set(targetPos);

camCtx.dirty = true;

}

};

};

var cleanup = function (args, ctx) {

};

var update = function (args, ctx) {

};

var parameters = [

{ key: 'targetCamera', type: 'entity' },

{ key: 'targetLookat', type: 'entity' }

];

</script>