Animate on collapse and prevent collapsing on resize when already enlarged

ckanext/odsh/assets/odsh.js

@@ -19,11 +19,12 @@ $(document).ready(function () {
   }
 
   function adjustEllipsis() {
-    $('.ellipsis-action').each(function () {
+    $('.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({
@@ -31,9 +32,6 @@ $(document).ready(function () {
         'overflow-y': 'visible'
       });
 
-      // Calculate content height
-      var contentHeight = targetContent.height();
-
       // Apply ellipsis functionality if necessary
       if (contentHeight > maxContentHeight) {
         targetContent.css({
@@ -46,9 +44,14 @@ $(document).ready(function () {
         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');
+          targetContent.addClass("full-text");
           if (overlay) overlay.hide();
           readMoreLink.hide();
           readLessLink.show();
@@ -57,9 +60,13 @@ $(document).ready(function () {
         readLessLink.click(function (event) {
           event.preventDefault();
           targetContent.css('max-height', maxContentHeight + 'px');
+          targetContent.removeClass("full-text");
           if (overlay) overlay.show();
           readMoreLink.show();
           readLessLink.hide();
+          $('html, body').animate({
+            scrollTop: targetContent.offset().top
+          }, 50);
         });
       } else {
         ellipsisAction.hide();