| Index: trunk/extensions/UploadWizard/resources/jquery/jquery.autoEllipsis.js |
| — | — | @@ -0,0 +1,131 @@ |
| | 2 | +/** |
| | 3 | + * Plugin that automatically truncates the plain text contents of an element and adds an ellipsis |
| | 4 | + */ |
| | 5 | +( function( $ ) { |
| | 6 | + |
| | 7 | +// Cache ellipsed substrings for every string-width combination |
| | 8 | +var cache = { }; |
| | 9 | +// Use a seperate cache when match highlighting is enabled |
| | 10 | +var matchTextCache = { }; |
| | 11 | + |
| | 12 | +$.fn.autoEllipsis = function( options ) { |
| | 13 | + options = $.extend( { |
| | 14 | + 'position': 'center', |
| | 15 | + 'tooltip': false, |
| | 16 | + 'restoreText': false, |
| | 17 | + 'hasSpan': false, |
| | 18 | + 'matchText': null |
| | 19 | + }, options ); |
| | 20 | + $(this).each( function() { |
| | 21 | + var $this = $(this); |
| | 22 | + if ( options.restoreText ) { |
| | 23 | + if ( ! $this.data( 'autoEllipsis.originalText' ) ) { |
| | 24 | + $this.data( 'autoEllipsis.originalText', $this.text() ); |
| | 25 | + } else { |
| | 26 | + $this.text( $this.data( 'autoEllipsis.originalText' ) ); |
| | 27 | + } |
| | 28 | + } |
| | 29 | + |
| | 30 | + // container element - used for measuring against |
| | 31 | + var $container = $this; |
| | 32 | + // trimmable text element - only the text within this element will be trimmed |
| | 33 | + var $trimmableText = null; |
| | 34 | + // protected text element - the width of this element is counted, but next is never trimmed from it |
| | 35 | + var $protectedText = null; |
| | 36 | + |
| | 37 | + if ( options.hasSpan ) { |
| | 38 | + $trimmableText = $this.children( options.selector ); |
| | 39 | + } else { |
| | 40 | + $trimmableText = $( '<span />' ) |
| | 41 | + .css( 'whiteSpace', 'nowrap' ) |
| | 42 | + .text( $this.text() ); |
| | 43 | + $this |
| | 44 | + .empty() |
| | 45 | + .append( $trimmableText ); |
| | 46 | + } |
| | 47 | + |
| | 48 | + var text = $container.text(); |
| | 49 | + var trimmableText = $trimmableText.text(); |
| | 50 | + var w = $container.width(); |
| | 51 | + var pw = $protectedText ? $protectedText.width() : 0; |
| | 52 | + // Try cache |
| | 53 | + if ( !( text in cache ) ) { |
| | 54 | + cache[text] = {}; |
| | 55 | + } |
| | 56 | + if ( options.matchText && !( text in matchTextCache ) ) { |
| | 57 | + matchTextCache[text] = {}; |
| | 58 | + } |
| | 59 | + if ( options.matchText && !( options.matchText in matchTextCache[text] ) ) { |
| | 60 | + matchTextCache[text][options.matchText] = {}; |
| | 61 | + } |
| | 62 | + if ( !options.matchText && w in cache[text] ) { |
| | 63 | + $container.html( cache[text][w] ); |
| | 64 | + if ( options.tooltip ) |
| | 65 | + $container.attr( 'title', text ); |
| | 66 | + return; |
| | 67 | + } |
| | 68 | + if( options.matchText && options.matchText in matchTextCache[text] && w in matchTextCache[text][options.matchText] ) { |
| | 69 | + $container.html( matchTextCache[text][options.matchText][w] ); |
| | 70 | + if ( options.tooltip ) |
| | 71 | + $container.attr( 'title', text ); |
| | 72 | + return; |
| | 73 | + } |
| | 74 | + if ( $trimmableText.width() + pw > w ) { |
| | 75 | + switch ( options.position ) { |
| | 76 | + case 'right': |
| | 77 | + // Use binary search-like technique for efficiency |
| | 78 | + var l = 0, r = trimmableText.length; |
| | 79 | + do { |
| | 80 | + var m = Math.ceil( ( l + r ) / 2 ); |
| | 81 | + $trimmableText.text( trimmableText.substr( 0, m ) + '...' ); |
| | 82 | + if ( $trimmableText.width() + pw > w ) { |
| | 83 | + // Text is too long |
| | 84 | + r = m - 1; |
| | 85 | + } else { |
| | 86 | + l = m; |
| | 87 | + } |
| | 88 | + } while ( l < r ); |
| | 89 | + $trimmableText.text( trimmableText.substr( 0, l ) + '...' ); |
| | 90 | + break; |
| | 91 | + case 'center': |
| | 92 | + // TODO: Use binary search like for 'right' |
| | 93 | + var i = [Math.round( trimmableText.length / 2 ), Math.round( trimmableText.length / 2 )]; |
| | 94 | + var side = 1; // Begin with making the end shorter |
| | 95 | + while ( $trimmableText.outerWidth() + pw > w && i[0] > 0 ) { |
| | 96 | + $trimmableText.text( trimmableText.substr( 0, i[0] ) + '...' + trimmableText.substr( i[1] ) ); |
| | 97 | + // Alternate between trimming the end and begining |
| | 98 | + if ( side == 0 ) { |
| | 99 | + // Make the begining shorter |
| | 100 | + i[0]--; |
| | 101 | + side = 1; |
| | 102 | + } else { |
| | 103 | + // Make the end shorter |
| | 104 | + i[1]++; |
| | 105 | + side = 0; |
| | 106 | + } |
| | 107 | + } |
| | 108 | + break; |
| | 109 | + case 'left': |
| | 110 | + // TODO: Use binary search like for 'right' |
| | 111 | + var r = 0; |
| | 112 | + while ( $trimmableText.outerWidth() + pw > w && r < trimmableText.length ) { |
| | 113 | + $trimmableText.text( '...' + trimmableText.substr( r ) ); |
| | 114 | + r++; |
| | 115 | + } |
| | 116 | + break; |
| | 117 | + } |
| | 118 | + } |
| | 119 | + if ( options.tooltip ) { |
| | 120 | + $container.attr( 'title', text ); |
| | 121 | + } |
| | 122 | + if ( options.matchText ) { |
| | 123 | + $container.highlightText( options.matchText ); |
| | 124 | + matchTextCache[text][options.matchText][w] = $container.html(); |
| | 125 | + } else { |
| | 126 | + cache[text][w] = $container.html(); |
| | 127 | + } |
| | 128 | + |
| | 129 | + } ); |
| | 130 | +}; |
| | 131 | + |
| | 132 | +} )( jQuery ); |
| Property changes on: trunk/extensions/UploadWizard/resources/jquery/jquery.autoEllipsis.js |
| ___________________________________________________________________ |
| Added: svn:mergeinfo |
| 1 | 133 | Merged /trunk/phase3/extensions/UploadWizard/resources/jquery/jquery.autoEllipsis.js:r85939 |
| 2 | 134 | Merged /branches/uploadwizard/extensions/UploadWizard/resources/jquery/jquery.autoEllipsis.js:r73550-75905 |
| Added: svn:eol-style |
| 3 | 135 | + native |