Skip to content

Commit c6a3c6c

Browse files
committed
commit
1 parent 26183e7 commit c6a3c6c

7 files changed

Lines changed: 164 additions & 4 deletions

File tree

app/index.html

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,79 @@
4646

4747

4848
<div class="content">
49+
<div class="card about">
50+
<h5 class="title">emoticons-js</h5>
51+
<div style="display: table;margin: 10px auto;">
52+
<iframe src="https://ghbtns.com/github-btn.html?user=ritz078&repo=emoticons-js&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
53+
<iframe src="https://ghbtns.com/github-btn.html?user=ritz078&type=follow&count=true&size=large" frameborder="0" scrolling="0" width="220px" height="30px"></iframe>
54+
55+
</div>
56+
<p>A jQuery plugin for converting text emojis into image-based emoticons, also supporting an automatic media embedding system for multimedia URLs</p>
57+
<p>A demo is included with the download package.</p>
58+
<p>An <a href="http://rkritesh.in/ngEmoticons">AngularJS version</a> of Emoticons-js is also available.</p>
59+
60+
<p>Some <a href="#a" class="demo"><b>Demo examples</b></a> with their source code are given below.</p>
61+
62+
</div>
63+
64+
<div class="card">
65+
<h5 class="title">Features</h5>
66+
<ol>
67+
<li><p>Emoticons-js has apparently evolved from a simple text emoticon to image emoji conversion system into a fully-blown text beautification toolkit.</p></li>
68+
<li> <p>Besides taking emoticons expressed using a text form and converting them to icon font-based or image-based emojis, this plugin can also do some other stuff too.</p></li>
69+
<li><p>This includes parsing the text for links pointing to multimedia assets, and automatically embedding those assets inside the text.</p></li>
70+
<li> <p>YouTube & Vimeo videos, PDF files, images, audio, and video files can all be retrieved and embedded inside the text, allowing users to view their content without having to navigate away to another browser page.</p></li>
71+
<li><p> <b>Emoticons-js can also highlight source code embedded on the page as well, but this requires you to load Highlight.js.</b></p></li>
72+
</ol>
73+
74+
75+
76+
77+
78+
79+
</div>
80+
<div class="card">
81+
<h5 class="title">Documentation</h5>
82+
<pre><code>
83+
$('#element').emoticons({
84+
//Instructs the library whether or not to embed urls
85+
link : true,
86+
//same as the target attribute in html anchor tag . supports all html supported target values.
87+
linkTarget : '_blank',
88+
//Array of extensions to be excluded from converting into links
89+
linkExclude : ['jpg','pdf'],
90+
//set true to show a preview of pdf links
91+
pdfEmbed : true,
92+
//set true to embed images
93+
imageEmbed : true,
94+
//set true to embed audio
95+
audioEmbed : false,
96+
//set true to show a preview of youtube/vimeo videos with details
97+
videoEmbed : true,
98+
//set true to show basic video files like mp4 etc. (supported by html5 player)
99+
basicVideoEmbed : true,
100+
//width of the video frame (in pixels)
101+
videoWidth : 640,
102+
//height of the video frame (in pixels)
103+
videoHeight : 390,
104+
//( Mandatory ) The authorization key obtained from google's developer console for using youtube data api
105+
ytAuthKey : 'xxxxxxx',
106+
//Instructs the library whether or not to highlight code syntax.
107+
highlightCode : true,
108+
//callback before pdf preview
109+
beforePdfPreview : function(){},
110+
//callback after pdf preview
111+
afterPdfPreview : function(){},
112+
// callback on video frame view
113+
onVideoShow:function(){},
114+
//callback on video load (youtube/vimeo)
115+
onVideoLoad:function(){}
116+
117+
});
118+
</code></pre>
119+
</div>
49120
<div class="card" id="a">
121+
<h5 class="title">Examples</h5>
50122
<div class="title">Simple Usage</div>
51123
<div class="row">
52124
<div class="col s12">

app/scripts/main.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,18 @@ $(document).ready(function(){
1818
var target = this.hash;
1919
var $target = $(target);
2020

21+
$('html, body').stop().animate({
22+
'scrollTop': $target.offset().top-60
23+
}, 900, 'swing', function () {
24+
window.location.hash = target;
25+
});
26+
});
27+
$('.about a[href^="#"]').on('click',function (e) {
28+
e.preventDefault();
29+
30+
var target = this.hash;
31+
var $target = $(target);
32+
2133
$('html, body').stop().animate({
2234
'scrollTop': $target.offset().top-60
2335
}, 900, 'swing', function () {

app/styles/main.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,7 @@ header {
6363
}
6464
li {
6565
margin-top : 10px;
66+
-webkit-font-smoothing: antialiased;
6667
&:hover{
6768
color:#fff;
6869
}
@@ -76,6 +77,9 @@ header {
7677
padding : 20px;
7778
margin-top : 50px;
7879
margin-left : 250px;
80+
ol{
81+
padding-left : 40px;
82+
}
7983
pre {
8084
white-space : pre;
8185
code {

dist/index.html

Lines changed: 74 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/github.min.css"/>
1111
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
1212
<link rel="stylesheet" href="styles/3bd4589c.vendor.css">
13-
<link rel="stylesheet" href="styles/e7cbb7fe.main.css">
13+
<link rel="stylesheet" href="styles/1bf1dad8.main.css">
1414
</head>
1515
<body>
1616
<!--[if lt IE 10]>
@@ -39,7 +39,79 @@
3939

4040

4141
<div class="content">
42+
<div class="card about">
43+
<h5 class="title">emoticons-js</h5>
44+
<div style="display: table;margin: 10px auto;">
45+
<iframe src="https://ghbtns.com/github-btn.html?user=ritz078&repo=emoticons-js&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
46+
<iframe src="https://ghbtns.com/github-btn.html?user=ritz078&type=follow&count=true&size=large" frameborder="0" scrolling="0" width="220px" height="30px"></iframe>
47+
48+
</div>
49+
<p>A jQuery plugin for converting text emojis into image-based emoticons, also supporting an automatic media embedding system for multimedia URLs</p>
50+
<p>A demo is included with the download package.</p>
51+
<p>An <a href="http://rkritesh.in/ngEmoticons">AngularJS version</a> of Emoticons-js is also available.</p>
52+
53+
<p>Some <a href="#a" class="demo"><b>Demo examples</b></a> with their source code are given below.</p>
54+
55+
</div>
56+
57+
<div class="card">
58+
<h5 class="title">Features</h5>
59+
<ol>
60+
<li><p>Emoticons-js has apparently evolved from a simple text emoticon to image emoji conversion system into a fully-blown text beautification toolkit.</p></li>
61+
<li> <p>Besides taking emoticons expressed using a text form and converting them to icon font-based or image-based emojis, this plugin can also do some other stuff too.</p></li>
62+
<li><p>This includes parsing the text for links pointing to multimedia assets, and automatically embedding those assets inside the text.</p></li>
63+
<li> <p>YouTube & Vimeo videos, PDF files, images, audio, and video files can all be retrieved and embedded inside the text, allowing users to view their content without having to navigate away to another browser page.</p></li>
64+
<li><p> <b>Emoticons-js can also highlight source code embedded on the page as well, but this requires you to load Highlight.js.</b></p></li>
65+
</ol>
66+
67+
68+
69+
70+
71+
72+
</div>
73+
<div class="card">
74+
<h5 class="title">Documentation</h5>
75+
<pre><code>
76+
$('#element').emoticons({
77+
//Instructs the library whether or not to embed urls
78+
link : true,
79+
//same as the target attribute in html anchor tag . supports all html supported target values.
80+
linkTarget : '_blank',
81+
//Array of extensions to be excluded from converting into links
82+
linkExclude : ['jpg','pdf'],
83+
//set true to show a preview of pdf links
84+
pdfEmbed : true,
85+
//set true to embed images
86+
imageEmbed : true,
87+
//set true to embed audio
88+
audioEmbed : false,
89+
//set true to show a preview of youtube/vimeo videos with details
90+
videoEmbed : true,
91+
//set true to show basic video files like mp4 etc. (supported by html5 player)
92+
basicVideoEmbed : true,
93+
//width of the video frame (in pixels)
94+
videoWidth : 640,
95+
//height of the video frame (in pixels)
96+
videoHeight : 390,
97+
//( Mandatory ) The authorization key obtained from google's developer console for using youtube data api
98+
ytAuthKey : 'xxxxxxx',
99+
//Instructs the library whether or not to highlight code syntax.
100+
highlightCode : true,
101+
//callback before pdf preview
102+
beforePdfPreview : function(){},
103+
//callback after pdf preview
104+
afterPdfPreview : function(){},
105+
// callback on video frame view
106+
onVideoShow:function(){},
107+
//callback on video load (youtube/vimeo)
108+
onVideoLoad:function(){}
109+
110+
});
111+
</code></pre>
112+
</div>
42113
<div class="card" id="a">
114+
<h5 class="title">Examples</h5>
43115
<div class="title">Simple Usage</div>
44116
<div class="row">
45117
<div class="col s12">
@@ -252,7 +324,7 @@
252324
ga('create','UA-60624235-2');ga('send','pageview');
253325
</script>
254326

255-
<script src="scripts/e5cd0908.main.js"></script>
327+
<script src="scripts/b31d3611.main.js"></script>
256328

257329
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
258330
</body>
Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/styles/1bf1dad8.main.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/styles/e7cbb7fe.main.css

Lines changed: 0 additions & 1 deletion
This file was deleted.

0 commit comments

Comments
 (0)