[IMP] (website)_mass_mailing: make newsletter popup use popup snippet

Before this commit, the newsletter popup was using its own mechanism instead of
the popup snippet, making a lot of extra code.

Now, the newsletter popup snippet just use the behavior of both the popup
snippet and the newsletter snippet.

Community: https://github.com/odoo/odoo/pull/74667
Upgrade: https://github.com/odoo/upgrade/pull/2742
task-2246975
This commit is contained in:
Romain Derie
2021-08-20 12:05:06 +00:00
parent 6bd5c69ed6
commit 8873fe7240
15 changed files with 75 additions and 344 deletions
-10
View File
@@ -33,7 +33,6 @@ var EditPageMenu = websiteNavbarData.WebsiteNavbarActionWidget.extend({
edition_was_stopped: '_onEditionWasStopped',
request_save: '_onSnippetRequestSave',
request_cancel: '_onSnippetRequestCancel',
get_clean_html: '_onGetCleanHTML',
}),
/**
@@ -506,15 +505,6 @@ var EditPageMenu = websiteNavbarData.WebsiteNavbarActionWidget.extend({
this._addEditorMessages();
}
},
/**
* Get the cleaned value of the editable element.
*
* @private
* @param {OdooEvent} ev
*/
_onGetCleanHTML: function (ev) {
ev.data.callback(this.wysiwyg.getValue({$layout: ev.data.$layout}));
},
/**
* Snippet (menu_data) can request to save the document to leave the page
*
@@ -59,6 +59,12 @@ const PopupWidget = publicWidget.Widget.extend({
$(document).on('mouseleave.open_popup', () => this._showPopup());
}
},
/**
* @private
*/
_canShowPopup() {
return true;
},
/**
* @private
*/
@@ -69,7 +75,7 @@ const PopupWidget = publicWidget.Widget.extend({
* @private
*/
_showPopup: function () {
if (this._popupAlreadyShown) {
if (this._popupAlreadyShown || !this._canShowPopup()) {
return;
}
this.$target.find('.modal').modal('show');
+1 -3
View File
@@ -12,10 +12,8 @@ On a simple click, your visitors can subscribe to mailing lists managed in the E
'category': 'Website/Website',
'depends': ['website', 'mass_mailing', 'google_recaptcha'],
'data': [
'security/ir.model.access.csv',
'views/snippets/s_popup.xml',
'views/snippets_templates.xml',
'views/mailing_list_views.xml',
'views/website_mass_mailing_views.xml',
],
'auto_install': ['website', 'mass_mailing'],
'assets': {
@@ -3,7 +3,6 @@
from odoo import _
from odoo.http import route, request
from odoo.osv import expression
from odoo.addons.mass_mailing.controllers import main
@@ -46,35 +45,7 @@ class MassMailController(main.MassMailController):
subscription.opt_out = False
# add email to session
request.session['mass_mailing_email'] = email
mass_mailing_list = request.env['mailing.list'].sudo().browse(list_id)
return {
'toast_type': 'success',
'toast_content': mass_mailing_list.toast_content
'toast_content': _("Thanks for subscribing!"),
}
@route(['/website_mass_mailing/get_content'], type='json', website=True, auth="public")
def get_mass_mailing_content(self, newsletter_id, **post):
PopupModel = request.env['website.mass_mailing.popup'].sudo()
data = self.is_subscriber(newsletter_id, **post)
domain = expression.AND([request.website.website_domain(), [('mailing_list_id', '=', newsletter_id)]])
mass_mailing_popup = PopupModel.search(domain, limit=1)
if mass_mailing_popup:
data['popup_content'] = mass_mailing_popup.popup_content
else:
data.update(PopupModel.default_get(['popup_content']))
return data
@route(['/website_mass_mailing/set_content'], type='json', website=True, auth="user")
def set_mass_mailing_content(self, newsletter_id, content, **post):
PopupModel = request.env['website.mass_mailing.popup']
domain = expression.AND([request.website.website_domain(), [('mailing_list_id', '=', newsletter_id)]])
mass_mailing_popup = PopupModel.search(domain, limit=1)
if mass_mailing_popup:
mass_mailing_popup.write({'popup_content': content})
else:
PopupModel.create({
'mailing_list_id': newsletter_id,
'popup_content': content,
'website_id': request.website.id,
})
return True
@@ -1,6 +1,4 @@
# -*- coding: utf-8 -*-
# Part of Odoo. See LICENSE file for full copyright and licensing details.
from . import mailing_list
from . import website_mass_mailing
from . import res_company
@@ -1,15 +0,0 @@
# -*- coding: utf-8 -*-
# Part of Odoo. See LICENSE file for full copyright and licensing details.
from odoo import fields, models
from odoo.tools.translate import _
class MailingList(models.Model):
_inherit = 'mailing.list'
def _default_toast_content(self):
return _('<p>Thanks for subscribing!</p>')
website_popup_ids = fields.One2many('website.mass_mailing.popup', 'mailing_list_id', string="Website Popups")
toast_content = fields.Html(default=_default_toast_content, translate=True)
@@ -1,16 +0,0 @@
# -*- coding: utf-8 -*-
# Part of Odoo. See LICENSE file for full copyright and licensing details.
from odoo import fields, models
class MassMailingPopup(models.Model):
_name = 'website.mass_mailing.popup'
_description = "Mailing list popup"
def _default_popup_content(self):
return self.env['ir.ui.view']._render_template('website_mass_mailing.s_newsletter_subscribe_popup_content')
mailing_list_id = fields.Many2one('mailing.list')
website_id = fields.Many2one('website')
popup_content = fields.Html(string="Website Popup Content", default=_default_popup_content, translate=True, sanitize=False)
@@ -1,2 +0,0 @@
id,name,model_id:id,group_id:id,perm_read,perm_write,perm_create,perm_unlink
access_mass_mailing_popup,website.mail.popup,model_website_mass_mailing_popup,mass_mailing.group_mass_mailing_user,1,1,1,1
1 id name model_id:id group_id:id perm_read perm_write perm_create perm_unlink
2 access_mass_mailing_popup website.mail.popup model_website_mass_mailing_popup mass_mailing.group_mass_mailing_user 1 1 1 1
@@ -96,77 +96,4 @@ options.registry.recaptchaSubscribe = options.Class.extend({
return this._super(...arguments);
},
});
options.registry.newsletter_popup = options.registry.mailing_list_subscribe.extend({
popup_template_id: "editor_new_mailing_list_subscribe_popup",
popup_title: _t("Add a Newsletter Subscribe Popup"),
/**
* @override
*/
start: function () {
this.$target.on('hidden.bs.modal.newsletter_popup_option', () => {
this.trigger_up('snippet_option_visibility_update', {show: false});
});
return this._super(...arguments);
},
/**
* @override
*/
onTargetShow: function () {
// Open the modal
this.$target.data('quick-open', true);
return this._refreshPublicWidgets();
},
/**
* @override
*/
onTargetHide: function () {
// Close the modal
const $modal = this.$('.modal');
if ($modal.length && $modal.is('.modal_shown')) {
$modal.modal('hide');
}
},
/**
* @override
*/
cleanForSave: function () {
var self = this;
var content = this.$target.data('content');
if (content) {
this.trigger_up('get_clean_html', {
$layout: $('<div/>').html(content),
callback: function (html) {
self.$target.data('content', html);
},
});
}
this._super.apply(this, arguments);
},
/**
* @override
*/
destroy: function () {
this.$target.off('.newsletter_popup_option');
this._super.apply(this, arguments);
},
//--------------------------------------------------------------------------
// Options
//--------------------------------------------------------------------------
/**
* @override
*/
select_mailing_list: function () {
var self = this;
return this._super.apply(this, arguments).then(function () {
self.$target.data('quick-open', true);
self.$target.removeData('content');
return self._refreshPublicWidgets();
});
},
});
});
@@ -1,10 +1,7 @@
odoo.define('mass_mailing.website_integration', function (require) {
"use strict";
var config = require('web.config');
var core = require('web.core');
var Dialog = require('web.Dialog');
var utils = require('web.utils');
var publicWidget = require('web.public.widget');
const {ReCaptcha} = require('google_recaptcha.ReCaptchaV3');
@@ -37,12 +34,6 @@ publicWidget.registry.subscribe = publicWidget.Widget.extend({
start: function () {
var self = this;
var def = this._super.apply(this, arguments);
this.$popup = this.$target.closest('.o_newsletter_modal');
if (this.$popup.length) {
// No need to check whether the user subscribed or not if the input
// is in a popup as the popup won't open if he did subscribe.
return def;
}
var always = function (data) {
var isSubscriber = data.is_subscriber;
@@ -102,8 +93,9 @@ publicWidget.registry.subscribe = publicWidget.Widget.extend({
self.$(".js_subscribe_btn").addClass('d-none');
self.$(".js_subscribed_btn").removeClass('d-none');
self.$('input.js_subscribe_email').prop('disabled', !!result);
if (self.$popup.length) {
self.$popup.modal('hide');
const $popup = self.$target.closest('.o_newsletter_modal');
if ($popup.length) {
$popup.modal('hide');
}
}
self.displayNotification({
@@ -115,114 +107,4 @@ publicWidget.registry.subscribe = publicWidget.Widget.extend({
});
},
});
publicWidget.registry.newsletter_popup = publicWidget.Widget.extend({
selector: ".o_newsletter_popup",
disabledInEditableMode: false,
/**
* @override
*/
start: function () {
var self = this;
var defs = [this._super.apply(this, arguments)];
this.websiteID = this._getContext().website_id;
this.listID = parseInt(this.$target.attr('data-list-id'));
if (!this.listID || (utils.get_cookie(_.str.sprintf("newsletter-popup-%s-%s", this.listID, this.websiteID)) && !self.editableMode)) {
return Promise.all(defs);
}
if (this.$target.data('content') && this.editableMode) {
// To avoid losing user changes.
this._dialogInit(this.$target.data('content'));
this.$target.removeData('quick-open');
this.massMailingPopup.open();
} else {
defs.push(this._rpc({
route: '/website_mass_mailing/get_content',
params: {
newsletter_id: self.listID,
},
}).then(function (data) {
self._dialogInit(data.popup_content, data.email || '');
if (!self.editableMode && !data.is_subscriber) {
if (config.device.isMobile) {
setTimeout(function () {
self._showBanner();
}, 5000);
} else {
$(document).on('mouseleave.open_popup_event', self._showBanner.bind(self));
}
} else {
$(document).off('mouseleave.open_popup_event');
}
// show popup after choosing a newsletter
if (self.$target.data('quick-open')) {
self.massMailingPopup.open();
self.$target.removeData('quick-open');
}
}));
}
return Promise.all(defs);
},
/**
* @override
*/
destroy: function () {
if (this.massMailingPopup) {
this.massMailingPopup.close();
}
this._super.apply(this, arguments);
},
//--------------------------------------------------------------------------
// Private
//--------------------------------------------------------------------------
/**
* @param {string} content
* @private
*/
_dialogInit: function (content, email) {
var self = this;
this.massMailingPopup = new Dialog(this, {
technical: false,
$content: $('<div/>').html(content),
$parentNode: this.$target,
backdrop: !this.editableMode,
dialogClass: 'p-0' + (this.editableMode ? ' oe_structure oe_empty' : ''),
renderFooter: false,
size: 'medium',
});
this.massMailingPopup.opened().then(function () {
var $modal = self.massMailingPopup.$modal;
$modal.find('header button.close').on('mouseup', function (ev) {
ev.stopPropagation();
});
$modal.addClass('o_newsletter_modal');
$modal.find('.oe_structure').attr('data-editor-message', _t('DRAG BUILDING BLOCKS HERE'));
$modal.find('.modal-dialog').addClass('modal-dialog-centered');
$modal.find('.js_subscribe').data('list-id', self.listID)
.find('input.js_subscribe_email').val(email);
self.trigger_up('widgets_start_request', {
editableMode: self.editableMode,
$target: $modal,
});
});
this.massMailingPopup.on('closed', this, function () {
var $modal = self.massMailingPopup.$modal;
if ($modal) { // The dialog might have never been opened
self.$el.data('content', $modal.find('.modal-body').html());
}
});
},
/**
* @private
*/
_showBanner: function () {
this.massMailingPopup.open();
utils.set_cookie(_.str.sprintf("newsletter-popup-%s-%s", this.listID, this.websiteID), true);
$(document).off('mouseleave.open_popup_event');
},
});
});
@@ -0,0 +1,27 @@
/** @odoo-module **/
import PopupWidget from 'website.s_popup';
PopupWidget.include({
//--------------------------------------------------------------------------
// Private
//--------------------------------------------------------------------------
/**
* Prevents the (newsletter) popup to be shown if the user is subscribed.
*
* @override
*/
_canShowPopup() {
if (
this.$el.is('.o_newsletter_popup') &&
this.$el.find('input.js_subscribe_email').prop('disabled')
) {
return false;
}
return this._super(...arguments);
},
});
export default PopupWidget;
@@ -1,26 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<record id="mailing_list_view_form" model="ir.ui.view">
<field name="name">mailing.list.view.form.inherit.website</field>
<field name="model">mailing.list</field>
<field name="inherit_id" ref="mass_mailing.mailing_list_view_form"/>
<field name="arch" type="xml">
<xpath expr="//sheet" position="inside">
<notebook>
<page string="Toast Content" name="toast_content">
<field name="toast_content" nolabel="1"/>
</page>
<page string="Website popups" name="website_popups" attrs="{'invisible': [('website_popup_ids', '=', [])]}">
<field name="website_popup_ids">
<tree create="0">
<field name="write_date"/>
<field name="create_date"/>
<field name="website_id"/>
</tree>
</field>
</page>
</notebook>
</xpath>
</field>
</record>
</odoo>
@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<record id="website_mass_mailing.s_popup_000_js" model="ir.asset">
<field name="name">Popup 000 JS Website Mass Mailing Override</field>
<field name="bundle">web.assets_frontend</field>
<field name="path">website_mass_mailing/static/src/snippets/s_popup/000.js</field>
</record>
</odoo>
@@ -51,26 +51,34 @@
</template>
<template id="s_newsletter_subscribe_popup" name="Newsletter Popup">
<div class="o_newsletter_popup o_snippet_invisible" data-list-id="0"/>
</template>
<template id="s_newsletter_subscribe_popup_content" name="Newsletter Popup Content">
<section class="s_text_block oe_img_bg o_bg_img_center pt88 pb64" data-snippet="s_text_block"
style="background-image: url('/web/image/website.s_cover_default_image'); background-position: 0 100%;">
<div class="container s_allow_columns">
<h1 style="text-align: center;">Always <b>First</b>.</h1>
<p style="text-align: center;">Be the first to find out all the latest news,<br/> products, and trends.</p>
</div>
</section>
<section class="s_text_block" data-snippet="s_text_block">
<div class="container">
<div class="row s_nb_column_fixed no-gutters">
<div class="col-lg-8 offset-lg-2 pt32 pb32">
<t t-snippet-call="website_mass_mailing.s_newsletter_subscribe_form"/>
<div class="s_popup o_newsletter_popup o_snippet_invisible" data-name="Newsletter Popup" data-vcss="001" data-invisible="1">
<div class="modal fade s_popup_middle o_newsletter_modal"
style="background-color: var(--black-50) !important;"
data-show-after="5000" data-display="afterDelay" data-consents-duration="7"
data-focus="false" data-backdrop="false" tabindex="-1" role="dialog">
<div class="modal-dialog d-flex">
<div class="modal-content oe_structure">
<div class="s_popup_close js_close_popup o_we_no_overlay o_not_editable" aria-label="Close">&#215;</div>
<section class="s_text_block oe_img_bg o_bg_img_center pt88 pb64" data-snippet="s_text_block" data-name="Text"
style="background-image: url('/web/image/website.s_cover_default_image'); background-position: 0 100%;">
<div class="container s_allow_columns">
<h1 style="text-align: center;">Always <b>First</b>.</h1>
<p style="text-align: center;">Be the first to find out all the latest news,<br/> products, and trends.</p>
</div>
</section>
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<div class="row s_nb_column_fixed no-gutters">
<div class="col-lg-8 offset-lg-2 pt32 pb32">
<t t-snippet-call="website_mass_mailing.s_newsletter_subscribe_form"/>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
</section>
</div>
</template>
<template id="newsletter_subscribe_options" name="Newsletter Subscribe Options" inherit_id="website.snippet_options">
@@ -78,8 +86,7 @@
<xpath expr="//div" position="after">
<t t-set="selector" t-value="'.js_subscribe'"/>
<div data-js="mailing_list_subscribe"
t-att-data-selector="selector"
t-attf-data-exclude=".o_newsletter_modal #{selector}">
t-att-data-selector="selector">
<we-button data-select_mailing_list="" data-no-preview="true">Change Newsletter</we-button>
</div>
<div data-js="recaptchaSubscribe"
@@ -88,10 +95,6 @@
<we-checkbox t-if="recaptcha_public_key" string="Show reCaptcha Policy" data-toggle-recaptcha-legal="" data-no-preview="true"/>
</div>
<div t-att-data-selector="selector" data-drop-near="p, h1, h2, h3, blockquote, .card"/>
<div data-js="newsletter_popup"
data-selector=".o_newsletter_popup">
<we-button data-select_mailing_list="" data-no-preview="true">Change Newsletter</we-button>
</div>
</xpath>
<xpath expr="//div[@data-js='anchor']" position="attributes">
<attribute name="data-exclude" add=".o_newsletter_popup" separator=","/>
@@ -1,22 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<record id="view_mail_mass_mailing_popup_form" model="ir.ui.view">
<field name="name">website.mass_mailing.popup.form</field>
<field name="model">website.mass_mailing.popup</field>
<field name="arch" type="xml">
<form>
<sheet>
<group>
<field name="website_id" groups="website.group_multi_website"/>
</group>
<label for="popup_content"/>
<field name="popup_content" widget="html" options="{
'snippets': 'website.snippets',
'cssEdit': 'website_mass_mailing.iframe_css_assets_edit',
'wrapper': 'website_mass_mailing.edition.wrapper',
}"/>
</sheet>
</form>
</field>
</record>
</odoo>