[ofbiz-framework] branch trunk updated: Improved: Open FTL File from browser (OFBIZ-12018)

[James Yong-2]

This is an automated email from the ASF dual-hosted git repository.

jamesyong pushed a commit to branch trunk
in repository https://gitbox.apache.org/repos/asf/ofbiz-framework.git


The following commit(s) were added to refs/heads/trunk by this push:
     new c911019  Improved: Open FTL File from browser (OFBIZ-12018)
c911019 is described below

commit c9110198568e988e65ba6b9d3881b7edb60254cc
Author: James Yong <[hidden email]>
AuthorDate: Mon Sep 28 21:50:01 2020 +0800

    Improved: Open FTL File from browser (OFBIZ-12018)
   
    Better usability when clicking on named border
---
 .../widget/renderer/html/HtmlWidgetRenderer.java   | 14 ++----
 themes/common-theme/webapp/common/css/info.css     |  6 +++
 .../webapp/common/js/util/OfbizUtil.js             | 57 +++++++++++++---------
 3 files changed, 44 insertions(+), 33 deletions(-)

diff --git a/framework/widget/src/main/java/org/apache/ofbiz/widget/renderer/html/HtmlWidgetRenderer.java b/framework/widget/src/main/java/org/apache/ofbiz/widget/renderer/html/HtmlWidgetRenderer.java
index 8b17243..3ec7257 100644
--- a/framework/widget/src/main/java/org/apache/ofbiz/widget/renderer/html/HtmlWidgetRenderer.java
+++ b/framework/widget/src/main/java/org/apache/ofbiz/widget/renderer/html/HtmlWidgetRenderer.java
@@ -18,7 +18,6 @@
  *******************************************************************************/
 package org.apache.ofbiz.widget.renderer.html;
 
-import java.io.File;
 import java.io.IOException;
 import java.util.List;
 
@@ -79,24 +78,21 @@ public class HtmlWidgetRenderer {
         List<String> themeBasePathsToExempt = UtilHtml.getVisualThemeFolderNamesToExempt();
         if (!themeBasePathsToExempt.stream().anyMatch(widgetName::contains)) {
             // add additional visual label for non-theme ftl
-            switch (boundaryType) {
-            case "End":
+            if ("Begin".equals(boundaryType)) {
+                return "<div class='info-container'><div class='info-content'>";
+            } else if ("End".equals(boundaryType)) {
                 String fileName = widgetName.substring(widgetName.lastIndexOf("/") + 1);
                 switch (namedBorderType) {
                 case SOURCE:
-                    return "</div><div class='info-overlay'><span class='info-overlay-item'><a href='#' data-source='"
-                            + widgetName
-                            + "'>"
+                    return "</div><div class='info-overlay'><span class='info-overlay-item info-cursor-none' data-source='" + widgetName + "'>"
                             + fileName
-                            + "</a></span></div></div>";
+                            + "</span></div></div>";
                 case LABEL:
                     return "</div><div class='info-overlay'><span class='info-overlay-item'>"
                             + fileName
                             + "</span></div></div>";
                 default: return "";
                 }
-            default:
-                return "<div class='info-container'><div class='info-content'>";
             }
         }
         return "";
diff --git a/themes/common-theme/webapp/common/css/info.css b/themes/common-theme/webapp/common/css/info.css
index 217a5f4..8dd2ba8 100644
--- a/themes/common-theme/webapp/common/css/info.css
+++ b/themes/common-theme/webapp/common/css/info.css
@@ -17,3 +17,9 @@
     border: 2px dashed rgba(236, 198, 48);
     z-index: 10;
 }
+.info-cursor {
+    cursor: pointer;
+}
+.info-cursor-none {
+    cursor: text;
+}
diff --git a/themes/common-theme/webapp/common/js/util/OfbizUtil.js b/themes/common-theme/webapp/common/js/util/OfbizUtil.js
index 11b4ab3..90a1a93 100644
--- a/themes/common-theme/webapp/common/js/util/OfbizUtil.js
+++ b/themes/common-theme/webapp/common/js/util/OfbizUtil.js
@@ -35,39 +35,48 @@ $(document).ready(function() {
         }
       }
     });
-    jQuery(document).ajaxSuccess(function () {
-        initNamedBorder();
-    })
     //initializing UI combobox dropdown by overriding its methods.
     ajaxAutoCompleteDropDown();
     // bindObservers will add observer on passed html section when DOM is ready.
     bindObservers("body");
 
-    function initNamedBorder() {
-        jQuery("[data-source]").off();
-        // fadeout info-overlay labels
-        setTimeout(function(){
-            $('.info-overlay').fadeOut(1000, function(){
-                jQuery("[data-source]").off();
-                $('.info-container').contents().unwrap();
-                $('.info-content').contents().unwrap();
-                $('.info-overlay').delay(1000).remove();
-            });
-        }, 3000);
+    let count = 1;
+    function initNamedBorders() {
         // clickable link in named border to open source file
-        jQuery("[data-source]").click(function(){
-            var sourceLocaton = jQuery(this).data("source");
-            jQuery.ajax({
-                url: 'openSourceFile',
-                type: "POST",
-                data: {sourceLocation:sourceLocaton},
-                success: function(data) {
-                    alert("Command is sent to open source file with your IDE");
-                }
+        var selectList = jQuery(".info-cursor-none[data-source]");
+        // console.log("length="+selectList.length);
+        selectList.each(function(){
+            const $this = $(this);
+            $this.removeClass("info-cursor-none");
+            var sourceLocaton = $this.data("source");
+            $this.addClass("info-cursor").click(function(){
+                jQuery.ajax({
+                    url: 'openSourceFile',
+                    type: "POST",
+                    data: {sourceLocation:sourceLocaton},
+                    success: function(data) {
+                        alert("Server has opened \n" + sourceLocaton);
+                    }
+                });
             });
+            setTimeout(function (){
+                $this.fadeOut(1000,function() {
+                    // fadeout info-overlay labels
+                    $this.off();
+                    var container = $this.closest(".info-container");
+                    container.find(".info-content").contents().unwrap();
+                    container.contents().unwrap();
+                    $this.closest(".info-overlay").remove();
+                });
+            }, (200 * ++count) + 5000);
+
         });
+
     }
-    initNamedBorder();
+    initNamedBorders();
+    jQuery(document).ajaxSuccess(function () {
+        initNamedBorders();
+    });
 });
 
 /* bindObservers function contains the code of adding observers and it can be called for specific section as well