rotating through images on hover

1 files changed, 26 insertions, 8 deletions

diff --git a/public/assets/javascripts/ui/site/ProjectList.js b/public/assets/javascripts/ui/site/ProjectList.js
index 149cd41..ebb0a96 100644
--- a/public/assets/javascripts/ui/site/ProjectList.js
+++ b/public/assets/javascripts/ui/site/ProjectList.js
@@ -1,4 +1,4 @@
-
+var projectListTimeout = null
 var ProjectList = View.extend({
 
 	el: ".projectList",
@@ -9,20 +9,38 @@ var ProjectList = View.extend({
 	},
 	
 	initialize: function(){
+	  this.$(".images").each(function(){
+	    $divs = $(this).children("div")
+	    $divs.hide()
+	    $divs.first().show()
+	    $(this).data("index", 0)
+	  })
 	},
 	
 	timeout: null,
-	enter: function(){
-    clearTimeout(this.timeout)
-    this.advance()
+	enter: function(e){
+    clearTimeout(projectListTimeout)
+    this.advance(e.currentTarget)
 	},
 	
-	leave: function(){
-    clearTimeout(this.timeout)
+	leave: function(e){
+    clearTimeout(projectListTimeout)
+    var $divs = $(e.currentTarget).find(".images div")
+    $divs.hide()
+    $divs.eq(0).show()
 	},
 	
-	advance: function(){
-    this.timeout = setTimeout(this.advance.bind(this), 500)
+	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)
 	}
 	
 /*