'use strict';

var gulp = require('gulp');
var del = require('del');
var sass = require('gulp-sass');
var cleanCSS = require('gulp-clean-css');
var autoprefixer = require('gulp-autoprefixer');
var uglify = require('gulp-uglify');
var htmlmin = require('gulp-htmlmin');
var connect = require('gulp-connect');
var livereload = require('gulp-livereload');

livereload({ start: true })

var AUTOPREFIXER_BROWSERS = [
  'ie >= 10',
  'ie_mob >= 10',
  'ff >= 30',
  'chrome >= 34',
  'safari >= 7',
  'opera >= 23',
  'ios >= 7',
  'android >= 4.4',
  'bb >= 10'
];

function server () {
  connect.server();
}

function clearDist () {
  return del([
    './dist/**/*'
  ]);
}

function sassCompile () {
  return gulp.src('./styles/**/*.sass')
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({browsers: AUTOPREFIXER_BROWSERS}))
    .pipe(cleanCSS({compatibility: 'ie8'}))
    .pipe(gulp.dest('./dist'))
    .pipe(livereload());
};

function cssCompile () {
  return gulp.src('./styles/*.css')
  .pipe(cleanCSS({compatibility: 'ie8'}))
  .pipe(gulp.dest('./dist'))
  .pipe(livereload());
}

function jsCompile () {
  return gulp.src('./js/*.js')
  .pipe(uglify())
  .pipe(gulp.dest('./dist'))
  .pipe(livereload());
}

function htmlCompile () {
  return gulp.src(['./*.html'])
  .pipe(htmlmin({
    collapseWhitespace: true,
    removeComments: true
  }))
  .pipe(gulp.dest('./dist'))
  .pipe(livereload());
}

function watch () {
  livereload.listen();
  gulp.watch("./styles/*", gulp.series(sassCompile, cssCompile));
  gulp.watch("./js/*", gulp.series(jsCompile));
  gulp.watch("./*.html", gulp.series(htmlCompile));
}

gulp.task("watch", gulp.parallel(watch, server));

gulp.task('default', gulp.series(clearDist ,sassCompile, cssCompile, jsCompile, htmlCompile));