1 files changed, 56 insertions, 40 deletions
diff --git a/public/assets/javascripts/mx/primitives/mx.youtube.js b/public/assets/javascripts/mx/primitives/mx.youtube.js
index 3756d80..b21184d 100644
--- a/public/assets/javascripts/mx/primitives/mx.youtube.js
+++ b/public/assets/javascripts/mx/primitives/mx.youtube.js
@@ -4,53 +4,69 @@ MX.Youtube = MX.Object3D.extend({
   
   	this.type = "Youtube"
 
-    var layer = this
-		layer.media = ops.media
-		layer.width = ops.media.width
-		layer.height = ops.media.height
-		layer.x = ops.x || 0
-		layer.y = ops.y || 0
-		layer.z = ops.z || 0
-		layer.rotationX = ops.rotationX || 0
-		layer.rotationY = ops.rotationY || 0
-		layer.rotationZ = ops.rotationZ || 0
-		layer.scale = ops.scale || 1
-		layer.backface = ops.backface || false
+		this.media = ops.media
+		this.width = ops.media.width
+		this.height = ops.media.height
+		this.x = ops.x || 0
+		this.y = ops.y || 0
+		this.z = ops.z || 0
+		this.rotationX = ops.rotationX || 0
+		this.rotationY = ops.rotationY || 0
+		this.rotationZ = ops.rotationZ || 0
+		this.scale = ops.scale || 1
+		this.backface = ops.backface || false
 		
-		if (layer.backface) {
-			layer.el.classList.add("backface-visible")
-		}
-
-    if (ops.src) {
-    	this.loadEmbed(ops)
-    }
+		ops.className && this.el.classList.add(ops.className)
+		this.backface && this.el.classList.add("backface-visible")		
+		this.el.classList.add("video")
 		
-		if (ops.className) {
-			layer.el.classList.add(ops.className)
-		}
-		layer.el.style.backgroundRepeat = 'no-repeat'
-
+		this.load()
   },
 
-  loadEmbed: function(ops){
-    var layer = this
+  load: function (ops) {
+  	var uid = 'player-' + Uid()
+  	var preload = document.createElement("div")
+  	preload.id = uid
+  	preload.style.backgroundImage = "url(" + this.media.thumbnail + ")"
+  	preload.style.width = this.media.width + "px"
+  	preload.style.height = this.media.height + "px"
+  	preload.style.pointerEvents = "none"
+  	preload.className = "preload"
+  	this.el.appendChild(preload)
+  	
+		this.player = new YT.Player(uid, {
+			videoId: this.media.token,
+			width: this.width,
+			height: this.height,
+			events: {
+				onReady: $.proxy(this.ready, this),
+				onError: $.proxy(this.error, this),
+			}
+		})
   },
   
-  move: function(ops){
-  	var layer = this
-  	layer.ops = defaults(ops, layer.ops)
-  	for (var i in ops) {
-  		layer[i] = ops[i]
-  	}
-		layer.dirty = true
-		layer.update()
+  ready: function(){
+  	console.log("youtube ready")
   },
-
-	toString: function(){
-		var params = "id src width height depth x y z rotationX rotationY rotationZ scale".split(" ")
-		return this.__toString(params)
-	},
-
+  
+  error: function(err){
+  	console.log("youtube error", err)
+  },
+  
+  play: function(){
+  	this.player.playVideo()
+  },
+  
+  pause: function(){
+		this.player.pauseVideo()
+  },
+  
+  seek: function(n){
+  },
+  
+  duration: function(){
+  }
+  
 })
 
 window.onYouTubePlayerAPIReady = function(){