2014-06-09 17:02:39 +04:00
|
|
|
/**
|
|
|
|
*
|
2015-02-16 17:06:43 +03:00
|
|
|
* Material Design Lite
|
2015-01-06 16:36:47 +03:00
|
|
|
* Copyright 2015 Google Inc. All rights reserved.
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
* you may not use this file except in compliance with the License.
|
|
|
|
* You may obtain a copy of the License at
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-10-22 17:14:09 +04:00
|
|
|
* https://www.apache.org/licenses/LICENSE-2.0
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
* See the License for the specific language governing permissions and
|
|
|
|
* limitations under the License
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
*/
|
2014-06-09 17:02:39 +04:00
|
|
|
|
2014-04-17 16:02:38 +04:00
|
|
|
'use strict';
|
2014-06-19 16:14:21 +04:00
|
|
|
|
|
|
|
// Include Gulp & Tools We'll Use
|
2014-04-17 16:02:38 +04:00
|
|
|
var gulp = require('gulp');
|
2014-06-07 21:38:49 +04:00
|
|
|
var $ = require('gulp-load-plugins')();
|
2014-06-22 00:32:57 +04:00
|
|
|
var del = require('del');
|
2014-06-19 05:37:49 +04:00
|
|
|
var runSequence = require('run-sequence');
|
2014-05-06 16:47:36 +04:00
|
|
|
var browserSync = require('browser-sync');
|
|
|
|
var reload = browserSync.reload;
|
2015-01-29 18:26:23 +03:00
|
|
|
var fs = require('fs');
|
|
|
|
var path = require('path');
|
2015-02-04 13:14:57 +03:00
|
|
|
var pkg = require('./package.json');
|
|
|
|
var banner = ['/**',
|
|
|
|
' * <%= pkg.name %> - <%= pkg.description %>',
|
|
|
|
' * @version v<%= pkg.version %>',
|
|
|
|
' * @link <%= pkg.homepage %>',
|
2015-03-17 13:08:30 +03:00
|
|
|
' * @license <%= pkg.license.type %>',
|
2015-02-04 13:14:57 +03:00
|
|
|
' */',
|
|
|
|
''].join('\n');
|
|
|
|
|
|
|
|
var AUTOPREFIXER_BROWSERS = [
|
|
|
|
'ie >= 10',
|
|
|
|
'ie_mob >= 10',
|
|
|
|
'ff >= 30',
|
|
|
|
'chrome >= 34',
|
|
|
|
'safari >= 7',
|
|
|
|
'opera >= 23',
|
|
|
|
'ios >= 7',
|
|
|
|
'android >= 4.4',
|
|
|
|
'bb >= 10'
|
|
|
|
];
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Lint JavaScript
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.task('jshint', function () {
|
|
|
|
return gulp.src('src/**/*.js')
|
2014-06-26 23:32:04 +04:00
|
|
|
.pipe(reload({stream: true, once: true}))
|
2015-02-10 16:20:01 +03:00
|
|
|
.pipe($.jshint())
|
|
|
|
.pipe($.jshint.reporter('jshint-stylish'))
|
|
|
|
.pipe($.if(!browserSync.active, $.jshint.reporter('fail')));
|
2014-06-19 16:14:21 +04:00
|
|
|
});
|
2014-05-07 13:33:42 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Optimize Images
|
2015-02-04 13:14:57 +03:00
|
|
|
// TODO: Update image paths in final CSS to match root/images
|
|
|
|
gulp.task('images', function () {
|
|
|
|
return gulp.src('src/**/*.{svg,png,jpg}')
|
2015-02-24 12:11:04 +03:00
|
|
|
.pipe($.flatten())
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe($.cache($.imagemin({
|
|
|
|
progressive: true,
|
|
|
|
interlaced: true
|
|
|
|
})))
|
2015-02-04 13:14:57 +03:00
|
|
|
.pipe(gulp.dest('./images'))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe($.size({title: 'images'}));
|
2014-06-19 16:14:21 +04:00
|
|
|
});
|
|
|
|
|
2015-02-16 20:41:09 +03:00
|
|
|
// Copy fonts
|
|
|
|
gulp.task('fonts', function () {
|
|
|
|
return gulp.src([
|
|
|
|
'fonts/*'
|
|
|
|
]).pipe(gulp.dest('.tmp/fonts'));
|
|
|
|
});
|
2014-11-12 19:43:46 +03:00
|
|
|
|
2015-02-04 13:14:57 +03:00
|
|
|
// Compile and Automatically Prefix Stylesheets (dev)
|
2015-02-16 20:41:09 +03:00
|
|
|
gulp.task('styles:dev', ['fonts'], function () {
|
2015-02-04 13:14:57 +03:00
|
|
|
return gulp.src([
|
|
|
|
'src/**/**/*.scss'
|
|
|
|
])
|
|
|
|
.pipe($.changed('.tmp/styles', {extension: '.css'}))
|
|
|
|
.pipe($.sass({
|
|
|
|
precision: 10,
|
|
|
|
onError: console.error.bind(console, 'Sass error:')
|
|
|
|
}))
|
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
2015-02-05 15:39:43 +03:00
|
|
|
.pipe(gulp.dest('.tmp/styles'))
|
2015-02-04 13:14:57 +03:00
|
|
|
.pipe($.size({title: 'styles'}));
|
2014-07-08 18:53:00 +04:00
|
|
|
});
|
|
|
|
|
2015-03-18 21:31:44 +03:00
|
|
|
// Compile and Automatically Prefix Stylesheet Templates (production)
|
|
|
|
gulp.task('styletemplates', function () {
|
|
|
|
// For best performance, don't add Sass partials to `gulp.src`
|
|
|
|
return gulp.src([
|
|
|
|
'src/template.scss'
|
|
|
|
])
|
|
|
|
// Generate Source Maps
|
|
|
|
.pipe ($.sourcemaps.init())
|
|
|
|
.pipe($.sass({
|
|
|
|
precision: 10,
|
|
|
|
onError: console.error.bind(console, 'Sass error:')
|
|
|
|
}))
|
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
|
|
|
.pipe(gulp.dest('.tmp'))
|
|
|
|
// Concatenate Styles
|
|
|
|
.pipe($.concat('material.css.template'))
|
|
|
|
.pipe($.header(banner, {pkg: pkg}))
|
|
|
|
.pipe(gulp.dest('./css'))
|
|
|
|
// Minify Styles
|
|
|
|
.pipe($.if('*.css', $.csso()))
|
|
|
|
.pipe($.concat('material.min.css.template'))
|
|
|
|
.pipe(gulp.dest('./css'))
|
|
|
|
.pipe($.size({title: 'styles'}));
|
|
|
|
});
|
|
|
|
|
2015-02-04 13:14:57 +03:00
|
|
|
// Compile and Automatically Prefix Stylesheets (production)
|
2015-03-18 21:31:44 +03:00
|
|
|
gulp.task('styles', ['styletemplates'], function () {
|
2014-07-30 03:25:19 +04:00
|
|
|
// For best performance, don't add Sass partials to `gulp.src`
|
|
|
|
return gulp.src([
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/styleguide.scss'
|
2014-10-14 19:19:35 +04:00
|
|
|
])
|
2015-02-24 17:21:47 +03:00
|
|
|
// Generate Source Maps
|
|
|
|
.pipe ($.sourcemaps.init())
|
2014-11-25 14:22:05 +03:00
|
|
|
.pipe($.sass({
|
2015-01-07 16:50:02 +03:00
|
|
|
precision: 10,
|
|
|
|
onError: console.error.bind(console, 'Sass error:')
|
|
|
|
}))
|
2014-07-04 15:35:14 +04:00
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
2014-09-03 14:47:19 +04:00
|
|
|
.pipe(gulp.dest('.tmp'))
|
2015-02-04 13:14:57 +03:00
|
|
|
// Concatenate Styles
|
|
|
|
.pipe($.concat('material.css'))
|
|
|
|
.pipe($.header(banner, {pkg: pkg}))
|
|
|
|
.pipe(gulp.dest('./css'))
|
|
|
|
// Minify Styles
|
2014-08-28 20:13:09 +04:00
|
|
|
.pipe($.if('*.css', $.csso()))
|
2015-02-04 13:14:57 +03:00
|
|
|
.pipe($.concat('material.min.css'))
|
|
|
|
//.pipe($.header(banner, {pkg: pkg}))
|
2015-02-24 17:21:47 +03:00
|
|
|
.pipe($.sourcemaps.write('./'))
|
2015-02-04 13:14:57 +03:00
|
|
|
.pipe(gulp.dest('./css'))
|
2014-07-30 03:25:19 +04:00
|
|
|
.pipe($.size({title: 'styles'}));
|
2014-06-19 05:37:49 +04:00
|
|
|
});
|
2014-06-18 23:58:06 +04:00
|
|
|
|
2014-11-12 19:43:46 +03:00
|
|
|
// Concatenate And Minify JavaScript
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.task('scripts', function () {
|
2015-01-30 17:44:33 +03:00
|
|
|
var sources = [
|
|
|
|
// Component handler
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/wskComponentHandler.js',
|
2015-01-30 17:44:33 +03:00
|
|
|
// Polyfills/dependencies
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/third_party/**/*.js',
|
2015-01-30 17:44:33 +03:00
|
|
|
// Base components
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/animation/animation.js',
|
|
|
|
'src/button/button.js',
|
|
|
|
'src/checkbox/checkbox.js',
|
|
|
|
'src/column-layout/column-layout.js',
|
|
|
|
'src/icon-toggle/icon-toggle.js',
|
2015-02-16 20:14:45 +03:00
|
|
|
'src/menu/menu.js',
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/radio/radio.js',
|
|
|
|
'src/slider/slider.js',
|
|
|
|
'src/spinner/spinner.js',
|
|
|
|
'src/switch/switch.js',
|
|
|
|
'src/tabs/tabs.js',
|
|
|
|
'src/textfield/textfield.js',
|
|
|
|
'src/tooltip/tooltip.js',
|
2015-01-30 17:44:33 +03:00
|
|
|
// Complex components (which reuse base components)
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/layout/layout.js',
|
2015-01-30 17:44:33 +03:00
|
|
|
// And finally, the ripples
|
2015-02-04 13:14:57 +03:00
|
|
|
'src/ripple/ripple.js'
|
2015-01-30 17:44:33 +03:00
|
|
|
];
|
2015-01-20 20:54:59 +03:00
|
|
|
return gulp.src(sources)
|
2015-02-04 13:14:57 +03:00
|
|
|
.pipe($.sourcemaps.init())
|
|
|
|
// Concatenate Scripts
|
|
|
|
.pipe($.concat('material.js'))
|
|
|
|
.pipe($.header(banner, {pkg: pkg}))
|
|
|
|
.pipe(gulp.dest('./js'))
|
|
|
|
// Minify Scripts
|
|
|
|
.pipe($.uglify({preserveComments: 'some', sourceRoot: '.', sourceMapIncludeSources: true}))
|
|
|
|
.pipe($.concat('material.min.js'))
|
|
|
|
// Write Source Maps
|
|
|
|
.pipe($.sourcemaps.write('./'))
|
|
|
|
.pipe(gulp.dest('./js'))
|
2014-11-12 19:43:46 +03:00
|
|
|
.pipe($.size({title: 'scripts'}));
|
|
|
|
});
|
|
|
|
|
2015-02-10 16:19:18 +03:00
|
|
|
// Run Unit Tests
|
|
|
|
gulp.task('mocha', function () {
|
2015-02-16 12:15:59 +03:00
|
|
|
return gulp.src('./test/index.html')
|
2015-02-11 18:57:39 +03:00
|
|
|
.pipe($.mochaPhantomjs({reporter: 'list'}))
|
2015-02-10 16:19:18 +03:00
|
|
|
});
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Clean Output Directory
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.task('clean', del.bind(null, ['.tmp', 'css/*', 'js/*', '!dist/.git'], {dot: true}));
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Watch Files For Changes & Reload
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.task('serve', ['styles:dev'], function () {
|
2014-06-26 11:10:04 +04:00
|
|
|
browserSync({
|
2014-06-26 02:14:19 +04:00
|
|
|
notify: false,
|
2014-09-22 14:34:01 +04:00
|
|
|
// Customize the BrowserSync console logging prefix
|
2014-09-22 14:52:32 +04:00
|
|
|
logPrefix: 'WSK',
|
2015-02-05 15:39:43 +03:00
|
|
|
server: ['.tmp', 'src', '.tmp/styles']
|
2014-06-20 19:20:44 +04:00
|
|
|
});
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.watch(['src/**/**/**/*.html'], reload);
|
|
|
|
gulp.watch(['src/**/**/*.{scss,css}'], ['styles:dev', reload]);
|
|
|
|
gulp.watch(['src/**/*.js'], ['jshint']);
|
2014-04-17 16:02:38 +04:00
|
|
|
});
|
2014-06-07 21:38:49 +04:00
|
|
|
|
2014-07-01 00:18:52 +04:00
|
|
|
// Build and serve the output from the dist build
|
2015-02-04 13:14:57 +03:00
|
|
|
gulp.task('serve:dist', ['default'], function () {
|
2014-07-01 00:23:24 +04:00
|
|
|
browserSync({
|
|
|
|
notify: false,
|
2014-09-22 14:52:32 +04:00
|
|
|
logPrefix: 'WSK',
|
2015-02-04 13:14:57 +03:00
|
|
|
server: './',
|
2015-02-16 20:41:09 +03:00
|
|
|
baseDir: 'src'
|
2014-07-01 00:18:52 +04:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2014-06-20 03:36:01 +04:00
|
|
|
// Build Production Files, the Default Task
|
2015-02-21 05:41:44 +03:00
|
|
|
gulp.task('default', ['clean','mocha'], function (cb) {
|
2015-01-29 18:26:23 +03:00
|
|
|
runSequence(
|
|
|
|
'styles',
|
2015-02-04 13:14:57 +03:00
|
|
|
['jshint', 'scripts', 'images'],
|
2015-01-29 18:26:23 +03:00
|
|
|
cb);
|
2014-06-07 21:38:49 +04:00
|
|
|
});
|
2015-02-16 12:15:59 +03:00
|
|
|
|
|
|
|
gulp.task('test', ['jshint', 'mocha']);
|