feat: add JP/EN language toggle and multi-language web build

- Add language toggle (日本語 / English) in sidebar
- Build both JP and EN web outputs into webroot/ja/ and webroot/en/
- Root index.html redirects to Japanese version
- Search index generated per language
- Add build-web.sh to orchestrate multi-language build
- Update npm web script and GitHub Actions workflow accordingly

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: piti6

.github/workflows/deploy-web.yml

@@ -39,11 +39,8 @@ jobs:
       - name: Install gem dependencies
         run: bundle install
 
-      - name: Build web pages
-        run: REVIEW_CONFIG_FILE=config-epub-jp.yml npx grunt web
-
-      - name: Build search index
-        run: node build-search-index.js
+      - name: Build web pages (JP + EN)
+        run: npm run web
 
       - name: Setup Pages
         uses: actions/configure-pages@v4

articles/layouts/layout-web.html.erb

@@ -28,6 +28,10 @@
 <% end %>
         <h1 class="side-title"><%=h @book.config.name_of("booktitle") %></h1>
       </div>
+      <div class="lang-toggle" id="lang-toggle">
+        <a href="#" class="lang-btn" data-lang="ja">日本語</a>
+        <a href="#" class="lang-btn" data-lang="en">English</a>
+      </div>
       <div class="search-box">
         <input type="text" id="search-input" placeholder="Search..." autocomplete="off" />
         <div id="search-results" class="search-results"></div>
@@ -200,6 +204,27 @@
     return snippet;
   }
 })();
+
+// --- Language Toggle ---
+(function() {
+  var path = location.pathname;
+  var langMatch = path.match(/\/(ja|en)\//);
+  var currentLang = langMatch ? langMatch[1] : 'ja';
+
+  // Highlight active language
+  document.querySelectorAll('.lang-btn').forEach(function(btn) {
+    var lang = btn.getAttribute('data-lang');
+    if (lang === currentLang) {
+      btn.classList.add('lang-active');
+    }
+    btn.addEventListener('click', function(e) {
+      e.preventDefault();
+      if (lang === currentLang) return;
+      var newPath = path.replace('/' + currentLang + '/', '/' + lang + '/');
+      location.href = newPath + location.hash;
+    });
+  });
+})();
 </script>
 </body>
 </html>

articles/style-web.css

@@ -60,6 +60,35 @@ nav.side-content {
   nav.side-content .review-signature a {
     color: #6b7280; }
 
+/* --- Language Toggle --- */
+.lang-toggle {
+  display: flex;
+  gap: 0;
+  margin-bottom: 12px;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  overflow: hidden; }
+
+.lang-btn {
+  flex: 1;
+  display: block;
+  padding: 6px 0;
+  text-align: center;
+  font-size: 0.78em;
+  font-weight: 500;
+  color: #6b7280;
+  text-decoration: none;
+  background: #fff;
+  transition: background 0.15s, color 0.15s; }
+.lang-btn:hover {
+  background: #f3f4f6;
+  text-decoration: none; }
+.lang-btn.lang-active {
+  background: #1f2937;
+  color: #fff; }
+.lang-btn + .lang-btn {
+  border-left: 1px solid #d1d5db; }
+
 /* --- Search --- */
 .search-box {
   position: relative;

build-search-index.js

@@ -1,12 +1,12 @@
 "use strict";
 
 // Generates search-index.json from webroot HTML files.
-// Run after review-webmaker: node build-search-index.js
+// Usage: node build-search-index.js [directory]
 
 const fs = require("fs");
 const path = require("path");
 
-const webroot = path.join(__dirname, "articles", "webroot");
+const webroot = process.argv[2] || path.join(__dirname, "articles", "webroot");
 const outFile = path.join(webroot, "search-index.json");
 
 const htmlFiles = fs.readdirSync(webroot).filter(f => f.endsWith(".html") && f !== "index.html" && f !== "titlepage.html");

build-web.sh

@@ -0,0 +1,38 @@
+#!/bin/bash
+set -e
+
+WEBROOT="articles/webroot"
+OUTDIR="articles/webroot-dist"
+
+rm -rf "$OUTDIR"
+mkdir -p "$OUTDIR/ja" "$OUTDIR/en"
+
+# Build Japanese
+echo "=== Building Japanese ==="
+REVIEW_CONFIG_FILE=config-epub-jp.yml npx grunt web
+cp -r "$WEBROOT/"* "$OUTDIR/ja/"
+
+# Build English
+echo "=== Building English ==="
+REVIEW_CONFIG_FILE=config-epub-en.yml npx grunt web
+cp -r "$WEBROOT/"* "$OUTDIR/en/"
+
+# Generate search indices
+echo "=== Building search indices ==="
+node build-search-index.js "$OUTDIR/ja"
+node build-search-index.js "$OUTDIR/en"
+
+# Create root redirect
+cat > "$OUTDIR/index.html" << 'REDIRECT'
+<!DOCTYPE html>
+<html>
+<head><meta http-equiv="refresh" content="0; url=ja/index.html" /></head>
+<body><a href="ja/index.html">日本語版へ / Go to Japanese version</a></body>
+</html>
+REDIRECT
+
+# Replace webroot with final output
+rm -rf "$WEBROOT"
+mv "$OUTDIR" "$WEBROOT"
+
+echo "=== Done: $WEBROOT/ja/ and $WEBROOT/en/ ==="

package.json

@@ -25,7 +25,7 @@
     "html": "grunt html",
     "text": "grunt text",
     "epub": "grunt epub",
-    "web": "grunt web && node build-search-index.js",
+    "web": "bash build-web.sh",
     "idgxml": "grunt idgxmlmaker",
     "vivliostyle": "grunt vivliostyle",
     "test": "npm run html"