@@ -14,7 +14,7 @@ So, this utility attempts to handle everything. It:
14
14
- Will properly handle URLs with query parameters or a named anchor (i.e. hash)
15
15
- Will autolink email addresses.
16
16
- Will autolink phone numbers.
17
- - Will autolink Twitter handles .
17
+ - Will autolink mentions ( Twitter, Instagram) .
18
18
- Will autolink hashtags.
19
19
- Will properly handle HTML input. The utility will not change the ` href `
20
20
attribute inside anchor (< ; a> ; ) tags (or any other tag/attribute for that
@@ -27,6 +27,23 @@ Full API Docs: [http://gregjacobs.github.io/Autolinker.js/docs/](http://gregjaco
27
27
Live Example: [ http://gregjacobs.github.io/Autolinker.js/examples/live-example/ ] ( http://gregjacobs.github.io/Autolinker.js/examples/live-example/ )
28
28
29
29
30
+ ## Breaking Changes from 0.x -> 1.x
31
+
32
+ 1 . ` twitter ` option removed, replaced with ` mention ` (which accepts 'twitter'
33
+ and 'instagram' values)
34
+ 2 . Matching mentions (previously the ` twitter ` option) now defaults to
35
+ being turned off. Previously, Twitter handle matching was on by
36
+ default.
37
+ 3 . ` replaceFn ` option now called with just one argument: the ` Match `
38
+ object (previously was called with two arguments: ` autolinker ` and
39
+ ` match ` )
40
+ 4 . (Used inside the ` replaceFn ` ) ` TwitterMatch ` replaced with
41
+ ` MentionMatch ` , and ` MentionMatch.getType() ` now returns ` 'mention' `
42
+ instead of ` 'twitter' `
43
+ 5 . (Used inside the ` replaceFn ` ) ` TwitterMatch.getTwitterHandle() ` ->
44
+ ` MentionMatch.getMention() `
45
+
46
+
30
47
## Installation
31
48
32
49
#### Download
@@ -109,66 +126,68 @@ providing an Object as the second parameter to [Autolinker.link()](http://gregja
109
126
hashtags should be truncated to inside the text of a link. If the match is
110
127
over the number of characters, it will be truncated to this length by
111
128
replacing the end of the string with a two period ellipsis ('..').<br /><br />
112
-
129
+
113
130
Example: a url like 'http://www.yahoo.com/some/long/path/to/a/file ' truncated
114
131
to 25 characters may look like this: 'yahoo.com/some/long/pat..'<br /><br />
115
-
116
- In the object form, both ` length ` and ` location ` may be specified to perform
117
- truncation. Available options for ` location ` are: 'end' (default), 'middle',
118
- or 'smart'. Example usage:
119
-
132
+
133
+ In the object form, both ` length ` and ` location ` may be specified to perform
134
+ truncation. Available options for ` location ` are: 'end' (default), 'middle',
135
+ or 'smart'. Example usage:
136
+
120
137
``` javascript
121
138
truncate: { length: 32 , location: ' middle' }
122
139
```
123
-
124
- The ' smart' truncation option is for URLs where the algorithm attempts to
125
- strip out unnecessary parts of the URL (such as the ' www.' , then URL scheme,
126
- hash, etc.) before trying to find a good point to insert the ellipsis if it is
127
- still too long . For details, see source code of:
140
+
141
+ The ' smart' truncation option is for URLs where the algorithm attempts to
142
+ strip out unnecessary parts of the URL (such as the ' www.' , then URL scheme,
143
+ hash, etc.) before trying to find a good point to insert the ellipsis if it is
144
+ still too long . For details, see source code of:
128
145
[TruncateSmart](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.truncate.TruncateSmart)
129
146
- [className](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-className) : String<br />
130
147
A CSS class name to add to the generated anchor tags . This class will be added
131
- to all links, as well as this class plus " url" / " email" / " phone" / " twitter" / " hashtag "
132
- suffixes for styling url/ email/ phone/ twitter / hashtag links differently.
148
+ to all links, as well as this class plus " url" / " email" / " phone" / " hashtag " / " mention " / " twitter" / " instagram "
149
+ suffixes for styling url/ email/ phone/ hashtag/ mention links differently.
133
150
134
151
For example, if this config is provided as " myLink" , then:
135
152
136
153
1 ) URL links will have the CSS classes: " myLink myLink-url" < br / >
137
154
2 ) Email links will have the CSS classes: " myLink myLink-email" < br / >
138
155
3 ) Phone links will have the CSS classes: " myLink myLink-phone" < br / >
139
- 4 ) Twitter links will have the CSS classes: " myLink myLink-twitter" < br / >
156
+ 4 ) Twitter mention links will have the CSS classes: " myLink myLink-mention myLink-twitter" < br / >
157
+ 5 ) Instagram mention links will have the CSS classes: " myLink myLink-mention myLink-instagram" < br / >
140
158
5 ) Hashtag links will have the CSS classes: " myLink myLink-hashtag" < br / >
141
159
142
160
- [urls](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-urls) : Boolean/Object<br />
143
161
` true` to have URLs auto- linked, ` false` to skip auto- linking of URLs.
144
162
Defaults to ` true` .< br>
145
-
163
+
146
164
This option also accepts an Object form with 3 properties, to allow for more
147
165
customization of what exactly gets linked . All default to ` true` :
148
-
166
+
149
167
- schemeMatches (Boolean ): ` true` to match URLs found prefixed with a scheme,
150
168
i .e . ` http://google.com` , or ` other+scheme://google.com` , ` false` to
151
169
prevent these types of matches.
152
170
- wwwMatches (Boolean ): ` true` to match urls found prefixed with ` 'www.'` ,
153
- i .e . ` www.google.com` . ` false` to prevent these types of matches . Note
154
- that if the URL had a prefixed scheme, and ` schemeMatches` is true , it
171
+ i .e . ` www.google.com` . ` false` to prevent these types of matches . Note
172
+ that if the URL had a prefixed scheme, and ` schemeMatches` is true , it
155
173
will still be linked.
156
174
- tldMatches: ` true` to match URLs with known top level domains (.com , .net ,
157
- etc.) that are not prefixed with a scheme or ` 'www.'` . Ex : ` google.com` ,
175
+ etc.) that are not prefixed with a scheme or ` 'www.'` . Ex : ` google.com` ,
158
176
` asdf.org/?page=1` , etc. ` false` to prevent these types of matches.
159
177
< br / >
160
-
178
+
161
179
Example usage: ` urls: { schemeMatches: true, wwwMatches: true, tldMatches: false }`
162
-
180
+
163
181
- [email](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-email) : Boolean<br />
164
182
` true` to have email addresses auto- linked, ` false` to skip auto- linking of
165
183
email addresses . Defaults to ` true` .< br / >< br / >
166
184
- [phone](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-phone) : Boolean<br />
167
185
` true` to have phone numbers auto- linked, ` false` to skip auto- linking of
168
186
phone numbers . Defaults to ` true` .< br / >< br / >
169
- - [twitter](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-twitter) : Boolean<br />
170
- ` true` to have Twitter handles auto- linked, ` false` to skip auto- linking of
171
- Twitter handles . Defaults to ` true` .< br / >< br / >
187
+ - [mention](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-mention) : String<br />
188
+ A string for the service name to have mentions (@username) auto- linked to . Supported
189
+ values at this time are ' twitter' , and ' instagram' . Pass ` false` to skip
190
+ auto- linking of mentions . Defaults to ` false` .< br / >< br / >
172
191
- [hashtag](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-hashtag) : Boolean/String<br />
173
192
A string for the service name to have hashtags auto- linked to . Supported
174
193
values at this time are ' twitter' , ' facebook' and ' instagram' . Pass ` false` to skip
@@ -225,23 +244,23 @@ autolinker.link( "Go to www.google.com" );
225
244
## Custom Replacement Function
226
245
227
246
A custom replacement function ([replaceFn ](http: // gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-replaceFn))
228
- may be provided to replace url/ email/ phone/ Twitter handle / hashtag matches on an
247
+ may be provided to replace url/ email/ phone/ mention / hashtag matches on an
229
248
individual basis, based on the return from this function .
230
249
231
250
#### Full example, for purposes of documenting the API:
232
251
233
252
```javascript
234
- var input = "..."; // string with URLs, Email Addresses, Twitter Handles , and Hashtags
253
+ var input = "..."; // string with URLs, Email Addresses, Mentions ( Twitter, Instagram) , and Hashtags
235
254
236
255
var linkedText = Autolinker.link ( input , {
237
- replaceFn : function ( autolinker , match ) {
256
+ replaceFn : function ( match ) {
238
257
console .log ( " href = " , match .getAnchorHref () );
239
258
console .log ( " text = " , match .getAnchorText () );
240
259
241
260
switch ( match .getType () ) {
242
261
case ' url' :
243
262
console .log ( " url: " , match .getUrl () );
244
-
263
+
245
264
return true ; // let Autolinker perform its normal anchor tag replacement
246
265
247
266
case ' email' :
@@ -259,10 +278,11 @@ var linkedText = Autolinker.link( input, {
259
278
260
279
return ' <a href="http://newplace.to.link.phone.numbers.to/">' + match .getNumber () + ' </a>' ;
261
280
262
- case ' twitter' :
263
- console .log ( " Twitter Handle: " , match .getTwitterHandle () );
281
+ case ' mention' :
282
+ console .log ( " Mention: " , match .getMention () );
283
+ console .log ( " Mention Service Name: " , match .getServiceName () );
264
284
265
- return ' <a href="http://newplace.to.link.twitter .handles.to/">' + match .getTwitterHandle () + ' </a>' ;
285
+ return ' <a href="http://newplace.to.link.mention .handles.to/">' + match .getMention () + ' </a>' ;
266
286
267
287
case ' hashtag' :
268
288
console .log ( " Hashtag: " , match .getHashtag () );
@@ -276,13 +296,13 @@ var linkedText = Autolinker.link( input, {
276
296
#### Modifying the default generated anchor tag
277
297
278
298
```javascript
279
- var input = "..."; // string with URLs, Email Addresses, Twitter Handles , and Hashtags
299
+ var input = "..."; // string with URLs, Email Addresses, Mentions ( Twitter, Instagram) , and Hashtags
280
300
281
301
var linkedText = Autolinker.link( input, {
282
- replaceFn : function ( autolinker , match ) {
302
+ replaceFn : function ( match ) {
283
303
console .log ( " href = " , match .getAnchorHref () );
284
304
console .log ( " text = " , match .getAnchorText () );
285
-
305
+
286
306
var tag = match .buildTag (); // returns an `Autolinker.HtmlTag` instance for an <a> tag
287
307
tag .setAttr ( ' rel' , ' nofollow' ); // adds a 'rel' attribute
288
308
tag .addClass ( ' external-link' ); // adds a CSS class
@@ -294,10 +314,9 @@ var linkedText = Autolinker.link( input, {
294
314
` ` `
295
315
296
316
297
- The ` replaceFn ` is provided two arguments :
317
+ The ` replaceFn ` is provided one argument :
298
318
299
- 1. The [Autolinker](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker) instance that is performing replacements.
300
- 2. An [Autolinker.match.Match](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.match.Match)
319
+ 1. An [Autolinker.match.Match](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.match.Match)
301
320
object which details the match that is to be replaced.
302
321
303
322
0 commit comments