From 5f757f97565297ed1d3c7af742a82530d6c58ffe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20H=C3=BCbner?= <hubnedav@fit.cvut.cz>
Date: Thu, 13 Apr 2017 18:59:23 +0200
Subject: [PATCH] Make ModelViewer resizable

---
 app/Resources/assets/js/ModelViewer.js      | 18 +++++++++---------
 app/Resources/assets/style/modelviewer.scss |  3 +--
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/app/Resources/assets/js/ModelViewer.js b/app/Resources/assets/js/ModelViewer.js
index 3bcb7cd..7423b8f 100644
--- a/app/Resources/assets/js/ModelViewer.js
+++ b/app/Resources/assets/js/ModelViewer.js
@@ -26,9 +26,9 @@ var ModelViewer = function($dom_element, model_url) {
     this.initScene();
 
 
-    this.stats = new Stats();
-    this.stats.dom.style.position = 'absolute';
-    this.container.append(this.stats.dom);
+    // this.stats = new Stats();
+    // this.stats.dom.style.position = 'absolute';
+    // this.container.append(this.stats.dom);
 
 
     function renderLoop() {
@@ -44,8 +44,11 @@ var ModelViewer = function($dom_element, model_url) {
             }
             $this.render();
         }
+
+        $this.resize(parseInt($this.dom_element.width()), parseInt($this.dom_element.height()));
     }
 
+
     renderLoop();
 };
 
@@ -73,8 +76,8 @@ ModelViewer.prototype.initHtml = function () {
 
 ModelViewer.prototype.initCamera = function () {
     this.camera = new THREE.PerspectiveCamera(45, this.width / this.height, .1, 300);
-    this.camera.position.z = 35;
-    this.camera.position.y = -35;
+    this.camera.position.z = 80;
+    this.camera.position.y = -45;
     this.camera.position.x = 35;
     this.camera.up = new THREE.Vector3(0, 0, 1);
 };
@@ -112,9 +115,6 @@ ModelViewer.prototype.initScene = function() {
 
     this.container.append(this.renderer.domElement);
 
-    // this.renderer.shadowMap.enabled = true;
-    // this.renderer.shadowMap.renderReverseSided = false;
-
     this.controls = new THREE.OrbitControls( this.camera, this.renderer.domElement );
     this.controls.enableZoom = true;
 };
@@ -208,7 +208,7 @@ ModelViewer.prototype.centerCamera = function(mesh) {
     var distanceZ = (geometry.boundingBox.max.z - geometry.boundingBox.min.z) / 2 / Math.tan(this.camera.fov * Math.PI / 360);
 
     var maxDistance = Math.max(Math.max(distanceX, distanceY), distanceZ);
-    maxDistance *= 1.6 * this.scale;
+    maxDistance *= 1.9 * this.scale;
 
     var cameraPosition = this.camera.position.normalize().multiplyScalar(maxDistance);
 
diff --git a/app/Resources/assets/style/modelviewer.scss b/app/Resources/assets/style/modelviewer.scss
index 7ac0019..cf9a0bc 100644
--- a/app/Resources/assets/style/modelviewer.scss
+++ b/app/Resources/assets/style/modelviewer.scss
@@ -1,6 +1,5 @@
 .model-container {
-  width:700px;
-  height: 525px;
+  width: 100%;
   position: relative;
   border: 1px solid #DDDDDD;