2 files changed, 97 insertions, 2 deletions

diff --git a/addons/website/static/src/js/backend/res_config_settings.js b/addons/website/static/src/js/backend/res_config_settings.js
index 47a52579447..ad9373d26f1 100644
--- a/addons/website/static/src/js/backend/res_config_settings.js
+++ b/addons/website/static/src/js/backend/res_config_settings.js
@@ -1,7 +1,14 @@
 odoo.define('website.settings', function (require) {
 
-var BaseSettingController = require('base.settings').Controller;
-var FormController = require('web.FormController');
+const BaseSettingController = require('base.settings').Controller;
+const core = require('web.core');
+const Dialog = require('web.Dialog');
+const FieldBoolean = require('web.basic_fields').FieldBoolean;
+const fieldRegistry = require('web.field_registry');
+const FormController = require('web.FormController');
+
+const QWeb = core.qweb;
+const _t = core._t;
 
 BaseSettingController.include({
 
@@ -33,4 +40,34 @@ BaseSettingController.include({
     },
 });
 
+const WebsiteCookiesbarField = FieldBoolean.extend({
+    xmlDependencies: ['/website/static/src/xml/website.res_config_settings.xml'],
+
+    _onChange: function () {
+        const checked = this.$input[0].checked;
+        if (!checked) {
+            return this._setValue(checked);
+        }
+
+        const cancelCallback = () => this.$input[0].checked = !checked;
+        Dialog.confirm(this, null, {
+            title: _t("Please confirm"),
+            $content: QWeb.render('website.res_config_settings.cookies_modal_main'),
+            buttons: [{
+                text: 'Do not activate',
+                classes: 'btn-primary',
+                close: true,
+                click: cancelCallback,
+            },
+            {
+                text: 'Activate anyway',
+                close: true,
+                click: () => this._setValue(checked),
+            }],
+            cancel_callback: cancelCallback,
+        });
+    },
+});
+
+fieldRegistry.add('website_cookiesbar_field', WebsiteCookiesbarField);
 });
diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index 9765bc57473..0ef07ccc12e 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -1,6 +1,7 @@
 odoo.define('website.editor.snippets.options', function (require) {
 'use strict';
 
+require('website.s_popup_options');
 var core = require('web.core');
 var Dialog = require('web.Dialog');
 const wUtils = require('website.utils');
@@ -913,6 +914,63 @@ options.registry.anchor = options.Class.extend({
     },
 });
 
+options.registry.CookiesBar = options.registry.SnippetPopup.extend({
+    xmlDependencies: (options.registry.SnippetPopup.prototype.xmlDependencies || []).concat(
+        ['/website/static/src/xml/website.cookies_bar.xml']
+    ),
+
+    //--------------------------------------------------------------------------
+    // Options
+    //--------------------------------------------------------------------------
+
+    /**
+     * Change the cookies bar layout.
+     *
+     * @see this.selectClass for parameters
+     */
+    selectLayout: function (previewMode, widgetValue, params) {
+        let websiteId;
+        this.trigger_up('context_get', {
+            callback: function (ctx) {
+                websiteId = ctx['website_id'];
+            },
+        });
+
+        const $template = $(qweb.render(`website.cookies_bar.${widgetValue}`, {
+            websiteId: websiteId,
+        }));
+
+        const $content = this.$target.find('.s_popup_content');
+        const selectorsToKeep = [
+            '.o_cookies_bar_text_button',
+            '.o_cookies_bar_text_policy',
+            '.o_cookies_bar_text_title',
+            '.o_cookies_bar_text_primary',
+            '.o_cookies_bar_text_secondary',
+        ];
+
+        if (this.$savedSelectors === undefined) {
+            this.$savedSelectors = [];
+        }
+
+        for (const selector of selectorsToKeep) {
+            const $currentLayoutEls = $content.find(selector).contents();
+            const $newLayoutEl = $template.find(selector);
+            if ($currentLayoutEls.length) {
+                // save value before change, eg 'title' is not inside 'discrete' template
+                // but we want to preserve it in case of select another layout later
+                this.$savedSelectors[selector] = $currentLayoutEls;
+            }
+            const $savedSelector = this.$savedSelectors[selector];
+            if ($newLayoutEl.length && $savedSelector && $savedSelector.length) {
+                $newLayoutEl.empty().append($savedSelector);
+            }
+        }
+
+        $content.empty().append($template);
+    },
+});
+
 /**
  * Allows edition of 'cover_properties' in website models which have such
  * fields (blogs, posts, events, ...).