[IMP] web_editor, website(_*): show all snippets even if module is not installed

* mail_channel, mass_mailing, twitter, event

- t-install attribute holds the technical name of the module that
  needs to be install to use a particular snippet.

- Disable the drag & drop feature for these dummy snippets.

- Move some images to website module.

- Installed snippets display at the top of the list.

- Hide not-installed module snippets if user don't have rights to install module.

3 files changed, 42 insertions, 1 deletions

diff --git a/addons/web_editor/models/ir_qweb.py b/addons/web_editor/models/ir_qweb.py
index 71445d4919e..fcab2902a3b 100644
--- a/addons/web_editor/models/ir_qweb.py
+++ b/addons/web_editor/models/ir_qweb.py
@@ -50,6 +50,18 @@ class QWeb(models.AbstractModel):
         div = u'<div name="%s" data-oe-type="snippet" data-oe-thumbnail="%s">' % (escape(ir_qweb.unicodifier(name)), escape(ir_qweb.unicodifier(thumbnail)))
         return [self._append(ast.Str(div))] + self._compile_node(el, options) + [self._append(ast.Str(u'</div>'))]
 
+    def _compile_directive_install(self, el, options):
+        if self.user_has_groups('base.group_system'):
+            module = self.env['ir.module.module'].search([('name', '=', el.attrib.get('t-install'))])
+            if not module or module.state == 'installed':
+                return []
+            name = el.attrib.get('string') or 'Snippet'
+            thumbnail = el.attrib.pop('t-thumbnail', 'oe-thumbnail')
+            div = u'<div name="%s" data-oe-type="snippet" data-module-id="%s" data-oe-thumbnail="%s"><section/></div>' % (escape(ir_qweb.unicodifier(name)), module.id, escape(ir_qweb.unicodifier(thumbnail)))
+            return [self._append(ast.Str(div))]
+        else:
+            return []
+
     def _compile_directive_tag(self, el, options):
         if el.get('t-placeholder'):
             el.set('t-att-placeholder', el.attrib.pop('t-placeholder'))
@@ -60,6 +72,7 @@ class QWeb(models.AbstractModel):
     def _directives_eval_order(self):
         directives = super(QWeb, self)._directives_eval_order()
         directives.insert(directives.index('call'), 'snippet')
+        directives.insert(directives.index('call'), 'install')
         return directives
 
 
diff --git a/addons/web_editor/static/src/js/snippets.editor.js b/addons/web_editor/static/src/js/snippets.editor.js
index e11e3205815..d0b6394ecd9 100644
--- a/addons/web_editor/static/src/js/snippets.editor.js
+++ b/addons/web_editor/static/src/js/snippets.editor.js
@@ -251,12 +251,25 @@ data.Class = Widget.extend({
                         $div.find('.oe_snippet_thumbnail_img').css('background-image', 'url(' + thumbnail + ')');
                     }
                     // end
+
+                    var moduleID = $snippet.data('moduleId');
+                    if (moduleID) {
+                        $snippet.addClass('o_snippet_install');
+                        var $installBtn = $('<a/>', {
+                            class: 'btn btn-primary btn-sm o_install_btn',
+                            target: '_blank',
+                            href: '/web#id=' + moduleID + '&view_type=form&model=ir.module.module&action=base.open_module_tree',
+                            text: _t("Install"),
+                        });
+                        $div.append($installBtn);
+                    }
                 }
                 if (!$snippet.data("selector")) {
                     $("> *:not(.oe_snippet_thumbnail)", this).addClass('oe_snippet_body');
                 }
                 number++;
-            });
+            })
+            .not('[data-module-id]');
 
         // hide scroll if no snippets defined
         if (!number) {
diff --git a/addons/web_editor/static/src/less/web_editor.ui.less b/addons/web_editor/static/src/less/web_editor.ui.less
index 4f1eb7dc4be..f83a73984c4 100644
--- a/addons/web_editor/static/src/less/web_editor.ui.less
+++ b/addons/web_editor/static/src/less/web_editor.ui.less
@@ -86,6 +86,8 @@ html[lang] > body.editor_enable [data-oe-translation-state] {
 
 // SNIPPET PANEL
 #oe_snippets {
+    .o-w-preserve-btn();
+
     .o-flex-display();
     .o-flex-flow(column, nowrap);
     .o-position-absolute(0, auto, 0, -@o-we-sidebar-width);
@@ -173,6 +175,19 @@ html[lang] > body.editor_enable [data-oe-translation-state] {
                     }
                 }
 
+                &.o_snippet_install {
+                    .oe_snippet_thumbnail_img {
+                        opacity: 0.5;
+                    }
+                    .btn.o_install_btn {
+                        display: none;
+                        .o-position-absolute(16px, 4px, auto, 4px);
+                    }
+                    &:hover .btn.o_install_btn {
+                        display: block;
+                    }
+                }
+
                 &:nth-child(2n+1) {
                     clear: left;
                 }