1 files changed, 66 insertions, 0 deletions
diff --git a/client/assets/javascripts/mx/primitives/mx.cutout.js b/client/assets/javascripts/mx/primitives/mx.cutout.js
new file mode 100644
index 0000000..9d9043f
--- /dev/null
+++ b/client/assets/javascripts/mx/primitives/mx.cutout.js
@@ -0,0 +1,66 @@
+MX.Cutout = MX.Object3D.extend({
+  init: function (ops) {
+  
+  	this.type = "Cutout"
+
+    var layer = this
+    layer.width = 0
+    layer.height = 0
+
+    if (ops.src) this.loadTexture(ops)
+
+		if (ops.texture) {
+		}
+		else if (ops.classname) {
+			layer.el.classList.add(ops.classname)
+		}
+		else {
+		}
+		layer.el.style.backgroundRepeat = 'no-repeat'
+
+    this.dirty = true
+    this.updateChildren = true
+    this.update()
+  },
+
+  loadTexture: function(ops){
+    var layer = this
+    var image = new Image()
+    var pattern = ops.pattern
+    var texture = ops.texture
+    
+    image.onload = function(){
+			var canvas = document.createElement("canvas")
+			var ctx = canvas.getContext('2d')
+
+			layer.width = canvas.width = image.naturalWidth
+			layer.height = canvas.height = image.naturalHeight
+
+			ctx.drawImage(image, 0, 0, canvas.width, canvas.height)
+			ctx.globalCompositeOperation = "source-in"
+			
+			if (texture) {
+				ctx.fillStyle = ctx.createPattern(texture, 'repeat')
+				ctx.fillRect(0, 0, canvas.width, canvas.height)
+			}
+			if (pattern) {
+				ctx.fillStyle = ctx.createPattern(pattern, 'repeat')
+				ctx.fillRect(0, 0, canvas.width, canvas.height)
+			}
+
+			layer.scale = ops.scale || 1
+			layer.x = ops.x || 0
+			layer.y = (ops.y || 0) + layer.height/2 + 1
+			layer.z = ops.z || 0
+			layer.rotationX = ops.rotationX || 0
+			layer.rotationY = ops.rotationY || 0
+			layer.el.appendChild(canvas)
+
+			layer.el.classList.add('image')
+			ops.className && layer.el.classList.add(ops.className)
+			layer.dirty = true
+			layer.update()
+    }
+    image.src = ops.src;
+  }
+})