const { src, dest, watch, parallel } = require("gulp");
const sass = require("gulp-sass");
const imagemin = require("gulp-imagemin");
const uglify = require("gulp-uglify-es").default;
const babel = require("gulp-babel");
const rename = require("gulp-rename");

/*
 * Add compressor from sass to css files
 * Sass is not browser supported.
 */

function sass2css(done) {
  src("./wp-content/themes/joth/assets/src/sass/style.scss")
    .pipe(sass({ outputStyle: "compressed" }).on("error", sass.logError))
    .pipe(rename('style.min.css'))
    .pipe(dest("./wp-content/themes/joth/assets/dist/css/"));
  done();
}

/*
 * Compress all jpeg, png and svg files.
 */

function compressImages(done) {
  src("./wp-content/themes/joth/assets/src/images/*")
    .pipe(imagemin({ progressive: true }))
    .pipe(dest("./wp-content/themes/joth/assets/dist/images/"));
  done();
}

/**
 * Minify all js files.
 */

function minifyJs(done) {
  src("./wp-content/themes/joth/assets/src/js/*.js")
    .pipe(babel({ presets: ["@babel/env"] }))
    .pipe(uglify())
    .pipe(rename({suffix: '.min'}))
    .pipe(dest("./wp-content/themes/joth/assets/dist/js/"));
  done();
}

watch("./wp-content/themes/joth/assets/src/sass/**/*.scss", sass2css);
watch("./wp-content/themes/joth/assets/src/images/*", compressImages);
watch("./wp-content/themes/joth/assets/src/js/*", minifyJs);

module.exports.default = parallel(
  rename,
  sass2css,
  compressImages,
  minifyJs,
);