orbit camera

1 files changed, 7 insertions, 43 deletions

diff --git a/public/assets/test/ortho.html b/public/assets/test/ortho.html
index bd94a51..57e050c 100644
--- a/public/assets/test/ortho.html
+++ b/public/assets/test/ortho.html
@@ -32,6 +32,7 @@ body {
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/mx/mx.js"></script>
 <script src="/assets/javascripts/mx/extensions/mx.scene.js"></script>
+<script src="/assets/javascripts/mx/extensions/mx.orbitCamera.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
 <script src="/assets/javascripts/rectangles/util/mouse.js"></script>
 <script src="/assets/javascripts/rectangles/models/vec2.js"></script>
@@ -94,43 +95,6 @@ Map.UI.Ortho = function(map){
 		}
 	})
 }
-MX.OrbitCamera = function(opt){
-	var exports = {}, bound = false
-	exports.opt = opt = defaults(opt, {
-		el: window,                 // object to bind events on
-		camera: scene.camera,       // camera object we'll be moving
-		radius: 100,
-		radiusRange: [ 10, 1000 ],
-		rotationX: 0,
-		rotationY: 0,
-		center: { x: 0, y: 0, z: 0 },
-	})
-	exports.init = function(){
-		exports.bind()
-	}
-	exports.toggle = function(state){
-		if (state) exports.bind()
-		else exports.unbind()
-	}
-	exports.bind = function(){
-		if (bound) return;
-		bound = true
-	}
-	exports.unbind = function(){
-		if (! bound) return;
-		bound = false
-	}
-	exports.update = function(){
-		opt.camera.x = opt.radius * sin(opt.rotationY) * cos(opt.rotationX)
-		opt.camera.y = opt.radius * sin(opt.rotationY) * sin(opt.rotationX)
-		opt.camera.z = opt.radius * cos(opt.rotationY)
-		opt.camera.rotationX = opt.rotationX
-		opt.camera.rotationY = PI-opt.rotationY
-		hud.innerHTML = opt.camera.toString()
-	}
-	
-	return exports
-}
 
 var scene, map, controls
 
@@ -167,17 +131,17 @@ function polyline (time) {
   }
 }
 document.addEventListener('DOMContentLoaded', build_circle)
-function add_mx_point (p) {
+function add_mx_point (p, i) {
 	var mx = new MX.Object3D()
 	mx.updateChildren = false
 	mx.move({
 		x: p.a,
-		y: 0,
+		y: i/4,
 		z: p.b,
 		width: 1,
-		height: 1,
+		height: i/2,
 	})
-	mx.el.style.backgroundColor = "#f80"
+	mx.el.style.backgroundColor = 'rgb(' + [abs(floor(p.a*30)), 0, abs(floor(p.b*30))] + ')'
 	mx.el.style.backfaceVisibility = "visible"
 	scene.add(mx)
 	mx.update()
@@ -200,11 +164,11 @@ function build_circle () {
 
 	var theta, rad = 10;
 	for (var i = 0; i < 100; i++) {
-		theta = (i/TWO_PI)
+		theta = (i/100 * TWO_PI)
 		add_mx_point({
 			a: sin(theta) * rad,
 			b: cos(theta) * rad,
-		})
+		}, i)
 	}
 
 	scene.update()