|
1 /** |
|
2 * Interface Elements for jQuery |
|
3 * Expander |
|
4 * |
|
5 * http://interface.eyecon.ro |
|
6 * |
|
7 * Copyright (c) 2006 Stefan Petre |
|
8 * Dual licensed under the MIT (MIT-LICENSE.txt) |
|
9 * and GPL (GPL-LICENSE.txt) licenses. |
|
10 * |
|
11 * |
|
12 */ |
|
13 |
|
14 /** |
|
15 * Expands text and textarea elements while new characters are typed to the a miximum width |
|
16 * |
|
17 * @name Expander |
|
18 * @description Expands text and textarea elements while new characters are typed to the a miximum width |
|
19 * @param Mixed limit integer if only expands in width, array if expands in width and height |
|
20 * @type jQuery |
|
21 * @cat Plugins/Interface |
|
22 * @author Stefan Petre |
|
23 */ |
|
24 |
|
25 jQuery.iExpander = |
|
26 { |
|
27 helper : null, |
|
28 expand : function() |
|
29 { |
|
30 |
|
31 text = this.value; |
|
32 if (!text) |
|
33 return; |
|
34 style = { |
|
35 fontFamily: jQuery(this).css('fontFamily')||'', |
|
36 fontSize: jQuery(this).css('fontSize')||'', |
|
37 fontWeight: jQuery(this).css('fontWeight')||'', |
|
38 fontStyle: jQuery(this).css('fontStyle')||'', |
|
39 fontStretch: jQuery(this).css('fontStretch')||'', |
|
40 fontVariant: jQuery(this).css('fontVariant')||'', |
|
41 letterSpacing: jQuery(this).css('letterSpacing')||'', |
|
42 wordSpacing: jQuery(this).css('wordSpacing')||'' |
|
43 }; |
|
44 jQuery.iExpander.helper.css(style); |
|
45 html = jQuery.iExpander.htmlEntities(text); |
|
46 html = html.replace(new RegExp( "\\n", "g" ), "<br />"); |
|
47 jQuery.iExpander.helper.html('pW'); |
|
48 spacer = jQuery.iExpander.helper.get(0).offsetWidth; |
|
49 jQuery.iExpander.helper.html(html); |
|
50 width = jQuery.iExpander.helper.get(0).offsetWidth + spacer; |
|
51 if (this.Expander.limit && width > this.Expander.limit[0]) { |
|
52 width = this.Expander.limit[0]; |
|
53 } |
|
54 this.style.width = width + 'px'; |
|
55 if (this.tagName == 'TEXTAREA') { |
|
56 height = jQuery.iExpander.helper.get(0).offsetHeight + spacer; |
|
57 if (this.Expander.limit && height > this.Expander.limit[1]) { |
|
58 height = this.Expander.limit[1]; |
|
59 } |
|
60 this.style.height = height + 'px'; |
|
61 } |
|
62 }, |
|
63 htmlEntities : function(text) |
|
64 { |
|
65 entities = { |
|
66 '&':'&', |
|
67 '<':'<', |
|
68 '>':'>', |
|
69 '"':'"' |
|
70 }; |
|
71 for(i in entities) { |
|
72 text = text.replace(new RegExp(i,'g'),entities[i]); |
|
73 } |
|
74 return text; |
|
75 }, |
|
76 build : function(limit) |
|
77 { |
|
78 if (jQuery.iExpander.helper == null) { |
|
79 jQuery('body', document).append('<div id="expanderHelper" style="position: absolute; top: 0; left: 0; visibility: hidden;"></div>'); |
|
80 jQuery.iExpander.helper = jQuery('#expanderHelper'); |
|
81 } |
|
82 return this.each( |
|
83 function() |
|
84 { |
|
85 if (/TEXTAREA|INPUT/.test(this.tagName)) { |
|
86 if (this.tagName == 'INPUT') { |
|
87 elType = this.getAttribute('type'); |
|
88 if (!/text|password/.test(elType)) { |
|
89 return; |
|
90 } |
|
91 } |
|
92 if (limit && (limit.constructor == Number || (limit.constructor == Array && limit.length == 2))) { |
|
93 if (limit.constructor == Number) |
|
94 limit = [limit, limit]; |
|
95 else { |
|
96 limit[0] = parseInt(limit[0])||400; |
|
97 limit[1] = parseInt(limit[1])||400; |
|
98 } |
|
99 this.Expander = { |
|
100 limit : limit |
|
101 }; |
|
102 } |
|
103 jQuery(this) |
|
104 .blur(jQuery.iExpander.expand) |
|
105 .keyup(jQuery.iExpander.expand) |
|
106 .keypress(jQuery.iExpander.expand); |
|
107 jQuery.iExpander.expand.apply(this); |
|
108 } |
|
109 } |
|
110 ); |
|
111 } |
|
112 }; |
|
113 |
|
114 jQuery.fn.Autoexpand = jQuery.iExpander.build; |