[IMP] OpenChatter: display who likes a post

Cherry-picked from 8e7dfaed151dcc9ed3a5b4bdd87e8afcad51a765
Closes #1729

addons/mail/mail_message.py

@@ -579,6 +579,16 @@ class mail_message(osv.Model):
             thread_level=thread_level, message_unload_ids=message_unload_ids, domain=domain, parent_id=parent_id, context=context)
         return message_list
 
+    def get_likers_list(self, cr, uid, ids, limit=10, context=None):
+        """ Return the people list who liked this message. """
+        voter_names = []
+        message = self.browse(cr, uid, ids, context=context)
+        for voter in message.vote_user_ids[:limit]:
+            voter_names.append(voter.name)
+        if len(message.vote_user_ids) > limit:
+            voter_names.append(_("and %s others like this") % (len(message.vote_user_ids) - limit))
+        return voter_names
+
     #------------------------------------------------------
     # mail_message internals
     #------------------------------------------------------

addons/mail/static/src/css/mail.css

@@ -1,9 +1,23 @@
 /* ------------ TOPBAR MAIL BUTTON --------------- */
-.oe_systray #oe_topbar_compose_full_email_icon {
+
+/* FIXME this css is not very pretty because it uses a 
+ * 'button' element wich comes with a lot of inappropriate 
+ * styling. Entypo is also a headache to center properly
+ * */
+.openerp .oe_topbar_item.oe_topbar_compose_full_email{ 
+    padding: 0px;
+    width: 32px;
+    height: 32px;
+}
+.openerp .oe_topbar_item.oe_topbar_compose_full_email button{
+    position: relative;
+    top: -3px;  /* centering entypo ... urgh */
+    box-sizing: border-box;
+    border: none;
+    box-shadow: none;
     color: white;
     margin-right: 15px;
 }
-
 /* ------------ MAIL WIDGET --------------- */
 .openerp .oe_mail, .openerp .oe_mail *{
     -webkit-box-sizing: border-box;
@@ -136,6 +150,7 @@
     padding-left: 3px;
     padding-right: 5px;
     margin-right: 5px;
+    padding-top: 2px;
 }
 
 /* c) Message action icons */

addons/mail/static/src/js/mail.js

@@ -916,12 +916,63 @@ openerp.mail = function (session) {
             this.$('.oe_reply').on('click', this.on_message_reply);
             this.$('.oe_star').on('click', this.on_star);
             this.$('.oe_msg_vote').on('click', this.on_vote);
+            this.$('.oe_mail_vote_count').on('mouseenter', this.on_hover);
             this.$('.oe_mail_expand').on('click', this.on_expand);
             this.$('.oe_mail_reduce').on('click', this.on_expand);
             this.$('.oe_mail_action_model').on('click', this.on_record_clicked);
             this.$('.oe_mail_action_author').on('click', this.on_record_author_clicked);
         },
-
+        on_hover : function(event){
+            var self = this;
+            var voter = "";
+            var limit = 10;
+            event.stopPropagation();
+            var $target = $(event.target).hasClass("fa-thumbs-o-up") ? $(event.target).parent() : $(event.target);
+            //Note: We can set data-content attr on target element once we fetch data so that next time when one moves mouse on element it saves call
+            //But if there is new like comes then we'll not have new likes in popover in that case
+            if ($target.data('liker-list'))
+            {
+                voter = $target.data('liker-list');
+                self.bindTooltipTo($target, voter);
+                $target.tooltip('hide').tooltip('show');
+                $(".tooltip").on("mouseleave", function () {
+                    $(this).remove();
+                });
+            }else{
+                this.ds_message.call('get_likers_list', [this.id, limit])
+                .done(function (data) {
+                    _.each(data, function(people, index) {
+                        voter = voter + people.substring(0,1).toUpperCase() + people.substring(1);
+                        if(index != data.length-1) {
+                            voter = voter + "<br/>";
+                        }
+                    });
+                    $target.data('liker-list', voter);
+                    self.bindTooltipTo($target, voter);
+                    $target.tooltip('hide').tooltip('show');
+                    $(".tooltip").on("mouseleave", function () {
+                        $(this).remove();
+                    });
+                });
+            }
+            return true;
+        },
+        bindTooltipTo: function($el, value) {
+            $el.tooltip({
+                'title': value,
+                'placement': 'top',
+                'container': this.el,
+                'html': true,
+                'trigger': 'manual',
+                'animation': false
+             }).on("mouseleave", function () {
+                setTimeout(function () {
+                    if (!$(".tooltip:hover").length) {
+                        $el.tooltip("hide");
+                    }
+                },100);
+            });
+        },
         on_record_clicked: function  (event) {
             event.preventDefault();
             var self = this;
@@ -1124,6 +1175,7 @@ openerp.mail = function (session) {
             this.$(".oe_msg_footer:first .oe_mail_vote_count").remove();
             this.$(".oe_msg_footer:first .oe_msg_vote").replaceWith(vote_element);
             this.$('.oe_msg_vote').on('click', this.on_vote);
+            this.$('.oe_mail_vote_count').on('mouseenter', this.on_hover);
         },
 
         /**