fix: 优化跳跃和下落手感
This commit is contained in:
cancerai committed
1 parent
ada64fe4be
commit
afe2f64b9b
25 files changed
+1197
-188
No files matched your search
+168
-11
@@ -1,5 +1,8 @@
|
||||
// 设置：用户名 + 手机虚拟手柄按钮的自定义（位置/大小，拖动调整）
|
||||
// 设置：用户名 + 设备相关自定义
|
||||
// · PC（电脑端）→ 键盘按键映射
|
||||
// · 移动端 → 手机虚拟手柄按钮的位置/大小（拖动调整）
|
||||
import { Save } from './save.js';
|
||||
import { applyBindings, defaultBindings, BIND } from './input.js';
|
||||
|
||||
// 每个可自定义的手柄按钮：key 对应 touch.js 里的 data-touch，
|
||||
// def 为默认布局（cx/cy 为相对舞台中心的百分比，size 为按钮边长 px）
|
||||
@@ -13,21 +16,37 @@ const BUTTONS = [
|
||||
{ key: 'suicide', label: '↺', shape: 'sm', def: { cx: 90, cy: 58, size: 42 } },
|
||||
];
|
||||
|
||||
// 设置界面里可重绑的键盘动作（标签 + action）
|
||||
const KEY_ACTIONS = [
|
||||
['left', '左移'], ['right', '右移'],
|
||||
['up', '上（上浮）'],
|
||||
['jump', '跳跃'], ['shoot', '射击'],
|
||||
['suicide', '自杀 / 重生'], ['restart', '整关重来'],
|
||||
['pause', '暂停'],
|
||||
];
|
||||
|
||||
const clone = (o) => JSON.parse(JSON.stringify(o));
|
||||
const DEFAULT_TOUCH = {};
|
||||
BUTTONS.forEach(b => { DEFAULT_TOUCH[b.key] = clone(b.def); });
|
||||
const makeDefaults = () => ({ username: '', touch: clone(DEFAULT_TOUCH) });
|
||||
const makeDefaults = () => ({ username: '', touch: clone(DEFAULT_TOUCH), keys: defaultBindings() });
|
||||
|
||||
// 工作副本（未点「确定」前不落盘，点「返回」即丢弃）
|
||||
let work = makeDefaults();
|
||||
let wrap = null;
|
||||
let pcMode = false; // true=电脑端（键盘映射），false=移动端（手柄按钮）
|
||||
let listening = null; // 重绑监听：{act, idx}
|
||||
let conflict = null; // 冲突警告：{code, label, act}
|
||||
const els = {};
|
||||
let keysBox = null; // 键盘映射容器
|
||||
|
||||
/** 读取/补全存档里的设置对象（保证 touch 字段齐全） */
|
||||
/** 读取/补全存档里的设置对象（保证 touch / keys 字段齐全） */
|
||||
function meta() {
|
||||
if (!Save.data.settings) Save.data.settings = { username: '' };
|
||||
if (!Save.data.settings.touch) Save.data.settings.touch = clone(DEFAULT_TOUCH);
|
||||
return Save.data.settings;
|
||||
if (!Save.data.settings) Save.data.settings = {};
|
||||
const s = Save.data.settings;
|
||||
if (typeof s.username !== 'string') s.username = '';
|
||||
if (!s.touch) s.touch = clone(DEFAULT_TOUCH);
|
||||
if (!s.keys) s.keys = defaultBindings();
|
||||
return s;
|
||||
}
|
||||
|
||||
/** 把某个按钮按 p={cx,cy,size} 绝对定位（百分比定位 + 像素边长） */
|
||||
@@ -59,13 +78,135 @@ function showUsername() {
|
||||
if (el) el.textContent = '玩家：' + (meta().username || '无名氏');
|
||||
}
|
||||
|
||||
/** 把键盘 code 转成可读标签 */
|
||||
function keyLabel(code) {
|
||||
const M = {
|
||||
Space: '空格', ShiftLeft: 'Shift', ShiftRight: 'Shift', ControlLeft: 'Ctrl', ControlRight: 'Ctrl',
|
||||
AltLeft: 'Alt', AltRight: 'Alt', Tab: 'Tab', Backspace: '⌫', Escape: 'Esc', Enter: 'Enter',
|
||||
ArrowLeft: '←', ArrowRight: '→', ArrowUp: '↑', ArrowDown: '↓',
|
||||
MetaLeft: 'Win', MetaRight: 'Win', ContextMenu: '菜单',
|
||||
};
|
||||
if (M[code]) return M[code];
|
||||
if (code.startsWith('Key')) return code.slice(3);
|
||||
if (code.startsWith('Digit')) return code.slice(5);
|
||||
if (code.startsWith('Numpad')) return '小键' + code.slice(6);
|
||||
if (/^F\d{1,2}$/.test(code)) return code;
|
||||
return code;
|
||||
}
|
||||
|
||||
/** 构建设置界面里的键盘映射行（点击按键后按新键重绑） */
|
||||
function renderKeys() {
|
||||
if (!keysBox) return;
|
||||
keysBox.innerHTML = '';
|
||||
// 冲突警告横幅（始终置于面板顶部，醒目）
|
||||
if (conflict) {
|
||||
const w = document.createElement('div');
|
||||
w.className = 'kwarb';
|
||||
w.textContent = `「${keyLabel(conflict.code)}」已被【${conflict.label}】占用，请换一个键（Esc 取消）`;
|
||||
keysBox.appendChild(w);
|
||||
}
|
||||
for (const [act, label] of KEY_ACTIONS) {
|
||||
const row = document.createElement('div');
|
||||
row.className = 'krow';
|
||||
const nm = document.createElement('span');
|
||||
nm.className = 'kact'; nm.textContent = label;
|
||||
const keys = document.createElement('div');
|
||||
keys.className = 'kkeys';
|
||||
(work.keys[act] || []).forEach((code, idx) => {
|
||||
const chip = document.createElement('button');
|
||||
chip.type = 'button';
|
||||
const isListen = listening && listening.act === act && listening.idx === idx;
|
||||
chip.className = 'kchip' + (isListen ? ' listen' : '');
|
||||
chip.dataset.kact = act; chip.dataset.kidx = idx;
|
||||
chip.textContent = keyLabel(code);
|
||||
const rm = document.createElement('b');
|
||||
rm.className = 'krm'; rm.dataset.krm = act; rm.dataset.kidx = idx; rm.textContent = '×';
|
||||
chip.appendChild(rm);
|
||||
keys.appendChild(chip);
|
||||
});
|
||||
const add = document.createElement('button');
|
||||
add.type = 'button';
|
||||
add.className = 'kadd'; add.dataset.kadd = act; add.textContent = '＋ 添加';
|
||||
keys.appendChild(add);
|
||||
if (listening && listening.act === act) {
|
||||
const tip = document.createElement('span');
|
||||
const isClash = conflict && conflict.act === act;
|
||||
tip.className = 'klisten' + (isClash ? ' bad' : '');
|
||||
tip.textContent = isClash ? '该键冲突，请换一个键（Esc 取消）' : '按下一个键…（Esc 取消）';
|
||||
keys.appendChild(tip);
|
||||
}
|
||||
row.appendChild(nm); row.appendChild(keys);
|
||||
keysBox.appendChild(row);
|
||||
}
|
||||
}
|
||||
|
||||
/** 检测 code 是否已绑定到其它动作（返回冲突动作的标签，否则 null） */
|
||||
function conflictInfo(code, act, idx) {
|
||||
for (const [a, label] of KEY_ACTIONS) {
|
||||
const arr = work.keys[a] || [];
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (arr[i] === code && !(a === act && i === idx)) return label;
|
||||
}
|
||||
}
|
||||
// 不可重绑的系统动作也算冲突（如「菜单」用的 KeyQ）
|
||||
if (BIND.menu && BIND.menu.includes(code)) return '菜单';
|
||||
return null;
|
||||
}
|
||||
|
||||
/** 重绑监听：捕获下一次按键并写入 work.keys（检测到冲突则拒绝并提示） */
|
||||
function onCaptureKey(e) {
|
||||
if (!listening) return;
|
||||
e.preventDefault();
|
||||
if (e.code === 'Escape') { listening = null; conflict = null; renderKeys(); return; }
|
||||
const { act, idx } = listening;
|
||||
const clash = conflictInfo(e.code, act, idx);
|
||||
if (clash) { // 该键已被其它动作占用 → 拒绝并提示
|
||||
conflict = { code: e.code, label: clash, act };
|
||||
renderKeys();
|
||||
return; // 停留在监听态，等待换键或 Esc
|
||||
}
|
||||
if (idx >= (work.keys[act] || []).length) (work.keys[act] = work.keys[act] || []).push(e.code);
|
||||
else work.keys[act][idx] = e.code;
|
||||
conflict = null;
|
||||
listening = null;
|
||||
renderKeys();
|
||||
}
|
||||
|
||||
/** 给键盘映射容器绑定点击委托（重绑 / 添加 / 删除） */
|
||||
let keysWired = false;
|
||||
function wireKeys() {
|
||||
if (!keysBox || keysWired) return;
|
||||
keysWired = true;
|
||||
keysBox.addEventListener('click', (e) => {
|
||||
const rm = e.target.closest('.krm');
|
||||
if (rm) {
|
||||
const a = rm.dataset.krm, i = +rm.dataset.kidx;
|
||||
work.keys[a].splice(i, 1);
|
||||
if (listening && listening.act === a) listening = null;
|
||||
renderKeys();
|
||||
return;
|
||||
}
|
||||
const chip = e.target.closest('.kchip');
|
||||
if (chip) { listening = { act: chip.dataset.kact, idx: +chip.dataset.kidx }; renderKeys(); return; }
|
||||
const add = e.target.closest('.kadd');
|
||||
if (add) { listening = { act: add.dataset.kadd, idx: 1e9 }; renderKeys(); return; }
|
||||
});
|
||||
}
|
||||
|
||||
export const Settings = {
|
||||
init() {
|
||||
/** isTouch：是否移动端（由 main.js 依据 ?touch 覆盖与设备检测传入） */
|
||||
init(isTouch) {
|
||||
pcMode = !isTouch;
|
||||
wrap = document.getElementById('touch-preview');
|
||||
keysBox = document.getElementById('set-keys');
|
||||
work = clone(meta());
|
||||
this.build();
|
||||
renderKeys();
|
||||
wireKeys();
|
||||
showUsername();
|
||||
apply();
|
||||
applyBindings(meta().keys);
|
||||
document.addEventListener('keydown', onCaptureKey);
|
||||
},
|
||||
|
||||
/** 构建设置界面里的可拖拽手柄预览（克隆 #touch 的按钮形状） */
|
||||
@@ -86,38 +227,54 @@ export const Settings = {
|
||||
}
|
||||
},
|
||||
|
||||
/** 打开设置界面：从存档同步工作副本与输入框 */
|
||||
/** 打开设置界面：从存档同步工作副本与输入框，并按设备切换面板 */
|
||||
enter() {
|
||||
const s = meta();
|
||||
work = { username: s.username || '', touch: clone(s.touch) };
|
||||
work = { username: s.username || '', touch: clone(s.touch), keys: clone(s.keys) };
|
||||
const inp = document.getElementById('set-username');
|
||||
if (inp) inp.value = work.username;
|
||||
listening = null;
|
||||
conflict = null;
|
||||
this.build();
|
||||
renderKeys();
|
||||
// 按设备显示对应面板：PC→键盘映射；移动端→手柄按钮
|
||||
const keysRow = document.getElementById('set-keys-row');
|
||||
const touchRow = document.getElementById('set-touch-row');
|
||||
if (keysRow) keysRow.classList.toggle('hidden', !pcMode);
|
||||
if (touchRow) touchRow.classList.toggle('hidden', pcMode);
|
||||
},
|
||||
|
||||
/** 确定：保存用户名与手柄布局到存档 */
|
||||
/** 确定：保存用户名 / 手柄布局 / 键位到存档，并应用，然后由调用方返回上一页 */
|
||||
confirm() {
|
||||
const s = meta();
|
||||
const inp = document.getElementById('set-username');
|
||||
work.username = (inp ? inp.value : '').trim().slice(0, 16);
|
||||
s.username = work.username;
|
||||
s.touch = clone(work.touch);
|
||||
s.keys = clone(work.keys);
|
||||
Save.flush();
|
||||
showUsername();
|
||||
apply();
|
||||
applyBindings(s.keys);
|
||||
},
|
||||
|
||||
/** 恢复默认：布局与用户名全部回到出厂值（仅影响工作副本，需点确定才落盘） */
|
||||
/** 恢复默认：用户名/手柄布局/键位全部回到出厂值（仅影响工作副本，需点确定才落盘） */
|
||||
reset() {
|
||||
work = makeDefaults();
|
||||
listening = null;
|
||||
conflict = null;
|
||||
const inp = document.getElementById('set-username');
|
||||
if (inp) inp.value = '';
|
||||
this.build();
|
||||
renderKeys();
|
||||
},
|
||||
|
||||
/** 供调试 / 测试使用 */
|
||||
_state() { return work; },
|
||||
_els() { return els; },
|
||||
_pcMode() { return pcMode; },
|
||||
_conflict() { return conflict; },
|
||||
_listening() { return listening; },
|
||||
};
|
||||
|
||||
/** 给单个预览按钮绑定「拖动移动」与「右下角缩放」 */
|
||||
|
||||
Reference in new issue
Block a user