diff --git a/app/views/templates/likes_info.jst b/app/views/templates/likes_info.jst
index 94f23bd3c..6758e5ffc 100644
--- a/app/views/templates/likes_info.jst
+++ b/app/views/templates/likes_info.jst
@@ -1,6 +1,16 @@
<% if(likes_count > 0) { %>
-
- <%= Diaspora.I18n.t('stream.likes', {count: likes_count}) %>
-
+ <% if(likes && likes.length == 0) { %>
+
+ <%= Diaspora.I18n.t('stream.likes', {count: likes_count}) %>
+
+ <% } else { %>
+
+ <% _.each(likes, function(like){ %>
+ ">
+
" class="avatar" title="<%= like.get("author").name %>"/>
+
+ <% }) %>
+
+ <% } %>
<% } %>
diff --git a/public/javascripts/app/models/post.js b/public/javascripts/app/models/post.js
index 8ab106e49..3560276f8 100644
--- a/public/javascripts/app/models/post.js
+++ b/public/javascripts/app/models/post.js
@@ -2,7 +2,7 @@ app.models.Post = Backbone.Model.extend({
urlRoot : "/posts",
initialize : function() {
this.comments = new app.collections.Comments(this.get("last_three_comments"), {post : this});
- this.likes = new app.collections.Likes(this.get("user_like"), { post : this}); // load in the user like initially
+ this.likes = new app.collections.Likes([], {post : this}); // load in the user like initially
},
createdAt : function() {
diff --git a/public/javascripts/app/views/likes_info_view.js b/public/javascripts/app/views/likes_info_view.js
index 9af8ed0ad..d889b1c67 100644
--- a/public/javascripts/app/views/likes_info_view.js
+++ b/public/javascripts/app/views/likes_info_view.js
@@ -2,6 +2,25 @@ app.views.LikesInfo = app.views.StreamObject.extend({
template_name : "#likes-info-template",
- className : "likes_container"
+ className : "likes_container",
+ events : {
+ "click .expand_likes" : "showAvatars"
+ },
+
+ tooltipSelector : ".avatar",
+
+ presenter : function() {
+ return _.extend(this.defaultPresenter(), {likes : this.model.likes.models})
+ },
+
+ showAvatars : function(evt){
+ if(evt) { evt.preventDefault() }
+ var self = this;
+ this.model.likes.fetch()
+ .done(function(resp){
+ // set like attribute and like collection
+ self.model.set({likes : self.model.likes.reset(resp)})
+ })
+ }
});
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index 142b3ec21..34d27c8cc 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -3449,9 +3449,11 @@ a.toggle_selector
.likes_list
.avatar
+ :position relative
:float none
:height 20px
:width 20px
+ :top 5px
#gs-name-form-spinner
:position absolute
diff --git a/spec/javascripts/app/views/likes_info_spec.js b/spec/javascripts/app/views/likes_info_view_spec.js
similarity index 64%
rename from spec/javascripts/app/views/likes_info_spec.js
rename to spec/javascripts/app/views/likes_info_view_spec.js
index 53e4855be..fa2ad9acd 100644
--- a/spec/javascripts/app/views/likes_info_spec.js
+++ b/spec/javascripts/app/views/likes_info_view_spec.js
@@ -28,5 +28,24 @@ describe("app.views.LikesInfo", function(){
expect($(this.view.el).html().trim()).toBe("");
})
})
+
+ describe("showAvatars", function(){
+ beforeEach(function(){
+ spyOn(this.post.likes, "fetch").andCallThrough()
+ })
+
+ it("calls fetch on the model's like collection", function(){
+ this.view.showAvatars();
+ expect(this.post.likes.fetch).toHaveBeenCalled();
+ })
+
+ it("sets the fetched response to the model's likes", function(){
+ //placeholder... not sure how to test done functionalty here
+ })
+
+ it("re-renders the view", function(){
+ //placeholder... not sure how to test done functionalty here
+ })
+ })
})