const gulp = require('gulp')
const browserSync = require('browser-sync').create()

const concat = require('gulp-concat')
const uglify = require('gulp-uglify')

const sass = require('gulp-sass')
const sourcemaps = require('gulp-sourcemaps')
const autoprefixer = require('gulp-autoprefixer')

gulp.task('sass', function () {
  return gulp.src('./app/src/sass/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass({ outputStyle: 'expanded'} ).on('error', sass.logError))
    .pipe(sourcemaps.write())
    .pipe( autoprefixer({ browsers: ['last 2 versions'] }) )
    .pipe(gulp.dest('./app/assets/css/'))
    .pipe(browserSync.stream())
})

gulp.task('js', function () {
  return gulp.src('./app/src/js/**/*.js')
    .pipe(sourcemaps.init())
    .pipe(concat('all.min.js'))
    .pipe(uglify())
    .pipe(sourcemaps.write(''))
    .pipe(gulp.dest('./app/assets/js/'))
    .pipe(browserSync.stream())
})

gulp.task('serve', ['sass', 'js'], function () {
  browserSync.init({
    server: "./app",
    injectChanges: true,
    notify: false
  })

  gulp.watch('app/src/sass/**/*.scss', ['sass'])
  gulp.watch('app/src/js/**/*.js', ['js'])
  gulp.watch('app/**/*.html').on('change', browserSync.reload)
})

gulp.task('default', ['serve'])

const gulp = require('gulp')
const browserSync = require('browser-sync').create()

const concat = require('gulp-concat')
const uglify = require('gulp-uglify')

const sass = require('gulp-sass')
const sourcemaps = require('gulp-sourcemaps')
const autoprefixer = require('gulp-autoprefixer')

const PATHS = {
  styles: {
    src: 'app/src/sass/**/*.scss',
    dest: 'app/assets/css/'
  },
  scripts: {
    src: 'app/src/js/**/*.js',
    dest: 'app/assets/js/'
  }
}

gulp.task('sass', function () {
  return gulp.src(PATHS.styles.src)
    .pipe(sourcemaps.init())
    .pipe(sass({ outputStyle: 'expanded'} ).on('error', sass.logError))
    .pipe(sourcemaps.write())
    .pipe( autoprefixer({ browsers: ['last 2 versions'] }) )
    .pipe(gulp.dest(PATHS.styles.dest))
    .pipe(browserSync.stream())
})

gulp.task('js', function () {
  return gulp.src(PATHS.scripts.src)
    .pipe(sourcemaps.init())
    .pipe(concat('all.min.js'))
    .pipe(uglify())
    .pipe(sourcemaps.write(''))
    .pipe(gulp.dest(PATHS.scripts.dest))
    .pipe(browserSync.stream())
})

gulp.task('serve', ['sass', 'js'], function () {
  console.log(PATHS.styles.src);
  browserSync.init({
    server: './app',
    injectChanges: true,
    notify: false
  })

  gulp.watch(PATHS.styles.src, ['sass'])
  gulp.watch(PATHS.scripts.src, ['js'])
  gulp.watch('app/**/*.html').on('change', browserSync.reload)
})

gulp.task('default', ['serve'])

put paths in variables to avoid repetition