From 57decbbed6d3d8899b09a58361ae9b30d39a9c03 Mon Sep 17 00:00:00 2001
From: Jeremy Kersten <jke@odoo.com>
Date: Tue, 11 Sep 2018 22:35:22 +0200
Subject: [PATCH] [FIX] web_editor: fix and improve AltDialog

Ref label
Add tooltip
Fix title from modal -> before this commit, modal title was wrongly replaced by title of image :/

task-1878245
---
 addons/web_editor/static/src/js/widgets/widgets.js |  2 +-
 addons/web_editor/static/src/xml/editor.xml        | 12 +++++++++---
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/addons/web_editor/static/src/js/widgets/widgets.js b/addons/web_editor/static/src/js/widgets/widgets.js
index 02a08f711dc..dd0982bf3be 100644
--- a/addons/web_editor/static/src/js/widgets/widgets.js
+++ b/addons/web_editor/static/src/js/widgets/widgets.js
@@ -83,7 +83,7 @@ var AltDialog = Dialog.extend({
         this.$editable = $editable;
         this.media = media;
         this.alt = ($(this.media).attr('alt') || "").replace(/&quot;/g, '"');
-        this.title = ($(this.media).attr('title') || "").replace(/&quot;/g, '"');
+        this.tag_title = ($(this.media).attr('title') || "").replace(/&quot;/g, '"');
     },
 
     //--------------------------------------------------------------------------
diff --git a/addons/web_editor/static/src/xml/editor.xml b/addons/web_editor/static/src/xml/editor.xml
index 76369f1fc98..ac5cbe6d07b 100644
--- a/addons/web_editor/static/src/xml/editor.xml
+++ b/addons/web_editor/static/src/xml/editor.xml
@@ -31,15 +31,21 @@
     <!-- Alt Dialog (allows to change alt and title of page images) -->
     <form t-name="web_editor.dialog.alt" action="#">
         <div class="form-group row">
-            <label class="col-md-3 col-form-label" for="alt">Description (alt tag)</label>
+            <label class="col-md-3 col-form-label" for="alt"
+                   title="'Alt tag' specifies an alternate text for an image, if the image cannot be displayed (slow connection, missing image, screen reader ...).">
+               Description <small>(ALT Tag)</small>
+            </label>
             <div class="col-md-8">
                 <input class="form-control" id="alt" required="required" t-att-value="widget.alt" type="text"/>
             </div>
         </div>
         <div class="form-group row">
-            <label class="col-md-3 col-form-label" for="title">Tooltip</label>
+            <label class="col-md-3 col-form-label" for="title"
+                   title="'Title tag' is shown as a tooltip when you hover the picture.">
+               Tooltip  <small>(TITLE Tag)</small>
+            </label>
             <div class="col-md-8">
-                <input class="form-control" id="title" required="required" t-att-value="widget.title" type="text"/>
+                <input class="form-control" id="title" required="required" t-att-value="widget.tag_title" type="text"/>
             </div>
         </div>
     </form>