Everything seems to work, except viewport lines

This commit is contained in:
Thomas FORGIONE
2015-07-06 17:18:08 +02:00
parent 4da5754b64
commit 59e6806d16
17 changed files with 194 additions and 257 deletions

View File

@@ -1,4 +1,5 @@
var ButtonManager = function(cameras, previewer) {
var ButtonManager = function(camera, cameras, previewer) {
this.camera = camera;
this.cameras = cameras;
this.previewer = previewer;
@@ -19,8 +20,8 @@ var ButtonManager = function(cameras, previewer) {
this.fullscreenElement.onclick = function() {fullscreen();};
(function(self) {
self.undoElement.onclick = function() {self.cameras.mainCamera().undo(); self.updateElements();};
self.redoElement.onclick = function() {self.cameras.mainCamera().redo(); self.updateElements();};
self.undoElement.onclick = function() {self.camera.undo(); self.updateElements();};
self.redoElement.onclick = function() {self.camera.redo(); self.updateElements();};
self.fullElement.onclick = function() {
self.cameras.map(function(camera) {
@@ -32,15 +33,15 @@ var ButtonManager = function(cameras, previewer) {
};
self.pointerLockElement.onchange = function() {
self.cameras.mainCamera().shouldLock = self.pointerLockElement.checked;
self.cameras.mainCamera().onPointerLockChange();
self.camera.shouldLock = self.pointerLockElement.checked;
self.camera.onPointerLockChange();
};
self.showarrowsElement.onchange = function() {self.showArrows = self.showarrowsElement.checked;};
self.resetElement.onclick = function() {
// Reinit camera
self.cameras.mainCamera().reset();
self.camera.reset();
};
self.recommendationElement.onchange = function() {
@@ -52,13 +53,13 @@ var ButtonManager = function(cameras, previewer) {
ButtonManager.prototype.updateElements = function() {
// Update icon
if (!this.cameras.mainCamera().undoable()) {
if (!this.camera.undoable()) {
this.undoElement.className = "btn btn-default navbar-btn";
} else {
this.undoElement.className = "btn btn-primary navbar-btn";
}
if (!this.cameras.mainCamera().redoable()) {
if (!this.camera.redoable()) {
this.redoElement.className = "btn btn-default navbar-btn";
} else {
this.redoElement.className = "btn btn-primary navbar-btn";

View File

@@ -158,10 +158,10 @@ function initListeners() {
document.addEventListener('keydown', function(event) { if (event.keyCode == 27) { stopFullscreen();} }, false);
// HTML Bootstrap buttons
buttonManager = new ButtonManager(cameras, previewer);
buttonManager = new ButtonManager(camera1, cameras, previewer);
// Camera selecter for hover and clicking recommendations
cameraSelecter = new L3D.CameraSelecter(renderer, scene, cameras, coins, buttonManager);
cameraSelecter = new L3D.CameraSelecter(renderer, scene, camera1, cameras, coins, buttonManager);
}
function render() {
@@ -184,21 +184,20 @@ function render() {
// Update main camera
var currentTime = Date.now() - previousTime;
cameras.updateMainCamera(isNaN(currentTime) ? 20 : currentTime);
camera1.update(isNaN(currentTime) ? 20 : currentTime);
previousTime = Date.now();
// Update the recommendations
cameras.update(cameras.mainCamera());
cameras.map(function(cam) { cam.update(camera1);});
// Set current position of camera
cameras.look();
camera1.look();
var left = 0, bottom = 0, width = container_size.width(), height = container_size.height();
renderer.setScissor(left, bottom, width, height);
renderer.enableScissorTest(true);
renderer.setViewport(left, bottom, width, height);
renderer.render(scene, cameras.mainCamera());
renderer.render(scene, camera1);
// Remove borders of preview
previewer.clear();
@@ -207,7 +206,7 @@ function render() {
cameras.map(function(camera) { if (camera instanceof Recommendation) hide(camera); });
// Update transparent elements
THREEx.Transparency.update(cameras.mainCamera());
THREEx.Transparency.update(camera1);
// Render preview
previewer.render(cameraSelecter.prev, container_size.width(), container_size.height());

View File

@@ -33,6 +33,7 @@ var cameras, cameraSelecter;
var spheres = new Array(mesh_number);
var visible = 0;
var stats;
var camera1;
var loader;
var coins = [];
@@ -71,7 +72,7 @@ function init() {
container.appendChild(renderer.domElement);
// Initialize pointer camera
var camera1 = new L3D.ReplayCamera(50, container_size.width() / container_size.height(), 0.01, 100000, coins);
camera1 = new L3D.ReplayCamera(50, container_size.width() / container_size.height(), 0.01, 100000, coins);
cameras = initMainScene(camera1, scene, coins);
camera1.cameras = cameras;
@@ -183,21 +184,21 @@ function render() {
// Update main camera
var currentTime = Date.now() - previousTime;
cameras.updateMainCamera(isNaN(currentTime) ? 20 : currentTime);
camera1.update(isNaN(currentTime) ? 20 : currentTime);
previousTime = Date.now();
// Update the recommendations
cameras.update(cameras.mainCamera());
cameras.map(function(camera) {camera.update(camera1);});
// Set current position of camera
cameras.look();
camera1.look();
var left = 0, bottom = 0, width = container_size.width(), height = container_size.height();
renderer.setScissor(left, bottom, width, height);
renderer.enableScissorTest(true);
renderer.setViewport(left, bottom, width, height);
renderer.render(scene, cameras.mainCamera());
renderer.render(scene, camera1);
// Hide arrows in recommendation
// cameras.map(function(camera) { if (camera instanceof RecommendedCamera) hide(camera); });

View File

@@ -304,10 +304,12 @@ TutoCamera.prototype.anglesFromVectors = function() {
this.theta = Math.atan2(forward.x, forward.z);
};
TutoCamera.prototype.move = function(otherCamera, toSave) {
TutoCamera.prototype.move = function(recommendation, toSave) {
if (toSave === undefined)
toSave = true;
var otherCamera = recommendation.camera || recommendation;
this.moving = true;
this.new_target = otherCamera.target.clone();
this.new_position = otherCamera.position.clone();
@@ -326,7 +328,7 @@ TutoCamera.prototype.move = function(otherCamera, toSave) {
}
};
TutoCamera.prototype.moveHermite = function(otherCamera, toSave) {
TutoCamera.prototype.moveHermite = function(recommendation, toSave) {
if (this.tutorial.nextAction() === 'recommendation') {
this.tutorial.nextStep();
}
@@ -334,6 +336,8 @@ TutoCamera.prototype.moveHermite = function(otherCamera, toSave) {
if (toSave === undefined)
toSave = true;
var otherCamera = recommendation.camera;
this.movingHermite = true;
this.t = 0;

View File

@@ -27,6 +27,7 @@ var loader;
var coins = [];
var previousTime;
var tutorial;
var camera1;
init();
animate();
@@ -64,7 +65,7 @@ function init() {
stats.domElement.style.position = 'absolute';
stats.domElement.style.cssFloat = "top-left";
var camera1 = new TutoCamera(50, container_size.width() / container_size.height(), 0.01, 100000, renderer, scene, onWindowResize, container_size, coins, container);
camera1 = new TutoCamera(50, container_size.width() / container_size.height(), 0.01, 100000, renderer, scene, onWindowResize, container_size, coins, container);
// Initialize pointer for pointer lock
var pointer = new L3D.MousePointer(camera1);
@@ -88,7 +89,7 @@ function init() {
// Initialize pointer camera
tutorial = camera1.tutorial;
cameras = new L3D.CameraContainer(camera1, []);
cameras = [];
tutorial.setCameras(cameras);
// Load peach scene
@@ -121,10 +122,10 @@ function initListeners() {
document.addEventListener('keydown', function(event) { if (event.keyCode == 27) { stopFullscreen();} }, false);
// HTML Bootstrap buttons
buttonManager = new ButtonManager(cameras, previewer);
buttonManager = new ButtonManager(camera1, cameras, previewer);
// Camera selecter for hover and clicking recommendations
cameraSelecter = new L3D.CameraSelecter(renderer, scene, cameras, coins, buttonManager);
cameraSelecter = new L3D.CameraSelecter(renderer, scene, camera1, cameras, coins, buttonManager);
}
@@ -148,21 +149,21 @@ function render() {
// Update main camera
var currentTime = Date.now() - previousTime;
cameras.updateMainCamera(isNaN(currentTime) ? 20 : currentTime);
camera1.update(isNaN(currentTime) ? 20 : currentTime);
previousTime = Date.now();
// Update the recommendations
cameras.update(cameras.mainCamera());
cameras.map(function(camera) {camera.update(camera1);});
// Set current position of camera
cameras.look();
camera1.look();
var left = 0, bottom = 0, width = container_size.width(), height = container_size.height();
renderer.setScissor(left, bottom, width, height);
renderer.enableScissorTest(true);
renderer.setViewport(left, bottom, width, height);
THREEx.Transparency.update(cameras.mainCamera());
renderer.render(scene, cameras.mainCamera());
THREEx.Transparency.update(camera1);
renderer.render(scene, camera1);
// Remove borders of preview
previewer.clear();
@@ -193,8 +194,8 @@ function onWindowResize() {
previewer.domElement.height = container_size.height();
renderer.setSize(container_size.width(), container_size.height());
cameras.forEach(function(camera) {camera.aspect = container_size.width() / container_size.height();});
cameras.forEach(function(camera) {camera.updateProjectionMatrix();});
cameras.forEach(function(camera) {camera.camera.aspect = container_size.width() / container_size.height();});
cameras.forEach(function(camera) {camera.camera.updateProjectionMatrix();});
render();
}