Merge pull request IQSS#9222 from ar062800/ar062800/collapse_datavers…

…e_description Update dataverse.xhtml to add "read more/read less" buttons for dataverse descriptions
MPDL · Feb 10, 2023 · b7d60be · b7d60be
2 parents e4ebced + 30e92c4
commit b7d60be
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 10 deletions.
diff --git a/doc/release-notes/1249-collapse_dataverse_description.md b/doc/release-notes/1249-collapse_dataverse_description.md
@@ -0,0 +1 @@
+Long descriptions for collections are now truncated but can be expanded to read the full description.
diff --git a/src/main/java/propertyFiles/Bundle.properties b/src/main/java/propertyFiles/Bundle.properties
@@ -73,7 +73,7 @@ delete=Delete
 copyClipboard=Copy to Clipboard
 truncateMoreBtn=Read full {0} [+]
 truncateMoreTip=Click to read the full {0}.
-truncateLessBtn=Collapse {0} [+]
+truncateLessBtn=Collapse {0} [-]
 truncateLessTip=Click to collapse the {0}.
 yes=Yes
 no=No

diff --git a/src/main/webapp/dataset.xhtml b/src/main/webapp/dataset.xhtml
@@ -1790,6 +1790,7 @@
                     <p:remoteCommand name="datasetSaveCommand" action="#{DatasetPage.save()}" update=":datasetForm,:messagePanel"/>
                     <!-- END: Publish/Submit for Review Dialogs -->
                 </h:form>
+                <c:set var="descriptionText" value="#{DatasetPage.datasetVersionUI.description.datasetFieldType.localeTitle}" />
                 <script>
                     //<![CDATA[
                     $(document).ready(function () {
@@ -1799,13 +1800,13 @@
                     function summaryDescTruncation() {
                         // truncate summary description, contentTruncate function in dv_rebind_bootstrap_ui.js
                         // add summary desc row id to pass as selector param
-                        var descId = 'dsDescription';
+                        var descId = 'dsDescription td > div';
                         // add metadata dynamic label text, tooltip text from bundle as param
-                        var truncMoreBtn = '#{of:format1(bundle.truncateMoreBtn, DatasetPage.datasetVersionUI.description.datasetFieldType.localeTitle)}';
-                        var truncMoreTip = '#{of:format1(bundle.truncateMoreTip, DatasetPage.datasetVersionUI.description.datasetFieldType.localeTitle)}';
-                        var truncLessBtn = '#{of:format1(bundle.truncateLessBtn, DatasetPage.datasetVersionUI.description.datasetFieldType.localeTitle)}';
-                        var truncLessTip = '#{of:format1(bundle.truncateLessTip, DatasetPage.datasetVersionUI.description.datasetFieldType.localeTitle)}';
-                        
+                        var truncMoreBtn = '#{of:format1(bundle.truncateMoreBtn, descriptionText)}';
+                        var truncMoreTip = '#{of:format1(bundle.truncateMoreTip, descriptionText)}';
+                        var truncLessBtn = '#{of:format1(bundle.truncateLessBtn, descriptionText)}';
+                        var truncLessTip = '#{of:format1(bundle.truncateLessTip, descriptionText)}';
+
                         // pass bundle text variabls as params to function
                         contentTruncate(descId, truncMoreBtn, truncMoreTip, truncLessBtn, truncLessTip);
                     }

diff --git a/src/main/webapp/dataverse.xhtml b/src/main/webapp/dataverse.xhtml
@@ -592,7 +592,7 @@
                             <o:importFunctions type="edu.harvard.iq.dataverse.util.MarkupChecker" />
                             <div class="row margin-bottom" jsf:rendered="#{!empty DataversePage.dataverse.description and !widgetWrapper.widgetView}">
                                 <div id="dataverseDesc" class="col-xs-12">
-                                    <h:outputText value="#{MarkupChecker:sanitizeBasicHTML(DataversePage.dataverse.description)}" escape="false"/>
+                                   <h:outputText value="#{MarkupChecker:sanitizeBasicHTML(DataversePage.dataverse.description)}" escape="false"/>
                                 </div>
                             </div>
                             <!-- Featured Dataverses Carousel -->
@@ -822,12 +822,14 @@
                     </div>
                     </h:form>
                 </p:dialog>
+                <c:set var="descriptionText" value="#{bundle.description}" />
                 <script>
                     //<![CDATA[
                     var scrollPos=0;
                     $(document).ready(function () {
                         initCarousel();
                         popoverHTML('#{bundle.htmlAllowedTitle}','#{bundle.htmlAllowedTags}');
+                        summarizeDesc();
                     });
                     function initCarousel() {
                         var owl1 = $("#featuredDataversesList");
@@ -853,6 +855,18 @@
                         }
                         $('#featuredDataversesList .item').matchHeight();
                     }
+                    function summarizeDesc() {
+                        // truncate summary description, contentTruncate function in dv_rebind_bootstrap_ui.js
+                        // add id to pass as selector param
+                        var descId = 'dataverseDesc';
+                        // add metadata dynamic label text, tooltip text from bundle as param
+                        var truncMoreBtn = '#{of:format1(bundle.truncateMoreBtn, descriptionText)}';
+                        var truncMoreTip = '#{of:format1(bundle.truncateMoreTip, descriptionText)}';
+                        var truncLessBtn = '#{of:format1(bundle.truncateLessBtn, descriptionText)}';
+                        var truncLessTip = '#{of:format1(bundle.truncateLessTip, descriptionText)}';
+                        // pass bundle text variables as params to function
+                        contentTruncate(descId, truncMoreBtn, truncMoreTip, truncLessBtn, truncLessTip);
+                    }
                     function callOnError(){
                         window.scrollTo(0, 0);
                     }

diff --git a/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js b/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js
@@ -166,7 +166,7 @@ function sharrre(){
  */
 function contentTruncate(truncSelector, truncMoreBtn, truncMoreTip, truncLessBtn, truncLessTip){
     // SELECTOR ID FROM PARAMETERS
-    $('#' + truncSelector + ' td > div:first-child').each(function () {
+    $('#' + truncSelector).each(function () {
 
         // add responsive img class to limit width to that of container
         $(this).find('img').attr('class', 'img-responsive');
@@ -176,7 +176,7 @@ function contentTruncate(truncSelector, truncMoreBtn, truncMoreTip, truncLessBtn
 
         if (containerHeight > 250) {
             // ADD A MAX-HEIGHT TO CONTAINER
-            $(this).css({'max-height':'250px','overflow-y':'hidden','position':'relative'});
+            $(this).css({'max-height':'250px','overflow-y':'hidden', 'overflow-x':'hidden', 'position':'relative'});
 
             // BTN LABEL TEXT, ARIA ATTR'S, FROM BUNDLE VIA PARAMETERS
             var readMoreBtn = '<button class="btn btn-link desc-more-link" type="button" data-toggle="tooltip" data-original-title="' + truncMoreTip + '" aria-expanded="false" aria-controls="#' + truncSelector + '">' + truncMoreBtn + '</button>';
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		Long descriptions for collections are now truncated but can be expanded to read the full description.