From 6be73e2527927c584fd1fc0d8d76665eeb6bff36 Mon Sep 17 00:00:00 2001
From: stib <stib@pureandapplied.com.au>
Date: Tue, 14 May 2019 11:09:05 +1000
Subject: [PATCH 1/2] =?UTF-8?q?Added=20hysteresis=20to=20length,=20clickab?=
 =?UTF-8?q?le=20"=E2=80=A6more"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 dataRender/ellipsis.js | 88 ++++++++++++++++++++++++------------------
 1 file changed, 51 insertions(+), 37 deletions(-)

diff --git a/dataRender/ellipsis.js b/dataRender/ellipsis.js
index 186e9e56..7abfa0dd 100644
--- a/dataRender/ellipsis.js
+++ b/dataRender/ellipsis.js
@@ -48,42 +48,56 @@
  */
 
 jQuery.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml ) {
-	var esc = function ( t ) {
-		return t
-			.replace( /&/g, '&amp;' )
-			.replace( /</g, '&lt;' )
-			.replace( />/g, '&gt;' )
-			.replace( /"/g, '&quot;' );
-	};
-
-	return function ( d, type, row ) {
-		// Order, search and type get the original data
-		if ( type !== 'display' ) {
-			return d;
-		}
-
-		if ( typeof d !== 'number' && typeof d !== 'string' ) {
-			return d;
-		}
-
-		d = d.toString(); // cast numbers
-
-		if ( d.length <= cutoff ) {
-			return d;
-		}
-
-		var shortened = d.substr(0, cutoff-1);
-
-		// Find the last white space character in the string
-		if ( wordbreak ) {
-			shortened = shortened.replace(/\s([^\s]*)$/, '');
-		}
+    var esc = function ( t ) {
+        return t
+            .replace( /&/g, '&amp;' )
+            .replace( /</g, '&lt;' )
+            .replace( />/g, '&gt;' )
+            .replace( /"/g, '&quot;' );
+    };
+ 
+    return function ( d, type, row ) {
+        // Order, search and type get the original data
+        if ( type !== 'display' ) {
+            return d;
+        }
+ 
+        if ( typeof d !== 'number' && typeof d !== 'string' ) {
+            return d;
+        }
+ 
+        d = d.toString(); // cast numbers
+ 
+        if ( d.length <= cutoff * 1.5) {
+            return d;
+        }
+ 
+        var shortened = d.substr(0, cutoff-1);
+ 
+        // Find the last white space character in the string
+        if ( wordbreak ) {
+            shortened = shortened.replace(/\s([^\s]*)$/, '');
+        }
+ 
+        // Protect against uncontrolled HTML input
+        if ( escapeHtml ) {
+            shortened = esc( shortened );
+        }
+        var myID = row[0];
+        return '<span class="ellipsis" title="'+esc(d)+'">'+ shortened + '</span><a id="ellipsis_' + myID + '" onclick=toggleVisibility(' + myID + ') class="ellipsis" style="font-style: italic"> &#8230more</a><span id="truncatedItem_' + myID + '" style="display:none">' +d.substr(shortened.length, d.length)+'<span>';
+    };
+};
 
-		// Protect against uncontrolled HTML input
-		if ( escapeHtml ) {
-			shortened = esc( shortened );
-		}
 
-		return '<span class="ellipsis" title="'+esc(d)+'">'+shortened+'&#8230;</span>';
-	};
-};
+function toggleVisibility(myId){
+	var truncatedText = document.getElementById("truncatedItem_"+myId);
+	var ellipsis = document.getElementById("ellipsis_" + myId);
+	if(ellipsis.innerText === truncatedText.innerText) {
+        ellipsis.innerText = " …more";
+        ellipsis.style = "font-style: italic";
+  	}
+	else {
+		ellipsis.innerText = truncatedText.innerText;
+        ellipsis.style  = "";
+	}
+} 

From f74fb998594b42a528d9147ea4e0b4a916829518 Mon Sep 17 00:00:00 2001
From: stib <stib@pureandapplied.com.au>
Date: Thu, 16 May 2019 11:48:50 +1000
Subject: [PATCH 2/2] learned a bit about the DOM

---
 dataRender/ellipsis.js | 40 +++++++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/dataRender/ellipsis.js b/dataRender/ellipsis.js
index 7abfa0dd..f56ee4b2 100644
--- a/dataRender/ellipsis.js
+++ b/dataRender/ellipsis.js
@@ -47,7 +47,7 @@
  *    } );
  */
 
-jQuery.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml ) {
+jQuery.fn.dataTable.render.ellipsis = function ( cutoff, maxLength, wordbreak, escapeHtml ) {
     var esc = function ( t ) {
         return t
             .replace( /&/g, '&amp;' )
@@ -55,7 +55,7 @@ jQuery.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml )
             .replace( />/g, '&gt;' )
             .replace( /"/g, '&quot;' );
     };
- 
+
     return function ( d, type, row ) {
         // Order, search and type get the original data
         if ( type !== 'display' ) {
@@ -68,36 +68,38 @@ jQuery.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml )
  
         d = d.toString(); // cast numbers
  
-        if ( d.length <= cutoff * 1.5) {
+        if ( d.length <= maxLength) {
             return d;
         }
- 
         var shortened = d.substr(0, cutoff-1);
- 
+        
         // Find the last white space character in the string
         if ( wordbreak ) {
             shortened = shortened.replace(/\s([^\s]*)$/, '');
         }
- 
+        var remainder = d.substr(shortened.length);
         // Protect against uncontrolled HTML input
         if ( escapeHtml ) {
             shortened = esc( shortened );
+            remainder = esc(remainder);
         }
-        var myID = row[0];
-        return '<span class="ellipsis" title="'+esc(d)+'">'+ shortened + '</span><a id="ellipsis_' + myID + '" onclick=toggleVisibility(' + myID + ') class="ellipsis" style="font-style: italic"> &#8230more</a><span id="truncatedItem_' + myID + '" style="display:none">' +d.substr(shortened.length, d.length)+'<span>';
+
+        return '<span class="ellipsis" title="'+esc(d)+'">' + 
+        shortened +
+        '</span><a  onclick="toggleVisibility(this)" class="ellipsis" style="font-style: italic"> &#8230more</a><span style="display:none">' +
+        remainder + '</span></span>';
     };
 };
 
 
-function toggleVisibility(myId){
-	var truncatedText = document.getElementById("truncatedItem_"+myId);
-	var ellipsis = document.getElementById("ellipsis_" + myId);
-	if(ellipsis.innerText === truncatedText.innerText) {
-        ellipsis.innerText = " …more";
-        ellipsis.style = "font-style: italic";
-  	}
-	else {
-		ellipsis.innerText = truncatedText.innerText;
-        ellipsis.style  = "";
-	}
+// eslint-disable-next-line no-unused-vars
+function toggleVisibility(thisElement){
+    if(thisElement.innerText === " …more") {
+        thisElement.style  = "font-style: inherit";
+        thisElement.innerText = thisElement.nextSibling.innerText;
+    }
+    else {
+        thisElement.innerText = " …more";
+        thisElement.style = "font-style: italic";
+    }
 }