MX.Soundcloud = MX.Object3D.extend({
  init: function (ops) {
  
  	this.type = "Soundcloud"
		this.media = ops.media
    this.width = 0
    this.height = 0
		this.x = ops.x || 0
		this.y = ops.y || 0
		this.z = ops.z || 0
		this.scale = ops.scale || 1
		this.backface = ops.backface || false
			
		ops.className && this.el.classList.add(ops.className)
		this.backface && this.el.classList.add("backface-visible")
		this.el.classList.add("audio")
		this.el.classList.add("mx-scenery")

		this.el.style.backgroundRepeat = 'no-repeat'
		this.paused = true

  	this.ops = ops
  },

  load: function(ops){
    if (ops) {
      ops = this.ops = defaults(ops, this.ops)
    }
    else {
      ops = this.ops
    }

  	this.width = ops.media.width
  	this.height = ops.media.height

  	var tag = Parser.lookup.soundcloud.tag(ops.media)
  	var $iframe = $(tag)
  	var iframe = $iframe[0]
  	$iframe.css('z-index', '-1')
  	this.el.appendChild( iframe )

  	var overlay = this.overlay = document.createElement("div")
  	overlay.style.width = "100%"
  	overlay.style.height = "100%"
  	overlay.style.position = "absolute"
  	overlay.style.top = "0"
  	overlay.style.left = "0"
  	overlay.style.zIndex = "2"
  	overlay.className = "overlay"
  	this.el.appendChild(overlay)
  	
  	this.player = SC.Widget( iframe )
  	this.player.setVolume(80)
  	
  	this.duration = 0
  	
  	this.player.bind(SC.Widget.Events.READY, this.ready.bind(this))
//   	this.player.bind(SC.Widget.Events.LOAD_PROGRESS, this.loadProgress.bind(this))
//   	this.player.bind(SC.Widget.Events.PLAY_PROGRESS, this.playProgress.bind(this))
  	this.player.bind(SC.Widget.Events.PLAY, this.didPlay.bind(this))
  	this.player.bind(SC.Widget.Events.PAUSE, this.didPause.bind(this))
  	this.player.bind(SC.Widget.Events.FINISH, this.finished.bind(this))
  },
  
  ready: function(){
		this.seek( this.media.keyframe || 0 )

  	if (this.media.autoplay) {
  	  this.play()
  	}

  	this.player.getDuration(function(duration){
  	  this.duration = duration
  	}.bind(this))
  },
  
  play: function(){
    this.player.play()
  },
  
  pause: function(){
    this.player.pause()
  },

  toggle: function(state){
    if (typeof state === "boolean") {
      if (state) this.play()
      else this.pause()
    }
    else {
      this.player.toggle()
    }
  },
  
  seek: function(n){
		if (n < 1) {
			n = n * this.duration
		}
		this.player.seekTo(n)
  },

  setLoop: function(state){
		this.media.loop = state
  },
  
  didPlay: function(){
    this.paused = false
  },
  
  didPause: function(){
    this.paused = true
  },
  
  finished: function(){
  	console.log("soundcloud finished")
  	if (this.media.loop) {
  		this.seek(0)
  		this.play()
  	}
  	else if (this.bound) {
  		$(".playButton").removeClass('playing')
  	}
  },
  
})