diff --git a/web_tree_image_tooltip/__manifest__.py b/web_tree_image_tooltip/__manifest__.py
index b46057c1b..a91692041 100644
--- a/web_tree_image_tooltip/__manifest__.py
+++ b/web_tree_image_tooltip/__manifest__.py
@@ -21,5 +21,8 @@
'data': [
'view/assets.xml',
],
+ 'demo': [
+ 'demo/view_res_users.xml',
+ ],
'installable': True,
}
diff --git a/web_tree_image_tooltip/demo/view_res_users.xml b/web_tree_image_tooltip/demo/view_res_users.xml
new file mode 100644
index 000000000..2007317cd
--- /dev/null
+++ b/web_tree_image_tooltip/demo/view_res_users.xml
@@ -0,0 +1,12 @@
+
+
+
+ res.users
+
+
+
+
+
+
+
+
diff --git a/web_tree_image_tooltip/readme/CONFIGURE.rst b/web_tree_image_tooltip/readme/CONFIGURE.rst
index b992cb9d5..75b370d3c 100644
--- a/web_tree_image_tooltip/readme/CONFIGURE.rst
+++ b/web_tree_image_tooltip/readme/CONFIGURE.rst
@@ -1 +1,14 @@
Insert `widget='image'` in your field view definition in any image field
+
+.. code:: xml
+
+
+
+
+If the model has different fields of the same image with different size
+(as ``product.product`` for instance with ``image``, ``image_medium``, ``image_small``),
+you can write the following code to reduce the load duration of the tree view.
+
+.. code:: xml
+
+
\ No newline at end of file
diff --git a/web_tree_image_tooltip/readme/CONTRIBUTORS.rst b/web_tree_image_tooltip/readme/CONTRIBUTORS.rst
index 24b755f9a..89dc49395 100644
--- a/web_tree_image_tooltip/readme/CONTRIBUTORS.rst
+++ b/web_tree_image_tooltip/readme/CONTRIBUTORS.rst
@@ -3,4 +3,6 @@
* Jay Vora
* Meet Dholakia
* Nikul Chaudhary
+* Sylvain LE GAL (https://www.twitter.com/legalsylvain)
+
diff --git a/web_tree_image_tooltip/readme/DESCRIPTION.rst b/web_tree_image_tooltip/readme/DESCRIPTION.rst
index 092033b3b..cc26fccc8 100644
--- a/web_tree_image_tooltip/readme/DESCRIPTION.rst
+++ b/web_tree_image_tooltip/readme/DESCRIPTION.rst
@@ -1,3 +1,4 @@
This module defines a images and icons in tree view via Tooltip.
Additionally, Default width with 30px.
+.. image:: ../static/description/tree_view_image.png
\ No newline at end of file
diff --git a/web_tree_image_tooltip/readme/USAGE.rst b/web_tree_image_tooltip/readme/USAGE.rst
index a8eeccbfa..a23a87929 100644
--- a/web_tree_image_tooltip/readme/USAGE.rst
+++ b/web_tree_image_tooltip/readme/USAGE.rst
@@ -1,2 +1,3 @@
Mouse Hover in tree view image that time Tooltip effect.
+.. image:: ../static/description/tree_view_image_tooltip.png
\ No newline at end of file
diff --git a/web_tree_image_tooltip/static/description/tree_view_image.png b/web_tree_image_tooltip/static/description/tree_view_image.png
new file mode 100644
index 000000000..efbd51cbd
Binary files /dev/null and b/web_tree_image_tooltip/static/description/tree_view_image.png differ
diff --git a/web_tree_image_tooltip/static/description/tree_view_image_tooltip.png b/web_tree_image_tooltip/static/description/tree_view_image_tooltip.png
new file mode 100644
index 000000000..22b8c2ead
Binary files /dev/null and b/web_tree_image_tooltip/static/description/tree_view_image_tooltip.png differ
diff --git a/web_tree_image_tooltip/static/src/js/tooltip.js b/web_tree_image_tooltip/static/src/js/tooltip.js
index ce57c2799..767a1386f 100644
--- a/web_tree_image_tooltip/static/src/js/tooltip.js
+++ b/web_tree_image_tooltip/static/src/js/tooltip.js
@@ -2,14 +2,36 @@ odoo.define('web_tree_image_tooltip.web_tree_image_tooltip',
function (require) {
"use strict";
+ var session = require('web.session');
+ var field_utils = require('web.field_utils');
+ var FieldBinaryImage = require('web.basic_fields').FieldBinaryImage;
var ListRenderer = require('web.ListRenderer');
+
+ FieldBinaryImage.include({
+ _render: function () {
+ this._super();
+ if (this.nodeOptions.tooltip_image) {
+ var image_src = session.url('/web/image', {
+ model: this.model,
+ id: JSON.stringify(this.res_id),
+ field: this.nodeOptions.tooltip_image,
+ // unique forces a reload of the image when the record has been updated
+ unique: field_utils.format.datetime(this.recordData.__last_update).replace(/[^0-9]/g, ''),
+ })
+ this.$('.img-fluid')[0].setAttribute("tooltip-image-src", image_src);
+ }
+ },
+ });
+
ListRenderer.include({
events: _.extend({}, ListRenderer.prototype.events, {
'mouseover tbody tr td .o_field_image': '_onHoverRecord_img',
}),
_onHoverRecord_img: function (event) {
var img_src =
- $(event.currentTarget).children('.img-fluid').attr('src')
+ $(event.currentTarget).children('.img-fluid').attr('tooltip-image-src') ||
+ $(event.currentTarget).children('.img-fluid').attr('src');
+
$(event.currentTarget).tooltip({
title: "
",
delay: 0,