const {
    src,
    dest,
    series,
    parallel
} = require("gulp");
const concat = require("gulp-concat");
const sass = require("gulp-sass");
const webpack = require("webpack-stream");
const rev = require("gulp-rev");
const del = require("del");
const revCollector = require("gulp-rev-collector");


function compileHTML() {
    return src("src/views/**/*.html")
        .pipe(dest("dist/views/"));
}

function compileIndexCSS() {
    return src(["src/styles/index/*.scss", "src/styles/reset.scss"])
        .pipe(sass().on('error', sass.logError))
        .pipe(concat("index.min.css"))
        .pipe(rev())
        .pipe(dest("dist/styles/"))
        .pipe(rev.manifest("css-manifest.json"))
        .pipe(dest("./rev/"));
}

function compileDetailCSS() {
    return src(["src/styles/detail/*.scss", "src/styles/reset.scss"])
        .pipe(sass().on('error', sass.logError))
        .pipe(concat("detail.min.css"))
        .pipe(rev())
        .pipe(dest("dist/styles/"))
        .pipe(rev.manifest("css-manifest.json"))
        .pipe(dest("./rev/"));
}

function compileJS() {
    return webpack({
            mode: "development",
            // entry: "./src/scripts/app.js",
            entry: {
                "app": "./src/scripts/app.js",
                "detail": "./src/scripts/detail.js"
            },
            devtool: "source-map",
            output: {
                filename: "[name].min.js",
            },
            module: {
                rules: [{
                        test: /\.m?js$/,
                        exclude: /(node_modules|bower_components)/,
                        use: {
                            loader: 'babel-loader',
                            options: {
                                presets: ['@babel/preset-env'],
                                plugins: ['@babel/plugin-transform-runtime']
                            }
                        }
                    },
                    {
                        test: /\.html$/,
                        loader: "string-loader"
                    }
                ]
            }
        })
        .pipe(rev())
        .pipe(dest("dist/scripts/"))
        .pipe(rev.manifest("js-manifest.json"))
        .pipe(dest("./rev/"));
}

function copyStatic() {
    return src("src/static/**/*.*")
        .pipe(dest("dist/static/"));
}

function revCollect() {
    return src(['rev/**/*.json', './dist/**/*.html'])
        .pipe(revCollector({
            replaceReved: true,
            dirReplacements: {
                './styles/': './styles/',
                './scripts/': './scripts/',
                // 'cdn/': function (manifest_value) {
                //     return '//cdn' + (Math.floor(Math.random() * 9) + 1) + '.' + 'exsample.dot' + '/img/' + manifest_value;
                // }
            }
        }))
        .pipe(dest('./dist/'));
}

function clean(path) {
    return function () {
        return del(path);
    }
}

exports.default = series(clean("./dist"), parallel(compileHTML, compileIndexCSS, compileDetailCSS, compileJS, copyStatic),revCollect);