Skip to content

Commit 28d0b1a

Browse files
committed
Add some more tests for phone number handling, and clean up some documentation.
Remove `preprocessFn`, since this is not really a responsibility of Autolinker. The input text can simply be preprocessed before passing it in.
1 parent de943c8 commit 28d0b1a

File tree

8 files changed

+1032
-866
lines changed

8 files changed

+1032
-866
lines changed

README.md

Lines changed: 70 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,24 @@
11
# Autolinker.js
22

3-
Because I had so much trouble finding a good autolinking implementation out in the wild, I decided to roll my own. It
4-
seemed that everything I found out there was either an implementation that didn't cover every case, or was just limited
5-
in one way or another.
3+
Because I had so much trouble finding a good auto-linking implementation out in
4+
the wild, I decided to roll my own. It seemed that everything I found out there
5+
was either an implementation that didn't cover every case, or was just limited
6+
in one way or another.
67

78
So, this utility attempts to handle everything. It:
89

9-
- Autolinks URLs, whether or not they start with the protocol (i.e. 'http://'). In other words, it will automatically link the
10-
text "google.com", as well as "http://google.com".
10+
- Autolinks URLs, whether or not they start with the protocol (i.e. 'http://').
11+
In other words, it will automatically link the text "google.com", as well as
12+
"http://google.com".
1113
- Will properly handle URLs with special characters
1214
- Will properly handle URLs with query parameters or a named anchor (i.e. hash)
1315
- Will autolink email addresses.
16+
- Will autolink phone numbers.
1417
- Will autolink Twitter handles.
15-
- Will properly handle HTML input. The utility will not change the `href` attribute inside anchor (<a>) tags (or any other
16-
tag/attribute for that matter), and will not accidentally wrap the inner text of an anchor tag with a new one (which would cause
17-
doubly-nested anchor tags).
18+
- Will properly handle HTML input. The utility will not change the `href`
19+
attribute inside anchor (<a>) tags (or any other tag/attribute for that
20+
matter), and will not accidentally wrap the inner text of an anchor tag with a
21+
new one (which would cause doubly-nested anchor tags).
1822

1923
Hope that this utility helps you as well!
2024

@@ -23,7 +27,8 @@ Hope that this utility helps you as well!
2327

2428
#### Download
2529

26-
Simply clone or download the zip of the project, and link to either `dist/Autolinker.js` or `dist/Autolinker.min.js` with a script tag:
30+
Simply clone or download the zip of the project, and link to either
31+
`dist/Autolinker.js` or `dist/Autolinker.min.js` with a script tag:
2732

2833
```html
2934
<script src="path/to/Autolinker.min.js"></script>
@@ -49,14 +54,15 @@ JavaScript:
4954

5055
```javascript
5156
var Autolinker = require( 'autolinker' );
52-
// note: npm wants an all-lowercase package name, but the utility is a class and should be
53-
// aliased with a capital letter
57+
// note: npm wants an all-lowercase package name, but the utility is a class and
58+
// should be aliased with a capital letter
5459
```
5560

5661

5762
## Usage
5863

59-
Using the static [link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-static-method-link) method:
64+
Using the static [link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-static-method-link)
65+
method:
6066

6167
```javascript
6268
var linkedText = Autolinker.link( textToAutolink[, options] );
@@ -70,10 +76,12 @@ var autolinker = new Autolinker( [ options ] );
7076
var linkedText = autolinker.link( textToAutoLink );
7177
```
7278

73-
Note: if using the same options to autolink multiple pieces of html/text, it is slightly more efficient to create a single
74-
Autolinker instance, and run the [link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-method-link) method repeatedly (i.e. use the "class" form above).
79+
Note: if using the same options to autolink multiple pieces of html/text, it is
80+
slightly more efficient to create a single Autolinker instance, and run the
81+
[link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-method-link)
82+
method repeatedly (i.e. use the "class" form above).
83+
7584

76-
7785
#### Example:
7886

7987
```javascript
@@ -83,7 +91,8 @@ var linkedText = Autolinker.link( "Check out google.com", { className: "myLink"
8391

8492
## Options
8593

86-
These are the options which may be specified for linking. These are specified by providing an Object as the second parameter to [Autolinker.link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-static-method-link). These include:
94+
These are the options which may be specified for linking. These are specified by
95+
providing an Object as the second parameter to [Autolinker.link()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-static-method-link). These include:
8796

8897
- [newWindow](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-newWindow) : Boolean<br />
8998
`true` to have the links should open in a new window when clicked, `false` otherwise. Defaults to `true`.<br /><br />
@@ -95,21 +104,23 @@ These are the options which may be specified for linking. These are specified by
95104
- [className](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-className) : String<br />
96105
A CSS class name to add to the generated anchor tags. This class will be added to all links, as well as this class
97106
plus "url"/"email"/"twitter" suffixes for styling url/email/twitter links differently.
98-
107+
99108
For example, if this config is provided as "myLink", then:
100-
109+
101110
1) URL links will have the CSS classes: "myLink myLink-url"<br />
102111
2) Email links will have the CSS classes: "myLink myLink-email", and<br />
103112
3) Twitter links will have the CSS classes: "myLink myLink-twitter"<br />
104-
113+
105114
- [urls](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-urls) : Boolean<br />
106115
`true` to have URLs auto-linked, `false` to skip auto-linking of URLs. Defaults to `true`.<br />
107116
- [email](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-email) : Boolean<br />
108117
`true` to have email addresses auto-linked, `false` to skip auto-linking of email addresses. Defaults to `true`.<br /><br />
118+
- [phone](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-phone) : Boolean<br />
119+
`true` to have phone numbers auto-linked, `false` to skip auto-linking of phone numbers. Defaults to `true`.<br /><br />
109120
- [twitter](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-twitter) : Boolean<br />
110121
`true` to have Twitter handles auto-linked, `false` to skip auto-linking of Twitter handles. Defaults to `true`.<br /><br />
111122
- [replaceFn](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-replaceFn) : Function<br />
112-
A function to use to programmatically make replacements of matches in the input string, one at a time. See the section
123+
A function to use to programmatically make replacements of matches in the input string, one at a time. See the section
113124
<a href="#custom-replacement-function">Custom Replacement Function</a> for more details.
114125

115126

@@ -128,14 +139,16 @@ var linkedText = Autolinker.link( "http://www.yahoo.com/some/long/path/to/a/file
128139
```
129140

130141
## More Examples
131-
One could update an entire DOM element that has unlinked text to auto-link them as such:
142+
One could update an entire DOM element that has unlinked text to auto-link them
143+
as such:
132144

133145
```javascript
134146
var myTextEl = document.getElementById( 'text' );
135147
myTextEl.innerHTML = Autolinker.link( myTextEl.innerHTML );
136148
```
137149

138-
Using the same pre-configured [Autolinker](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker) instance in multiple locations of a codebase (usually by dependency injection):
150+
Using the same pre-configured [Autolinker](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker)
151+
instance in multiple locations of a codebase (usually by dependency injection):
139152

140153
```javascript
141154
var autolinker = new Autolinker( { newWindow: false, truncate: 25 } );
@@ -155,8 +168,9 @@ autolinker.link( "Go to www.google.com" );
155168

156169
## Custom Replacement Function
157170

158-
A custom replacement function ([replaceFn](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-replaceFn)) may be provided to replace url/email/twitter matches on an individual basis, based
159-
on the return from this function.
171+
A custom replacement function ([replaceFn](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-cfg-replaceFn))
172+
may be provided to replace url/email/twitter matches on an individual basis,
173+
based on the return from this function.
160174

161175
Full example, for purposes of documenting the API:
162176

@@ -167,36 +181,42 @@ var linkedText = Autolinker.link( input, {
167181
replaceFn : function( autolinker, match ) {
168182
console.log( "href = ", match.getAnchorHref() );
169183
console.log( "text = ", match.getAnchorText() );
170-
184+
171185
switch( match.getType() ) {
172-
case 'url' :
186+
case 'url' :
173187
console.log( "url: ", match.getUrl() );
174-
188+
175189
if( match.getUrl().indexOf( 'mysite.com' ) === -1 ) {
176190
var tag = autolinker.getTagBuilder().build( match ); // returns an `Autolinker.HtmlTag` instance, which provides mutator methods for easy changes
177191
tag.setAttr( 'rel', 'nofollow' );
178192
tag.addClass( 'external-link' );
179-
193+
180194
return tag;
181-
195+
182196
} else {
183197
return true; // let Autolinker perform its normal anchor tag replacement
184198
}
185-
199+
186200
case 'email' :
187201
var email = match.getEmail();
188202
console.log( "email: ", email );
189-
203+
190204
if( email === "[email protected]" ) {
191205
return false; // don't auto-link this particular email address; leave as-is
192206
} else {
193207
return; // no return value will have Autolinker perform its normal anchor tag replacement (same as returning `true`)
194208
}
195-
209+
210+
case 'phone' :
211+
var phoneNumber = match.getPhoneNumber();
212+
console.log( twitterHandle );
213+
214+
return '<a href="http://newplace.to.link.twitter.handles.to/">' + twitterHandle + '</a>';
215+
196216
case 'twitter' :
197217
var twitterHandle = match.getTwitterHandle();
198218
console.log( twitterHandle );
199-
219+
200220
return '<a href="http://newplace.to.link.twitter.handles.to/">' + twitterHandle + '</a>';
201221
}
202222
}
@@ -206,23 +226,30 @@ var linkedText = Autolinker.link( input, {
206226

207227
The function is provided two arguments:
208228

209-
1. The Autolinker instance that is performing replacements. This can be used to query the options that the Autolinker
210-
instance is configured with, or to retrieve its TagBuilder instance (via [autolinker.getTagBuilder()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-method-getTagBuilder)).
211-
2. An [Autolinker.match.Match](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.match.Match) object which details the match that is to be replaced.
229+
1. The Autolinker instance that is performing replacements. This can be used to
230+
query the options that the Autolinker instance is configured with, or to
231+
retrieve its TagBuilder instance (via [autolinker.getTagBuilder()](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker-method-getTagBuilder)).
232+
2. An [Autolinker.match.Match](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.match.Match)
233+
object which details the match that is to be replaced.
234+
212235

236+
A replacement of the match is made based on the return value of the function.
237+
The following return values may be provided:
213238

214-
A replacement of the match is made based on the return value of the function. The following return values may be provided:
215-
216-
- No return value (`undefined`), or `true` (Boolean): Delegate back to Autolinker to replace the match as it normally would.
239+
- No return value (`undefined`), or `true` (Boolean): Delegate back to
240+
Autolinker to replace the match as it normally would.
217241
- `false` (Boolean): Do not replace the current match at all - leave as-is.
218-
- Any String: If a string is returned from the function, the string will be used directly as the replacement HTML for
219-
the match.
220-
- An [Autolinker.HtmlTag](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.HtmlTag) instance, which can be used to build/modify an HTML tag before writing out its HTML text.
242+
- Any String: If a string is returned from the function, the string will be used
243+
directly as the replacement HTML for the match.
244+
- An [Autolinker.HtmlTag](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker.HtmlTag)
245+
instance, which can be used to build/modify an HTML tag before writing out its
246+
HTML text.
221247

222248

223249
## Full API Docs
224250

225-
The full API docs for Autolinker may be referenced at: [http://gregjacobs.github.io/Autolinker.js/docs/](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker)
251+
The full API docs for Autolinker may be referenced at:
252+
[http://gregjacobs.github.io/Autolinker.js/docs/](http://gregjacobs.github.io/Autolinker.js/docs/#!/api/Autolinker)
226253

227254

228255
## Changelog

0 commit comments

Comments
 (0)