const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");

module.exports = (env, argv) => {
  const isProd = argv.mode === "production";

  return {
    entry: {
      sheet: "./fabula-ultima-sheet.js",
      // Imports the shared CSS so HtmlWebpackPlugin can inject it into the book page
      book: "./book.js",
    },
    output: {
      filename: isProd ? "[name].[contenthash].js" : "[name].js",
      path: path.resolve(__dirname, "dist"),
      clean: true,
      // Disable IIFE wrapping so onclick= handlers can reach global functions
      iife: false,
    },
    module: {
      rules: [
        {
          test: /\.css$/,
          use: [
            isProd ? MiniCssExtractPlugin.loader : "style-loader",
            "css-loader",
          ],
        },
      ],
    },
    plugins: [
      ...(isProd
        ? [new MiniCssExtractPlugin({ filename: "[name].[contenthash].css" })]
        : []),
      new HtmlWebpackPlugin({
        template: "./fabula-ultima-sheet.html",
        filename: "index.html",
        chunks: ["sheet"],
        scriptLoading: "blocking",
      }),
      new HtmlWebpackPlugin({
        template: "./books/core/index.html",
        filename: "books/core/index.html",
        chunks: ["book"],
        scriptLoading: "blocking",
      }),
      new HtmlWebpackPlugin({
        template: "./books/natural-fantasy-atlas/index.html",
        filename: "books/natural-fantasy-atlas/index.html",
        chunks: ["book"],
        scriptLoading: "blocking",
      }),
      // Copy book pages to dist/books/ (excluding index.html, managed by HtmlWebpackPlugin)
      new CopyWebpackPlugin({
        patterns: [
          {
            from: "books",
            to: "books",
            globOptions: { ignore: ["**/index.html"] },
          },
        ],
      }),
      // Copy static CSS
      new CopyWebpackPlugin({
        patterns: [
          {
            from: "css",
            to: "css",
            globOptions: { ignore: ["**/index.html"] },
          },
        ],
      }),
    ],
    optimization: {
      minimizer: ["...", new CssMinimizerPlugin()],
      splitChunks: {
        cacheGroups: {
          // Merge CSS from all entries into a single shared file
          styles: {
            name: "styles",
            type: "css/mini-extract",
            chunks: "all",
            enforce: true,
          },
        },
      },
    },
    devServer: {
      static: [
        { directory: path.resolve(__dirname, "dist") },
        // Serve raw html/ pages at /book in dev so they don't need to be copied
        { directory: path.resolve(__dirname, "books"), publicPath: "/books" },
        { directory: path.resolve(__dirname, "css"), publicPath: "/css" },
      ],
      port: 8080,
      open: true,
      historyApiFallback: {
        rewrites: [
          // /book (no trailing slash) → /book/index.html
          { from: /^\/book$/, to: "/book/index.html" },
        ],
      },
    },
  };
};