Skip to content

Commit eff65fd

Browse files
committed
修正
1 parent 3f701a3 commit eff65fd

1 file changed

Lines changed: 17 additions & 121 deletions

File tree

WebSite/assets/js/layout.js

Lines changed: 17 additions & 121 deletions
Original file line numberDiff line numberDiff line change
@@ -2,32 +2,10 @@ document.addEventListener("DOMContentLoaded", () => {
22
const shell =
33
document.querySelector(".page-shell") || document.body;
44

5-
// 'WebSite' ディレクトリを基準とした相対パスを取得する
6-
const getCurrentRelativePath = () => {
7-
const pathname = location.pathname;
8-
let relativePath = pathname;
9-
10-
// パスから '/WebSite/' より前の部分を削除
11-
const webSiteIndex = pathname.indexOf("/WebSite/");
12-
if (webSiteIndex !== -1) {
13-
// '/WebSite/' の後の部分を取得 (例: en/blog/blog_00018.html)
14-
relativePath = pathname.substring(
15-
webSiteIndex + "/WebSite/".length,
16-
);
17-
} else if (pathname.startsWith("/")) {
18-
// 'WebSite' がない場合は、先頭の '/' を削除
19-
relativePath = pathname.substring(1);
20-
}
21-
22-
// パスが空またはディレクトリの場合は 'index.html' (ルートページと仮定)
23-
if (relativePath === "" || relativePath.endsWith("/")) {
24-
relativePath += "index.html";
25-
}
26-
27-
return relativePath; // 例: index.html, blog/blog_00001.html, en/blog/blog_00001.html
28-
};
29-
30-
const currentPath = getCurrentRelativePath();
5+
const currentPath = (() => {
6+
const name = location.pathname.split("/").pop();
7+
return name && name.length > 0 ? name : "index.html";
8+
})();
319

3210
// layout.js の読み込みパスから相対パスを特定する
3311
const getPartialsPath = () => {
@@ -61,117 +39,35 @@ document.addEventListener("DOMContentLoaded", () => {
6139
])
6240
.then(([headerHtml, footerHtml]) => {
6341
shell.insertAdjacentHTML("afterbegin", headerHtml);
64-
// 修正: shell の直後にフッターを挿入(shell自体が body の場合、body の末尾になる)
65-
shell.insertAdjacentHTML("beforeend", footerHtml);
66-
67-
// 現在のページの階層レベルを計算
68-
const pathSegments = location.pathname
69-
.split("/")
70-
.filter((segment) => segment.length > 0);
71-
let depth = 0;
72-
const webSiteIndex = pathSegments.indexOf("WebSite");
42+
shell.insertAdjacentHTML("afterend", footerHtml);
7343

74-
if (webSiteIndex !== -1) {
75-
// 'WebSite' ディレクトリを基準として、それより下の階層数を計算
76-
// depthはWebSite以下のセグメント数から1(ファイル名)を引いたもの
77-
depth = pathSegments.length - (webSiteIndex + 1);
78-
// 例: /WebSite/a/b/c.html -> depth = 3
44+
// 言語切り替え
45+
const langSwitch =
46+
document.querySelector(".lang-switch");
47+
if (langSwitch) {
48+
const isEn = document.documentElement.lang === "en";
49+
const search = window.location.search || "";
50+
const targetUrl = isEn
51+
? `../${currentPath}${search}`
52+
: `en/${currentPath}${search}`;
53+
langSwitch.setAttribute("href", targetUrl);
7954
}
80-
// ... (WebSiteがない場合のロジックは前回と同様でOK) ...
8155

82-
// ベースURLのプレフィックスを生成 (例: "../../" for depth 2)
83-
const relativeRootPrefix = "../".repeat(depth);
84-
85-
// ナビゲーションリンクのパスを修正し、アクティブクラスを適用
8656
const navLinks =
8757
document.querySelectorAll(".site-nav a");
8858
navLinks.forEach((link) => {
89-
let originalHref = link.getAttribute("href");
90-
if (
91-
originalHref &&
92-
!originalHref.startsWith("http") &&
93-
!originalHref.startsWith("#")
94-
) {
95-
// 'WebSite/' からの相対パスを想定しているため、現在のページの深さに応じて調整
96-
const adjustedHref = `${relativeRootPrefix}${originalHref}`;
97-
link.setAttribute("href", adjustedHref);
98-
}
99-
10059
const target =
10160
link.getAttribute("data-nav") ||
10261
link.getAttribute("href") ||
10362
"";
10463

105-
// 修正: href がファイル名でない場合を考慮
106-
const targetFilename =
107-
target.split("/").pop().split(/[?#]/)[0] ||
108-
"index.html";
109-
const currentFilename =
110-
currentPath.split("/").pop().split(/[?#]/)[0] ||
111-
"index.html";
64+
const cleanTarget = target.split(/[?#]/)[0];
11265

113-
if (targetFilename === currentFilename) {
66+
if (cleanTarget === currentPath) {
11467
link.classList.add("active");
11568
}
11669
});
11770

118-
// 言語切り替え
119-
const langSwitch =
120-
document.querySelector(".lang-switch");
121-
if (langSwitch) {
122-
const isEn = document.documentElement.lang === "en";
123-
const search = window.location.search || "";
124-
125-
// 現在のURLパス (例: /WebSite/blog/en/blog_00018.html)
126-
const pathname = location.pathname;
127-
128-
// ファイル名のみを取得 (例: blog_00018.html)
129-
const currentFilename = getFilename(pathname);
130-
131-
let targetPath = currentFilename; // ターゲットの基本はファイル名
132-
133-
// 1. ターゲットとなるディレクトリ構造を決定
134-
if (pathname.includes("/blog/")) {
135-
// ブログページの場合
136-
if (isEn) {
137-
// 英語 -> 日本語へ切り替え: /WebSite/blog/ + ファイル名
138-
targetPath = `blog/${targetPath}`;
139-
} else {
140-
// 日本語 -> 英語へ切り替え: /WebSite/blog/en/ + ファイル名
141-
targetPath = `blog/en/${targetPath}`;
142-
}
143-
} else {
144-
// ブログ以外のページの場合 (index.htmlなど)
145-
if (isEn) {
146-
// 英語 -> 日本語へ切り替え: /WebSite/ + ファイル名
147-
// targetPathはそのまま
148-
} else {
149-
// 日本語 -> 英語へ切り替え: /WebSite/en/ + ファイル名
150-
targetPath = `en/${targetPath}`;
151-
}
152-
}
153-
154-
// 2. ターゲットURLを生成:
155-
// relativeRootPrefix: 現在のページから WebSite/ の直下にアクセスするための相対パス
156-
// targetPath: WebSite/ からのターゲット相対パス (例: blog/en/blog_00018.html)
157-
const targetUrl = `${relativeRootPrefix}${targetPath}${search}`;
158-
159-
// index.htmlの特殊処理: targetPathがindex.htmlでrelativeRootPrefixがない場合、ルートを指す
160-
if (
161-
targetPath === "index.html" &&
162-
relativeRootPrefix === ""
163-
) {
164-
targetUrl = `./${targetPath}${search}`;
165-
} else if (
166-
targetPath === "index.html" &&
167-
relativeRootPrefix.length > 0
168-
) {
169-
// blog/ から /index.html に戻る場合など
170-
targetUrl = `${relativeRootPrefix}${targetPath}${search}`;
171-
}
172-
173-
langSwitch.setAttribute("href", targetUrl);
174-
}
17571
const navToggle =
17672
document.querySelector(".nav-toggle");
17773
const siteNav = document.querySelector(".site-nav");

0 commit comments

Comments
 (0)