1 files changed, 129 insertions, 0 deletions
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js
new file mode 100644
index 0000000..7704689
--- /dev/null
+++ b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js
@@ -0,0 +1,129 @@
+
+var wallHeight = 180
+var shapes = new ShapeList
+var last_point = new vec2 (0,0)
+
+var BlueprintEditor = View.extend(AnimatedView.prototype).extend({
+
+  regions: [],
+
+  initialize: function(opt){
+    this.parent = opt.parent
+
+    $(window).resize(this.resize.bind(this))
+
+    scene = new MX.Scene().addTo("#perspective")
+    scene.camera.radius = 20
+    cam = scene.camera
+
+    scene.width = window.innerWidth/2
+    scene.height = window.innerHeight
+    scene.perspective = window.innerHeight
+  
+    movements = new MX.Movements(cam, viewHeight)
+    movements.init()
+    movements.lock()
+
+    app.on("move", function(pos){
+      cam.x = pos.x
+      cam.y = pos.y
+      cam.z = pos.z
+    })
+
+    var floorplan = this.floorplan = new MX.Image({
+      backface: true,
+    })
+    scene.add(this.floorplan)
+  
+    // recenter perspective view by rightclicking map
+    this.floorplan.el.addEventListener("contextmenu", function(e){
+      e.preventDefault()
+      var offset = offsetFromPoint(e, this)
+      var x = (offset.left - 0.5) * floorplan.width * floorplan.scale
+      var z = (offset.top - 0.5) * floorplan.height * floorplan.scale
+      controls.opt.center.x = -x
+      controls.opt.center.y = 0
+      controls.opt.center.z = z
+    }, true)
+
+    scene.update()
+
+    controls = new MX.OrbitCamera({
+      el: scene.el,
+      radius: 3000,
+      radiusRange: [ 10, 10000 ],
+      rotationX: PI/4,
+      rotationY: PI/2,
+    })
+    controls.init()
+  },
+  
+  resize: function(){
+    if (this.parent.orbiting) {
+      scene.width = window.innerWidth/2
+      scene.height = window.innerHeight
+      this.parent.map.resize( window.innerWidth/2, window.innerHeight )
+      this.parent.map.canvas.style.display = "block"
+    }
+    else {
+      scene.width = window.innerWidth
+      scene.height = window.innerHeight
+      this.parent.map.canvas.style.display = "none"
+    }
+  },
+  
+  loadFloorplan: function(media){
+    // console.log(media)
+    this.floorplan.load({
+      media: media,
+      keepImage: true,
+      rotationX: -PI/2,
+      rotationY: PI,
+      scale: media.scale,
+    })
+    this.startAnimating()
+    this.regions = RegionList.buildByShape()
+  },
+  
+  animate: function(t, dt){
+    map.update(t)
+
+    movements.update(dt)
+    controls.update()
+    scene.update()
+
+    map.draw.ctx.save()
+    map.draw.translate()
+
+    this.floorplan.draw(map.draw.ctx, true)
+
+    map.draw.coords()
+
+    if (shapes.workline) {
+      shapes.workline.draw(map.draw.ctx, "rgba(255,255,0,0.1)", "#f80")
+      if (map.ui.placing && last_point) {
+        shapes.workline.draw_line( map.draw.ctx, last_point )
+      }
+    }
+
+    shapes.draw(map.draw.ctx, "rgba(255,255,0,0.1)", "#f80")
+
+    map.draw.ctx.strokeStyle = "#f00";
+    map.draw.x_at( this.parent.startPosition )
+    map.draw.mouse(map.ui.mouse.cursor)
+    map.draw.camera(scene.camera)
+    
+//    var colors = ["rgba(0,0,0,0.1)"]
+//    var colors = ["rgba(255,255,255,1)"]
+
+//     map.draw.regions(this.regions, colors, "#000")
+
+//     this.regions.forEach(function(room,i){
+//       map.draw.ctx.fillStyle = colors[i % colors.length]
+//       map.draw.ctx.fillRect( room.x.a, room.y.a, room.width(), room.height() )
+//     })
+
+    map.draw.ctx.restore()
+  },
+
+})