'use strict';
const webpack = require('webpack');
const WebpackDevServer = require('webpack-dev-server');
const webpackConfig = require('./webpack.config.js');
const opn = require('opn');
const gulp = require('gulp');
const clean = require('gulp-clean');
const gutil = require('gulp-util');
const gulpif = require('gulp-if');
const sprity = require('sprity');
const imagemin = require('gulp-imagemin');

gulp.task('default', ['build-dev', 'serve']);

// Development build
gulp.task('build-dev', ['webpack:build-dev'], function () {
});

// Production build
gulp.task('build', ['imagemin', 'webpack:build'], function () {

});

gulp.task('clean', function () {
    return gulp.src('dist/*')
        .pipe(clean());
});

gulp.task('webpack:build', function (callback) {
    process.env.NODE_ENV = 'production';
    webpack(webpackConfig, function (err, stats) {
        if (err) throw new gutil.PluginError('webpack:build', err);
        gutil.log('[webpack:build]', stats.toString({
            colors: true
        }));
        callback();
    });
});

let myDevConfig = Object.create(webpackConfig);
myDevConfig.devtool = 'sourcemap';
myDevConfig.debug = true;
let devCompiler = webpack(myDevConfig);

gulp.task('webpack:build-dev', function (callback) {
    // run webpack
    devCompiler.run(function (err, stats) {
        if (err) throw new gutil.PluginError('webpack:build-dev', err);
        gutil.log('[webpack:build-dev]', stats.toString({
            colors: true
        }));
        callback();
    });
});

gulp.task('watch', function () {
    gulp.watch('src/lib/**/*', ['webpack:build-dev']);
    gulp.watch('src/fonts/**/*', ['webpack:build-dev']);
    gulp.watch('src/img/**/*', ['webpack:build-dev']);
    gulp.watch('src/html/**/*', ['webpack:build-dev']);
    gulp.watch('src/js/**/*', ['webpack:build-dev']);
    gulp.watch('src/less/**/*', ['webpack:build-dev']);
});

//iframe方式自动刷新
gulp.task('serve', ['watch'], function (callback) {
    let devConfig = webpackConfig;
    devConfig.devtool = 'eval';
    devConfig.debug = true;
    devConfig.entry.client = 'webpack-dev-server/client?http://localhost:8080';
    devConfig.entry.server = 'webpack/hot/dev-server';

    // Start a webpack-dev-server
    new WebpackDevServer(webpack(devConfig), {
        publicPath: '/' + devConfig.output.publicPath,
        stats: {
            colors: true
        }
    }).listen(4080, 'localhost', function (err) {
        if (err) throw new gutil.PluginError('webpack-dev-server', err);
        gutil.log('[webpack-dev-server]', 'http://localhost:4080/index.html');
        opn('http://localhost:4080/webpack-dev-server/dist/html/index.html');
        callback();
    });
});

// TODO:inline自动刷新未实现，需要手动刷新 囧~
gulp.task('serve:inline', ['watch'], function (callback) {

    let devConfig = webpackConfig;
    devConfig.devtool = 'eval';
    devConfig.debug = true;
    for (let el in devConfig.entry) {
        devConfig.entry[el].unshift(
            'webpack-dev-server/client?http://localhost:8080/dist/',
            'webpack/hot/dev-server'
        );
    }

    // Start a webpack-dev-server
    new WebpackDevServer(webpack(devConfig), {
        publicPath: '/' + devConfig.output.publicPath,
        hot: true,
        inline: true,
        stats: {
            colors: true
        }
    }).listen(8080, 'localhost', function (err) {
        if (err) throw new gutil.PluginError('webpack-dev-server', err);
        gutil.log('[webpack-dev-server]', 'http://localhost:8080/index.html');
        opn('http://localhost:8080/dist/html/index.html');
        callback();
    });
});

gulp.task('sprites', function () {
    return sprity.src({
        src: 'src//sprites/**/*.{png,jpg,jpeg}',
        style: './sprite.css',
        prefix: 'sprite',
        cssPath: '../img'
        // ... other optional options
        // for example if you want to generate less instead of css
        // processor: 'less' // make sure you have installed sprity-less
    })
        .pipe(gulpif('*.png', gulp.dest('./src/img/'), gulp.dest('./src/css/')));
});

gulp.task('imagemin', function () {
    return gulp.src('./src/img/**/*')
        .pipe(imagemin())
        .pipe(gulp.dest('./src/img'));
});