Skip to content

Commit c83ba63

Browse files
committed
Use Assemble to build the examples.
1 parent 0bac2e2 commit c83ba63

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+862
-167
lines changed

Gruntfile.js

Lines changed: 28 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,16 +8,37 @@ module.exports = function (grunt) {
88
watch: {
99
source: {
1010
files: ['background-check.js'],
11-
tasks: ['clean', 'jshint', 'uglify', 'copy']
11+
tasks: ['clean:source', 'jshint', 'uglify', 'copy']
1212
},
13+
1314
examples: {
14-
files: ['examples/*.js', '!examples/*.min.js'],
15+
files: ['examples/src/*/*.*'],
16+
tasks: ['clean:examples', 'assemble']
17+
},
18+
19+
examplesJS: {
20+
files: ['examples/build/scripts/*.js', '!examples/build/scripts/*.min.js'],
1521
tasks: ['jshint']
1622
}
1723
},
1824

25+
assemble: {
26+
options: {
27+
flatten: true,
28+
data: 'examples/src/data/*.json',
29+
layout: 'examples/src/layouts/default.hbs',
30+
partials: ['examples/src/partials/*.hbs']
31+
},
32+
build: {
33+
files: [{
34+
src: ['examples/src/pages/*.hbs'],
35+
dest: 'examples/build/'
36+
}]
37+
}
38+
},
39+
1940
jshint: {
20-
files: ['background-check.js', 'examples/*.js', '!examples/*.min.js'],
41+
files: ['background-check.js', 'examples/build/scripts/*.js', '!examples/build/scripts/*.min.js'],
2142
options: {
2243
'white': true,
2344
'indent': 2,
@@ -40,7 +61,8 @@ module.exports = function (grunt) {
4061
},
4162

4263
clean: {
43-
all: ['background-check.min.js', 'examples/background-check.min.js']
64+
source: ['background-check.min.js', 'examples/build/scripts/background-check.min.js'],
65+
examples: ['examples/build/*.html']
4466
},
4567

4668
uglify: {
@@ -56,12 +78,13 @@ module.exports = function (grunt) {
5678
copy: {
5779
min: {
5880
src: 'background-check.min.js',
59-
dest: 'examples/background-check.min.js'
81+
dest: 'examples/build/scripts/background-check.min.js'
6082
}
6183
}
6284

6385
});
6486

87+
grunt.loadNpmTasks('assemble');
6588
grunt.loadNpmTasks('grunt-contrib-watch');
6689
grunt.loadNpmTasks('grunt-contrib-jshint');
6790
grunt.loadNpmTasks('grunt-contrib-clean');

examples/cross-origin.html renamed to examples/build/cross-origin.html

Lines changed: 39 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -10,19 +10,29 @@
1010

1111
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700' rel='stylesheet' type='text/css'>
1212

13-
<link rel="stylesheet" href="normalize.css">
14-
<link rel="stylesheet" href="examples.css" >
13+
<link rel="stylesheet" href="styles/normalize.css">
14+
<link rel="stylesheet" href="styles/examples.css" >
15+
1516

16-
<script src="background-check.min.js"></script>
17-
<script src="drag.js"></script>
18-
<script src="cross-origin.js"></script>
17+
18+
<script src="scripts/background-check.min.js"></script>
19+
20+
<script src="scripts/drag.js"></script>
21+
<script src="scripts/cross-origin.js"></script>
22+
23+
1924
</head>
2025

2126
<body>
27+
28+
2229
<div class="header">
30+
2331
<h1>BackgroundCheck</h1>
2432
<p class="header-subtitle">Automatically switch to a darker or a lighter version of an element depending on the brightness of images behind it.</p>
25-
<div class="header-drag">Drag and Release elements over image</div>
33+
34+
35+
<div class="header-drag">Drag and Release elements over images</div>
2636

2737
<div class="demo demo--single">
2838
<img crossorigin data-src="//upload.wikimedia.org/wikipedia/commons/thumb/d/d2/Centralpark.png/800px-Centralpark.png" draggable="false" />
@@ -32,30 +42,42 @@ <h1>BackgroundCheck</h1>
3242
The image is served with <a href="http://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS" target="_blank"><strong>access-control-allow-origin: *</strong></a> from <a href="http://en.wikipedia.org/wiki/File:Centralpark.png" target="_blank">Wikipedia</a>.
3343
</p>
3444

45+
3546
<div class="border border--one"><div class="icon target"></div></div>
3647
<div class="border border--two"><div class="icon target"></div></div>
3748
<div class="border border--three"><div class="icon target"></div></div>
3849
<div class="border border--four"><div class="icon icon--simple target"></div></div>
3950
</div>
4051

52+
4153
<div class="download">
4254
<a class="button" href="http://github.com/kennethcachia/Background-Check">Github Project</a>
4355
<a class="button button--secondary" href="http://raw.github.com/kennethcachia/Background-Check/master/background-check.min.js">Download</a>
4456
</div>
45-
57+
4658
<h2>Demos</h2>
4759
<ul class="examples">
48-
<li><a href="index.html">Project Page</a></li>
49-
<li><a href="css-backgrounds.html">CSS Backgrounds</a></li>
50-
<li><a href="css-backgrounds-fullscreen.html" target="_blank">CSS Backgrounds &mdash; Fullscreen</a></li>
51-
<li><a href="slider.html">Slider</a></li>
52-
<li><a href="fixed-nav.html">Fixed Nav</a></li>
53-
<li><a href="cross-origin.html">Cross-Origin Request</a></li>
54-
<li><a href="third-party/flexslider.html">FlexSlider &mdash; Slide</a></li>
55-
<li><a href="third-party/flexslider-fade.html">FlexSlider &mdash; Fade</a></li>
60+
61+
<li><a href="index.html" >Project Page</a></li>
62+
63+
<li><a href="css-backgrounds.html" >CSS Backgrounds</a></li>
64+
65+
<li><a href="css-backgrounds-fullscreen.html" target="_blank">CSS Backgrounds — Fullscreen</a></li>
66+
67+
<li><a href="slider.html" >Slider</a></li>
68+
69+
<li><a href="fixed-nav.html" >Fixed Nav</a></li>
70+
71+
<li><a href="cross-origin.html" >Cross Origin</a></li>
72+
73+
<li><a href="flexslider.html" >FlexSlider — Slide</a></li>
74+
75+
<li><a href="flexslider-fade.html" >FlexSlider — Fade</a></li>
76+
5677
</ul>
5778
</div>
5879

80+
5981
<div class="footer container">
6082
<span class="twitter-share">
6183
<a href="https://twitter.com/share" class="twitter-share-button" data-dnt="true" data-count="none" data-text="BackgroundCheck &mdash; Automatically switch to a darker or a lighter version of an element.">Tweet</a>
@@ -64,7 +86,7 @@ <h2>Demos</h2>
6486

6587
<span class="footer-credits"><a href="http://twitter.com/kennethcachia/" target="_blank">@kennethcachia</a></span>
6688
</div>
67-
89+
6890
<script type="text/javascript">
6991
var _gaq = _gaq || [];
7092
_gaq.push(['_setAccount', 'UA-18542897-1']);
@@ -75,6 +97,6 @@ <h2>Demos</h2>
7597
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
7698
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
7799
})();
78-
</script>
100+
</script>
79101
</body>
80102
</html>

examples/css-backgrounds-fullscreen.html renamed to examples/build/css-backgrounds-fullscreen.html

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,22 @@
1010

1111
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700' rel='stylesheet' type='text/css'>
1212

13-
<link rel="stylesheet" href="normalize.css">
14-
<link rel="stylesheet" href="examples.css" >
15-
<link rel="stylesheet" href="slider.css" >
13+
<link rel="stylesheet" href="styles/normalize.css">
14+
<link rel="stylesheet" href="styles/examples.css" >
15+
<link rel="stylesheet" href="styles/slider.css" >
16+
1617

17-
<script src="background-check.min.js"></script>
18-
<script src="slider.js"></script>
18+
19+
<script src="scripts/background-check.min.js"></script>
20+
21+
<script src="scripts/slider.js"></script>
22+
23+
1924
</head>
2025

2126
<body>
27+
28+
2229
<div class="demo-css--fullscreen">
2330
<div class="slider">
2431
<div class="slider-strip">
@@ -33,6 +40,7 @@
3340
</div>
3441
</div>
3542

43+
3644
<script type="text/javascript">
3745
var _gaq = _gaq || [];
3846
_gaq.push(['_setAccount', 'UA-18542897-1']);
@@ -43,6 +51,6 @@
4351
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
4452
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
4553
})();
46-
</script>
54+
</script>
4755
</body>
4856
</html>

examples/css-backgrounds.html renamed to examples/build/css-backgrounds.html

Lines changed: 38 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,28 @@
1010

1111
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700' rel='stylesheet' type='text/css'>
1212

13-
<link rel="stylesheet" href="normalize.css">
14-
<link rel="stylesheet" href="examples.css" >
13+
<link rel="stylesheet" href="styles/normalize.css">
14+
<link rel="stylesheet" href="styles/examples.css" >
15+
1516

16-
<script src="background-check.min.js"></script>
17-
<script src="drag.js"></script>
18-
<script src="css-backgrounds.js"></script>
17+
18+
<script src="scripts/background-check.min.js"></script>
19+
20+
<script src="scripts/drag.js"></script>
21+
<script src="scripts/css-backgrounds.js"></script>
22+
23+
1924
</head>
2025

2126
<body>
27+
28+
2229
<div class="header">
30+
2331
<h1>BackgroundCheck</h1>
2432
<p class="header-subtitle">Automatically switch to a darker or a lighter version of an element depending on the brightness of images behind it.</p>
33+
34+
2535
<div class="header-drag">Drag and Release elements over images</div>
2636

2737
<div class="demo">
@@ -39,30 +49,42 @@ <h1>BackgroundCheck</h1>
3949
<div class="demo-css" style="background-size: 50%; background-position: top right;"></div>
4050
</div>
4151

52+
4253
<div class="border border--one border--fixed"><div class="icon target"></div></div>
4354
<div class="border border--two border--fixed"><div class="icon target"></div></div>
4455
<div class="border border--three border--fixed"><div class="icon target"></div></div>
4556
<div class="border border--four border--fixed"><div class="icon icon--simple target"></div></div>
4657
</div>
4758

59+
4860
<div class="download">
4961
<a class="button" href="http://github.com/kennethcachia/Background-Check">Github Project</a>
5062
<a class="button button--secondary" href="http://raw.github.com/kennethcachia/Background-Check/master/background-check.min.js">Download</a>
5163
</div>
52-
64+
5365
<h2>Demos</h2>
5466
<ul class="examples">
55-
<li><a href="index.html">Project Page</a></li>
56-
<li><a href="css-backgrounds.html">CSS Backgrounds</a></li>
57-
<li><a href="css-backgrounds-fullscreen.html" target="_blank">CSS Backgrounds &mdash; Fullscreen</a></li>
58-
<li><a href="slider.html">Slider</a></li>
59-
<li><a href="fixed-nav.html">Fixed Nav</a></li>
60-
<li><a href="cross-origin.html">Cross-Origin Request</a></li>
61-
<li><a href="third-party/flexslider.html">FlexSlider &mdash; Slide</a></li>
62-
<li><a href="third-party/flexslider-fade.html">FlexSlider &mdash; Fade</a></li>
67+
68+
<li><a href="index.html" >Project Page</a></li>
69+
70+
<li><a href="css-backgrounds.html" >CSS Backgrounds</a></li>
71+
72+
<li><a href="css-backgrounds-fullscreen.html" target="_blank">CSS Backgrounds — Fullscreen</a></li>
73+
74+
<li><a href="slider.html" >Slider</a></li>
75+
76+
<li><a href="fixed-nav.html" >Fixed Nav</a></li>
77+
78+
<li><a href="cross-origin.html" >Cross Origin</a></li>
79+
80+
<li><a href="flexslider.html" >FlexSlider — Slide</a></li>
81+
82+
<li><a href="flexslider-fade.html" >FlexSlider — Fade</a></li>
83+
6384
</ul>
6485
</div>
6586

87+
6688
<div class="footer container">
6789
<span class="twitter-share">
6890
<a href="https://twitter.com/share" class="twitter-share-button" data-dnt="true" data-count="none" data-text="BackgroundCheck &mdash; Automatically switch to a darker or a lighter version of an element.">Tweet</a>
@@ -71,7 +93,7 @@ <h2>Demos</h2>
7193

7294
<span class="footer-credits"><a href="http://twitter.com/kennethcachia/" target="_blank">@kennethcachia</a></span>
7395
</div>
74-
96+
7597
<script type="text/javascript">
7698
var _gaq = _gaq || [];
7799
_gaq.push(['_setAccount', 'UA-18542897-1']);
@@ -82,6 +104,6 @@ <h2>Demos</h2>
82104
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
83105
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
84106
})();
85-
</script>
107+
</script>
86108
</body>
87109
</html>

0 commit comments

Comments
 (0)