game/wc2.js
李鹏宇 e405eb7a07 feat: 网站布局统一化+公告卡片重做+地形素材归类+加载动画升级+底部栏拆分
- 网站 7 个页签统一内边距/宽度/滚动方式,去掉重复页头
- 公告卡片改为图文大卡(支持后台 image/title/pinned 字段)
- assets/terrain/ 拆 6 个子目录并同步 manifest + TERRAIN_ASSETS
- 删除 assets/art/(transition 图片已清空)
- 加载界面增加随机过渡背景图 + 深色压暗层
- 底部栏建造按钮拆为地形/移动/高度/管理 4 个独立按钮
- 侧面板改为从底部向上展开(WorldBox 风格)
- 删除视频背景文件(已回滚为静态 JPG)
- 新增 wc1.js(六边形地图渲染)、wc2.js(导航控件)
2026-07-24 23:39:49 +08:00

48 lines
2.3 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script>
// 右下角导航控件:方向按钮(支持长按) + 键盘方向键,统一平移相机
const PAN_STEP = 20; // [PLACEHOLDER] 每步平移像素量(按钮单次 / 键盘单次)
const PAN_HOLD_MS = 55; // [PLACEHOLDER] 按钮长按重复间隔ms
const PAN_BOUND_K = 0.45; // [PLACEHOLDER] 平移上限 = 视口边长的比例(向内收缩,世界中心最多移到屏幕内约 45% 处即停)
let panTimer = null;
function stopPanHold() { if (panTimer) { clearInterval(panTimer); panTimer = null; } }
function panCamera(dx, dy) {
if (microViewOpen) return; // 微观视图打开时不平移主世界
const bx = W * PAN_BOUND_K, by = H * PAN_BOUND_K;
camera.x = Math.max(-bx, Math.min(bx, camera.x + dx));
camera.y = Math.max(-by, Math.min(by, camera.y + dy));
}
const PAN_DIRS = {
up:[0,-PAN_STEP], down:[0,PAN_STEP], left:[-PAN_STEP,0], right:[PAN_STEP,0],
nw:[-PAN_STEP,-PAN_STEP], ne:[PAN_STEP,-PAN_STEP], sw:[-PAN_STEP,PAN_STEP], se:[PAN_STEP,PAN_STEP],
};
const navPanel = document.getElementById('navControls');
navPanel.addEventListener('pointerdown', e => {
const btn = e.target.closest('button');
if (!btn) return;
e.preventDefault();
const d = PAN_DIRS[btn.dataset.cmd];
if (!d) return;
stopPanHold();
panCamera(d[0], d[1]); // 立即响应一次
panTimer = setInterval(() => panCamera(d[0], d[1]), PAN_HOLD_MS); // 长按连续平移
});
window.addEventListener('pointerup', stopPanHold);
window.addEventListener('pointercancel', stopPanHold);
// 键盘方向键 + WASD = 等效于方向按钮(按住时系统自动重复 keydown → 连续平移)
const KEY_PAN = {
ArrowUp: [0, -PAN_STEP], ArrowDown: [0, PAN_STEP],
ArrowLeft: [-PAN_STEP, 0], ArrowRight: [ PAN_STEP, 0],
w: [0, -PAN_STEP], s: [0, PAN_STEP],
a: [-PAN_STEP, 0], d: [ PAN_STEP, 0],
W: [0, -PAN_STEP], S: [0, PAN_STEP],
A: [-PAN_STEP, 0], D: [ PAN_STEP, 0],
};
window.addEventListener('keydown', e => {
if (!(e.key in KEY_PAN)) return;
if (microViewOpen) return; // 微观视图不平移主世界
const t = e.target;
if (t && (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.isContentEditable)) return;
e.preventDefault(); // 阻止方向键滚动页面
panCamera(KEY_PAN[e.key][0], KEY_PAN[e.key][1]);
});