pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web_editor: properly reset to custom background option

Browse Source 
This commit solves a bug when using custom background option: if a
custom background was selected, then hovering a non-custom background
and leaving the dropdown was selecting the non-custom background for
good instead of resetting back to the custom one. This is because the
custom background option is a non-preview one (you have to click) so
there should not be any need of resetting... except that the non-custom
background option is a preview one and messes with the same DOM
attributes as the custom background option.
This commit is contained in:
qsm-odoo
2017-10-03 10:52:30 +02:00
parent 95d03559a2
commit 4e090b2a5e
1 changed files with 41 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/editor/snippets.options.js
+41 -12
View File
@@ -827,6 +827,7 @@ registry.background = SnippetOption.extend({
start: function () {
var res = this._super.apply(this, arguments);
this.bindBackgroundEvents();
this.__customImageSrc = this._getSrcFromCssValue();
return res;
},
@@ -840,9 +841,16 @@ registry.background = SnippetOption.extend({
* @see this.selectClass for parameters
*/
background: function (previewMode, value, $li) {
if (previewMode === 'reset' && value === undefined) {
// No background has been selected and we want to reset back to the
// original custom image
this._setCustomBackground(this.__customImageSrc);
return;
}
if (value && value.length) {
this.$target.css('background-image', 'url(\'' + value + '\')');
this.$target.addClass('oe_img_bg');
this.$target.removeClass('oe_custom_bg').addClass('oe_img_bg');
} else {
this.$target.css('background-image', '');
this.$target.removeClass('oe_img_bg oe_custom_bg');
@@ -868,11 +876,7 @@ registry.background = SnippetOption.extend({
_editor.$('[href="#editor-media-video"], [href="#editor-media-icon"]').addClass('hidden');
_editor.on('save', this, function () {
var value = $image.attr('src');
this.background(previewMode, value, $li);
this.$target.addClass('oe_custom_bg');
this._setActive();
this.$target.trigger('snippet-option-change', [this]);
this._setCustomBackground($image.attr('src'));
});
_editor.on('closed', this, function () {
$image.remove();
@@ -907,17 +911,27 @@ registry.background = SnippetOption.extend({
// Private
//--------------------------------------------------------------------------
/**
* Returns the src value from a css value related to a background image
* (e.g. "url('blabla')" => "blabla" / "none" => "").
*
* @private
* @param {string} value
* @returns {string}
*/
_getSrcFromCssValue: function (value) {
if (value === undefined) {
value = this.$target.css('background-image');
}
return value.replace(/url\(['"]*|['"]*\)|^none$/g, '');
},
/**
* @override
*/
_setActive: function () {
this._super.apply(this, arguments);
var src = this.$target.css('background-image').replace(/url\(['"]*|['"]*\)|^none$/g, '');
if (this.$target.hasClass('oe_custom_bg')) {
this.$el.find('li[data-choose-image]').data('background', src).attr('data-background', src);
}
var src = this._getSrcFromCssValue();
this.$el.find('li[data-background]')
.removeClass('active')
.filter(function () {
@@ -925,7 +939,22 @@ registry.background = SnippetOption.extend({
return (bgOption === '' && src === '' || bgOption !== '' && src.indexOf(bgOption) >= 0);
})
.addClass('active');
}
this.$el.find('li[data-choose-image]').toggleClass('active', this.$target.hasClass('oe_custom_bg'));
},
/**
* Sets the given value as custom background image.
*
* @private
* @param {string} value
*/
_setCustomBackground: function (value) {
this.__customImageSrc = this._getSrcFromCssValue(value);
this.background(false, this.__customImageSrc);
this.$target.addClass('oe_custom_bg');
this._setActive();
this.$target.trigger('snippet-option-change', [this]);
},
});
/**