594 lines
26 KiB
JavaScript
594 lines
26 KiB
JavaScript
"use strict";
|
|
|
|
function bindUI() {
|
|
renderToolPalette();
|
|
loadLogPushSettings();
|
|
syncLogPushControls();
|
|
syncAudioControls();
|
|
applyToolTips();
|
|
window.bindGroundUI?.(world);
|
|
renderEcologyCards();
|
|
window.TarinaiSaveSystem?.bindSaveSystem?.();
|
|
uiCache.toolButtons = Array.from(ui.toolPalette?.querySelectorAll(".tool") || []);
|
|
function isActiveToolMode() {
|
|
return Boolean(world?.tool && world.tool !== "observe");
|
|
}
|
|
function clickedInsideGameOrToolUi(target) {
|
|
return Boolean((canvas && canvas.contains?.(target)) || ui.toolPalette?.contains?.(target) || ui.panelQuickTabs?.contains?.(target) || ui.mobileModeControls?.contains?.(target) || ui.mobileRotateControls?.contains?.(target) || ui.backToGameBtn?.contains?.(target));
|
|
}
|
|
|
|
function panelSectionForTab(tab = "") {
|
|
if (tab === "game") return document.querySelector(".stage-wrap") || canvas;
|
|
if (tab === "selected") return ui.selectedCard;
|
|
if (tab === "tools") return ui.toolCard;
|
|
if (tab === "colony") return document.querySelector(".colony-card");
|
|
if (tab === "events") return document.querySelector(".log-card");
|
|
if (tab === "family") return document.querySelector(".lineage-main-card");
|
|
return null;
|
|
}
|
|
|
|
function setActivePanelTab(tab = "") {
|
|
for (const btn of ui.panelQuickTabs?.querySelectorAll("[data-panel-tab]") || []) {
|
|
btn.classList.toggle("active", btn.dataset.panelTab === tab);
|
|
}
|
|
}
|
|
|
|
function isTouchMobileLayout() {
|
|
return Boolean(window.TarinaiInputMode?.classification?.touchFirst || document.body.classList.contains("touch-mobile-ui") || window.innerWidth <= 980);
|
|
}
|
|
|
|
function isDesktopLayout() {
|
|
return window.matchMedia?.("(min-width: 981px)")?.matches ?? window.innerWidth >= 981;
|
|
}
|
|
|
|
function markCollapsibleCardState(card, collapsed, { user = false } = {}) {
|
|
if (!card) return;
|
|
card.classList.toggle("collapsed", Boolean(collapsed));
|
|
if (user) {
|
|
if (collapsed) card.dataset.userCollapsed = "1";
|
|
else delete card.dataset.userCollapsed;
|
|
}
|
|
const toggle = card.querySelector(".panel-card-toggle");
|
|
toggle?.setAttribute("aria-expanded", collapsed ? "false" : "true");
|
|
const state = toggle?.querySelector(".panel-card-state");
|
|
if (state) state.textContent = collapsed ? "展開" : "折り畳み";
|
|
}
|
|
|
|
function markToolCategoryState(category, collapsed, { user = false } = {}) {
|
|
if (!category) return;
|
|
category.classList.toggle("collapsed", Boolean(collapsed));
|
|
if (user) {
|
|
if (collapsed) category.dataset.userCollapsed = "1";
|
|
else delete category.dataset.userCollapsed;
|
|
}
|
|
category.querySelector(".tool-category-toggle")?.setAttribute("aria-expanded", collapsed ? "false" : "true");
|
|
}
|
|
|
|
function openAutoCollapsedSectionsForMobileScroll() {
|
|
// v39.15.47: 自動スクロールは折り畳み状態を一切変更しない。
|
|
return;
|
|
}
|
|
|
|
function scrollWindowToElement(target, offset = 0, behavior = "auto") {
|
|
if (!target) return;
|
|
const scroller = document.scrollingElement || document.documentElement;
|
|
const rect = target.getBoundingClientRect?.();
|
|
if (!rect) return;
|
|
const maxTop = Math.max(0, scroller.scrollHeight - window.innerHeight);
|
|
const top = Math.max(0, Math.min(window.scrollY + rect.top - offset, maxTop));
|
|
window.scrollTo({ top, behavior: "auto" });
|
|
}
|
|
|
|
function scrollPanelToTab(tab = "") {
|
|
const panel = ui.panel;
|
|
if (!panel) return false;
|
|
window.TarinaiTooltips?.hide?.();
|
|
if (tab === "selected" && (!world.selected || world.selected.dead || !world.tarinai.includes(world.selected))) {
|
|
selectTool("observe");
|
|
uiCache.showSelectedEmpty = true;
|
|
uiCache.selectedEmpty = false;
|
|
renderSelected();
|
|
showToast("たりないが未選択です。たりないデータを開ける状態にしました。");
|
|
}
|
|
const target = panelSectionForTab(tab);
|
|
if (!target) return false;
|
|
target.classList?.remove?.("hidden");
|
|
if (tab === "family") {
|
|
// 更新OFFでも、ユーザーが家系図へ移動した時だけ現在スナップショットを描画する。
|
|
window.resetArchiveRenderState?.();
|
|
renderArchive?.();
|
|
}
|
|
const isDesktop = window.matchMedia?.("(min-width: 981px)")?.matches ?? window.innerWidth >= 981;
|
|
if (isDesktop && tab !== "game" && tab !== "family") {
|
|
const tabsH = ui.panelQuickTabs?.offsetHeight || 0;
|
|
const top = Math.max(0, target.offsetTop - tabsH - 8);
|
|
panel.scrollTo({ top, behavior: "auto" });
|
|
} else {
|
|
// スマホはページ全体スクロール。目的地UIの上端を画面上端へ合わせる。
|
|
scrollWindowToElement(target, 0, "auto");
|
|
}
|
|
setActivePanelTab(tab);
|
|
return true;
|
|
}
|
|
|
|
window.scrollPanelToTab = scrollPanelToTab;
|
|
|
|
const activatePanelQuickTab = (e) => {
|
|
const btn = e.target.closest("[data-panel-tab]");
|
|
if (!btn) return;
|
|
const now = performance?.now?.() ?? Date.now();
|
|
if (now - Number(ui.panelQuickTabs?.dataset?.lastActivateAt || 0) < 50) return;
|
|
if (ui.panelQuickTabs) ui.panelQuickTabs.dataset.lastActivateAt = String(now);
|
|
e.preventDefault();
|
|
audio.uiClick?.();
|
|
scrollPanelToTab(btn.dataset.panelTab || "");
|
|
};
|
|
|
|
ui.panelQuickTabs?.addEventListener("click", activatePanelQuickTab);
|
|
ui.panelQuickTabs?.addEventListener("pointerup", activatePanelQuickTab, { passive: false });
|
|
ui.panelQuickTabs?.addEventListener("touchend", activatePanelQuickTab, { passive: false });
|
|
|
|
/* old quick-tab binding removed */
|
|
if (false) ui.panelQuickTabs?.addEventListener("click", (e) => {
|
|
const btn = e.target.closest("[data-panel-tab]");
|
|
if (!btn) return;
|
|
e.preventDefault();
|
|
audio.uiClick?.();
|
|
scrollPanelToTab(btn.dataset.panelTab || "");
|
|
});
|
|
|
|
ui.panel?.addEventListener("scroll", () => {
|
|
const panel = ui.panel;
|
|
if (!panel || !ui.panelQuickTabs) return;
|
|
const tabsH = ui.panelQuickTabs.offsetHeight || 0;
|
|
const entries = [
|
|
["game", document.querySelector(".stage-wrap") || canvas],
|
|
["selected", ui.selectedCard],
|
|
["tools", ui.toolCard],
|
|
["colony", document.querySelector(".colony-card")],
|
|
["events", document.querySelector(".log-card")],
|
|
["family", document.querySelector(".lineage-main-card")],
|
|
].filter(([, el]) => el && !el.classList.contains("hidden"));
|
|
let active = entries[0]?.[0] || "";
|
|
const y = panel.scrollTop + tabsH + 18;
|
|
for (const [key, el] of entries) {
|
|
if (el.offsetTop <= y) active = key;
|
|
}
|
|
setActivePanelTab(active);
|
|
}, { passive: true });
|
|
|
|
syncToolSizeBadges();
|
|
setActivePanelTab(ui.selectedCard?.classList.contains("hidden") ? "tools" : "selected");
|
|
|
|
function setCollapsibleCardState(card, collapsed) {
|
|
markCollapsibleCardState(card, collapsed);
|
|
}
|
|
|
|
function applyDesktopInitialPanelState() {
|
|
const touchFirst = Boolean(window.TarinaiInputMode?.classify?.().touchFirst || document.body.classList.contains("touch-mobile-ui"));
|
|
const desktop = !touchFirst && isDesktopLayout();
|
|
if (!desktop || uiCache.desktopInitialPanelStateApplied) return;
|
|
uiCache.desktopInitialPanelStateApplied = true;
|
|
for (const card of document.querySelectorAll(".collapsible-card")) markCollapsibleCardState(card, false);
|
|
for (const category of ui.toolPalette?.querySelectorAll(".tool-category") || []) markToolCategoryState(category, false);
|
|
}
|
|
|
|
function applyMobileInitialPanelState() {
|
|
const touchFirst = Boolean(window.TarinaiInputMode?.classify?.().touchFirst || document.body.classList.contains("touch-mobile-ui"));
|
|
if (!touchFirst || uiCache.mobileInitialPanelStateApplied) return;
|
|
uiCache.mobileInitialPanelStateApplied = true;
|
|
setCollapsibleCardState(document.querySelector(".colony-card"), true);
|
|
setCollapsibleCardState(document.querySelector(".log-card"), true);
|
|
for (const category of ui.toolPalette?.querySelectorAll(".tool-category") || []) {
|
|
const keepOpen = category.dataset.toolCategory === "operate";
|
|
markToolCategoryState(category, !keepOpen);
|
|
}
|
|
}
|
|
applyDesktopInitialPanelState();
|
|
applyMobileInitialPanelState();
|
|
window.addEventListener("resize", () => { applyDesktopInitialPanelState(); applyMobileInitialPanelState(); }, { passive: true });
|
|
|
|
function updateBackToGameButton() {
|
|
const btn = ui.backToGameBtn;
|
|
if (!btn) return;
|
|
const stage = document.querySelector(".stage-wrap");
|
|
const touchFirst = Boolean(window.TarinaiInputMode?.classification?.touchFirst || document.body.classList.contains("touch-mobile-ui") || window.innerWidth <= 980);
|
|
if (!touchFirst || !stage) { btn.hidden = true; return; }
|
|
const rect = stage.getBoundingClientRect();
|
|
const visible = rect.bottom > 42 && rect.top < Math.min(window.innerHeight * 0.72, window.innerHeight - 90);
|
|
btn.hidden = visible;
|
|
}
|
|
ui.backToGameBtn?.addEventListener("click", (e) => {
|
|
e.preventDefault();
|
|
audio.uiClick?.();
|
|
scrollPanelToTab("game");
|
|
});
|
|
window.addEventListener("scroll", updateBackToGameButton, { passive: true });
|
|
window.addEventListener("resize", updateBackToGameButton, { passive: true });
|
|
updateBackToGameButton();
|
|
|
|
window.TarinaiEvents?.on?.("selection:changed", () => {
|
|
if (world?._scrollSelectedDataTopOnNextSelection && isDesktopLayout() && world.selected && !world.selected.dead) {
|
|
world._scrollSelectedDataTopOnNextSelection = false;
|
|
window.setTimeout(() => {
|
|
renderSelected?.();
|
|
scrollPanelToTab("selected");
|
|
}, 40);
|
|
return;
|
|
}
|
|
world && (world._scrollSelectedDataTopOnNextSelection = false);
|
|
const touchFirst = Boolean(window.TarinaiInputMode?.classification?.touchFirst || document.body.classList.contains("touch-mobile-ui") || window.innerWidth <= 980);
|
|
const mode = window.TarinaiInputMode?.currentMode || uiCache.mobileInputMode || "auto";
|
|
if (!touchFirst || mode !== "auto" || world.tool !== "observe" || !world.selected || world.selected.dead) return;
|
|
window.setTimeout(() => {
|
|
renderSelected?.();
|
|
scrollPanelToTab("selected");
|
|
}, 40);
|
|
});
|
|
|
|
function activeRotatableToolType() {
|
|
const type = typeof toolItemType === "function" ? toolItemType(world?.tool || "") : "";
|
|
return type && typeof isRotatableItemType === "function" && isRotatableItemType(type) ? type : "";
|
|
}
|
|
|
|
function syncMobileRotateControls() {
|
|
const controls = ui.mobileRotateControls;
|
|
if (!controls) return;
|
|
const show = isTouchMobileLayout()
|
|
&& (window.TarinaiInputMode?.currentMode || uiCache.mobileInputMode || "auto") !== "camera"
|
|
&& Boolean(activeRotatableToolType());
|
|
controls.hidden = !show;
|
|
}
|
|
|
|
window.syncMobileRotateControls = syncMobileRotateControls;
|
|
|
|
function rotateMobileTool(direction = "right") {
|
|
const type = activeRotatableToolType();
|
|
if (!type || !world?.rotateToolAngle) return false;
|
|
const step = 45 * Math.PI / 180;
|
|
world.rotateToolAngle(type, direction === "left" ? -step : step);
|
|
audio.uiClick?.();
|
|
render();
|
|
syncMobileRotateControls();
|
|
return true;
|
|
}
|
|
|
|
ui.mobileRotateControls?.addEventListener("click", (e) => {
|
|
const btn = e.target.closest?.("[data-mobile-rotate]");
|
|
if (!btn) return;
|
|
e.preventDefault();
|
|
rotateMobileTool(btn.dataset.mobileRotate || "right");
|
|
});
|
|
window.TarinaiEvents?.on?.("tool:selected", syncMobileRotateControls);
|
|
window.addEventListener("resize", syncMobileRotateControls, { passive: true });
|
|
syncMobileRotateControls();
|
|
|
|
window.addEventListener("keydown", (e) => {
|
|
const tag = String(e.target?.tagName || "").toLowerCase();
|
|
if (tag === "input" || tag === "textarea" || e.target?.isContentEditable) return;
|
|
const type = activeRotatableToolType();
|
|
if (!type || !world?.rotateToolAngle) return;
|
|
const key = String(e.key || "").toLowerCase();
|
|
const step = (e.shiftKey ? 5 : 45) * Math.PI / 180;
|
|
if (key === "q" || key === "[") {
|
|
e.preventDefault();
|
|
world.rotateToolAngle(type, -step);
|
|
render();
|
|
syncMobileRotateControls();
|
|
} else if (key === "e" || key === "]") {
|
|
e.preventDefault();
|
|
world.rotateToolAngle(type, step);
|
|
render();
|
|
syncMobileRotateControls();
|
|
} else if (key === "r") {
|
|
e.preventDefault();
|
|
world.setToolAngle?.(type, typeof defaultItemAngle === "function" ? defaultItemAngle(type) : 0);
|
|
render();
|
|
syncMobileRotateControls();
|
|
}
|
|
});
|
|
|
|
for (const toggle of document.querySelectorAll(".panel-card-toggle")) {
|
|
toggle.addEventListener("click", () => {
|
|
const card = toggle.closest(".collapsible-card");
|
|
if (!card) return;
|
|
audio.uiFold?.();
|
|
const collapsed = !card.classList.contains("collapsed");
|
|
markCollapsibleCardState(card, collapsed, { user: true });
|
|
});
|
|
}
|
|
ui.colonyChartTabs?.addEventListener("click", (e) => {
|
|
const btn = e.target.closest("button[data-chart]");
|
|
if (!btn) return;
|
|
uiCache.chartMode = btn.dataset.chart || "population";
|
|
for (const b of ui.colonyChartTabs.querySelectorAll("button")) b.classList.toggle("active", b === btn);
|
|
uiCache.lastChartDraw = "";
|
|
uiCache.lastChartDrawAt = 0;
|
|
renderStats();
|
|
});
|
|
ui.logPushEnabled?.addEventListener("change", () => {
|
|
uiCache.logPushEnabled = Boolean(ui.logPushEnabled.checked);
|
|
audio.notify?.();
|
|
saveLogPushSettings();
|
|
showToast(uiCache.logPushEnabled ? "\u30ed\u30b0\u306e\u30d7\u30c3\u30b7\u30e5\u901a\u77e5\u3092ON\u306b\u3057\u307e\u3057\u305f\u3002" : "\u30ed\u30b0\u306e\u30d7\u30c3\u30b7\u30e5\u901a\u77e5\u3092OFF\u306b\u3057\u307e\u3057\u305f\u3002");
|
|
});
|
|
ui.logPushControls?.addEventListener("change", (e) => {
|
|
const input = e.target.closest("[data-push-kind]");
|
|
if (!input) return;
|
|
const kind = input.dataset.pushKind || "";
|
|
audio.uiClick?.();
|
|
if (input.checked) uiCache.logPushKinds.add(kind);
|
|
else uiCache.logPushKinds.delete(kind);
|
|
saveLogPushSettings();
|
|
});
|
|
ui.soundCategoryControls?.addEventListener("change", (e) => {
|
|
const input = e.target.closest("[data-sound-category]");
|
|
if (!input) return;
|
|
const category = input.dataset.soundCategory || "";
|
|
audio.setCategory?.(category, Boolean(input.checked));
|
|
if (audio.enabled && input.checked) audio.uiClick?.();
|
|
syncAudioControls();
|
|
showToast(`${audio.soundCategories?.[category] || category} ${input.checked ? "ON" : "OFF"}`);
|
|
});
|
|
ui.archiveContent?.addEventListener("scroll", scheduleArchiveWindowRender, { passive: true });
|
|
window.addEventListener("scroll", schedulePendingArchiveRender, { passive: true });
|
|
window.addEventListener("resize", schedulePendingArchiveRender, { passive: true });
|
|
const bindArchiveHorizontal = (root) => {
|
|
if (!root) return;
|
|
root.addEventListener("wheel", (e) => {
|
|
const scroller = e.target.closest(".lineage-family-tree, .lineage-main-content");
|
|
if (!scroller) return;
|
|
const canX = scroller.scrollWidth > scroller.clientWidth + 4;
|
|
if (!canX) return;
|
|
const dominant = Math.abs(e.deltaX) > Math.abs(e.deltaY) ? e.deltaX : (e.shiftKey ? e.deltaY : 0);
|
|
if (!dominant) return;
|
|
e.preventDefault();
|
|
scroller.scrollLeft += dominant;
|
|
}, { passive: false });
|
|
};
|
|
bindArchiveHorizontal(ui.archiveContent);
|
|
ui.archiveContent?.addEventListener("click", (e) => {
|
|
const node = e.target.closest("[data-family-tarinai-id]");
|
|
if (!node) return;
|
|
const id = node.getAttribute("data-family-tarinai-id");
|
|
const t = world.tarinai.find(x => (x.id === id || x.familyKey === id) && !x.dead);
|
|
if (!t) { showToast("\u305d\u306e\u500b\u4f53\u306f\u3082\u3046\u9078\u629e\u3067\u304d\u307e\u305b\u3093\u3002"); return; }
|
|
window.TarinaiCommands?.dispatch?.(world, { type: "selection.focus", target: t, options: { pulse: 1.15 } });
|
|
selectTool("observe");
|
|
renderStats();
|
|
showToast(`${t.name}\u3092\u9078\u629e\u3057\u307e\u3057\u305f\u3002`);
|
|
});
|
|
|
|
if (!uiCache.archiveAutoRefreshTimer && typeof window !== "undefined") {
|
|
uiCache.archiveAutoRefreshTimer = window.setInterval(() => {
|
|
if (!ui.archiveContent || !archiveAutoUpdateEnabled()) return;
|
|
scheduleArchiveWindowRender();
|
|
}, 5000);
|
|
}
|
|
|
|
ui.selectedInfo?.addEventListener("click", (e) => {
|
|
const categoryToggle = e.target.closest(".selected-category-toggle");
|
|
if (categoryToggle) {
|
|
const category = categoryToggle.closest(".selected-category");
|
|
const id = category?.dataset?.selectedCategory || "";
|
|
if (!category || !id) return;
|
|
if (!uiCache.selectedCollapsedCategories) uiCache.selectedCollapsedCategories = new Set();
|
|
audio.uiFold?.();
|
|
category.classList.toggle("collapsed");
|
|
const collapsed = category.classList.contains("collapsed");
|
|
if (collapsed) uiCache.selectedCollapsedCategories.add(id);
|
|
else uiCache.selectedCollapsedCategories.delete(id);
|
|
categoryToggle.setAttribute("aria-expanded", collapsed ? "false" : "true");
|
|
return;
|
|
}
|
|
const focusBtn = e.target.closest("[data-focus-tarinai-id]");
|
|
if (focusBtn) {
|
|
e.preventDefault();
|
|
focusTarinaiById(focusBtn.getAttribute("data-focus-tarinai-id"));
|
|
return;
|
|
}
|
|
const btn = e.target.closest("[data-selected-action=\"favorite\"]");
|
|
if (!btn || !world.selected || world.selected.dead) return;
|
|
const favResult = window.TarinaiCommands?.dispatch?.(world, { type: "selection.favorite.toggle" });
|
|
if (!favResult?.ok) return;
|
|
uiCache.selectedSnapshot = "";
|
|
renderSelected();
|
|
render();
|
|
showToast(favResult.favorite ? "\u304a\u6c17\u306b\u5165\u308a\u306b\u3057\u307e\u3057\u305f\u3002" : "\u304a\u6c17\u306b\u5165\u308a\u3092\u89e3\u9664\u3057\u307e\u3057\u305f\u3002");
|
|
});
|
|
ui.selectedInfo?.addEventListener("change", (e) => {
|
|
const input = e.target.closest("[data-selected-name]");
|
|
if (!input) return;
|
|
renameSelectedTarinai(input.value);
|
|
});
|
|
ui.selectedInfo?.addEventListener("keydown", (e) => {
|
|
const input = e.target.closest("[data-selected-name]");
|
|
if (!input) return;
|
|
if (e.key === "Enter") { e.preventDefault(); input.blur(); }
|
|
if (e.key === "Escape") { e.preventDefault(); input.value = world.selected?.name || ""; input.blur(); }
|
|
});
|
|
ui.selectedCloseBtn?.addEventListener("click", () => {
|
|
window.TarinaiCommands?.dispatch?.(world, { type: "selection.clear" });
|
|
uiCache.showSelectedEmpty = false;
|
|
uiCache.selectedSnapshot = "";
|
|
uiCache.selectedEmpty = false;
|
|
renderSelected();
|
|
render();
|
|
});
|
|
|
|
ui.pauseBtn?.addEventListener("click", () => {
|
|
audio.uiClick?.();
|
|
const pauseResult = window.TarinaiCommands?.dispatch?.(world, { type: "simulation.paused.toggle" });
|
|
const paused = pauseResult?.ok ? pauseResult.paused : world.paused;
|
|
const archiveStale = uiCache.archiveFamilyVersion !== (world.familyVersion || 0);
|
|
if (archiveAutoUpdateEnabled() && paused && (uiCache.archivePendingWhileRunning || archiveStale)) {
|
|
uiCache.archivePendingWhileRunning = false;
|
|
scheduleArchiveWindowRender();
|
|
}
|
|
syncTopButtons();
|
|
});
|
|
ui.speedBtn?.addEventListener("click", () => {
|
|
audio.uiClick?.();
|
|
window.TarinaiCommands?.dispatch?.(world, { type: "simulation.speed.cycle", speeds: [1, 2, 4] });
|
|
syncTopButtons();
|
|
});
|
|
ui.ecologyBtn?.addEventListener("click", () => { audio.uiClick?.(); openEcologyDialog(); });
|
|
ui.soundBtn?.addEventListener("click", (e) => {
|
|
e.stopPropagation();
|
|
toggleSoundPanel();
|
|
});
|
|
ui.soundPanel?.addEventListener("click", (e) => e.stopPropagation());
|
|
ui.soundMasterToggle?.addEventListener("change", () => {
|
|
const on = audio.setEnabled ? audio.setEnabled(ui.soundMasterToggle.checked) : audio.toggle();
|
|
if (on) audio.uiClick?.();
|
|
syncAudioControls();
|
|
showToast(on ? "\u52b9\u679c\u97f3\u3092ON\u306b\u3057\u307e\u3057\u305f\u3002" : "\u52b9\u679c\u97f3\u3092OFF\u306b\u3057\u307e\u3057\u305f\u3002");
|
|
});
|
|
document.addEventListener("click", (e) => {
|
|
if (!ui.soundMenu || ui.soundMenu.contains(e.target)) return;
|
|
closeSoundPanel();
|
|
});
|
|
document.addEventListener("click", (e) => {
|
|
if (!isActiveToolMode()) return;
|
|
if (clickedInsideGameOrToolUi(e.target)) return;
|
|
selectTool("observe"); // \u9053\u5177\u8a2d\u7f6e\u30e2\u30fc\u30c9\u3092\u89e3\u9664
|
|
});
|
|
ui.creditsBtn?.addEventListener("click", () => { audio.uiClick?.(); openCreditsDialog(); });
|
|
ui.creditsCloseBtn?.addEventListener("click", closeCreditsDialog);
|
|
ui.creditsDialog?.addEventListener("click", (e) => {
|
|
if (e.target === ui.creditsDialog) closeCreditsDialog();
|
|
});
|
|
ui.resetBtn?.addEventListener("click", () => {
|
|
audio.uiClick?.();
|
|
openFieldDialog();
|
|
});
|
|
ui.fieldCancelBtn?.addEventListener("click", closeFieldDialog);
|
|
ui.fieldDialog?.addEventListener("click", (e) => {
|
|
if (e.target === ui.fieldDialog) { closeFieldDialog(); return; }
|
|
const btn = e.target.closest("[data-field-type]");
|
|
if (!btn) return;
|
|
resetWithField(btn.dataset.fieldType || "garden");
|
|
});
|
|
ui.ecologyCloseBtn?.addEventListener("click", closeEcologyDialog);
|
|
ui.ecologyDialog?.addEventListener("click", (e) => {
|
|
if (e.target === ui.ecologyDialog) closeEcologyDialog();
|
|
});
|
|
ui.archiveUpdateToggleBtn?.addEventListener("click", () => { audio.uiClick?.(); setArchiveUpdateEnabled(!archiveAutoUpdateEnabled()); });
|
|
syncArchiveUpdateButton();
|
|
ui.archiveResetBtn?.addEventListener("click", () => { audio.uiClick?.(); openArchiveResetDialog(); });
|
|
ui.archiveResetCancelBtn?.addEventListener("click", closeArchiveResetDialog);
|
|
ui.archiveResetDialog?.addEventListener("click", (e) => {
|
|
if (e.target === ui.archiveResetDialog) closeArchiveResetDialog();
|
|
});
|
|
ui.archiveResetConfirmBtn?.addEventListener("click", () => {
|
|
world.resetFamilyTree?.();
|
|
window.resetArchiveRenderState?.();
|
|
closeArchiveResetDialog();
|
|
renderArchive();
|
|
renderSelected();
|
|
showToast("\u5bb6\u7cfb\u56f3\u3092\u30ea\u30bb\u30c3\u30c8\u3057\u307e\u3057\u305f\u3002");
|
|
});
|
|
|
|
ui.toolPalette?.addEventListener("click", (e) => {
|
|
const toggle = e.target.closest(".tool-category-toggle");
|
|
if (toggle) {
|
|
const category = toggle.closest(".tool-category");
|
|
if (!category) return;
|
|
audio.uiFold?.();
|
|
const collapsed = !category.classList.contains("collapsed");
|
|
markToolCategoryState(category, collapsed, { user: true });
|
|
return;
|
|
}
|
|
const btn = e.target.closest(".tool");
|
|
if (!btn) return;
|
|
if (btn.dataset.suppressNextClick === "1") {
|
|
btn.dataset.suppressNextClick = "";
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
return;
|
|
}
|
|
const tool = btn.dataset.tool;
|
|
audio.uiClick?.();
|
|
if (tool === "undo" || tool === "redo") {
|
|
const result = window.TarinaiCommands?.dispatch?.(world, { type: tool === "undo" ? "history.undo" : "history.redo" });
|
|
showToast(result?.ok ? (tool === "undo" ? "\u623b\u3057\u307e\u3057\u305f\u3002" : "\u9032\u3081\u307e\u3057\u305f\u3002") : (tool === "undo" ? "\u623b\u305b\u308b\u64cd\u4f5c\u304c\u3042\u308a\u307e\u305b\u3093\u3002" : "\u9032\u3081\u308b\u64cd\u4f5c\u304c\u3042\u308a\u307e\u305b\u3093\u3002"));
|
|
renderStats();
|
|
return;
|
|
}
|
|
if (tool === "clear_tool") {
|
|
world.pendingLinkEndpoint = null;
|
|
world.copyBuffer = null;
|
|
selectTool("observe");
|
|
for (const b of uiCache.toolButtons || []) b.classList.remove("selected");
|
|
showToast("道具選択を解除しました。");
|
|
return;
|
|
}
|
|
if (world.tool === tool && cycleToolSize(tool)) return;
|
|
selectTool(tool);
|
|
});
|
|
|
|
const normalizedWheelDeltaY = (e) => {
|
|
const line = 18;
|
|
const page = Math.max(160, window.innerHeight * 0.82);
|
|
return e.deltaY * (e.deltaMode === 1 ? line : (e.deltaMode === 2 ? page : 1));
|
|
};
|
|
const applyScrollDelta = (el, dy) => {
|
|
if (!el || !Number.isFinite(dy) || Math.abs(dy) < 0.001) return dy;
|
|
const max = Math.max(0, el.scrollHeight - el.clientHeight);
|
|
const before = clamp(el.scrollTop || 0, 0, max);
|
|
const next = clamp(before + dy, 0, max);
|
|
el.scrollTop = next;
|
|
return dy - (next - before);
|
|
};
|
|
const chainScroll = (el) => {
|
|
if (!el) return;
|
|
el.addEventListener("wheel", (e) => {
|
|
if (Math.abs(e.deltaY) <= Math.abs(e.deltaX)) return;
|
|
const dy = normalizedWheelDeltaY(e);
|
|
const max = Math.max(0, el.scrollHeight - el.clientHeight);
|
|
const atTop = el.scrollTop <= 0.5;
|
|
const atBottom = el.scrollTop >= max - 0.5;
|
|
if (!((dy < 0 && atTop) || (dy > 0 && atBottom))) return;
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
applyScrollDelta(document.scrollingElement || document.documentElement, dy);
|
|
}, { passive: false });
|
|
};
|
|
const transferEdgeScroll = (child, parent) => {
|
|
if (!child || !parent) return;
|
|
child.addEventListener("wheel", (e) => {
|
|
if (Math.abs(e.deltaY) <= Math.abs(e.deltaX)) return;
|
|
const dy = normalizedWheelDeltaY(e);
|
|
const childCanScroll = child.scrollHeight > child.clientHeight + 1;
|
|
const childMax = Math.max(0, child.scrollHeight - child.clientHeight);
|
|
const movingInside = childCanScroll && ((dy < 0 && child.scrollTop > 0.5) || (dy > 0 && child.scrollTop < childMax - 0.5));
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
let rest = dy;
|
|
if (movingInside) rest = applyScrollDelta(child, dy);
|
|
if (Math.abs(rest) > 0.001) {
|
|
const parentRest = applyScrollDelta(parent, rest);
|
|
if (Math.abs(parentRest) > 0.001) applyScrollDelta(document.scrollingElement || document.documentElement, parentRest);
|
|
}
|
|
}, { passive: false });
|
|
};
|
|
const rightPanel = document.querySelector(".panel");
|
|
chainScroll(rightPanel);
|
|
chainScroll(ui.archiveContent);
|
|
transferEdgeScroll(ui.log, rightPanel);
|
|
|
|
const inputContext = window.TarinaiUIInputShared?.createInputContext?.({ canvas, world, ui, uiCache });
|
|
if (!inputContext) throw new Error("Tarinai UI input context is not available");
|
|
window.TarinaiTouchInput?.bindTouchInput?.(inputContext);
|
|
window.TarinaiMouseInput?.bindMouseInput?.(inputContext);
|
|
|
|
window.addEventListener("keydown", (e) => {
|
|
if (e.key !== "Escape") return;
|
|
closeFieldDialog();
|
|
closeEcologyDialog();
|
|
closeArchiveResetDialog();
|
|
closeCreditsDialog();
|
|
});
|
|
|
|
window.addEventListener("resize", resizeCanvas);
|
|
}
|