[IMP] website_forum: extended biography

The biography of established users (with high karma) can be seen
with an expanded tooltip. This gives to users that participate
some kind of reward and gratitude of their work.

addons/website_forum/models/forum.py

@@ -125,6 +125,7 @@ class Forum(models.Model):
     karma_dofollow = fields.Integer(string='Nofollow links', help='If the author has not enough karma, a nofollow attribute is added to links', default=500)
     karma_editor = fields.Integer(string='Editor Features: image and links',
                                   default=30, oldname='karma_editor_link_files')
+    karma_user_bio = fields.Integer(string='Display detailed user biography', default=750)
 
     @api.one
     @api.constrains('allow_question', 'allow_discussion', 'allow_link', 'default_post_type')
@@ -316,6 +317,7 @@ class Post(models.Model):
     can_comment = fields.Boolean('Can Comment', compute='_get_post_karma_rights')
     can_comment_convert = fields.Boolean('Can Convert to Comment', compute='_get_post_karma_rights')
     can_view = fields.Boolean('Can View', compute='_get_post_karma_rights')
+    can_display_biography = fields.Boolean('Can userbiography of the author be viewed', compute='_get_post_karma_rights')
 
     @api.multi
     def _get_post_karma_rights(self):
@@ -344,6 +346,7 @@ class Post(models.Model):
             post.can_comment = is_admin or user.karma >= post.karma_comment
             post.can_comment_convert = is_admin or user.karma >= post.karma_comment_convert
             post.can_view = is_admin or user.karma >= post.karma_close or post_sudo.create_uid.karma > 0
+            post.can_display_biography = is_admin or post_sudo.create_uid.karma >= post.forum_id.karma_user_bio
 
     @api.one
     @api.constrains('post_type', 'forum_id')

addons/website_forum/static/src/css/website_forum.css

@@ -45,11 +45,15 @@
   height: auto !important;
 }
 
-img.img-avatar {
+img.o_forum_avatar {
   max-height: 40px;
   margin-right: 10px;
 }
 
+img.o_forum_avatar_big {
+  max-width: 75px;
+  margin-right: 10px; }
+
 .oe_grey {
   background-color: #eeeeee;
 }
@@ -143,3 +147,27 @@ button.btn-link.text-muted {
   color: #999;
 }
 
+.o_forum_user_bio_expand {
+  position: absolute;
+  z-index: 200;
+  display: none; }
+
+.o_forum_tooltip_heading {
+  padding: 0px;
+  margin: 0px;
+  font-size: 18px; }
+
+.o_forum_user_bio {
+  color: black;
+  width: 318px;
+  min-height: 100px;
+  cursor: auto;
+  border: 1px solid darkgray;
+  background-color: whitesmoke;
+  line-height: 13px;
+  font-size: 11px;
+  word-wrap: break-word; }
+  .o_forum_user_bio .o_forum_tooltip_line {
+    min-height: 13px; }
+  .o_forum_user_bio .o_forum_tooltip_header {
+    min-height: 75px; }

addons/website_forum/static/src/css/website_forum.sass

@@ -36,10 +36,14 @@
     max-width: 600px
     height: auto !important
 
-img.img-avatar
+img.o_forum_avatar
   max-height: 40px
   margin-right: 10px
 
+img.o_forum_avatar_big
+  max-width: 75px
+  margin-right: 10px
+
 .oe_grey
   background-color: #eeeeee
 
@@ -112,3 +116,28 @@ a.no-decoration
 
 button.btn-link.text-muted
   color: #999
+
+.o_forum_user_bio_expand
+  position: absolute
+  z-index: 200
+  display: none
+
+.o_forum_tooltip_heading
+  padding: 0px
+  margin: 0px
+  font-size: 18px
+
+.o_forum_user_bio
+  color: black
+  width: 318px
+  min-height: 100px
+  cursor: auto
+  border: 1px solid darkgray
+  background-color: whitesmoke
+  line-height: 13px
+  font-size: 11px
+  word-wrap: break-word
+  .o_forum_tooltip_line
+    min-height: 13px
+  .o_forum_tooltip_header
+    min-height: 75px

addons/website_forum/static/src/js/website_forum.js

@@ -28,6 +28,23 @@ if(!$('.website_forum').length) {
         }
     });
 
+    // Extended user biography toogle
+    $('.o_forum_user_info').hover(
+        function () {
+           $(this).parent().find('.o_forum_user_bio_expand').delay(500).toggle('fast');
+        },
+        function () {
+            $(this).parent().find('.o_forum_user_bio_expand').clearQueue();
+        }
+    );
+
+    $('.o_forum_user_bio_expand').hover(
+        function () {},
+        function () {
+            $(this).fadeOut('fast');
+        }
+    );
+
     $('.vote_up,.vote_down').not('.karma_required').on('click', function (ev) {
         ev.preventDefault();
         var $link = $(ev.currentTarget);

addons/website_forum/views/ir_qweb.xml

@@ -4,6 +4,12 @@
     <xpath expr="//div[@itemprop='address']" position="after">
         <div>
              <div t-if="'karma' in fields" class='css_editable_mode_hidden'>
+                <div t-if="options.get('UserBio')">
+                    <span t-field="object.company_id.name" class="o_forum_tooltip_line"/><br/>
+                        <a t-att-href="object.company_id.website" t-if="object.company_id.website">
+                            <span t-field="object.company_id.website" class="o_forum_tooltip_line"/>
+                        </a>
+                </div>
                 <b><t t-esc="object.karma"/></b>
                 <div t-if="options.get('badges')" style="display: inline-block">
                     <t t-raw="separator"/>
@@ -16,7 +22,18 @@
                     <t t-esc="object.bronze_badge"/>
                 </div>
                 <t t-raw="0"/>
+                <div t-if="options.get('UserBio')">
+                    <div class="o_forum_tooltip_line" t-if="object.partner_id.country_id or object.partner_id.city">
+                        <span t-field="object.partner_id.city"/><span t-if="object.partner_id.city and object.partner_id.country_id">, </span><span t-field="object.partner_id.country_id"/>
+                    </div>
+                </div>
             </div>
+            <span t-if="options.get('website_description') and 'partner_id' in fields">
+                <t t-if="object.partner_id.website_description">
+                    <span t-field="object.partner_id.website_description"/>
+                </t>
+            </span>
+
         </div>
     </xpath>
 </template>

addons/website_forum/views/website_forum.xml

@@ -287,6 +287,9 @@
                 </tr><tr>
                     <td class="faq-rep-item"><strong t-field="forum.karma_editor"/></td>
                     <td>insert text link, upload files</td>
+                </tr><tr>
+                    <td class="faq-rep-item"><strong t-field="forum.karma_user_bio"/></td>
+                    <td>your biography can be seen as tooltip</td>
                 </tr><tr>
                     <td class="faq-rep-item"><strong t-field="forum.karma_comment_unlink_own"/></td>
                     <td>delete own comment</td>
@@ -811,7 +814,12 @@
         </div>
         <div class="question-block">
             <div class="pull-right author-box">
-                <img class="pull-left img img-rounded img-avatar" t-attf-src="/forum/user/#{answer.create_uid.id}/avatar"/>
+                <div class="o_forum_user_bio_expand" t-if="answer.can_display_biography">
+                    <t t-call="website_forum.forum_user_tooltip"/>
+                </div>
+                <a t-attf-href="/forum/#{ slug(forum) }/user/#{ answer.create_uid.id }" class="o_forum_user_info">
+                    <img class="pull-left img img-rounded o_forum_avatar" t-attf-src="/forum/user/#{answer.create_uid.id}/avatar"/>
+                </a>
                 <a t-attf-href="/forum/#{ slug(forum) }/user/#{ answer.create_uid.id }"
                     t-field="answer.create_uid"
                     t-field-options='{"widget": "contact", "country_image": true, "fields": ["name", "country_id"]}'
@@ -884,6 +892,24 @@
     </div>
 </template>
 
+<!-- Template for user tooltip  -->
+<template id="forum_user_tooltip">
+    <div class="o_forum_user_bio text-left panel panel-body">
+        <a t-attf-href="/forum/#{ slug(forum) }/user/#{ answer.create_uid.id }">
+            <img class="pull-left img img-rounded o_forum_avatar_big" t-attf-src="/forum/user/#{answer.create_uid.id}/avatar"/>
+        </a>
+        <div class="o_forum_tooltip_header">
+            <h4 class="o_forum_tooltip_heading"><a t-attf-href="/forum/#{ slug(forum) }/user/#{ answer.create_uid.id }"
+                t-field="answer.create_uid"
+                t-field-options='{"widget": "contact", "country_image": true, "fields": ["name", "country_id"]}'
+                style="display: inline-block;"/>
+            </h4>
+            <span t-field="answer.create_uid" t-field-options='{"widget": "contact", "UserBio": true, "badges": true, "fields": ["karma"]}'/>
+        </div>
+        <div t-field="answer.create_uid" t-field-options='{"widget": "contact", "website_description": true, "fields": ["partner_id"]}'/>
+    </div>
+</template>
+
 <!-- Utility template: Post a Comment -->
 <template id="post_comment">
     <div class="row clearfix">
@@ -1012,7 +1038,7 @@
         </h4>
         <div class="row">
             <div class="col-sm-3 mt16" t-foreach="users" t-as="user">
-                <img class="pull-left img img-circle img-avatar" t-attf-src="/forum/user/#{user.id}/avatar"/>
+                <img class="pull-left img img-circle o_forum_avatar" t-attf-src="/forum/user/#{user.id}/avatar"/>
                 <div>
                     <a t-attf-href="/forum/#{slug(forum)}/user/#{user.id}" t-field="user.name"/>
                 </div>
@@ -1025,7 +1051,7 @@
     <t t-call="website_forum.header">
         <div t-foreach="users" t-as="row_users" class="row mt16">
             <div t-foreach="row_users" t-as="user" class="col-sm-4">
-                <img class="pull-left img img-circle img-avatar" t-attf-src="/forum/user/#{user.id}/avatar"/>
+                <img class="pull-left img img-circle o_forum_avatar" t-attf-src="/forum/user/#{user.id}/avatar"/>
                 <div>
                     <a t-attf-href="/forum/#{slug(forum)}/user/#{user.id}" t-field="user.name"/>
                     <t t-if="user.country_id">