embed.js v2.0.4
A jQuery plugin for converting text emojis into image-based emoticons, also supporting an automatic media embedding system for multimedia URLs
A demo is included with the download package.
An AngularJS version of embed.js is also available.
Some Demo examples with their source code are given below.
Features
Converts emoticon text codes into emoticons :smile: , :heart:
Finds links in text input and turns them into html links.(shortened urls like goo.gl,ow.ly,bit.ly etc supported)
Youtube and Vimeo video embedding with video details fetched from the api.
HTML5 player supported media embedding (mp3,mp4,ogg,.webm,.ogv)
PDF,DOC,DOCX,XLS,XLSX,PPT viewing with preview and then the actual documents in a frame.
Inline Code Syntax highlighting (uses highlight.js)
Twitter tweet embedding supported
Codepen, jsbin,ideone, jsfiddle and plunker embed supported
soundcloud and spotify support
Twitch tv, dotSub, dailymotion, vine,TED, ustream and liveLeak support.
Google map location embed (streetview, view and place)
Documentation
$('#element').embedJS({
//The selector(id/class/tagName) inside #element that needs to be processed
embedSelector :'div',
//Instructs the library whether or not to embed urls
link : true,
//same as the target attribute in html anchor tag . supports all html supported target values.
linkTarget : '_blank',
//Array of extensions to be excluded from converting into links
linkExclude : ['jpg','pdf'],
//set false to show a preview of document(pdf,xls,xlsx,doc,docx,ppt) links
docEmbed : true,
docOptions : {
viewText : '<i class="fa fa-eye"></i> View PDF',
downloadText: '<i class="fa fa-download"></i> DOWNLOAD'
},
//set false to embed images
imageEmbed : true,
//set false to embed audio
audioEmbed : false,
//set false to show a preview of youtube/vimeo videos with details
videoEmbed : true,
//set false to show basic video files like mp4 etc. (supported by html5 player)
basicVideoEmbed : true,
//width of the video frame (in pixels)
videoWidth : 640,
//height of the video frame (in pixels)
videoHeight : 390,
//( Mandatory ) The authorization key obtained from google's developer console for
//using youtube data api and map embed api
gdevAuthKey : 'xxxxxxx',
//Set google map location embed
// Use @(place-name) to use this feature . Eg: @(Sydney)
locationEmbed :true,
mapOptions : {
//'place' or 'streetview' or 'view'
mode: 'place'
},
//Instructs the library whether or not to highlight code syntax.
highlightCode : true,
//Instructs the library whether or not embed the tweets
tweetsEmbed : true,
tweetOptions:{
//The maximum width of a rendered Tweet in whole pixels. Must be between 220 and 550 inclusive.
maxWidth : 550,
//When set to true or 1 links in a Tweet are not expanded to photo, video, or link previews.
hideMedia : false,
//When set to true or 1 a collapsed version of the previous Tweet in a conversation thread
//will not be displayed when the requested Tweet is in reply to another Tweet.
hideThread : false,
//Specifies whether the embedded Tweet should be floated left, right, or center in
//the page relative to the parent element.Valid values are left, right, center, and none.
//Defaults to none, meaning no alignment styles are specified for the Tweet.
align : 'none',
//Request returned HTML and a rendered Tweet in the specified.
//Supported Languages listed here (https://dev.twitter.com/web/overview/languages)
lang : 'en'
},
//An array of services excluded from embedding...
//Options : codePen/jdFiddle/jsBin/ideone/plunker/soundcloud/twitchTv/dotSub/dailymotion/vine/ted/liveleak/spotify/ustream
//Can exclude all options by setting it to 'all'
excludeEmbed :['twitchTv'],
//Height of jsfiddle/codepen/jsbin/ideone/plunker
codeEmbedHeight :300,
soundCloudOptions: {
height : 160,
themeColor : 'f50000', //Hex Code of the player theme color
autoPlay : false,
hideRelated : false,
showComments: true,
showUser : true, //Show or hide the uploader name, useful e.g. in tiny players to save space)
showReposts : false,
visual : false, //Show/hide the big preview image
download : false //Show/Hide download buttons
},
vineOptions:{
maxWidth:null,
type:'postcard', //'postcard' or 'simple' embedding
responsive:false // whether to make the vine embed responsive
},
//callback before doc preview
beforeDocPreview : function(){},
//callback after doc preview
afterDocPreview : function(){},
// callback on video frame view
onVideoShow:function(){},
//callback on video load (youtube/vimeo)
onVideoLoad:function(){}
//function to execute before embedding services
beforeEmbedJSApply: function () {},
//callback after embedJS is applied
afterEmbedJSLApply: function () {},
//callback after the twitter widgets of a BLOCK are loaded.
onTwitterShow : function () {}
});
Examples
Lotus :smile: eleates vix attrahendams luna est.Advenas mori!Fermiums prarere in cubiculum!Cum cacula cantare, omnes stellaes manifestum azureus, nobilis https://angularjs.org/ acipenseres.Cum orgia mori, omnes rationees <3 experientia alter, regius :heart: mortemes.Devatios persuadere, tanquam secundus spatii.Heu, barcas!Cedriums observare!A falsis, lacta talis imber. :P Cur eleates peregrinatione?
Result
Lotus :smile: eleates vix attrahendams luna est.Advenas mori!Fermiums prarere in cubiculum!Cum cacula cantare, omnes stellaes manifestum azureus, nobilis https://angularjs.org/ acipenseres.Cum orgia mori, omnes rationees <3 experientia alter, regius :heart: mortemes.Devatios persuadere, tanquam secundus spatii.Heu, barcas!Cedriums observare!A falsis, lacta talis imber. :P Cur eleates peregrinatione?
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://www.youtube.com/watch?v=QHulaj5ZxbI germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Result
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://www.youtube.com/watch?v=QHulaj5ZxbI germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://vimeo.com/92066734 germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Result
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://vimeo.com/92066734 germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt https://www.cca.edu/sites/default/files/pdf/08/word-to-pdf.pdf abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://vimeo.com/92066734 germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Result
Naviss credere!Orgia de germanus repressor, gratia rumor!Nunquam pugna axona.Cur orexis peregrinationes?Sunt https://www.cca.edu/sites/default/files/pdf/08/word-to-pdf.pdf abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam https://vimeo.com/92066734 germanus musa.Cur lacta prarere? :smile: Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
``` <script></script>``` www.ng-conf.org http://www.iitr.ac.in ROTFL!!!! Now this explains :P why Kejriwal & his Nocere cito ducunt ad noster domina.Salvus nutrixs ducunt ad decor.Grandis torquis sed mire visums xiphias est.```javascript grade = (student, period=(if b? then 7 else 6)) -> if student.excellentWork "A+" else if student.okayStuff if student.triedHard then "B" else "B-" else "C" class Animal extends Being constructor: (@name) ->\nmove: (meters) -> alert @name + " moved #{meters}m." ``` with Yogendra Yadav. Because he had praised Narendra :smile: Modi and Gujarat model in an interview.Check this 1-min clip in which Yogendra Yadav openly praises Modis Gujarat development : https://vimeo.com/119199079
Result
``` <script></script>``` www.ng-conf.org http://www.iitr.ac.in ROTFL!!!! Now this explains :P why Kejriwal & his Nocere cito ducunt ad noster domina.Salvus nutrixs ducunt ad decor.Grandis torquis sed mire visums xiphias est.```javascript grade = (student, period=(if b? then 7 else 6)) -> if student.excellentWork "A+" else if student.okayStuff if student.triedHard then "B" else "B-" else "C" class Animal extends Being constructor: (@name) ->\nmove: (meters) -> alert @name + " moved #{meters}m." ``` with Yogendra Yadav. Because he had praised Narendra :smile: Modi and Gujarat model in an interview.Check this 1-min clip in which Yogendra Yadav openly praises Modis Gujarat development : https://vimeo.com/119199079
Naviss credere!Orgia de :smile: germanus repressor, http://www.w3schools.com/html/mov_bbb.ogg gratia rumor!Nunquam pugna axona. http://media1.santabanta.com/full1/Hinduism/Lord%20Krishna/lor27h.jpg Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam germanus musa.Cur lacta prarere? Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
Result
Naviss credere!Orgia de :smile: germanus repressor, http://www.w3schools.com/html/mov_bbb.ogg gratia rumor!Nunquam pugna axona. http://media1.santabanta.com/full1/Hinduism/Lord%20Krishna/lor27h.jpg Cur orexis peregrinationes?Sunt abactores pugna gratis, germanus lamiaes.Cur lanista cantare?Est castus bromium, cesaris.Tabess velum, tanquam germanus musa.Cur lacta prarere? Assimilant aegre ducunt ad magnum advena.Emeritis, fidelis menss interdum examinare de varius, lotus detrius.
https://twitter.com/IGN/status/579314375808417792 www.ng-conf.org https://www.iitr.ac.in ROTFL!!!! Now this explains :P why Kejriwal & his fans are upset with Yogendra Yadav. Because he had praised Narendra :smile: Modi and Gujarat model in an interview.Check this 1-min clip in which Yogendra Yadav openly praises Modis Gujarat development
Result
https://twitter.com/IGN/status/579314375808417792 www.ng-conf.org https://www.iitr.ac.in ROTFL!!!! Now this explains :P why Kejriwal & his fans are upset with Yogendra Yadav. Because he had praised Narendra :smile: Modi and Gujarat model in an interview.Check this 1-min clip in which Yogendra Yadav openly praises Modis Gujarat development
http://codepen.io/jexordexan/pen/yyYEJa Eheu, fatalis accola!Gallus cantares, tanquam bassus aonides.Albus guttuss ducunt ad abnoba.Vox dexter heuretes est.Magnum advenas ducunt ad classis.Fluctuss trabem, tanquam nobilis elogium.Altus silva una anhelares demolitione est.Lactea de magnum domina, anhelare coordinatae!Spatii, uria, et ventus.Lactas assimilant in piscinam!
Result
http://codepen.io/jexordexan/pen/yyYEJa Eheu, fatalis accola!Gallus cantares, tanquam bassus aonides.Albus guttuss ducunt ad abnoba.Vox dexter heuretes est.Magnum advenas ducunt ad classis.Fluctuss trabem, tanquam nobilis elogium.Altus silva una anhelares demolitione est.Lactea de magnum domina, anhelare coordinatae!Spatii, uria, et ventus.Lactas assimilant in piscinam!
Cum zelus resistere, omnes cursuses aperto grandis, fidelis heureteses.Est pius axona, cesaris.Est gratis secula, cesaris. http://jsfiddle.net/zalun/NmudS/ Fiscina clemens guttus est.Nunquam prensionem adiurator.Cadunt cito ducunt ad regius nutrix.Vita castus candidatus est.
Result
Cum zelus resistere, omnes cursuses aperto grandis, fidelis heureteses.Est pius axona, cesaris.Est gratis secula, cesaris. http://jsfiddle.net/zalun/NmudS/ Fiscina clemens guttus est.Nunquam prensionem adiurator.Cadunt cito ducunt ad regius nutrix.Vita castus candidatus est.
Clemens caniss ducunt ad apolloniates.A falsis, victrix altus lactea.Ubi est camerarius ausus?Orgia de albus onus, prensionem racana! http://jsbin.com/iwovaj/73/ Parma potuss, tanquam pius demissio.Detriuss observare in cubiculum!Cur adiurator experimentum?!
Result
Clemens caniss ducunt ad apolloniates.A falsis, victrix altus lactea.Ubi est camerarius ausus?Orgia de albus onus, prensionem racana! http://jsbin.com/iwovaj/73/ Parma potuss, tanquam pius demissio.Detriuss observare in cubiculum!Cur adiurator experimentum?!
Urbs ires, tanquam alter mons.Nunquam pugna ausus.Sunt finises carpseris clemens, germanus vigiles. https://soundcloud.com/the-bugle/bugle-179-playas-gon-play Eheu.Boreas ortums, tanquam secundus era.Superbus silvas ducunt ad olla.Usus magnum animalis est.Tuss studere!Cursuss messis in hortus!Fiscinas sunt lubas de audax mons.!
Result
Urbs ires, tanquam alter mons.Nunquam pugna ausus.Sunt finises carpseris clemens, germanus vigiles. https://soundcloud.com/the-bugle/bugle-179-playas-gon-play Eheu.Boreas ortums, tanquam secundus era.Superbus silvas ducunt ad olla.Usus magnum animalis est.Tuss studere!Cursuss messis in hortus!Fiscinas sunt lubas de audax mons.!
Decors peregrinatione in asopus!Cur deus unda?Nunquam attrahendam cannabis.Rumor de gratis orgia, fallere poeta!Classiss messis in rugensis civitas! http://www.twitch.tv/tsm_santorin Cum stella mori, omnes zeluses aperto raptus, festus omniaes.Sunt habitioes acquirere magnum, ferox paluses.
Result
Decors peregrinatione in asopus!Cur deus unda?Nunquam attrahendam cannabis.Rumor de gratis orgia, fallere poeta!Classiss messis in rugensis civitas! http://www.twitch.tv/tsm_santorin Cum stella mori, omnes zeluses aperto raptus, festus omniaes.Sunt habitioes acquirere magnum, ferox paluses.
Dexter genetrixs ducunt ad planeta.Cur nixus peregrinatione?Hercle, valebat ferox!.Superbus galataes ducunt ad animalis.Ferox galataes ducunt ad vox. https://dotsub.com/view/85897135-c6ee-4c93-acdd-d7e7f4d08b6e Est emeritis danista, cesaris.Cum xiphias mori, omnes lapsuses experientia peritus, grandis toruses.
Result
Dexter genetrixs ducunt ad planeta.Cur nixus peregrinatione?Hercle, valebat ferox!.Superbus galataes ducunt ad animalis.Ferox galataes ducunt ad vox. https://dotsub.com/view/85897135-c6ee-4c93-acdd-d7e7f4d08b6e Est emeritis danista, cesaris.Cum xiphias mori, omnes lapsuses experientia peritus, grandis toruses.
Eposs resistere, tanquam raptus acipenser.Solitudos trabem in ostravia!Pius nutrixs ducunt ad advena.Vae.Galluss congregabo in ostravia! http://www.dailymotion.com/video/x2k8un2_2015-wc-nz-vs-wi-holder-reacts-on-guptills-237_sport Heu, repressor!Vae, calceus!A falsis, lumen neuter triticum.
Result
Eposs resistere, tanquam raptus acipenser.Solitudos trabem in ostravia!Pius nutrixs ducunt ad advena.Vae.Galluss congregabo in ostravia! http://www.dailymotion.com/video/x2k8un2_2015-wc-nz-vs-wi-holder-reacts-on-guptills-237_sport Heu, repressor!Vae, calceus!A falsis, lumen neuter triticum.
Cur tabes unda?Silvas sunt cedriums de audax habitio.Observare solite ducunt ad salvus cobaltum.Nutrix, zeta, et absolutio.Cum era ire, omnes finises carpseris varius, flavum homoes.Sunt eleateses examinare alter, emeritis advenaes.Sunt detriuses perdere mirabilis, rusticus lacteaes. https://vine.co/v/bjHh0zHdgZT Persuadere unus ducunt ad talis lumen.Ubi est secundus tabes? :smile:
Result
Cur tabes unda?Silvas sunt cedriums de audax habitio.Observare solite ducunt ad salvus cobaltum.Nutrix, zeta, et absolutio.Cum era ire, omnes finises carpseris varius, flavum homoes.Sunt eleateses examinare alter, emeritis advenaes.Sunt detriuses perdere mirabilis, rusticus lacteaes. https://vine.co/v/bjHh0zHdgZT Persuadere unus ducunt ad talis lumen.Ubi est secundus tabes? :smile:
Ubi est teres palus?Secundus lacteas ducunt ad valebat.Speciess assimilant in magnum hortus! http://www.ted.com/talks/monica_lewinsky_the_price_of_shame Ubi est fidelis exsul?Peritus axonas ducunt ad deus.Silva accelerares, tanquam fidelis ausus.Est castus mons, cesaris.
Result
Ubi est teres palus?Secundus lacteas ducunt ad valebat.Speciess assimilant in magnum hortus! http://www.ted.com/talks/monica_lewinsky_the_price_of_shame Ubi est fidelis exsul?Peritus axonas ducunt ad deus.Silva accelerares, tanquam fidelis ausus.Est castus mons, cesaris.
Vae.Ecce.Ubi est albus tabes?Crescere satis ducunt ad barbatus verpa.Observare foris ducunt ad barbatus scutum. http://www.liveleak.com/view?i=42a_1426999994 Valebat audax verpa est.Burgus de brevis frondator, imperium animalis!Quadras sunt fidess de clemens navis.
Result
Vae.Ecce.Ubi est albus tabes?Crescere satis ducunt ad barbatus verpa.Observare foris ducunt ad barbatus scutum. http://www.liveleak.com/view?i=42a_1426999994 Valebat audax verpa est.Burgus de brevis frondator, imperium animalis!Quadras sunt fidess de clemens navis.
Secundus, salvus diatrias sapienter resuscitabo de raptus, talis advena.Est albus candidatus, cesaris.Vae, mens!A falsis, hydra salvus eleates.Brevis boreas aegre amors axona est.Domesticus, noster rationes nunquam tractare de festus, audax calceus.Alter, bi-color fraticinidas virtualiter dignus de primus, varius gemna.Heu, salvus gemna! http://open.spotify.com/track/4th1RQAelzqgY7wL53UGQt Varius palus sapienter vitares parma est.Domesticus mortems ducunt ad uria.
Result
Secundus, salvus diatrias sapienter resuscitabo de raptus, talis advena.Est albus candidatus, cesaris.Vae, mens!A falsis, hydra salvus eleates.Brevis boreas aegre amors axona est.Domesticus, noster rationes nunquam tractare de festus, audax calceus.Alter, bi-color fraticinidas virtualiter dignus de primus, varius gemna.Heu, salvus gemna! http://open.spotify.com/track/4th1RQAelzqgY7wL53UGQt Varius palus sapienter vitares parma est.Domesticus mortems ducunt ad uria.
Cur rumor nocere?Emeritis adelphis satis perderes domina est.Gloss cadunt in bi-color brema! @(IIT Roorkee) Bi-color habitio virtualiter imitaris amicitia est.Teres tatas ducunt ad racana.Genetrixs prarere in rugensis civitas!
Result
Cur rumor nocere?Emeritis adelphis satis perderes domina est.Gloss cadunt in bi-color brema! @(IIT Roorkee) Bi-color habitio virtualiter imitaris amicitia est.Teres tatas ducunt ad racana.Genetrixs prarere in rugensis civitas!