'use strict';

var gulp = require('gulp');
var reactify = require('reactify');
var debowerify = require('debowerify');
var del = require('del');
var handleErrors = require('./util/handleErrors');


// Load plugins
var $ = require('gulp-load-plugins')();

//Styles
gulp.task('styles', function() {
    return gulp.src('app/styles/main.scss')
        .pipe($.rubySass({
            style: 'expanded',
            precision: 10,
            loadPath: ['app/bower_components', 'app/styles']
        }))
        .pipe($.autoprefixer('last 1 version'))
        .pipe(gulp.dest('dist/styles'))
        .pipe($.size());
});

// Scripts
gulp.task('scripts', function () {
    return gulp.src('app/scripts/app.js')
        .pipe($.browserify({
            insertGlobals: true,
            transform: ['reactify']
        }))
        .on('error', handleErrors)
        .pipe(gulp.dest('dist/scripts'))
        .pipe($.size());
    });


// HTML
gulp.task('html', function () {
    return gulp.src('app/*.html')
        .pipe($.useref())
        .pipe(gulp.dest('dist'))
        .pipe($.size());
});

// Fonts
gulp.task('fonts', function () {
    return gulp.src('app/fonts/**/*')
        .pipe(gulp.dest('dist/fonts'))
        .pipe($.size());
});

// Images
gulp.task('images', function () {
    return gulp.src('app/images/**/*')
        .pipe($.cache($.imagemin({
            optimizationLevel: 3,
            progressive: true,
            interlaced: true
        })))
        .pipe(gulp.dest('dist/images'))
        .pipe($.size());
});


// Clean
gulp.task('clean', function (cb) {
    del(['dist/styles', 'dist/scripts', 'dist/images'], cb);
});


// Bundle
gulp.task('bundle', ['styles', 'fonts', 'scripts', 'bower'], function(){
    return gulp.src('./app/*.html')
               .pipe($.useref.assets())
               .pipe($.useref.restore())
               .pipe($.useref())
               .pipe(gulp.dest('dist'));
});

// Build
gulp.task('build', ['html', 'bundle']);

// Default task
gulp.task('default', ['clean', 'build']);

// Webserver
gulp.task('serve', function () {
    gulp.src('dist')
        .pipe($.webserver({
            livereload: true,
            port: 9000
        }));
});

// Bower helper
gulp.task('bower', function() {
    gulp.src('app/bower_components/**/*.js', {base: 'app/bower_components'})
        .pipe(gulp.dest('dist/bower_components/'));

});

gulp.task('json', function() {
    gulp.src('app/scripts/json/**/*.json', {base: 'app/scripts'})
        .pipe(gulp.dest('dist/scripts/'));
});


// Watch
gulp.task('watch', ['html', 'bundle', 'serve'], function () {

    // Watch .json files
    gulp.watch('app/scripts/**/*.json', ['json']);

    // Watch .html files
    gulp.watch('app/*.html', ['html']);

    // Watch .scss files
    gulp.watch('app/styles/*.scss', ['styles']);
    gulp.watch('app/styles/*.css', ['styles']);

    // Watch .js files
    gulp.watch('app/scripts/*.js', ['scripts']);

    // Watch image files
    gulp.watch('app/images/**/*', ['images']);
});

@@ -248,18 +248,20 @@
 s')();%0A%0A
+%0A
 //
+ 
 Styles%0Ag
@@ -274,24 +274,69 @@
 sk('styles',
+ %5B'sass', 'css'%5D);%0A%0A// Sass%0Agulp.task('sass',
  function() 
@@ -527,16 +527,16 @@
 tyles'%5D%0A
-
         
@@ -653,24 +653,219 @@
 ze());%0A%7D);%0A%0A
+// CSS%0Agulp.task('css', function() %7B%0A    return gulp.src('app/styles/*.css')%0A        .pipe($.autoprefixer('last 1 version'))%0A        .pipe(gulp.dest('dist/styles'))%0A        .pipe($.size());%0A%7D);%0A%0A
 // Scripts%0Ag

Split style task in gulpfile