In my project I want to stop the orbit and move the camera to position when the user clicks on a hotspot. When the user closes the panel then the camera moves out again but there is a jagged cut when the camera orbit is re-enabled. Please help. I attached a video to show the issues.
var CameraTween = pc.createScript(‘cameraTween’);
// Inspector attributes
CameraTween.attributes.add(‘targetEntity’, { type: ‘entity’, title: ‘Target Entity’ });
CameraTween.attributes.add(‘animateToTargetButton’, { type: ‘entity’, title: ‘Animate to Target Button’ });
CameraTween.attributes.add(‘animateToPreviousButton’, { type: ‘entity’, title: ‘Animate to Previous Button’ });
CameraTween.prototype.initialize = function() {
// Store the initial position and rotation of the camera
this.camera = this.app.root.findByName(‘Camera’);
this.initialPosition = this.entity.getPosition().clone();
this.initialRotation = this.entity.getRotation().clone();
// Bind the button click events
this.animateToTargetButton.element.on('click', this.animateToTarget, this);
this.animateToPreviousButton.element.on('click', this.animateToPrevious, this);
};
CameraTween.prototype.animateToTarget = function() {
var targetPosition = this.targetEntity.getPosition().clone();
var targetRotation = this.targetEntity.getRotation().clone();
// Iterate through all scripts on the camera entity
var scripts = this.camera.script.scripts;
for (var i = 0; i < scripts.length; i++) {
var scriptName = scripts[i].__scriptType.__name;
// Disable the script if it's not 'cameraTween'
if (scriptName !== 'cameraTween') {
scripts[i].enabled = false;
}
}
// Position tween
this.entity.tween(this.entity.getLocalPosition()).to(targetPosition, 1.0, pc.SineOut).start();
// Rotation tween
this.entity.tween(this.entity.getLocalRotation()).to(targetRotation, 1.0, pc.SineOut).start();
};
CameraTween.prototype.animateToPrevious = function() {
// Position tween
var positionTween = this.entity.tween(this.entity.getLocalPosition()).to(this.initialPosition, 1.0, pc.SineOut).start();
// Rotation tween
var rotationTween = this.entity.tween(this.entity.getLocalRotation()).to(this.initialRotation, 1.0, pc.SineOut).start();
// Enable scripts only after both tweens are complete
var self = this;
positionTween.on('complete', function() {
rotationTween.on('complete', function() {
var scripts = self.camera.script.scripts;
for (var i = 0; i < scripts.length; i++) {
var scriptName = scripts[i].__scriptType.__name;
// Enable the script if it's not 'cameraTween'
if (scriptName !== 'cameraTween') {
scripts[i].enabled = true;
}
}
});
});
};