Skip to content

Commit 4baacfd

Browse files
committed
site updated
1 parent c9e0749 commit 4baacfd

7 files changed

Lines changed: 310 additions & 234 deletions

File tree

Gruntfile.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -232,7 +232,7 @@ module.exports = function (grunt) {
232232
options: {
233233
dest: '<%= config.dist %>'
234234
},
235-
html: '<%= config.app %>/index.html'
235+
html: '<%= config.app %>/*.html'
236236
},
237237

238238
// Performs rewrites based on rev and the useminPrepare configuration

app/doc.html

Lines changed: 196 additions & 167 deletions
Large diffs are not rendered by default.

app/examples.html

Lines changed: 78 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -28,11 +28,14 @@
2828
<a href="/">
2929
<li>Home</li>
3030
</a>
31-
<a href="getting_started">
31+
<a href="getting_started.html">
3232
<li>Getting Started</li>
3333
</a>
3434
<a href="doc.html">
35-
<li>Documentation</li>
35+
<li>Options</li>
36+
</a>
37+
<a href="api.html">
38+
<li>API</li>
3639
</a>
3740
<a href="examples.html">
3841
<li>Examples</li>
@@ -42,77 +45,89 @@
4245
</header>
4346
<div class="left-nav">
4447
<ul>
45-
<a href="#basic"><li>Basic Example</li></a>
46-
<a href="#youtube"><li>Youtube video with preview</li></a>
47-
<a href="#markdown"><li>Markdown using marked.js</li></a>
48-
<a href="#twitter"><li>Twitter</li></a>
49-
<a href="#gist"><li>Github gist</li></a>
50-
<a href="#code"><li>Code Highlighting</li></a>
51-
<a href="#flickr"><li>Flickr</li></a>
52-
<a href="#gmap"><li>Google Map</li></a>
53-
<a href="#sound"><li>SoundCloud and Spotify</li></a>
54-
<a href="#video"><li>Basic video</li></a>
55-
<a href="#videojs"><li>video.js support for video</li></a>
56-
<a href="#vine"><li>vine</li></a>
57-
<a href="#codepen"><li>codepen</li></a>
48+
<a href="#basic">
49+
<li>Basic Example</li>
50+
</a>
51+
<a href="#youtube">
52+
<li>Youtube video with preview</li>
53+
</a>
54+
<a href="#markdown">
55+
<li>Markdown using marked.js</li>
56+
</a>
57+
<a href="#twitter">
58+
<li>Twitter</li>
59+
</a>
60+
<a href="#gist">
61+
<li>Github gist</li>
62+
</a>
63+
<a href="#code">
64+
<li>Code Highlighting</li>
65+
</a>
66+
<a href="#flickr">
67+
<li>Flickr</li>
68+
</a>
69+
<a href="#gmap">
70+
<li>Google Map</li>
71+
</a>
72+
<a href="#sound">
73+
<li>SoundCloud and Spotify</li>
74+
</a>
75+
<a href="#video">
76+
<li>Basic video</li>
77+
</a>
78+
<a href="#videojs">
79+
<li>video.js support for video</li>
80+
</a>
81+
<a href="#vine">
82+
<li>vine</li>
83+
</a>
84+
<a href="#codepen">
85+
<li>codepen</li>
86+
</a>
5887
<a href="#inline">
5988
<li>Inline embed</li>
6089
</a>
6190
</ul>
6291
</div>
6392
<div class="container">
64-
<h5 id="basic">Basic Example</h5>
65-
<p data-height="250" data-theme-id="21076" data-slug-hash="QjZded" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/QjZded/'>embed.js-basic demo</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
66-
67-
68-
<h5 id="youtube">Youtube video with preview</h5>
69-
<p data-height="406" data-theme-id="21076" data-slug-hash="JYmJML" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/JYmJML/'>embed.js-youtube with preview</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
70-
71-
<h5 id="markdown">Markdown Support</h5>
72-
<p data-height="900" data-theme-id="21076" data-slug-hash="bVmPrX" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/bVmPrX/'>embed.js-Markdown Support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
73-
74-
75-
<h5 id="twitter">Twitter support</h5>
76-
<p data-height="550" data-theme-id="21076" data-slug-hash="XmLGJe" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/XmLGJe/'>embed.js-twitter</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
77-
78-
<h5 id="gist">Github gist support</h5>
79-
<p data-height="350" data-theme-id="21076" data-slug-hash="gaNEYJ" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/gaNEYJ/'>embed.js-gist</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
80-
81-
<h5 id="code">Code highlighting</h5>
82-
<p data-height="400" data-theme-id="21076" data-slug-hash="NGZJKq" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/NGZJKq/'>embed.js-code highlight</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
83-
84-
85-
<h5 id="flickr">Flickr</h5>
86-
<p data-height="800" data-theme-id="21076" data-slug-hash="rOEPXw" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/rOEPXw/'>embed.js-flickr support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
87-
88-
89-
<h5 id="gmap">Google Map</h5>
90-
<p data-height="800" data-theme-id="21076" data-slug-hash="OyBrgX" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/OyBrgX/'>embed.js-Google map</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
91-
92-
<h5 id="sound">Soundcloud and spotify</h5>
93-
<p data-height="500" data-theme-id="21076" data-slug-hash="rOERWY" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/rOERWY/'>embed.js-soundcloud and spotify</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
94-
95-
96-
<h5 id="video">Basic video</h5>
97-
<p data-height="750" data-theme-id="21076" data-slug-hash="bVPZgE" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/bVPZgE/'>embed.js-mp4 support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
98-
99-
<h5 id="videojs">video.js support</h5>
100-
<p data-height="750" data-theme-id="21076" data-slug-hash="KdjEWa" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/KdjEWa/'>embed.js-video.js </a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
101-
102-
<h5 id='vine'>vine</h5>
103-
<p data-height="600" data-theme-id="21076" data-slug-hash="WQqmOG" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/WQqmOG/'>embed.js-vine</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
104-
105-
<h5 id="codepen">codepen</h5>
106-
<p data-height="700" data-theme-id="21076" data-slug-hash="vNqPZw" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/vNqPZw/'>embed.js-codepen</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
107-
108-
<h5 id="inline">Inline embedding</h5>
109-
<p data-height="800" data-theme-id="21076" data-slug-hash="JYQVKg" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/JYQVKg/'>embed.js-inline</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
110-
93+
<h5 id="basic">Basic Example</h5>
94+
<p data-height="250" data-theme-id="21076" data-slug-hash="QjZded" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/QjZded/'>embed.js-basic demo</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
95+
<h5 id="youtube">Youtube video with preview</h5>
96+
<p data-height="406" data-theme-id="21076" data-slug-hash="JYmJML" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/JYmJML/'>embed.js-youtube with preview</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
97+
<h5 id="markdown">Markdown Support</h5>
98+
<p data-height="900" data-theme-id="21076" data-slug-hash="bVmPrX" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/bVmPrX/'>embed.js-Markdown Support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
99+
<h5 id="twitter">Twitter support</h5>
100+
<p data-height="550" data-theme-id="21076" data-slug-hash="XmLGJe" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/XmLGJe/'>embed.js-twitter</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
101+
<h5 id="gist">Github gist support</h5>
102+
<p data-height="350" data-theme-id="21076" data-slug-hash="gaNEYJ" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/gaNEYJ/'>embed.js-gist</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
103+
<h5 id="code">Code highlighting</h5>
104+
<p data-height="400" data-theme-id="21076" data-slug-hash="NGZJKq" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/NGZJKq/'>embed.js-code highlight</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
105+
<h5 id="flickr">Flickr</h5>
106+
<p data-height="800" data-theme-id="21076" data-slug-hash="rOEPXw" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/rOEPXw/'>embed.js-flickr support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
107+
<h5 id="gmap">Google Map</h5>
108+
<p data-height="800" data-theme-id="21076" data-slug-hash="OyBrgX" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/OyBrgX/'>embed.js-Google map</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
109+
<h5 id="sound">Soundcloud and spotify</h5>
110+
<p data-height="500" data-theme-id="21076" data-slug-hash="rOERWY" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/rOERWY/'>embed.js-soundcloud and spotify</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
111+
<h5 id="video">Basic video</h5>
112+
<p data-height="750" data-theme-id="21076" data-slug-hash="bVPZgE" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/bVPZgE/'>embed.js-mp4 support</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
113+
<h5 id="videojs">video.js support</h5>
114+
<p data-height="750" data-theme-id="21076" data-slug-hash="KdjEWa" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/KdjEWa/'>embed.js-video.js </a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
115+
<h5 id='vine'>vine</h5>
116+
<p data-height="600" data-theme-id="21076" data-slug-hash="WQqmOG" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/WQqmOG/'>embed.js-vine</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
117+
<h5 id="codepen">codepen</h5>
118+
<p data-height="700" data-theme-id="21076" data-slug-hash="vNqPZw" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/vNqPZw/'>embed.js-codepen</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
119+
<h5 id="inline">Inline embedding</h5>
120+
<p data-height="800" data-theme-id="21076" data-slug-hash="JYQVKg" data-default-tab="result" data-user="ritz078" class='codepen'>See the Pen <a href='http://codepen.io/ritz078/pen/JYQVKg/'>embed.js-inline</a> by Ritesh Kumar (<a href='http://codepen.io/ritz078'>@ritz078</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
111121
</div>
112122
</body>
113123
<script src="//assets.codepen.io/assets/embed/ei.js"></script>
124+
<!-- build:js(.) scripts/vendor.js -->
125+
<!-- bower:js -->
114126
<script src="/bower_components/jquery/dist/jquery.js"></script>
127+
<!-- endbower -->
128+
<!-- endbuild -->
129+
<!-- build:js(.tmp) scripts/examples.js -->
115130
<script src="scripts/examples.js"></script>
116-
131+
<!-- endbuild -->
117132

118133
</html>

app/index.html

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,18 +31,22 @@
3131
<a href="/">
3232
<li>Home</li>
3333
</a>
34-
<a href="getting_started">
34+
<a href="getting_started.html">
3535
<li>Getting Started</li>
3636
</a>
3737
<a href="doc.html">
38-
<li>Documentation</li>
38+
<li>Options</li>
39+
</a>
40+
<a href="api.html">
41+
<li>API</li>
3942
</a>
4043
<a href="examples.html">
4144
<li>Examples</li>
4245
</a>
4346
</ul>
4447
</nav>
4548
</header>
49+
4650
<div class="banner">
4751
<div class="banner-details">
4852
<span class="title">A vanilla JavaScript plugin to insert or embed <br><span class="typed">MP3 SONGS</span></span>

app/scripts/docs.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,24 @@
11
hljs.initHighlightingOnLoad();
2+
3+
let data = []
4+
5+
$('h5').each(function(){
6+
data.push($(this).html())
7+
})
8+
9+
let str = ''
10+
11+
$.each(data,function(){
12+
str+=`<a href="#${this}"><li>${this}</li></a>`
13+
})
14+
15+
$('.left-nav ul').html(str)
16+
17+
$('.left-nav a').click(function(e) {
18+
e.preventDefault()
19+
var id = $(this).attr('href')
20+
$('html,body').animate({
21+
scrollTop: $(id).offset().top - 70
22+
},
23+
'slow');
24+
})

app/styles/doc.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,13 @@ header {
1919
padding-top: 80px;
2020
}
2121

22+
a{
23+
text-decoration: none;
24+
}
25+
2226
.left-nav {
2327
position: fixed;
28+
overflow-y:scroll;
2429
left: 0;
2530
height: 100%;
2631
width: 250px;

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
"grunt-contrib-copy": "^0.8.0",
1212
"grunt-contrib-cssmin": "^0.12.2",
1313
"grunt-contrib-htmlmin": "^0.4.0",
14-
"grunt-contrib-imagemin": "^0.9.3",
14+
"grunt-contrib-imagemin": "^1.0.0",
1515
"grunt-contrib-uglify": "^0.8.0",
1616
"grunt-contrib-watch": "^0.6.1",
1717
"grunt-eslint": "^17.0.0",

0 commit comments

Comments
 (0)