const gulp = require('gulp');

// gulp plugins
const less = require('gulp-less');
const htmlmin = require('gulp-htmlmin');
const minifyCSS = require('gulp-csso');
const minify = require('gulp-minify');
const eslint = require('gulp-eslint');
const lesshint = require('gulp-lesshint');

// other packages
const browserSync = require('browser-sync').create();

gulp.task('html', function(){
  return gulp.src('src/index.html')
    .pipe(minifyCSS())
    .pipe(gulp.dest('build'))
});

gulp.task('css', function(){
  return gulp.src('src/less/*.less')
    .pipe(lesshint())
    .pipe(lesshint.reporter())
    .pipe(less())
    .pipe(minifyCSS())
    .pipe(gulp.dest('build/css'))
});

gulp.task('js', function(){
  return gulp.src('src/js/*.js')
    .pipe(eslint({
      "globals": [
        "jQuery",
        "$"
      ]
    }))
    .pipe(eslint.format())
    .pipe(minify({
      ext:{
          src:'.js',
          min:'.min.js'
      }
    }))
    .pipe(gulp.dest('build/js'))
});

gulp.task('default', [ 'html', 'css', 'js' ]);

/* DEVELOPMENT */

gulp.task('browsersync', ['default'], function() {
  browserSync.init({
    server: "./build"
  });
})

gulp.task('html-watch', ['html'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('css-watch', ['css'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('js-watch', ['js'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('watch', ['browsersync'], function(){
  gulp.watch('src/index.html', ['html-watch']);
  gulp.watch('src/less/*.less', ['css-watch']);
  gulp.watch('src/js/*.js', ['js-watch']);
})