var gulp = require('gulp'),
    postcss     = require('gulp-postcss'),
    sass        = require('gulp-sass'),
    sourcemaps  = require('gulp-sourcemaps'),
    autoprefixer = require('autoprefixer'),
    lost        = require('lost'),
    minify      = require('gulp-minify'),
    uglify      = require('gulp-uglify'),
    rename      = require('gulp-rename'),
    changed     = require('gulp-changed'),
    livereload  = require('gulp-livereload'),
    concat      = require('gulp-concat'),
    spritesmith = require('gulp.spritesmith'),
    imageResize = require('gulp-image-resize'),
    svgSprite   = require('gulp-svg-sprite'),
    filter          = require('gulp-filter'),
    less            = require('gulp-less'),
    path            = require('path');

// Specifiy the paths that will be used throughout the gulpfile

var destination = 'public/build',
 paths = {
 html: '',
 imagesSource : 'assets/images/',
 cssSource : 'assets/css/vendor/',
 sassSource : 'assets/sass/',
 sassDestination : destination+'/css',
 cssDestination : destination+'css/',
 jsSource : 'assets/js/',
 jsDestination : destination+'/js/'
 };

// Sprites like a pro
gulp.task('svg-sprite', function(){
 // More complex configuration example
 var config = {
 shape : {
 dimension : { // Set maximum dimensions
 maxWidth : 32,
 maxHeight : 32
 },
 spacing : { // Add padding
 padding : 60
 },
 dest : 'out/intermediate-svg' // Keep the intermediate files
 },
 mode : {
 view : { // Activate the «view» mode
 bust : false,
 render : {
 scss : true // Activate Sass output (with default options)
 }
 },
 symbol : true // Activate the «symbol» mode
 }
 };


 gulp.src('**/*.svg', {cwd: paths.imagesSource+'/sprite/svg/'})
 .pipe(svgSprite(config))
 .pipe(gulp.dest(paths.sassDestination+'/svg-sprite'));
});

gulp.task('sprite', function () {
 var spriteData = gulp.src(paths.imagesSource+'/sprite/resized/*.png').pipe(spritesmith({
 imgName: 'sprite-icons.png',
 cssName: 'sprite.css',
 padding : 4,
 algorithm: 'top-down',
 sprites : {
 "name": "sprite2",
 "x": 10,
 "y": 20,
 "width": 20,
 "height": 30,
 "total_width": 80,
 "total_height": 100,
 "offset_x": -10,
 "offset_y": -20,
 "px": {
 "x": "10px",
 "y": "20px",
 "width": "20px",
 "height": "30px",
 "total_width": "80px",
 "total_height": "100px",
 "offset_x": "-10px",
 "offset_y": "-20px"
 }
 }

 }));
 return spriteData.pipe(gulp.dest(paths.sassDestination));
});


gulp.task('styles', function() {
 return gulp.src([
 // Any static css files that never change such as vendor stylesheets 
 ])
 .pipe(sourcemaps.init())
 .pipe(postcss([
 lost(),
 autoprefixer()
 ]))
 .pipe(concat("styles/bundle.css"))
 .pipe(sourcemaps.write('./'))
 .pipe(gulp.dest(paths.cssDestination)).pipe(livereload());
});


gulp.task('sass', function () {
 gulp.src(paths.sassSource + '**/*.scss')
 .pipe(sourcemaps.init())
 .pipe(sass().on('error', sass.logError))
 .pipe(postcss([
 lost(),
 autoprefixer() // Auto support to legacy browsers could be specified here
 ]))
 .pipe(sourcemaps.write('./'))
 .pipe(gulp.dest(paths.sassDestination)).pipe(livereload());
});


gulp.task('scripts', function() {
 return gulp.src([
 // All the different libraries, components that needs to be compiled can go here
 paths.jsSource + 'app.js',
 ])
 .pipe(minify)
 .pipe(uglify())
 .pipe(concat('all.js'))
 .pipe(gulp.dest(paths.jsDestination)).pipe(livereload());
});

gulp.task('copy', function(){
 // All copy tasks which copies files from one directory to another on the fly
 return gulp.src(paths.sassSource + '**/*.scss')
 .pipe($.copy(outputPath));
});




gulp.task('watch', function(){
 livereload.listen();
 gulp.watch(paths.html + '*.html', []);
 gulp.watch(paths.sassSource + '**/*.scss', ['sass']);
 gulp.watch(paths.cssSource + '**/*.css', ['styles']);
 gulp.watch(paths.jsSource + '**/*.js', ['scripts']);
});

gulp.task('default', ['sass', 'scripts', 'styles']);