var projectListTimeout = null
var ProjectList = View.extend({

	el: ".projectList",

	events: {
		"mouseenter .room": 'enter',
		"mouseleave .room": 'leave',
	},
	
	initialize: function(){
	  this.$(".images").each(function(){
	    $divs = $(this).children("div")
	    $divs.hide()
	    $divs.first().show()
	    $(this).data("index", 0)
	  })
	},
	
	timeout: null,
	enter: function(e){
    clearTimeout(projectListTimeout)
    this.advance(e.currentTarget)
	},
	
	leave: function(e){
    clearTimeout(projectListTimeout)
    var $divs = $(e.currentTarget).find(".images div")
    $divs.hide()
    $divs.eq(0).show()
	},
	
	advance: function(el){
    projectListTimeout = setTimeout(function(){
      this.advance(el)
    }.bind(this), 500)
	  var $images = $(el).find(".images")
	  var $divs = $images.children("div")
	  var index = $images.data("index")
	  var nextIndex = (index + 1) % $divs.length
    $divs.eq(index).hide()
    $divs.eq(nextIndex).show()
    $images.data("index", nextIndex)
	}
	
/*
	spinOn: function(e){
		var iframe = $(e.currentTarget).find("iframe").get('0')
		if (! iframe) return
		iframe.contentWindow.postMessage("spin-on", window.location.origin)
	},

	spinOff: function(e){
		var iframe = $(e.currentTarget).find("iframe").get('0')
		if (! iframe) return
		iframe.contentWindow.postMessage("spin-off", window.location.origin)
	}
*/

})