[IMP] website_blog: Add category to blog tags, Archives collapsed

This commit allow to sort blog tag by category.

And display archives by default folded to avoid
5 years x 12 months => 65 list items open

Task-34417

addons/website_blog/controllers/main.py

@@ -149,11 +149,15 @@ class WebsiteBlog(http.Controller):
                 tag_ids.append(current_tag)
             tag_ids = request.env['blog.tag'].browse(tag_ids).exists()
             return ','.join(slug(tag) for tag in tag_ids)
+
+        tag_category = sorted(all_tags.mapped('category_id'), key=lambda category: category.name.upper())
+        other_tags =  sorted(all_tags.filtered(lambda x: not x.category_id), key=lambda tag: tag.name.upper())
+
         values = {
             'blog': blog,
             'blogs': blogs,
             'main_object': blog,
-            'tags': all_tags,
+            'other_tags': other_tags,
             'state_info': {"state": state, "published": published_count, "unpublished": unpublished_count},
             'active_tag_ids': active_tag_ids,
             'tags_list' : tags_list,
@@ -163,6 +167,7 @@ class WebsiteBlog(http.Controller):
             'nav_list': self.nav_list(blog),
             'blog_url': blog_url,
             'date': date_begin,
+            'tag_category': tag_category,
         }
         response = request.render("website_blog.blog_post_short", values)
         return response

addons/website_blog/models/website_blog.py

@@ -77,6 +77,19 @@ class Blog(models.Model):
         return tag_by_blog
 
 
+class BlogTagCategory(models.Model):
+    _name = 'blog.tag.category'
+    _description = 'Blog Tag Category'
+    _order = 'name'
+
+    name = fields.Char('Name', required=True, translate=True)
+    tag_ids = fields.One2many('blog.tag', 'category_id', string='Tags')
+
+    _sql_constraints = [
+        ('name_uniq', 'unique (name)', "Tag category already exists !"),
+    ]
+
+
 class BlogTag(models.Model):
     _name = 'blog.tag'
     _description = 'Blog Tag'
@@ -84,6 +97,7 @@ class BlogTag(models.Model):
     _order = 'name'
 
     name = fields.Char('Name', required=True, translate=True)
+    category_id = fields.Many2one('blog.tag.category', 'Category', index=True)
     post_ids = fields.Many2many('blog.post', string='Posts')
 
     _sql_constraints = [

addons/website_blog/security/ir.model.access.csv

@@ -5,3 +5,5 @@ blog_post_all,blog.post,model_blog_post,,1,0,0,0
 blog_post,blog.post,model_blog_post,website.group_website_designer,1,1,1,1
 blog_tag,blog.tag,model_blog_tag,,1,0,0,0
 blog_tag_edition,blog.tag,model_blog_tag,website.group_website_designer,1,1,1,1
+blog_tag_category,blog.tag.category,model_blog_tag_category,,1,0,0,0
+blog_tag_category,blog.tag.category,model_blog_tag_category,website.group_website_designer,1,1,1,1

addons/website_blog/static/src/js/website_blog.js

@@ -62,6 +62,16 @@ $(document).ready(function() {
         $('.cover_footer').on('click', page_transist);
         $('a[href^="#blog_content"]').on('click', animate);
         $('.o_twitter, .o_facebook, .o_linkedin, .o_google, .o_twitter_complete, .o_facebook_complete, .o_linkedin_complete, .o_google_complete').on('click', shareArticle);
+        /* Archives years collapse */
+        $('.blog_post_year_collapse').on('click', function() {
+            $(this).find('i.fa').toggleClass('fa-chevron-down fa-chevron-right');
+        });
+        /* Collapse in active year */
+        var $activeYear = $('.blog_post_year li.active');
+        if ($activeYear.length) {
+            var id = $activeYear.closest('ul').attr('id');
+            $("li.blog_post_year_collapse[data-target='#"+ id +"']").click();
+        }
     }
 
     /* Sharing links hover in blogpost */

addons/website_blog/static/src/less/website_blog.less

@@ -220,4 +220,15 @@
             margin-top: 10px;
         }
     }
+
+    .blog_post_year_collapse {
+        cursor: pointer;
+        > i {
+            color: @brand-primary;
+        }
+    }
+
+    section.blog_tags ul.nav-pills li a {
+        padding: 2px 15px;
+    }
 }

addons/website_blog/views/website_blog_templates.xml

@@ -392,23 +392,43 @@
 </template>
 
 <!-- Option:Right Column: tags -->
+
+<template id="tag_category" name="Tags List">
+    <ul class="nav nav-pills ml16">
+        <t t-if="tags">
+            <div t-if='not hide_title' class='text-muted mt8'><i class='fa fa-tag'/> <t t-esc='categ_title' /></div>
+            <t t-foreach="tags" t-as="tag">
+                <t t-if="tag.post_ids">
+                    <li t-att-class="tag.id in active_tag_ids and 'active' or None">
+                        <a t-attf-href="#{blog_url(tag=tags_list(active_tag_ids, tag.id))}">
+                            <span t-field="tag.name"/>
+                        </a>
+                    </li>
+                </t>
+            </t>
+        </t>
+    </ul>
+</template>
+
 <template id="opt_blog_rc_tags" name="Tags"
         inherit_id="website_blog.index_right" active="True" customize_show="True">
     <xpath expr="//div[@id='main_column']" position="attributes">
         <attribute name="class">col-sm-8</attribute>
     </xpath>
     <xpath expr="//div[@id='blog_right_column']" position="inside">
-        <section class="mt32">
-        <h4>Tags</h4>
-        <ul class="nav nav-pills nav-stacked">
-            <t t-foreach="tags" t-as="nav_tag">
-            <li t-att-class="nav_tag.id in active_tag_ids and 'active' or None" style="display: inline-block;">
-                <a t-attf-href="#{blog_url(tag=tags_list(active_tag_ids, nav_tag.id))}">
-                    <span t-field="nav_tag.name"/>
-                </a>
-            </li>
+        <section class="mt32 blog_tags">
+            <h4>Tags</h4>
+            <t t-foreach="tag_category" t-as="nav_tag_category">
+                <t t-call="website_blog.tag_category">
+                    <t t-set='categ_title' t-value="nav_tag_category.name"/>
+                    <t t-set='tags' t-value='nav_tag_category.tag_ids' />
+                </t>
+            </t>
+            <t t-call="website_blog.tag_category">
+                <t t-set='hide_title' t-value='not len(tag_category)' />
+                <t t-set='categ_title'>Others</t>
+                <t t-set='tags' t-value='other_tags' />
             </t>
-        </ul>
         </section>
     </xpath>
 </template>
@@ -424,19 +444,19 @@
         <h4>Archives</h4>
         <ul class="nav nav-pills nav-stacked">
             <t t-foreach="nav_list" t-as="year">
-                <li t-esc="year"/>
-                <t t-foreach="nav_list[year]" t-as="months">
-                    <t t-if="months['date_begin'] == date">
-                        <li class="active">
+                <li data-toggle="collapse" t-att-data-target="'#' + year" aria-expanded="false" class="blog_post_year_collapse mt8">
+                    <i t-attf-class="fa #{'fa-chevron-down' if not date and year_index == 0 else 'fa-chevron-right'} mr4"/><span t-esc="year"/>
+                </li>
+                <ul t-attf-class="blog_post_year collapse nav nav-pills nav-stacked #{not date and year_index == 0 and 'in'}" t-att-id="year" role="menu">
+                    <t t-foreach="nav_list[year]" t-as="months">
+                        <li t-if="months['date_begin'] == date" class="active">
                             <a t-ignore="True" t-attf-href="#{blog_url(date_begin=False, date_end=False)}"><t t-esc="months['month']"/><span class="pull-right badge" t-esc="months['post_date_count']"/></a>
                         </li>
-                    </t>
-                    <t t-else="1">
-                        <li>
+                        <li t-else="1">
                             <a t-ignore="True" t-attf-href="#{blog_url(date_begin=months['date_begin'], date_end=months['date_end'])}"><t t-esc="months['month']"/><span class="pull-right badge" t-esc="months['post_date_count']"/></a>
                         </li>
                     </t>
-                </t>
+                </ul>
             </t>
         </ul>
         </section>

addons/website_blog/views/website_blog_views.xml

@@ -187,8 +187,9 @@
             <field name="name">blog_tag_tree</field>
             <field name="model">blog.tag</field>
             <field name="arch" type="xml">
-                <tree string="Tag List" create="false">
+                <tree string="Tag List">
                     <field name="name"/>
+                    <field name="category_id"/>
                     <field name="post_ids"/>
                 </tree>
             </field>
@@ -202,6 +203,7 @@
                     <sheet>
                         <group>
                             <field name="name"/>
+                            <field name="category_id"/>
                         </group>
                         <label for="post_ids" string="Used in: "/>
                         <field name="post_ids"/>
@@ -218,5 +220,41 @@
             <field name="view_id" ref="blog_tag_tree"/>
         </record>
 
-        <menuitem id="menu_blog_tag" parent="menu_website_blog_root" name="Blog Tags" action="action_tags" sequence="40" />
+        <menuitem id="menu_blog_tag" parent="menu_website_blog_root" name="Tags" action="action_tags" sequence="40" />
+
+        <record id="blog_tag_category_form" model="ir.ui.view">
+            <field name="name">blog_tag_category_form</field>
+            <field name="model">blog.tag.category</field>
+            <field name="arch" type="xml">
+                <form string="Tag Category Form">
+                    <sheet>
+                        <group>
+                            <field name="name"/>
+                        </group>
+                    </sheet>
+                </form>
+            </field>
+        </record>
+
+        <record id="blog_tag_category_tree" model="ir.ui.view">
+            <field name="name">blog_tag_category_tree</field>
+            <field name="model">blog.tag.category</field>
+            <field name="arch" type="xml">
+                <tree string="Tag Categories">
+                    <field name="name"/>
+                </tree>
+            </field>
+        </record>
+
+        <record id="action_tag_category" model="ir.actions.act_window">
+            <field name="name">Tag Category</field>
+            <field name="res_model">blog.tag.category</field>
+            <field name="view_type">form</field>
+            <field name="view_mode">tree,form</field>
+            <field name="view_id" ref="blog_tag_category_tree"/>
+        </record>
+
+        <menuitem id="menu_website_blog_tag_category" parent="menu_website_blog_root"
+                  name="Tag Categories" action="action_tag_category" sequence="50" />
+
 </odoo>