or ), but haven't quite gotten it working yet, need to push this fix now
68 | var preMatch = '(^|[\\s\\0])';
69 |
70 | for ( var i=threeCharacterEmoticons.length-1; i>=0; --i ){
71 | threeCharacterEmoticons[i] = threeCharacterEmoticons[i].replace(specialRegex,'\\$1');
72 | threeCharacterEmoticons[i] = new RegExp( preMatch+'(' + threeCharacterEmoticons[i] + ')', 'g' );
73 | }
74 |
75 | for ( var i=twoCharacterEmoticons.length-1; i>=0; --i ){
76 | twoCharacterEmoticons[i] = twoCharacterEmoticons[i].replace(specialRegex,'\\$1');
77 | twoCharacterEmoticons[i] = new RegExp( preMatch+'(' + twoCharacterEmoticons[i] + ')', 'g' );
78 | }
79 |
80 | for ( var emoticon in specialEmoticons ){
81 | specialEmoticons[emoticon].regexp = emoticon.replace(specialRegex,'\\$1');
82 | specialEmoticons[emoticon].regexp = new RegExp( preMatch+'(' + specialEmoticons[emoticon].regexp + ')', 'g' );
83 | }
84 |
85 | var exclude = 'span.css-emoticon';
86 | if(opts.exclude){ exclude += ','+opts.exclude; }
87 | var excludeArray = exclude.split(',')
88 |
89 | return this.not(exclude).each(function() {
90 | var container = $(this);
91 | var cssClass = 'css-emoticon'
92 | if(opts.animate){ cssClass += ' un-transformed-emoticon animated-emoticon'; }
93 |
94 | for( var emoticon in specialEmoticons ){
95 | specialCssClass = cssClass + " " + specialEmoticons[emoticon].cssClass;
96 | container.html(container.html().replace(specialEmoticons[emoticon].regexp,"$1$2"));
97 | }
98 | $(threeCharacterEmoticons).each(function(){
99 | container.html(container.html().replace(this,"$1$2"));
100 | });
101 | $(twoCharacterEmoticons).each(function(){
102 | container.html(container.html().replace(this,"$1$2"));
103 | });
104 | // fix emoticons that got matched more then once (where one emoticon is a subset of another emoticon), and thus got nested spans
105 | $.each(excludeArray,function(index,item){
106 | container.find($.trim(item)+" span.css-emoticon").each(function(){
107 | $(this).replaceWith($(this).text());
108 | });
109 | });
110 | if(opts.animate){
111 | setTimeout(function(){$('.un-transformed-emoticon').removeClass('un-transformed-emoticon');}, opts.delay);
112 | }
113 | });
114 | }
115 |
116 | $.fn.unemoticonize = function(options) {
117 | var opts = $.extend({}, $.fn.emoticonize.defaults, options);
118 | return this.each(function() {
119 | var container = $(this);
120 | container.find('span.css-emoticon').each(function(){
121 | // add delay equal to animate speed if animate is not false
122 | var span = $(this);
123 | if(opts.animate){
124 | span.addClass('un-transformed-emoticon');
125 | setTimeout(function(){span.replaceWith(span.text());}, opts.delay);
126 | }else{
127 | span.replaceWith(span.text());
128 | }
129 | });
130 | });
131 | }
132 |
133 | $.fn.emoticonize.defaults = {animate: true, delay: 500, exclude: 'pre,code,.no-emoticons'}
134 | })(jQuery);
--------------------------------------------------------------------------------
/javascripts/jquery.cssemoticons.min.js:
--------------------------------------------------------------------------------
1 | /*
2 | * jQuery CSSEmoticons plugin 0.2.9
3 | *
4 | * Copyright (c) 2010 Steve Schwartz (JangoSteve)
5 | *
6 | * Dual licensed under the MIT and GPL licenses:
7 | * http://www.opensource.org/licenses/mit-license.php
8 | * http://www.gnu.org/licenses/gpl.html
9 | *
10 | * Date: Sun Oct 22 1:00:00 2010 -0500
11 | */(function(a){a.fn.emoticonize=function(m){var c=a.extend({},a.fn.emoticonize.defaults,m);var d=[")","(","*","[","]","{","}","|","^","<",">","\\","?","+","=","."];var l=[":-)",":o)",":c)",":^)",":-D",":-(",":-9",";-)",":-P",":-p",":-Þ",":-b",":-O",":-/",":-X",":-#",":'(","B-)","8-)",";*(",":-*",":-\\","?-)",": )",": ]","= ]","= )","8 )",": }",": D","8 D","X D","x D","= D",": (",": [",": {","= (","; )","; ]","; D",": P",": p","= P","= p",": b",": Þ",": O","8 O",": /","= /",": S",": #",": X","B )",": |",": \\","= \\",": *",": >",": <"];var j=[":)",":]","=]","=)","8)",":}",":D",":(",":[",":{","=(",";)",";]",";D",":P",":p","=P","=p",":b",":Þ",":O",":/","=/",":S",":#",":X","B)",":|",":\\","=\\",":*",":>",":<"];var h={">:)":{cssClass:"red-emoticon small-emoticon spaced-emoticon"},">;)":{cssClass:"red-emoticon small-emoticon spaced-emoticon"},">:(":{cssClass:"red-emoticon small-emoticon spaced-emoticon"},">: )":{cssClass:"red-emoticon small-emoticon"},">; )":{cssClass:"red-emoticon small-emoticon"},">: (":{cssClass:"red-emoticon small-emoticon"},";(":{cssClass:"red-emoticon spaced-emoticon"},"<3":{cssClass:"pink-emoticon counter-rotated"},O_O:{cssClass:"no-rotate"},o_o:{cssClass:"no-rotate"},"0_o":{cssClass:"no-rotate"},O_o:{cssClass:"no-rotate"},T_T:{cssClass:"no-rotate"},"^_^":{cssClass:"no-rotate"},"O:)":{cssClass:"small-emoticon spaced-emoticon"},"O: )":{cssClass:"small-emoticon"},"8D":{cssClass:"small-emoticon spaced-emoticon"},XD:{cssClass:"small-emoticon spaced-emoticon"},xD:{cssClass:"small-emoticon spaced-emoticon"},"=D":{cssClass:"small-emoticon spaced-emoticon"},"8O":{cssClass:"small-emoticon spaced-emoticon"},"[+=..]":{cssClass:"no-rotate nintendo-controller"}};var f=new RegExp("(\\"+d.join("|\\")+")","g");var n="(^|[\\s\\0])";for(var g=l.length-1;g>=0;--g){l[g]=l[g].replace(f,"\\$1");l[g]=new RegExp(n+"("+l[g]+")","g")}for(var g=j.length-1;g>=0;--g){j[g]=j[g].replace(f,"\\$1");j[g]=new RegExp(n+"("+j[g]+")","g")}for(var k in h){h[k].regexp=k.replace(f,"\\$1");h[k].regexp=new RegExp(n+"("+h[k].regexp+")","g")}var e="span.css-emoticon";if(c.exclude){e+=","+c.exclude}var b=e.split(",");return this.not(e).each(function(){var o=a(this);var i="css-emoticon";if(c.animate){i+=" un-transformed-emoticon animated-emoticon"}for(var p in h){specialCssClass=i+" "+h[p].cssClass;o.html(o.html().replace(h[p].regexp,"$1$2"))}a(l).each(function(){o.html(o.html().replace(this,"$1$2"))});a(j).each(function(){o.html(o.html().replace(this,"$1$2"))});a.each(b,function(q,r){o.find(a.trim(r)+" span.css-emoticon").each(function(){a(this).replaceWith(a(this).text())})});if(c.animate){setTimeout(function(){a(".un-transformed-emoticon").removeClass("un-transformed-emoticon")},c.delay)}})};a.fn.unemoticonize=function(b){var c=a.extend({},a.fn.emoticonize.defaults,b);return this.each(function(){var d=a(this);d.find("span.css-emoticon").each(function(){var e=a(this);if(c.animate){e.addClass("un-transformed-emoticon");setTimeout(function(){e.replaceWith(e.text())},c.delay)}else{e.replaceWith(e.text())}})})};a.fn.emoticonize.defaults={animate:true,delay:500,exclude:"pre,code,.no-emoticons"}})(jQuery);
--------------------------------------------------------------------------------
/stylesheets/jquery.cssemoticons.css:
--------------------------------------------------------------------------------
1 | /*
2 | * jQuery CSSEmoticons plugin 0.2.9
3 | *
4 | * Copyright (c) 2010 Steve Schwartz (JangoSteve)
5 | *
6 | * Dual licensed under the MIT and GPL licenses:
7 | * http://www.opensource.org/licenses/mit-license.php
8 | * http://www.gnu.org/licenses/gpl.html
9 | *
10 | * Date: Sun Oct 22 1:00:00 2010 -0500
11 | */
12 |
13 | /* Basic styles for emoticons */
14 | span.css-emoticon {
15 | font-family: "Trebuchet MS"; /* seems to give the best and most consistent emoticon appearance */
16 | font-size: 0.65em;
17 | font-weight: bold;
18 | color: #000000;
19 | display: inline-block;
20 | overflow: hidden;
21 | vertical-align: middle;
22 | transform: rotate(90deg);
23 | -webkit-transform: rotate(90deg);
24 | -moz-transform: rotate(90deg);
25 | -o-transform: rotate(90deg);
26 | width: 1.54em; /* note that this is a multiple of this span's font-size, not containing text font-size */
27 | height: 1.54em; /* so, relative to containing text, width and height are 0.9 x 1.6 = 1.44em */
28 | text-align: center;
29 | padding: 0;
30 | line-height: 1.34em;
31 | -moz-border-radius: 1.54em;
32 | -webkit-border-radius: 1.54em;
33 | border-radius: 1.54em;
34 | -moz-box-shadow: 1px -1px 2px rgba(0,0,0,0.5);
35 | -webkit-box-shadow: 1px -1px 2px rgba(0,0,0,0.5);
36 | box-shadow: 1px -1px 2px rgba(0,0,0,0.5);
37 | border: 1px solid rgba(0,0,0,0.25);
38 | background-color: #ffcc00;
39 | background-image: -webkit-gradient(
40 | linear,
41 | right top,
42 | left top,
43 | color-stop(0.41, rgb(255,204,0)),
44 | color-stop(0.56, rgb(255,221,85)),
45 | color-stop(1, rgb(255,238,170))
46 | );
47 | background-image: -moz-linear-gradient(
48 | center right,
49 | rgb(255,204,0) 41%,
50 | rgb(255,221,85) 56%,
51 | rgb(255,238,170) 100%
52 | );
53 | -webkit-transition-property:color, background, transform;
54 | -webkit-transition-duration: 1s, 1s;
55 | -webkit-transition-timing-function: linear, ease-in;
56 | }
57 |
58 | /* Styles for two-character emoticons that need more letter-spacing for proportionality */
59 | span.css-emoticon.spaced-emoticon {
60 | padding-left: 0.2em;
61 | width: 1.34em;
62 | letter-spacing: 0.2em;
63 | }
64 |
65 | /* This is a dirty dirty hack, because webkit doesn't properly do the padding+width=total-width as it should
66 | I think the width of the border may be throwing things off, because it's more noticable for small icons */
67 | @media screen and (-webkit-min-device-pixel-ratio:0) {
68 | span.css-emoticon.spaced-emoticon {
69 | width: 1.4em;
70 | }
71 | }
72 |
73 | /* Styles for emoticons that need to have smaller characters to fit inside the circle */
74 | span.css-emoticon.small-emoticon {
75 | font-size: 0.55em;
76 | width: 1.82em;
77 | height: 1.82em;
78 | line-height: 1.72em;
79 | -moz-border-radius: 1.82em;
80 | -webkit-border-radius: 1.82em;
81 | border-radius: 1.82em;
82 | }
83 |
84 | span.css-emoticon.small-emoticon.spaced-emoticon {
85 | padding-left: 0;
86 | width: 1.82em;
87 | letter-spacing: 0.1em;
88 | }
89 |
90 | /* Styles for additional colors */
91 | span.css-emoticon.red-emoticon {
92 | background-color: #eb0542;
93 | background-image: -webkit-gradient(
94 | linear,
95 | right top,
96 | left top,
97 | color-stop(0.41, rgb(235,5,66)),
98 | color-stop(0.56, rgb(235,38,90)),
99 | color-stop(1, rgb(250,55,110))
100 | );
101 | background-image: -moz-linear-gradient(
102 | center right,
103 | rgb(235,5,66) 41%,
104 | rgb(235,38,90) 56%,
105 | rgb(250,55,110) 100%
106 | );
107 | }
108 |
109 | span.css-emoticon.pink-emoticon {
110 | background-color: #ff8fd4;
111 | background-image: -webkit-gradient(
112 | linear,
113 | right top,
114 | left top,
115 | color-stop(0.41, rgb(255,143,212)),
116 | color-stop(0.56, rgb(255,153,216)),
117 | color-stop(1, rgb(255,173,225))
118 | );
119 | background-image: -moz-linear-gradient(
120 | center right,
121 | rgb(255,143,212) 41%,
122 | rgb(255,153,216) 56%,
123 | rgb(255,173,225) 100%
124 | );
125 | }
126 |
127 | /* styles for emoticons that need no rotation, like O_o */
128 | span.css-emoticon.no-rotate {
129 | transform: rotate(0deg);
130 | -webkit-transform: rotate(0deg);
131 | -moz-transform: rotate(0deg);
132 | -o-transform: rotate(0deg);
133 | -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
134 | -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
135 | box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
136 | font-size: 0.45em;
137 | width: 2.2em;
138 | height: 2.2em;
139 | line-height: 1.9em;
140 | -moz-border-radius: 2.2em;
141 | -webkit-border-radius: 2.2em;
142 | border-radius: 2.2em;
143 | background-image: -webkit-gradient(
144 | linear,
145 | right bottom,
146 | right top,
147 | color-stop(0.41, rgb(255,204,0)),
148 | color-stop(0.56, rgb(255,221,85)),
149 | color-stop(1, rgb(255,238,170))
150 | );
151 | background-image: -moz-linear-gradient(
152 | center bottom,
153 | rgb(255,204,0) 41%,
154 | rgb(255,221,85) 56%,
155 | rgb(255,238,170) 100%
156 | );
157 | }
158 |
159 | span.css-emoticon.no-rotate.red-emoticon {
160 | background-image: -webkit-gradient(
161 | linear,
162 | right bottom,
163 | right top,
164 | color-stop(0.41, rgb(235,5,66)),
165 | color-stop(0.56, rgb(235,38,90)),
166 | color-stop(1, rgb(250,55,110))
167 | );
168 | background-image: -moz-linear-gradient(
169 | center bottom,
170 | rgb(235,5,66) 41%,
171 | rgb(235,38,90) 56%,
172 | rgb(250,55,110) 100%
173 | );
174 | }
175 |
176 | span.css-emoticon.no-rotate.pink-emoticon {
177 | background-image: -webkit-gradient(
178 | linear,
179 | right bottom,
180 | right top,
181 | color-stop(0.41, rgb(255,143,212)),
182 | color-stop(0.56, rgb(255,153,216)),
183 | color-stop(1, rgb(255,173,225))
184 | );
185 | background-image: -moz-linear-gradient(
186 | center bottom,
187 | rgb(255,143,212) 41%,
188 | rgb(255,153,216) 56%,
189 | rgb(255,173,225) 100%
190 | );
191 | }
192 |
193 | /* Styles for emoticons that need to be rotated counter-clockwise, like <3 */
194 | span.css-emoticon.counter-rotated {
195 | transform: rotate(-90deg);
196 | -webkit-transform: rotate(-90deg);
197 | -moz-transform: rotate(-90deg);
198 | -o-transform: rotate(-90deg);
199 | -moz-box-shadow: -1px 1px 2px rgba(0,0,0,0.5);
200 | -webkit-box-shadow: -1px 1px 2px rgba(0,0,0,0.5);
201 | box-shadow: -1px 1px 2px rgba(0,0,0,0.5);
202 | background-image: -webkit-gradient(
203 | linear,
204 | left top,
205 | right top,
206 | color-stop(0.41, rgb(255,204,0)),
207 | color-stop(0.56, rgb(255,221,85)),
208 | color-stop(1, rgb(255,238,170))
209 | );
210 | background-image: -moz-linear-gradient(
211 | center left,
212 | rgb(255,204,0) 41%,
213 | rgb(255,221,85) 56%,
214 | rgb(255,238,170) 100%
215 | );
216 | }
217 |
218 | span.css-emoticon.counter-rotated.red-emoticon {
219 | background-image: -webkit-gradient(
220 | linear,
221 | left top,
222 | right top,
223 | color-stop(0.41, rgb(235,5,66)),
224 | color-stop(0.56, rgb(235,38,90)),
225 | color-stop(1, rgb(250,55,110))
226 | );
227 | background-image: -moz-linear-gradient(
228 | center left,
229 | rgb(235,5,66) 41%,
230 | rgb(235,38,90) 56%,
231 | rgb(250,55,110) 100%
232 | );
233 | }
234 |
235 | span.css-emoticon.counter-rotated.pink-emoticon {
236 | background-image: -webkit-gradient(
237 | linear,
238 | left top,
239 | right top,
240 | color-stop(0.41, rgb(255,143,212)),
241 | color-stop(0.56, rgb(255,153,216)),
242 | color-stop(1, rgb(255,173,225))
243 | );
244 | background-image: -moz-linear-gradient(
245 | center left,
246 | rgb(255,143,212) 41%,
247 | rgb(255,153,216) 56%,
248 | rgb(255,173,225) 100%
249 | );
250 | }
251 |
252 | /* Styles for animated states */
253 | span.css-emoticon.un-transformed-emoticon, span.css-emoticon.animated-emoticon:hover {
254 | /* font-size: inherit;
255 | font-weight: inherit;
256 | vertical-align: inherit;
257 | line-height: inherit;
258 | font-family: inherit; */
259 | letter-spacing: inherit;
260 | color: inherit;
261 | overflow: visible;
262 | transform: rotate(0deg);
263 | -webkit-transform: rotate(0deg);
264 | -moz-transform: rotate(0deg);
265 | -o-transform: rotate(0deg);
266 | background: none;
267 | background-image: none;
268 | box-shadow: none;
269 | -moz-box-shadow: none;
270 | -webkit-box-shadow: none;
271 | border-color: transparent;
272 | }
273 |
274 | span.css-emoticon.nintendo-controller {
275 | font-size: .8em;
276 | height: 1.2em;
277 | line-height: 1em;
278 | width: 2.7em;
279 | vertical-align: bottom;
280 | border-radius: 0;
281 | -webkit-border-radius: 0;
282 | -moz-border-radius: 0;
283 | background: -webkit-gradient(
284 | linear,
285 | left bottom,
286 | left top,
287 | color-stop(0.09, rgb(116,121,140)),
288 | color-stop(0.55, rgb(165,170,189))
289 | );
290 | background: -moz-linear-gradient(
291 | center bottom,
292 | rgb(116,121,140) 9%,
293 | rgb(165,170,189) 55%
294 | );
295 | }
--------------------------------------------------------------------------------