AnimatedView

2 files changed, 39 insertions, 21 deletions

diff --git a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
index c393cfb..741f4fb 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
@@ -1,5 +1,5 @@
 
-var BlueprintScaler = ModalFormView.extend({
+var BlueprintScaler = ModalFormView.extend(AnimatedView.prototype).extend({
 	el: ".blueprintScaler",
 	
 	action: "/api/media/scale",
@@ -20,7 +20,7 @@ var BlueprintScaler = ModalFormView.extend({
     this.$units = this.$("[name=blueprint-units]")
     this.$save = this.$("#saveBlueprint")
 
-    this.map = map = new Map ({
+    this.map = new Map ({
       type: "ortho",
       el: this.$blueprintMap.get(0),
       width: window.innerWidth,
@@ -30,14 +30,12 @@ var BlueprintScaler = ModalFormView.extend({
       zoom_max: 1,
     })
     this.lineTool = new LineTool
-    map.ui.add_tool("line", this.lineTool)
-    map.ui.set_tool("line")
+    this.map.ui.add_tool("line", this.lineTool)
+    this.map.ui.set_tool("line")
     
     scene = scene || { camera: { x: 0, y: 0, z: 0 } }
     
     this.floorplan = new MX.Image ()
-    
-    this.animating = false
 	},
 	
 	showBlueprintUpload: function(){
@@ -50,27 +48,16 @@ var BlueprintScaler = ModalFormView.extend({
     if (!! media.units) {
       this.parent.useFloorplan(media)
       this.hide()
+      this.stopAnimating()
       return
     }
 
     this.floorplan.load({ media: media, keepImage: true })
 
-    if (! this.animating) {
-      this.animating = true
-      this.animate()
-    }
+    this.startAnimating()
 	},
 	
-	animate: function(t){
-    requestAnimationFrame(this.animate.bind(this))
-    
-    if (! this.animating) return
-
-    var dt = t - this.last_t
-    this.last_t = t
-
-    if (! t) return
-
+	animate: function(t, dt){
     this.map.update(t)
 
     this.map.draw.ctx.save()
@@ -147,7 +134,7 @@ var BlueprintScaler = ModalFormView.extend({
 	},
 	
 	success: function(){
-	  this.animating = false
+    this.stopAnimating()
     this.parent.useFloorplan(this.media)
     this.hide()
 	},
diff --git a/public/assets/javascripts/ui/lib/AnimatedView.js b/public/assets/javascripts/ui/lib/AnimatedView.js
new file mode 100644
index 0000000..3c50b0a
--- /dev/null
+++ b/public/assets/javascripts/ui/lib/AnimatedView.js
@@ -0,0 +1,31 @@
+var AnimatedView = View.extend({
+
+  _animating: false,
+  last_t: 0,
+  
+  startAnimating: function(){
+    if (this._animating) return
+    this._animating = true
+    this._animate()
+  },
+
+	stopAnimating: function(){
+	  this._animating = false
+	},
+
+	_animate: function(t){
+	  if (! this._animating) return
+
+    requestAnimationFrame(this._animate.bind(this))
+    
+    var dt = t - this.last_t
+    this.last_t = t
+
+    if (! t) return
+    
+    this.animate(t, dt)
+	},
+	
+	animate: function(t, dt){},
+
+})
\ No newline at end of file