From d46f6a783ae8990c76b0d92160f7663fb32b3f06 Mon Sep 17 00:00:00 2001 From: Michael Heppler Date: Tue, 2 Mar 2021 15:54:40 -0500 Subject: [PATCH] Removed truncation plugin and attempted hacky css solution WIP [ref #6685] --- src/main/java/propertyFiles/Bundle.properties | 4 +- .../resources/js/dv_rebind_bootstrap_ui.js | 51 +++------ .../webapp/resources/js/jquery.truncate.js | 103 ------------------ 3 files changed, 18 insertions(+), 140 deletions(-) delete mode 100644 src/main/webapp/resources/js/jquery.truncate.js diff --git a/src/main/java/propertyFiles/Bundle.properties b/src/main/java/propertyFiles/Bundle.properties index fdaa68d3650..ce45c768d9b 100755 --- a/src/main/java/propertyFiles/Bundle.properties +++ b/src/main/java/propertyFiles/Bundle.properties @@ -59,12 +59,10 @@ apply=Apply add=Add delete=Delete copyClipboard=Copy to Clipboard - truncateMoreBtn=Read More truncateMoreTip=Click to read the full truncateLessBtn=Read Less -truncateLessTip=Click to collapse the - +truncateLessTip=Click to collapse the yes=Yes no=No previous=Previous diff --git a/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js b/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js index 16a5584ef01..1e1c6d5d6e3 100644 --- a/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js +++ b/src/main/webapp/resources/js/dv_rebind_bootstrap_ui.js @@ -166,47 +166,30 @@ function sharrre(){ */ function contentTruncate(truncSelector, truncMetaLabel, truncMoreBtn, truncMoreTip, truncLessBtn, truncLessTip){ - // jquery.truncate.js - // HTML-safe truncation - // https://github.com/pathable/truncate + // I MADE IT MYSELF... // WHAT ARE WE TRUNCATING // SELECTOR ID FROM PARAMETERS $('#' + truncSelector + ' td div').each(function () { - // GET THE DESC TEXT AND HTML - var truncateThis = $(this).html(); - + + // ADD A MAX-HEIGHT TO CONTAINER + $(this).css({'max-height':'250px','overflow-y':'hidden','position':'relative'}); + // BTN LABEL TEXT, DYNAMIC ARIA ATTR'S, FROM BUNDLE VIA PARAMETERS - var readMoreBtn = '... '; - var readLessBtn = ''; + var readMoreBtn = ''; + var moreFade = '
' + readMoreBtn + '
'; - if ($(this).hasClass('thisWasTruncated')) { - // ALREADY TRUNCATED, DO NOTHING - } - else { - var thisWasTruncated = jQuery.truncate(truncateThis, { - length: 500, - words: true, - keepFirstWord: true, - ellipsis: readMoreBtn, - // REMOVED FINISH BLOCK TO TRUNCATE MID CONENT - // finishBlock: true - }); - - // ... add responsive img class ++ link target - $(this).toggleClass('thisWasTruncated').html(thisWasTruncated).find('img').attr('class', 'img-responsive'); + // add responsive img class + $(this).find('img').attr('class', 'img-responsive'); + + // add Read More + button background fade + $(this).append(moreFade); - // ... add full description to summary block on Read More link click ++ add responsive img class ++ link target - $(document).on('click', 'button.truncate-more-link', function() { - $(this).tooltip('hide').parent('div').toggleClass('thisWasTruncated').html(truncateThis).append(readLessBtn).find('img').attr('class', 'img-responsive'); - $('button.collapse-less-link').tooltip(); - }); - // ... add responsive img class ++ link target - $(document).on('click', 'button.collapse-less-link', function() { - $(this).tooltip('hide').parent('div').toggleClass('thisWasTruncated').html(thisWasTruncated).find('img').attr('class', 'img-responsive'); - $('button.truncate-more-link').tooltip(); - }); - } + // ... add full description to summary block on Read More link click ++ add responsive img class + $(document).on('click', 'button.desc-more-link', function() { + $(this).tooltip('hide').parent('div').parent('div').css({'max-height':'none','overflow-y':'visible','position':'relative'}); + $('#more-fade-block').remove(); + }); }); } diff --git a/src/main/webapp/resources/js/jquery.truncate.js b/src/main/webapp/resources/js/jquery.truncate.js deleted file mode 100644 index e43d4134ae1..00000000000 --- a/src/main/webapp/resources/js/jquery.truncate.js +++ /dev/null @@ -1,103 +0,0 @@ -(function($) { - - // Matches trailing non-space characters. - var chop = /(\s*\S+|\s)$/; - - // Matches the first word in the string. - var start = /^(\S*)/; - - // Return a truncated html string. Delegates to $.fn.truncate. - $.truncate = function(html, options) { - return $('
').append(html).truncate(options).html(); - }; - - // Truncate the contents of an element in place. - $.fn.truncate = function(options) { - if ($.isNumeric(options)) options = {length: options}; - var o = $.extend({}, $.truncate.defaults, options); - - return this.each(function() { - var self = $(this); - - if (o.noBreaks) self.find('br').replaceWith(' '); - - var text = self.text(); - var excess = text.length - o.length; - - if (o.stripTags) self.text(text); - - // Chop off any partial words if appropriate. - if (o.words && excess > 0) { - var truncated = text.slice(0, o.length).replace(chop, '').length; - - if (o.keepFirstWord && truncated === 0) { - excess = text.length - start.exec(text)[0].length - 1; - } else { - excess = text.length - truncated - 1; - } - } - - if (excess < 0 || !excess && !o.truncated) return; - - // Iterate over each child node in reverse, removing excess text. - $.each(self.contents().get().reverse(), function(i, el) { - var $el = $(el); - var text = $el.text(); - var length = text.length; - - // If the text is longer than the excess, remove the node and continue. - if (length <= excess) { - o.truncated = true; - excess -= length; - $el.remove(); - return; - } - - // Remove the excess text and append the ellipsis. - if (el.nodeType === 3) { - // should we finish the block anyway? - if (o.finishBlock) { - $(el.splitText(length)).replaceWith(o.ellipsis); - } else { - $(el.splitText(length - excess - 1)).replaceWith(o.ellipsis); - } - return false; - } - - // Recursively truncate child nodes. - $el.truncate($.extend(o, {length: length - excess})); - return false; - }); - }); - }; - - $.truncate.defaults = { - - // Strip all html elements, leaving only plain text. - stripTags: false, - - // Only truncate at word boundaries. - words: false, - - // When 'words' is active, keeps the first word in the string - // even if it's longer than a target length. - keepFirstWord: false, - - // Replace instances of
with a single space. - noBreaks: false, - - // if true always truncate the content at the end of the block. - finishBlock: false, - - // The maximum length of the truncated html. - length: Infinity, - - // The character to use as the ellipsis. The word joiner (U+2060) can be - // used to prevent a hanging ellipsis, but displays incorrectly in Chrome - // on Windows 7. - // http://code.google.com/p/chromium/issues/detail?id=68323 - ellipsis: '\u2026' // '\u2060\u2026' - - }; - -})(jQuery);