// sass
import gulp from 'gulp';
import gulpif from 'gulp-if';
import sass  from 'gulp-sass';
// import sass  from 'gulp-ruby-sass';
import cleanCSS from 'gulp-clean-css';
import newer from 'gulp-newer';
import autoprefixer from 'gulp-autoprefixer';
import sourcemaps from 'gulp-sourcemaps';
import browser from 'browser-sync';
import pathConfig from '../paths.js'
import gcmq from 'gulp-group-css-media-queries';
import concat from 'gulp-concat';
import minifyCss from 'gulp-minify-css';

export const stylesBuild = () => {
  return gulp.src(`${pathConfig.src.sass}/**/*.scss`, {
    ignore: pathConfig.isProd && [`${pathConfig.src.sass}/parts/*.scss`]
  })

    .pipe(newer('*'))
    .pipe(gulpif(pathConfig.isDevelop, sourcemaps.init()))
    .pipe(sass.sync().on('error', sass.logError))
    .pipe(gulpif(pathConfig.isProd, gcmq()))
    .pipe(gulpif(pathConfig.isProd, autoprefixer()))
    .pipe(gulpif(pathConfig.isProd, cleanCSS({ level: 2 })))
    .pipe(gulpif(pathConfig.isDevelop, sourcemaps.write('./')))
    .pipe(gulp.dest(pathConfig.assets.css))

    .pipe(browser.reload({stream: true}));
}

// export const stylesBuild = () => {
//   return gulp.src(`${pathConfig.src.sass}/**/*.scss`)
//     .pipe(gulpif(pathConfig.isDevelop, sourcemaps.init()))
//     .pipe(sass.sync().on('error', sass.logError))
//     .pipe(concat("bundle.css"))
//     .pipe(gulpif(pathConfig.isDevelop, sourcemaps.write('./')))
//     .pipe(gulp.dest(pathConfig.assets.css))
//
// }


export const stylesDevelop = () => gulp.watch(`${pathConfig.src.sass}/**/*.scss`, stylesBuild).on('change', browser.reload.bind(null, {stream: true}));