const path = require('path');

// Webpack and third party plugins.
const webpack = require('webpack');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ManifestRevisionPlugin = require('manifest-revision-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

// Environment detection.
const node_env = process.env.NODE_ENV || 'development';

// Global server name
const SERVER_NAME = process.env.SERVER_NAME || 'localhost:8000';
const URL_SCHEME = process.env.URL_SCHEME || 'http';
/*
 Configuration settings
 ------------------------------------------------------------------------------
 */

// Where is your project located relative to this config?
const context = path.join(__dirname, '..');

// Where are your source assets located?
const rootAssetPath = './buyercall/assets';
const contextRoot = path.join(context, rootAssetPath);

// Which human languages do you want to support? (regex)
const languages = /en|es/;

// Where will the files get built to?
// var buildOutputPath = './build/public';
const buildOutputPath = path.join(context, './build/public');

// How should certain asset types be configured?
const assets = {
    fonts: {
        path: 'fonts',
        filename: '[path][name].[hash].[ext]'
    },
    images: {
        path: 'images',
        filename: '[path][name].[hash].[ext]'
    },
    images_theme: {
        path: 'images/theme',
        filename: '[path][name].[ext]'
    },
    scripts: {
        path: 'scripts',
        filename: '[name].[chunkhash].js',
        chunkFilename: '[id].[chunkhash].js'
    },
    components: {
        path: 'components',
        filename: '[name].[chunkhash].[ext]',
        chunkFilename: '[id].[chunkhash].[ext]'
    },
    styles: {
        path: 'styles',
        filename: '[name].[chunkhash].css',
        chunkFilename: '[id].[chunkhash].css'
    }
};

// Which top level JS and CSS files should get output?
const chunks = {
    app_js: [
        path.join(contextRoot, assets.scripts.path, 'entry.js')
    ],
    app_css: [
        path.join(contextRoot, assets.styles.path, 'default.scss')
    ],
    frontend_js: [
        path.join(contextRoot, assets.scripts.path, 'frontend.js')
    ],
    backend_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js')
    ],
    widgets_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.components.path, 'widgets.js')
    ],
    widgets_css: [
        path.join(contextRoot, assets.styles.path, 'widgets.scss')
    ],
    outbound_backend_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'outbound_backend_js.js'),
    ],
    inbound_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.components.path, 'inbound/inbound.js')
    ],
    call_widget_js: [
        path.join(contextRoot, assets.components.path, 'widgets/call_widget.js')
    ],
    agents_dashboard_js: [
        path.join(contextRoot, assets.components.path, 'agents/agents_dashboard.js')
    ],
    leads_dashboard_js: [
        path.join(contextRoot, assets.components.path, 'leads/leads_dashboard.js')
    ],
    sms_dashboard_js: [
        path.join(contextRoot, assets.components.path, 'sms/sms_dashboard.js'),
        path.join(contextRoot, assets.components.path, 'lead-sms.js')
    ],
    contacts_dashboard_js: [
        path.join(contextRoot, assets.components.path, 'contacts/contacts_dashboard.js'),
        path.join(contextRoot, assets.components.path, 'lead-sms.js')
    ],
    contacts_edit_js: [
        path.join(contextRoot, assets.components.path, 'contacts/contacts_edit.js'),
        path.join(contextRoot, assets.components.path, 'lead-sms.js')
    ],
    leads_backend_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'index.js'),
        path.join(contextRoot, assets.scripts.path, 'tables.js')
    ],
    agent_form_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'agent_form.js'),
    ],
    group_form_js: [
        path.join(contextRoot, assets.scripts.path, 'group_form.js'),
    ],
    forms_backend_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'forms_backend.js')
    ],
    forms_backend_edit_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'forms_backend_edit.js')
    ],
    form_leads_backend_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'form_leads_backend.js')
    ],
    form_leads_backend_new_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js')
    ],    
    form_leads_backend_edit_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.scripts.path, 'form_leads_backend_edit.js')
    ],
    partnership_new_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.components.path, 'sysadmin/partnership_new.js')
    ],
    account_edit_js: [
        path.join(contextRoot, assets.scripts.path, 'backend.js'),
        path.join(contextRoot, assets.components.path, 'partnership/account_edit.js')
    ],
    vendor_js: [
        'bootstrap',
        'moment',
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery-ui.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'material.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'perfect-scrollbar.jquery.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'chartist.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery.bootstrap-wizard.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'gsdk-bootstrap-wizard.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery.select-bootstrap.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'bootstrap-notify.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'bootstrap-colorpicker.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'bootstrap-datetimepicker.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'fullcalendar.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jasny-bootstrap.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery-jvectormap.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery.tagsinput.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'jquery.auto-complete.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'sweetalert2.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'nouislider.min.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'material-dashboard.js'),
        path.join(contextRoot, assets.scripts.path, 'vendor', 'player.min.js'),
    ],
    vendor_css: [
        // Bootstrap configuration settings:
        // https://gist.github.com/anonymous/ef4593b01915d647ed88
        // http://getbootstrap.com/customize/?id=ef4593b01915d647ed88
        path.join(contextRoot, assets.styles.path, 'vendor', 'bootstrap.3.3.5.min.css'),
        path.join(contextRoot, assets.styles.path, 'vendor', 'font-awesome.4.3.0.css'),
        path.join(contextRoot, assets.styles.path, 'vendor', 'material-dashboard.scss'),
        path.join(contextRoot, assets.styles.path, 'vendor', 'jquery.auto-complete.css'),
        path.join(contextRoot, assets.styles.path, 'vendor', 'progres-bar.css'),
    ],
    contact_lead_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'contact_leads.js'),
    ],
    contact_note_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'contact_note.js'),
    ],
    contact_detail_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'contact_detail.js'),
    ],
    contact_timeline_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'contact_timeline.js'),
    ],
    add_contact_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'add_contact.js'),
    ],
    voicemail_js : [
        path.join(contextRoot, assets.scripts.path, 'mobile', 'mediaelement-and-player.min.js'),
        path.join(contextRoot, assets.scripts.path, 'mobile', 'voicemail.js'),
    ],
    mobile_js : [
        'popper.js',
        'jquery-mask-plugin',
        path.join(contextRoot, assets.scripts.path, 'mobile', 'bootstrap-datepicker.js'),
        path.join(contextRoot, assets.scripts.path, 'mobile', 'bootstrap.min.js'),
        path.join(contextRoot, assets.scripts.path, 'mobile', 'mobile.js'),
    ],
    mobile_css : [
        path.join(contextRoot, assets.styles.path, 'mobile', 'datepicker.css'),
        path.join(contextRoot, assets.styles.path, 'mobile', 'bootstrap.min.css'),
        path.join(contextRoot, assets.styles.path, 'mobile', 'mediaelementplayer.css'),
        path.join(contextRoot, assets.styles.path, 'mobile', 'mobile.css'),
    ],
};

// Avoid parsing this code to speed up rebuilds.
/*var noParse = [
    path.join(contextRoot, assets.scripts.path, 'vendor'),
    path.join(contextRoot, assets.styles.path, 'vendor')
];*/
const noParse = /(scripts\/vendor)/;
// const noParse = /(scripts\/vendor)|(styles\/vendor)/;

// Where will assets get served in development mode? This depends on running
// the webpack dev server.
const publicPath = process.env.PUBLIC_PATH || 'http://localhost:2992/assets/';

/*
 Do not edit past this line unless you are tinkering with webpack.
 ------------------------------------------------------------------------------
 */

const optimization = {};

// Plugins that will load in all environments.
const plugins = [

    new MiniCssExtractPlugin(
        {
            filename: assets.styles.filename,
            chunkFilename: assets.styles.chunkFilename
        }
    ),

    // http://webpack.github.io/docs/list-of-plugins.html#contextreplacementplugin
    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, languages)
];

// Development environment only plugins.
if (node_env !== 'development') {
    // plugins.push(developmentPlugins[0]);
    optimization.minimizer = [
        new UglifyJsPlugin({
            uglifyOptions: {
                warnings: false
            },
        }),
    ];
}

// The location of manifest.json to be used by flask-webpack
// See https://github.com/nickjj/manifest-revision-webpack-plugin
const manifestPath = path.join('build', 'manifest.json');
// Preserve manifest between ManifestRevisionPlugin.format calls
const manifest = {};
/*
 * Builds manifest.json for use from flask-webpack. See
 * https://github.com/nickjj/manifest-revision-webpack-plugin
 */
const manifestRevisionPlugin = new ManifestRevisionPlugin(manifestPath, {
    rootAssetPath: rootAssetPath,
    ignorePaths: ['/fonts', '/styles', '/scripts'],
    extensionsRegex: /\.(jpe?g|png|gif|svg([\?]?.*))$/i,
    format: function (data, assets) {
        // Since the result of this function will replace the existing
        // manifest.json, we need to read the file and extend it with
        // new data.
        const output = {
            publicPath: data.publicPath,
            assets: manifest
        };
        for (let key in assets) {
            output.assets[key] = assets[key];
        }

        for (let chunk in data.assetsByChunkName) {
            let chunkValue = data.assetsByChunkName[chunk];
            if (typeof chunkValue == 'string') {
                chunkValue = [chunkValue];
            }

            for (let i = 0; i < chunkValue.length; i++) {
                const chunkWithExtension = chunk + '.' + chunkValue[i].split('.').slice(-1)[0];
                output.assets[chunkWithExtension] = chunkValue[i];
            }
        }

        return output;
    }
});

// Define global replace strings
const definePlugin = new webpack.DefinePlugin({
    SERVER_NAME: JSON.stringify(SERVER_NAME),
    URL_SCHEME: JSON.stringify(URL_SCHEME)
});

/*optimization.splitChunks = {
    cacheGroups: {
        commons: {
            test: /[\\/]node_modules[\\/]/,
            name: 'vendor_js',
            filename: 'vendor_js.js',
            chunks: 'all',
        }
    }
};*/

// JS files and templates used in the web site itself
const resources = [
    {
        mode: node_env,
        target: 'web',
        context: path.join(__dirname, '../'),
        entry: chunks,
        output: {
            path: buildOutputPath,
            publicPath: publicPath,
            filename: assets.scripts.filename,
            chunkFilename: assets.scripts.chunkFilename
        },
        externals: {
            'jquery': 'jQuery'
        },
        resolve: {
            // Allow requiring files without supplying the extension.
            extensions: ['.json', '.js', '.min.js', '.scss'],
            modules: [
                path.join(contextRoot, assets.scripts.path, 'vendor'),
                'node_modules'
            ]
        },
        optimization,
        module: {
            // noParse: noParse,
            rules: [
                {
                    test: /\.js$/i,
                    exclude: /node_modules/,
                    use: [
                        {
                            loader: 'babel-loader',
                            options: {
                                presets: ["@babel/preset-env"]
                            }
                        }
                    ]
                },
                {
                    test: /\.s?css$/i,
                    use: [
                        'style-loader',
                        {
                            loader: MiniCssExtractPlugin.loader,
                            options: {
                                hmr: node_env === 'development',
                            },
                        },
                        'css-loader',
                        {
                            loader: 'postcss-loader',
                            options: {
                                config: {
                                    path: './config/'
                                }
                            }
                        },
                        {
                            loader: 'sass-loader',
                            options: {
                                sassOptions: {
                                    includePaths: [path.join(contextRoot, assets.styles.path)],
                                },
                            },
                        },
                    ],
                },
                {
                    test: /\.(jpe?g|png|gif|svg([\?]?.*))$/i,
                    use: [
                        {
                            loader: 'file-loader',
                            options: {
                                context: rootAssetPath,
                                name: assets.images.filename
                            }
                        },
                        {
                            loader: 'image-webpack-loader',
                            options: {
                                // bypassOnDebug: true,
                                disable: true,
                            },
                        }
                    ]
                },
                {
                    test: /\.(woff([\?]?.*)|woff2([\?]?.*))$/i,
                    use: [
                        {
                            loader: 'url-loader',
                            options: {
                                limit: 100000,
                            },
                        },
                    ],
                },
                {
                    test: /\.(ttf([\?]?.*)|eot([\?]?.*))$/i,
                    use: [
                        {
                            loader: 'file-loader',
                            options: {
                                context: rootAssetPath,
                                name: assets.fonts.filename
                            }
                        },
                    ]
                },
                {
                    test: /\.tpl$/,
                    use: ['underscore-template-loader']
                },
                {
                    test: /\.po$/,
                    use: [
                        'json-loader',
                        'po-loader'
                    ]
                },
            ]
        },
        plugins: plugins.concat([
            manifestRevisionPlugin,

            definePlugin,

            new webpack.ProvidePlugin({
                '__': 'localize',
                '_': 'underscore',
                'html': 'html_utils',
            })
        ]),
        devServer: {
            watchOptions: {
                aggregateTimeout: 300,
                poll: 1000
            },
            headers: {
                "Cache-Control": "public; max-age=43200"
            }
        },
        //devtool: 'source-map'
    }
];


// Externally-loaded call widget script
resources.push({
    mode: node_env,
    target: 'web',
    context: path.join(__dirname, '../'),
    entry: {
        call_widget_external: [
            path.join(contextRoot, assets.components.path, 'widgets/call_widget.js')
        ],
    },
    output: {
        path: buildOutputPath,
        publicPath: publicPath,
        filename: '[name].js',
        chunkFilename: '[id].js'
    },
    resolve: {
        // Allow requiring files without supplying the extension.
        extensions: ['.json', '.js', '.min.js', '.scss'],
        modules: [
            path.join(contextRoot, assets.scripts.path, 'vendor'),
            'node_modules'
        ]
    },
    module: {
        // noParse: noParse,
        rules: [
            {
                test: /\.js$/i,
                exclude: /node_modules/,
                use: [
                    {
                        loader: 'babel-loader',
                        options: {
                            presets: ["@babel/preset-env"]
                        }
                    }
                ]
            },
            {
                test: /\.s?css$/i,
                use: [
                    'style-loader',
                    'css-loader',
                    {
                        loader: 'postcss-loader',
                        options: {
                            config: {
                                path: './config/'
                            }
                        }
                    },
                    {
                        loader: 'sass-loader',
                        options: {
                            sassOptions: {
                                includePaths: [path.join(contextRoot, assets.styles.path)],
                            },
                        },
                    },
                ],
            },
            {
                test: /\.(jpe?g|png|gif|svg([\?]?.*))$/i,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            context: rootAssetPath,
                            name: assets.images.filename
                        }
                    },
                    {
                        loader: 'image-webpack-loader',
                        options: {
                            // bypassOnDebug: true,
                            disable: true,
                        },
                    }
                ]
            },
            {
                test: /\.(woff([\?]?.*)|woff2([\?]?.*))$/i,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 100000,
                        },
                    },
                ],
            },
            {
                test: /\.(ttf([\?]?.*)|eot([\?]?.*))$/i,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            context: rootAssetPath,
                            name: assets.fonts.filename
                        }
                    },
                ]
            },
            {
                test: /\.tpl$/,
                use: ['underscore-template-loader']
            },
            {
                test: /\.po$/,
                use: [
                    'json-loader',
                    'po-loader'
                ]
            },
        ]
    },
    plugins: [
        manifestRevisionPlugin,

        definePlugin,

        new webpack.ProvidePlugin({
            '_': 'underscore',
            '$': 'jquery',
            'jQuery': 'jquery'
        })
    ],
    devServer: {
        watchOptions: {
            aggregateTimeout: 300,
            poll: 1000
        }
    }
});

module.exports = resources;