const gulp = require('gulp');
const sass = require('gulp-sass');
const webpack = require('webpack');
const webpackStream = require('webpack-stream');
const config = require('./webpack.config');

const cleanCSS = require('gulp-clean-css');
const autoprefixer = require('gulp-autoprefixer');

const newer = require('gulp-newer');

const fontsSrc = './src/fonts'
const fontsDest = './dist/fonts'

const imgSrc = './src/img'
const imgDest = './dist/img'

const sassTask = () => {
    return gulp.src('./src/sass/**/*.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(autoprefixer({
			browsers: ['last 2 versions', 'ie > 8'],
			cascade: false
		}))
        .pipe(cleanCSS({compatibility: 'ie8'}))
        .pipe(gulp.dest('./dist/css'));
}

const jsTask =() => {
    return gulp.src('./src/js/shared.js')
    .pipe(webpackStream(config, webpack))
    .pipe(gulp.dest('./dist/js/'));
}

const fontsTask = () => {
    return gulp.src(`./${fontsSrc}/**`)
        .pipe(newer(fontsDest))
        .pipe(gulp.dest(fontsDest));
}

const imgTask = () => {
    return gulp.src(`./${imgSrc}/**`)
        // .pipe(newer(imgDest))
        .pipe(gulp.dest(imgDest));
}

const watch = () => {
    gulp.watch('./src/sass/**/*.scss', sassTask);
    gulp.watch('./src/fonts/**', fontsTask);
    gulp.watch('./src/img/**', imgTask);
}

const build = gulp.parallel(jsTask, gulp.series(sassTask, fontsTask, imgTask));
module.exports = {
    default: gulp.parallel(jsTask, gulp.series(sassTask, fontsTask, imgTask, watch)),
    build
}

