diff --git a/js/Cube.js b/js/Cube.js index 58545d0..447ca61 100644 --- a/js/Cube.js +++ b/js/Cube.js @@ -19,7 +19,7 @@ var Cube = function(size, style) { if (typeof style === 'undefined') style = {}; this.geometry = new THREE.BoxGeometry(size, size, size); - this.geometry.computeVertexNormals(); + // this.geometry.computeVertexNormals(); this.material = new THREE.MeshLambertMaterial(style); diff --git a/js/PointerCamera.js b/js/PointerCamera.js index 452e934..7b1484f 100644 --- a/js/PointerCamera.js +++ b/js/PointerCamera.js @@ -1,6 +1,3 @@ -// Initialization - - // class camera extends THREE.PerspectiveCamera var PointerCamera = function() { THREE.PerspectiveCamera.apply(this, arguments); @@ -11,6 +8,11 @@ var PointerCamera = function() { this.keyboard = 'undefined'; + this.dragging = false; + + this.mouse = {x: 0, y: 0}; + this.move = {x: 0, y: 0}; + // Stuff for rendering this.position = new THREE.Vector3(); @@ -32,9 +34,15 @@ var PointerCamera = function() { var self = this; var onKeyDown = function(event) {self.onKeyDown(event);}; var onKeyUp = function(event) {self.onKeyUp(event);}; + var onMouseDown = function(event) {self.onMouseDown(event); }; + var onMouseMove = function(event) {self.onMouseMove(event); }; + var onMouseUp = function(event) {self.onMouseUp(event); }; document.addEventListener('keydown', onKeyDown, false); document.addEventListener('keyup', onKeyUp, false); + document.addEventListener('mousedown', onMouseDown, false); + document.addEventListener('mousemove', onMouseMove, false); + document.addEventListener('mouseup', onMouseUp, false); } PointerCamera.prototype = Object.create(THREE.PerspectiveCamera.prototype); PointerCamera.prototype.constructor = PointerCamera; @@ -47,6 +55,14 @@ PointerCamera.prototype.update = function() { if (this.increaseTheta) this.theta += this.sensitivity; if (this.decreaseTheta) this.theta -= this.sensitivity; + if (this.dragging) { + this.theta += this.move.x; + this.phi -= this.move.y; + + this.move.x = 0; + this.move.y = 0; + } + // Clamp phi this.phi = Math.min(Math.max(-(Math.PI/2-0.1),this.phi), Math.PI/2-0.1); @@ -115,6 +131,31 @@ PointerCamera.prototype.onKeyUp = function(event) { this.onKeyEvent(event, false); } +PointerCamera.prototype.onMouseDown = function(event) { + this.mouse.x = ( ( event.clientX - renderer.domElement.offsetLeft ) / renderer.domElement.width ) * 2 - 1; + this.mouse.y = - ( ( event.clientY - renderer.domElement.offsetTop ) / renderer.domElement.height ) * 2 + 1; + + this.dragging = true; +} + +PointerCamera.prototype.onMouseMove = function(event) { + if (this.dragging) { + var mouse = {x: this.mouse.x, y: this.mouse.y}; + this.mouse.x = ( ( event.clientX - renderer.domElement.offsetLeft ) / renderer.domElement.width ) * 2 - 1; + this.mouse.y = - ( ( event.clientY - renderer.domElement.offsetTop ) / renderer.domElement.height ) * 2 + 1; + + this.move.x = this.mouse.x - mouse.x; + this.move.y = this.mouse.y - mouse.y; + + console.log(this.move.x, this.move.y); + } +} + +PointerCamera.prototype.onMouseUp = function(event) { + this.onMouseMove(event); + this.dragging = false; +} + // Static members PointerCamera.DISTANCE_X = 1000; PointerCamera.DISTANCE_Z = 300;