diff --git a/web_widget_slick/static/src/js/web_widget_slick.js b/web_widget_slick/static/src/js/web_widget_slick.js index 47f27e75edc5..af22c3c7c7e5 100644 --- a/web_widget_slick/static/src/js/web_widget_slick.js +++ b/web_widget_slick/static/src/js/web_widget_slick.js @@ -1,7 +1,7 @@ /* Copyright 2016-2017 LasLabs Inc. * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html). */ -odoo.define('web_widget_slick.slick_widget', function(require){ +odoo.define('web_widget_slick', function(require) { "use strict"; var core = require('web.core'); @@ -68,36 +68,40 @@ odoo.define('web_widget_slick.slick_widget', function(require){ }, destroy_content: function() { - var self = this; if (this.$slick) { var $imgs = this.$el.find('img'); - $imgs.each(function(idx, val){ - self.$slick.slick('slickRemove', idx); - }); + // Unslicking removes the carousel but re-appends any images, + // so removal of images is also required + $imgs.each($.proxy(this._slickRemove, this)); + this.$slick.slick('unslick'); } }, render_value: function() { - var self = this; this._super(); this.destroy_content(); - var baseUrl = '/web/image/' + this.options.modelName; - this.$slick = $('
'); this.$el.append(this.$slick); - self.loading.push.apply(self.get('value')); - _.each(self.get('value'), function(id){ - var $img = $(''); - var $div = $('
'); - $div.append($img); - $img.attr('data-lazy', baseUrl + '/' + id + '/' + self.options.fieldName); - self.$slick.append($div); - }); + var baseUrl = '/web/image/' + this.options.modelName + '/'; + var value = this.get('value'); + this.loading.push.apply(value); + _.each(value, $.proxy(this._slickRender, this, [baseUrl])); this.$slick.slick(this.options); + }, + + _slickRemove: function (idx, val) { + this.$slick.slick('slickRemove', idx); + }, + _slickRender: function (baseUrl, id) { + var $img = $(''); + var $div = $('
'); + $img.attr('data-lazy', baseUrl + id + '/' + this.options.fieldName); + $div.append($img); + this.$slick.append($div); } }); diff --git a/web_widget_slick/static/src/xml/web_widget_slick.xml b/web_widget_slick/static/src/xml/web_widget_slick.xml index f1ce65057732..7bc6f6ae28e1 100644 --- a/web_widget_slick/static/src/xml/web_widget_slick.xml +++ b/web_widget_slick/static/src/xml/web_widget_slick.xml @@ -4,6 +4,6 @@ diff --git a/web_widget_slick/static/tests/js/web_widget_slick.js b/web_widget_slick/static/tests/js/web_widget_slick.js index 23cb75eeac42..87cfc20cbd42 100644 --- a/web_widget_slick/static/tests/js/web_widget_slick.js +++ b/web_widget_slick/static/tests/js/web_widget_slick.js @@ -1,8 +1,7 @@ /* Copyright 2017 LasLabs Inc. * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html). */ -odoo.define_section('web_widget_slick', ['web.core', 'web.form_common'], - function(test) { +odoo.define_section('web_widget_slick', ['web.core', 'web.form_common'], function(test) { "use strict"; function appendWidget (core, formCommon, $fix) { @@ -57,6 +56,18 @@ odoo.define_section('web_widget_slick', ['web.core', 'web.form_common'], } ); + test('.destroy_content() should remove carousel', + function (assert, core, formCommon) { + var $fix = $('#qunit-fixture'); + var widget = appendWidget(core, formCommon, $fix); + + widget.destroy_content(); + + var slickChildren = widget.$slick.children().length; + assert.strictEqual(slickChildren, 0); + } + ); + test('.render_value() should add images corresponding to field value', function(assert, core, formCommon) { var $fix = $('#qunit-fixture');