tweetParser.js - demo

tweetParser.js Parse elements containing a tweets and turn URLS, @users & #hashtags into working urls

tweetParser is also available as a Django Template Filter

PARAMETERS

INITIALISATION

You can install tweetParser.js with Bower

if you want to use bower just type :

bower install tweetparser.js 

Or via npm

npm install --save-dev tweetparser.js 

Add tweetParser.min.js to your HTML document

    <script src="js/tweetParser.min.js"></script>

Your tweet in your html document

    <p class="tweet">This is my awesome text only tweet ! #web #twitter @twitter http://www.twitter.com/ !!</p>

getting started with tweetParser

    //basic usage     tweetParser('.tweet');          //With Default parameters     tweetParser('.tweet', {         urlClass : "tweet_link", //this is default         userClass : "tweet_user", //this is default         hashtagClass : "hashtag", //this is default         target : "_blank", //this is default         searchWithHashtags : true //this is default         parseUsers : true,         parseHashtags : true,         parseUrls : true     });          // Note that '.tweet' is your own CSS selector

Want to use it in the jQuery way ?

  <script src="path/to/jquery.min.js"></script>   <script src="path/to/tweetParser.js"></script>

and call tweetParser like in v1 :

$([SELECTOR]).tweetParser([PARAMETERS]);

RESULT EXAMPLE

Check out the demo

you can customize your tweet with css classes used in parameters

Contributing

• Give it a star !
• Report a bug
• Tweet about it :)

Pull Requests

• Solve a problem
• For code enhancement, use JSLint as a code quality tool.
• Small is better than Big.

Changelog

• v2.2.0

  • Add Babel in dev dependecies
  • Port dev code to es6 syntax

• v2.1.3

  • Fix #10 - target link parameter issue

• v2.1.2

  • Emojis support

• v2.1.1

  • resolve issue #9 - Wrap tweetParser and the jQuery compatibility file in the same file.

• v2.1.0

  • Add a jQuery compatibility file.
  • You can now use Both VanillaJS or jQuery.

  <!-- To use it with jQuery : add tweetParser.js and jquery.tweetParser.js --> <script src="dist/tweetParser.js"></script> <script src="dev/jquery.tweetParser.js"></script>

  and call tweetParser like in v1 :

  $([SELECTOR]).tweetParser([PARAMETERS]);

  It is always easier to use it without jQuery just don't add jquery.tweetParser.js and :

  tweetParser([SELECTOR], [PARAMETERS]);

• v2.0.2

  • Code refactoring

• v2.0.1

  • Fix issue #8 - is now Firefox compatible - replace innerText by textContent

• v2.0.0

  • REMOVE jQuery dependecies...
  • ...But it still easy to use it as simple as a jQuery Plugin.
  • Improve URL regex : white spaces are not eaten anymore

NB : For you, there is just some small changes in the syntax to call tweetParser.

use

tweetParser([SELECTOR], [PARAMETERS]);

instead of :

$([SELECTOR]).tweetParser([PARAMETERS]);

• v1.3.1

  • Remove Gruntfile to switch to gulpfile
  • Prepare to publish to npm
  • Improve the Demo
  • Add sourcemaps

• v1.3.0

  • Improve (one more time) URL regex 🙌

• v1.2.1

  • Better URL regex

• v1.2.0

  • add parameter parseUsers, parseHashtags, parseUrls
  • Makeover on the demo
  • JSLint passed

• v1.1.0

  • searchWithHashtags parameter added

    You can now choose where hashtags links will point to. when searchWithHastags = true (default), tweetParser will generate the following link for each hashtags : "twitter.com/hashtag/THE_HASHTAG".
    if you set it to false, the link will be : "twitter.com/search?q=THE_HASHTAG"

  • code optimisation, remove useless var.

• v1.0.0

  Initial Version