const { src, dest, series, parallel, watch } = require('gulp');
const gulpSass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
const cssnano = require('cssnano');
const notify = require('gulp-notify');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');
const babel = require('gulp-babel');
const rename = require('gulp-regex-rename');
const unuse = require('postcss-uncss'); //https://github.com/uncss/postcss-uncss

/*
 * SASS$
 */
function sass() {
	let options_unuse = {
		html: 'http://starter.spip'
	};
	return (
		src('css/**/*.scss')
			.pipe(sourcemaps.init())
			.pipe(gulpSass({ outputStyle: 'expanded' }))
			.on('error', err => notify().write(err))
			.pipe(postcss([autoprefixer()])) // autoprefixer
			//.pipe(postcss([autoprefixer(), cssnano()])) // autoprefixer  +  minifier
			//.pipe(postcss([unuse(options_unuse), autoprefixer()])) // css unuse + autoprefixer
			.pipe(sourcemaps.write('.')) // initialize sourcemaps first
			.pipe(dest('css'))
	);
}

/*
 * JS -> concat + babel
 */
function jsConcatMinif() {
	return src(['./js/a_compresser/*.js'])
		.pipe(sourcemaps.init())
		.pipe(
			babel({
				presets: ['@babel/preset-env']
			})
		)
		.pipe(concat('mon_site.min.js', { newLine: ';' }))
		.pipe(uglify())
		.pipe(sourcemaps.write('.'))
		.pipe(dest('./js'));
}

/*
 * JS -> babel
 */
function jsBabel() {
	return src(['js/*.es6.js'])
		.pipe(
			babel({
				presets: ['@babel/preset-env']
			})
		)
		.pipe(rename(/\.es6/, ''))
		.pipe(dest('./js'));
}

/*
 * Les Watchers
 */
function watcherSass() {
	watch('css/**/*.scss', { ignoreInitial: false }, sass).on('change', function() {
		notify('CSS -> SCSS ==> OK').write('');
	});
}

function watcherJsConcatMinif() {
	watch('./js/a_compresser/*.js', { ignoreInitial: false }, jsConcatMinif).on('change', function() {
		notify('JS (concat)  ==> OK').write('');
	});
}

function watcherJsBabel() {
	watch('./js/*.es6.js', { ignoreInitial: false }, jsBabel).on('change', function() {
		notify('JS (babel)  ==> OK').write('');
	});
}

/*
 * SVG sprite
 */
const gulpSvgSprite = require('gulp-svg-sprite');
const config = {
	shape: {
		spacing: {
			box: 'icon'
		}
	},
	mode: {
		//"view": {
		//"dest": ".",
		//"sprite": "sprite_css_pictos.svg",
		//"bust": false
		//},

		symbol: {
			dest: '.',
			sprite: 'sprite_symbol_pictos.svg'
		}
	}
};

function svgSprite() {
	return (
		src('svg/**/*.svg')
			//.pipe(plumber())
			.pipe(gulpSvgSprite(config))
			.on('error', function(error) {
				console.log(error);
			})
			.pipe(dest('img'))
	);
}

/*
 * SVG minifier
 */
var svgmin = require('gulp-svgmin');
function svgMin() {
	return src('svg/*.svg')
		.pipe(svgmin())
		.pipe(dest('./svgmin'));
}

/*
 * Exports des fonctions
 */
module.exports = {
	default: parallel(sass, jsConcatMinif, jsBabel),
	sass: sass,
	watch: parallel(watcherSass, watcherJsConcatMinif, watcherJsBabel),
	sprite: svgSprite,
	svgmin: svgMin
};
