const head = require('lodash/head')
const tail = require('lodash/tail')
const path = require('path')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const cssnano = require('cssnano')
const debug = require('debug')
const config = require('./config')

debug.enable('app:*')

const log = debug('app:webpack')

// Environment
const NODE_ENV = process.env.NODE_ENV || 'development'
const DEVELOPMENT = NODE_ENV === 'development'
const TESTING = NODE_ENV === 'test'
const PRODUCTION = NODE_ENV === 'production'
const __DEBUG__ = DEVELOPMENT


// Webpack configuration
log('Creating webpack configuration...')
const webpackconfig = {
  devtool: config.webpack.devtool,
  resolve: {
    root: config.paths.app,
    extensions: ['', '.js', '.jsx', '.scss', '.css'],
  },

  entry: {
    app: [config.paths.entryFile],
    vendor: config.webpack.vendor,
  },

  output: {
    filename: `[name].[${config.compiler.hash_type}].js`,
    path: config.paths.dist,
    publicPath: config.webpack.output.publicPath,
  },

  plugins: [
    new webpack.DefinePlugin({ DEVELOPMENT, PRODUCTION, __DEBUG__ }),
    new webpack.optimize.OccurrenceOrderPlugin(),
    new HtmlWebpackPlugin({
      template: path.resolve(config.paths.app, 'index.html'),
      hash: true,
      favicon: path.resolve(config.paths.static, 'favicon.png'),
      filename: 'index.html',
      inject: 'body',
      minify: {
        collapseWhitespace: true,
      },
    }),
  ],

  module: {
    loaders: [
      {
        test: /\.jsx?/,
        loaders: ['babel-loader'],
        include: config.paths.app,
      },
      {
        test: /\.json$/,
        loader: 'json',
      },
      // Any .scss file in ./src/... *except* those in ./src/styles/
      // are local css modules. the class names and ids will be changed to:
      // [name]-[local]-[hash:base64:5]
      // include: /src\/(?!styles).+/,
      {
        test: /(\.scss|\.css)$/,
        exclude: /src\/styles/,
        loaders: [
          'style',
          'css?modules&sourceMap&importLoaders=1&localIdentName=[name]-[local]-[hash:base64:5]',
          'postcss',
          'sass',
          'toolbox',
        ],
      },
      // Any .scss files in ./src/styles are treated as normal (not local)
      // sass files, and so class names and ids will remain as specified
      {
        test: /(\.scss|\.css)$/,
        include: /src\/styles/,
        loader: 'style!css?sourceMap!postcss!sass',
      },
      // File loaders
      /* eslint-disable */
      { test: /\.woff(\?.*)?$/,  loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/font-woff' },
      { test: /\.woff2(\?.*)?$/, loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/font-woff2' },
      { test: /\.ttf(\?.*)?$/,   loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/octet-stream' },
      { test: /\.eot(\?.*)?$/,   loader: 'file?prefix=fonts/&name=[path][name].[ext]' },
      { test: /\.svg(\?.*)?$/,   loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=image/svg+xml' },
      { test: /\.(png|jpg)$/,    loader: 'url?limit=8192' },
      /* eslint-enable */
    ],
  },

  postcss: [
    cssnano({
      sourcemap: true,
      autoprefixer: {
        add: true,
        remove: true,
        browsers: ['last 2 versions'],
      },
      safe: true,
      discardComments: {
        removeAll: true,
      },
    }),
  ],

  sassLoader: {
    includePaths: config.paths.styles,
  },

  eslint: {
    configFile: path.resolve(config.paths.root, '.eslintrc'),
  },

  toolbox: {
    theme: './src/styles/react-toolbox-theme.scss',
  },

}

if (!TESTING) {
  webpackconfig.plugins.push(new webpack.optimize.CommonsChunkPlugin({
    names: ['vendor'],
  }))
}

if (DEVELOPMENT) {
  log('Extending webpack configuration with development settings.')

  log('Adding HMR entry points')
  webpackconfig.entry.app.push('webpack-hot-middleware/client')

  log('Enable development plugins (HMR, NoErrors)')
  webpackconfig.plugins.push(
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  )
}


if (PRODUCTION) {
  log('Extending webpack configuration with production settings.')

  log('Adding eslint preloader')
  webpackconfig.preLoaders = [
    {
      test: /\.jsx?/,
      loader: 'eslint-loader',
      exclude: /node_modules/,
    },
  ]

  log('Add uglify and dedupe plugins')
  webpackconfig.plugins.push(
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        unused: true,
        dead_code: true,
      },
    }),
    new webpack.optimize.DedupePlugin()
  )

  log('Apply ExtractTextPlugin to CSS loaders.')
  webpackconfig.module.loaders.filter(loader =>
    loader.loaders && loader.loaders.find(name => /css/.test(name.split('?')[0]))
  ).forEach(loader => {
    /* eslint-disable */
    const first = head(loader.loaders);
    const rest = tail(loader.loaders);
    loader.loader = ExtractTextPlugin.extract(first, rest.join('!'));
    delete loader.loaders;
    /* eslint-enable */
  })
  webpackconfig.plugins.push(
    new ExtractTextPlugin('[name].[contenthash].css', {
      allChunks: true,
    })
  )
}

module.exports = webpackconfig
