2 * Plugin that automatically truncates the plain text contents of an element and adds an ellipsis
6 // Cache ellipsed substrings for every string-width-position combination
8 // Use a separate cache when match highlighting is enabled
9 var matchTextCache = { };
11 $.fn.autoEllipsis = function ( options ) {
19 $(this).each( function () {
20 var $container, $trimmableText,
21 text, trimmableText, w, pw,
24 if ( options.restoreText ) {
25 if ( !$el.data( 'autoEllipsis.originalText' ) ) {
26 $el.data( 'autoEllipsis.originalText', $el.text() );
28 $el.text( $el.data( 'autoEllipsis.originalText' ) );
32 // container element - used for measuring against
35 // trimmable text element - only the text within this element will be trimmed
36 if ( options.hasSpan ) {
37 $trimmableText = $el.children( options.selector );
39 $trimmableText = $( '<span>' )
40 .css( 'whiteSpace', 'nowrap' )
44 .append( $trimmableText );
47 text = $container.text();
48 trimmableText = $trimmableText.text();
49 w = $container.width();
53 if ( options.matchText ) {
54 if ( !( text in matchTextCache ) ) {
55 matchTextCache[text] = {};
57 if ( !( options.matchText in matchTextCache[text] ) ) {
58 matchTextCache[text][options.matchText] = {};
60 if ( !( w in matchTextCache[text][options.matchText] ) ) {
61 matchTextCache[text][options.matchText][w] = {};
63 if ( options.position in matchTextCache[text][options.matchText][w] ) {
64 $container.html( matchTextCache[text][options.matchText][w][options.position] );
65 if ( options.tooltip ) {
66 $container.attr( 'title', text );
71 if ( !( text in cache ) ) {
74 if ( !( w in cache[text] ) ) {
77 if ( options.position in cache[text][w] ) {
78 $container.html( cache[text][w][options.position] );
79 if ( options.tooltip ) {
80 $container.attr( 'title', text );
86 if ( $trimmableText.width() + pw > w ) {
87 switch ( options.position ) {
89 // Use binary search-like technique for efficiency
91 r = trimmableText.length;
93 var m = Math.ceil( ( l + r ) / 2 );
94 $trimmableText.text( trimmableText.substr( 0, m ) + '...' );
95 if ( $trimmableText.width() + pw > w ) {
102 $trimmableText.text( trimmableText.substr( 0, l ) + '...' );
105 // TODO: Use binary search like for 'right'
106 i = [Math.round( trimmableText.length / 2 ), Math.round( trimmableText.length / 2 )];
107 // Begin with making the end shorter
109 while ( $trimmableText.outerWidth() + pw > w && i[0] > 0 ) {
110 $trimmableText.text( trimmableText.substr( 0, i[0] ) + '...' + trimmableText.substr( i[1] ) );
111 // Alternate between trimming the end and begining
113 // Make the begining shorter
117 // Make the end shorter
124 // TODO: Use binary search like for 'right'
126 while ( $trimmableText.outerWidth() + pw > w && r < trimmableText.length ) {
127 $trimmableText.text( '...' + trimmableText.substr( r ) );
133 if ( options.tooltip ) {
134 $container.attr( 'title', text );
136 if ( options.matchText ) {
137 $container.highlightText( options.matchText );
138 matchTextCache[text][options.matchText][w][options.position] = $container.html();
140 cache[text][w][options.position] = $container.html();