Refined adjust ellipsis functionality and created seperate webasset

ckanext/odsh/assets/odsh.js

@@ -18,71 +18,4 @@ $(document).ready(function () {
     });
   }
 
-  function adjustEllipsis() {
-    $('.ellipsis-action:not(.full-text)').each(function () {
-      var ellipsisAction = $(this);
-      var targetId = ellipsisAction.data('target');
-      var targetContent = $(targetId);
-      var maxContentHeight = ellipsisAction.data('max-height') || 150;
-      var contentHeight = targetContent.height();
-
-      // Reset styles
-      targetContent.css({
-        'max-height': 'none',
-        'overflow-y': 'visible'
-      });
-
-      // Apply ellipsis functionality if necessary
-      if (contentHeight > maxContentHeight) {
-        targetContent.css({
-          'max-height': maxContentHeight + 'px',
-          'overflow-y': 'hidden'
-        });
-        ellipsisAction.show();
-
-        var overlay = $('.ellipsis-overlay', ellipsisAction);
-        var readMoreLink = $('.readmore', ellipsisAction);
-        var readLessLink = $('.readless', ellipsisAction);
-
-        readMoreLink.show();
-        readLessLink.hide();
-        if (overlay) overlay.show();
-
-        readMoreLink.click(function (event) {
-          event.preventDefault();
-          targetContent.css('max-height', 'none');
-          ellipsisAction.addClass("full-text");
-          if (overlay) overlay.hide();
-          readMoreLink.hide();
-          readLessLink.show();
 });
-
-        readLessLink.click(function (event) {
-          event.preventDefault();
-          targetContent.css('max-height', maxContentHeight + 'px');
-          ellipsisAction.removeClass("full-text");
-          if (overlay) overlay.show();
-          readMoreLink.show();
-          readLessLink.hide();
-          $('html, body').animate({
-            scrollTop: targetContent.offset().top
-          }, 50);
-        });
-      } else {
-        ellipsisAction.hide();
-      }
-    });
-  }
-
-  // Call the function on page load
-  adjustEllipsis();
-
-  // Add an event listener for window resize
-  $(window).on('resize', function () {
-    // Call the adjustEllipsis function when window is resized
-    adjustEllipsis();
-  });
-
-});
-
-

ckanext/odsh/assets/odsh_adjust_ellipsis.js

+$(document).ready(function () {
+
+  function adjustEllipsis() {
+    $('.ellipsis-action').each(function () {
+      var ellipsisAction = $(this);
+      var targetId = ellipsisAction.data('target');
+      var targetContent = $(targetId);
+      var maxContentHeight = ellipsisAction.data('max-height') || 150;
+      var overlay = $('.ellipsis-overlay', ellipsisAction);
+      var readMoreLink = $('.readmore', ellipsisAction);
+      var readLessLink = $('.readless', ellipsisAction);
+  
+      // Reset styles to calculate content height
+      targetContent.css({
+        'max-height': 'none',
+        'overflow-y': 'visible'
+      });
+      
+      var contentHeight = targetContent.height();
+  
+      // Apply ellipsis functionality if necessary
+      if (contentHeight > maxContentHeight) {
+        ellipsisAction.show();
+        if (targetContent.hasClass("full-text")) {
+          toggleEllipsisActions(false);
+        } else {
+          targetContent.css({
+            'max-height': maxContentHeight + 'px',
+            'overflow-y': 'hidden'
+          });
+          toggleEllipsisActions(true);
+          if (overlay) overlay.show();
+        }
+      } else {
+        ellipsisAction.hide();
+      }
+  
+      function toggleEllipsisActions(showReadMore) {
+        readMoreLink.toggle(showReadMore);
+        readLessLink.toggle(!showReadMore);
+      }
+  
+      readMoreLink.off('click').on('click', function (event) {
+        event.preventDefault();
+        targetContent.css({
+          'max-height': 'none',
+          'overflow-y': 'visible'
+        });
+        targetContent.addClass("full-text");
+        if (overlay) overlay.hide();
+        toggleEllipsisActions(false);
+      });
+  
+      readLessLink.off('click').on('click', function (event) {
+        event.preventDefault();
+        targetContent.css({
+          'max-height': maxContentHeight + 'px',
+          'overflow-y': 'hidden'
+        });
+        targetContent.removeClass("full-text");
+        if (overlay) overlay.show();
+        toggleEllipsisActions(true);
+        $('html, body').animate({
+          scrollTop: targetContent.offset().top
+        }, 50);
+      });
+    });
+  }
+  
+  // Call the function on page load
+  adjustEllipsis();
+  
+  // Add an event listener for window resize
+  $(window).on('resize', function () {
+    // Call the adjustEllipsis function when window is resized
+    adjustEllipsis();
+  });  
+
+});

ckanext/odsh/assets/webassets.yml

@@ -5,6 +5,7 @@ odsh_base_script:
     - vendor/jquery-ui-autocomplete/jquery-ui.js
     - autocomplete.js
     - odsh.js
+    - odsh_adjust_ellipsis.js
 
 odsh_base_style:
   output: ckanext-odsh/odsh_base.css