refactor: 按键系统

This commit is contained in:
unanmed 2023-11-17 23:32:16 +08:00
parent d8c98ad7d5
commit 49e09384fa
2 changed files with 303 additions and 301 deletions

View File

@ -4,336 +4,342 @@ import { deleteWith, generateBinary, has, tip } from '@/plugin/utils';
import { EmitableEvent, EventEmitter } from '../../common/eventEmitter';
import { GameStorage } from '../storage';
interface HotkeyEvent extends EmitableEvent {
emit: (key: KeyCode, e: KeyboardEvent, ...params: any[]) => void;
keyChange: (data: HotkeyData, before: KeyCode, after: KeyCode) => void;
interface HotkeyEvent extends EmitableEvent {}
interface AssistHoykey {
ctrl: boolean;
shift: boolean;
alt: boolean;
}
interface HotkeyData {
interface RegisterHotkeyData extends Partial<AssistHoykey> {
id: string;
name: string;
defaults: KeyCode;
}
interface HotkeyData extends Required<RegisterHotkeyData> {
key: KeyCode;
ctrl?: boolean;
alt?: boolean;
shift?: boolean;
group?: string;
func: (code: KeyCode, e: KeyboardEvent) => any;
func: Map<symbol, HotkeyFunc>;
}
interface GroupInfo {
name: string;
includes: string[];
}
type RegisterData = Omit<HotkeyData, 'id' | 'key' | 'name'>;
type HotkeyFunc = (code: KeyCode, ev: KeyboardEvent) => void;
export class Hotkey extends EventEmitter<HotkeyEvent> {
static list: Hotkey[];
id: string;
name: string;
data: Record<string, HotkeyData> = {};
keyMap: Map<KeyCode, HotkeyData[]> = new Map();
list: Record<string, HotkeyData> = {};
storage?: GameStorage<Record<string, KeyCode>>;
groups: Record<string, GroupInfo> = {};
constructor(id: string, storage: boolean = true) {
private scope: symbol = Symbol();
constructor(id: string, name: string) {
super();
if (storage) {
this.storage = new GameStorage(GameStorage.fromAuthor('AncTe', id));
}
this.id = id;
this.name = name;
}
/**
*
* @param data
*
* @param data
*/
register(id: string, name: string, data: RegisterData) {
const key = {
id,
name,
key: this.storage?.getValue(id, data.defaults) ?? data.defaults,
...data
register(data: RegisterHotkeyData) {
const d: HotkeyData = {
...data,
ctrl: !!data.ctrl,
shift: !!data.shift,
alt: !!data.alt,
key: data.defaults,
func: new Map()
};
this.ensureKey(key.key).push(key);
this.list[id] = key;
return this;
this.ensureMap(d.key);
this.data[d.id] = d;
const arr = this.keyMap.get(d.key)!;
arr.push(d);
}
/**
*
* @param data
* @param key
*
* @param id id
* @param func
*/
setKey(data: string | HotkeyData, key: KeyCode): void {
if (typeof data === 'string') {
data = this.list[data];
realize(id: string, func: HotkeyFunc) {
const key = this.data[id];
if (!key.func.has(this.scope)) {
throw new Error(
`Cannot access using scope. Call use before calling realize.`
);
}
const map = this.keyMap.get(data.key)!;
deleteWith(map, data);
this.ensureKey(key).push(data);
const before = data.key;
key.func.set(this.scope, func);
}
/**
* 使symbol作为当前作用域{@link realize}
* @param symbol symbol
*/
use(symbol: symbol) {
this.scope = symbol;
for (const key of Object.values(this.data)) {
key.func.set(symbol, () => {});
}
}
/**
* {@link realize}{@link use}
* @param symbol symbol
*/
dispose(symbol: symbol) {
for (const key of Object.values(this.data)) {
key.func.delete(symbol);
}
}
/**
*
* @param id id
* @param key
* @param assist `ctrl` `shift` `alt`
*/
set(id: string, key: KeyCode, assist: number) {
const { ctrl, shift, alt } = this.unwarpBinary(assist);
const data = this.data[id];
const before = this.keyMap.get(data.key)!;
deleteWith(before, data);
this.ensureMap(key);
const after = this.keyMap.get(key)!;
after.push(data);
data.key = key;
this.emit('keyChange', data, before, key);
data.ctrl = ctrl;
data.shift = shift;
data.alt = alt;
}
/**
*
* @param key
*
* @param key
* @param assist `ctrl` `shift` `alt`
*/
getData(key: KeyCode): HotkeyData[] {
return this.keyMap.get(key) ?? [];
}
/**
*
* @param key
*/
emitKey(key: KeyCode, e: KeyboardEvent, ...params: any[]): any[] {
this.emit('emit', key, e, ...params);
return this.getData(key).map(v => {
const assist = generateBinary([e.ctrlKey, e.altKey, e.shiftKey]);
const need = generateBinary([!!v.ctrl, !!v.alt, !!v.shift]);
if (assist & need) {
v.func(key, e);
emitKey(key: KeyCode, assist: number, ev: KeyboardEvent) {
const toEmit = this.keyMap.get(key);
if (!toEmit) return;
const { ctrl, shift, alt } = this.unwarpBinary(assist);
toEmit.forEach(v => {
if (ctrl === v.ctrl && shift === v.shift && alt === v.alt) {
const func = v.func.get(this.scope);
if (!func) {
throw new Error(`Emit unknown scope keys.`);
}
func(key, ev);
}
});
}
/**
*
* @param id id
* @param name
* @param ids
*/
group(id: string, name: string, ids: string[]) {
this.groups[id] = {
name,
includes: ids
private unwarpBinary(bin: number): AssistHoykey {
return {
ctrl: !!(bin & (1 << 0)),
shift: !!(bin & (1 << 1)),
alt: !!(bin & (1 << 2))
};
ids.forEach(v => {
const data = this.list[v];
if (has(data.group)) {
deleteWith(this.groups[data.group].includes, v);
}
data.group = id;
});
return this;
}
/**
*
* @param id id
* @param name
*/
groupRest(id: string, name: string) {
const rest = Object.values(this.list)
.filter(v => !has(v.group))
.map(v => v.id);
this.group(id, name, rest);
return this;
}
/**
*
* @param hotkey
* @param cover id的按键
*/
extend(hotkey: Hotkey, cover: boolean = false) {
Object.values(hotkey.list).forEach(v => {
if (v.id in this.list && !cover) return;
this.register(v.id, v.name, v);
});
return this;
}
private ensureKey(key: KeyCode) {
private ensureMap(key: KeyCode) {
if (!this.keyMap.has(key)) {
this.keyMap.set(key, []);
}
return this.keyMap.get(key)!;
}
/**
* id获取hotkey实例
* @param id hotkey实例的id
*/
static get(id: string) {
return this.list.find(v => v.id === id);
}
}
export const hotkey = new Hotkey('gameKey');
// export const hotkey = new Hotkey('gameKey');
hotkey
.register('book', '怪物手册', {
defaults: KeyCode.KeyX,
func: () => {
core.openBook(true);
}
})
.register('save', '存档界面', {
defaults: KeyCode.KeyS,
func: () => {
core.save(true);
}
})
.register('load', '读档界面', {
defaults: KeyCode.KeyD,
func: () => {
core.load(true);
}
})
.register('undo', '回退', {
defaults: KeyCode.KeyA,
func: () => {
core.doSL('autoSave', 'load');
}
})
.register('redo', '恢复', {
defaults: KeyCode.KeyW,
func: () => {
core.doSL('autoSave', 'reload');
}
})
.register('toolbox', '道具栏', {
defaults: KeyCode.KeyT,
func: () => {
core.openToolbox(true);
}
})
.register('equipbox', '装备栏', {
defaults: KeyCode.KeyQ,
func: () => {
core.openEquipbox(true);
}
})
.register('fly', '楼层传送', {
defaults: KeyCode.KeyG,
func: () => {
core.useFly(true);
}
})
.register('turn', '勇士转向', {
defaults: KeyCode.KeyZ,
func: () => {
core.turnHero();
}
})
.register('getNext', '轻按', {
defaults: KeyCode.Space,
func: () => {
core.getNextItem();
}
})
.register('menu', '菜单', {
defaults: KeyCode.Escape,
func: () => {
core.openSettings(true);
}
})
.register('replay', '录像回放', {
defaults: KeyCode.KeyR,
func: () => {
core.ui._drawReplay();
}
})
.register('restart', '开始菜单', {
defaults: KeyCode.KeyN,
func: () => {
core.confirmRestart();
}
})
.register('shop', '快捷商店', {
defaults: KeyCode.KeyV,
func: () => {
core.openQuickShop(true);
}
})
.register('statistics', '数据统计', {
defaults: KeyCode.KeyB,
func: () => {
core.ui._drawStatistics();
}
})
.register('viewMap1', '浏览地图', {
defaults: KeyCode.PageUp,
func: () => {
core.ui._drawViewMaps();
}
})
.register('viewMap2', '浏览地图', {
defaults: KeyCode.PageDown,
func: () => {
core.ui._drawViewMaps();
}
})
.register('comment', '评论区', {
defaults: KeyCode.KeyP,
func: () => {
core.actions._clickGameInfo_openComments();
}
})
.register('mark', '标记怪物', {
defaults: KeyCode.KeyM,
func: () => {
// todo: refactor
const [x, y] = flags.mouseLoc ?? [];
const [mx, my] = getLocFromMouseLoc(x, y);
}
})
.register('skillTree', '技能树', {
defaults: KeyCode.KeyJ,
func: () => {
core.useItem('skill1', true);
}
})
.register('desc', '百科全书', {
defaults: KeyCode.KeyH,
func: () => {
core.useItem('I560', true);
}
})
.register('special', '鼠标位置怪物属性', {
defaults: KeyCode.KeyE,
func: () => {
const [x, y] = flags.mouseLoc ?? [];
const [mx, my] = getLocFromMouseLoc(x, y);
if (core.getBlockCls(mx, my)?.startsWith('enemy')) {
// mota.plugin.fixed.showFixed.value = false;
mota.ui.main.open('fixedDetail', {
panel: 'special'
});
}
}
})
.register('critical', '鼠标位置怪物临界', {
defaults: KeyCode.KeyC,
func: () => {
const [x, y] = flags.mouseLoc ?? [];
const [mx, my] = getLocFromMouseLoc(x, y);
if (core.getBlockCls(mx, my)?.startsWith('enemy')) {
// mota.plugin.fixed.showFixed.value = false;
mota.ui.main.open('fixedDetail', {
panel: 'critical'
});
}
}
})
.group('action', '游戏操作', [
'save',
'load',
'undo',
'redo',
'turn',
'getNext',
'mark'
])
.group('view', '快捷查看', [
'book',
'toolbox',
'equipbox',
'fly',
'menu',
'replay',
'shop',
'statistics',
'viewMap1',
'viewMap2',
'skillTree',
'desc',
'special',
'critical'
])
.group('system', '系统按键', ['comment'])
.groupRest('unClassed', '未分类按键');
// hotkey
// .register('book', '怪物手册', {
// defaults: KeyCode.KeyX,
// func: () => {
// core.openBook(true);
// }
// })
// .register('save', '存档界面', {
// defaults: KeyCode.KeyS,
// func: () => {
// core.save(true);
// }
// })
// .register('load', '读档界面', {
// defaults: KeyCode.KeyD,
// func: () => {
// core.load(true);
// }
// })
// .register('undo', '回退', {
// defaults: KeyCode.KeyA,
// func: () => {
// core.doSL('autoSave', 'load');
// }
// })
// .register('redo', '恢复', {
// defaults: KeyCode.KeyW,
// func: () => {
// core.doSL('autoSave', 'reload');
// }
// })
// .register('toolbox', '道具栏', {
// defaults: KeyCode.KeyT,
// func: () => {
// core.openToolbox(true);
// }
// })
// .register('equipbox', '装备栏', {
// defaults: KeyCode.KeyQ,
// func: () => {
// core.openEquipbox(true);
// }
// })
// .register('fly', '楼层传送', {
// defaults: KeyCode.KeyG,
// func: () => {
// core.useFly(true);
// }
// })
// .register('turn', '勇士转向', {
// defaults: KeyCode.KeyZ,
// func: () => {
// core.turnHero();
// }
// })
// .register('getNext', '轻按', {
// defaults: KeyCode.Space,
// func: () => {
// core.getNextItem();
// }
// })
// .register('menu', '菜单', {
// defaults: KeyCode.Escape,
// func: () => {
// core.openSettings(true);
// }
// })
// .register('replay', '录像回放', {
// defaults: KeyCode.KeyR,
// func: () => {
// core.ui._drawReplay();
// }
// })
// .register('restart', '开始菜单', {
// defaults: KeyCode.KeyN,
// func: () => {
// core.confirmRestart();
// }
// })
// .register('shop', '快捷商店', {
// defaults: KeyCode.KeyV,
// func: () => {
// core.openQuickShop(true);
// }
// })
// .register('statistics', '数据统计', {
// defaults: KeyCode.KeyB,
// func: () => {
// core.ui._drawStatistics();
// }
// })
// .register('viewMap1', '浏览地图', {
// defaults: KeyCode.PageUp,
// func: () => {
// core.ui._drawViewMaps();
// }
// })
// .register('viewMap2', '浏览地图', {
// defaults: KeyCode.PageDown,
// func: () => {
// core.ui._drawViewMaps();
// }
// })
// .register('comment', '评论区', {
// defaults: KeyCode.KeyP,
// func: () => {
// core.actions._clickGameInfo_openComments();
// }
// })
// .register('mark', '标记怪物', {
// defaults: KeyCode.KeyM,
// func: () => {
// // todo: refactor
// const [x, y] = flags.mouseLoc ?? [];
// const [mx, my] = getLocFromMouseLoc(x, y);
// }
// })
// .register('skillTree', '技能树', {
// defaults: KeyCode.KeyJ,
// func: () => {
// core.useItem('skill1', true);
// }
// })
// .register('desc', '百科全书', {
// defaults: KeyCode.KeyH,
// func: () => {
// core.useItem('I560', true);
// }
// })
// .register('special', '鼠标位置怪物属性', {
// defaults: KeyCode.KeyE,
// func: () => {
// const [x, y] = flags.mouseLoc ?? [];
// const [mx, my] = getLocFromMouseLoc(x, y);
// if (core.getBlockCls(mx, my)?.startsWith('enemy')) {
// // mota.plugin.fixed.showFixed.value = false;
// mota.ui.main.open('fixedDetail', {
// panel: 'special'
// });
// }
// }
// })
// .register('critical', '鼠标位置怪物临界', {
// defaults: KeyCode.KeyC,
// func: () => {
// const [x, y] = flags.mouseLoc ?? [];
// const [mx, my] = getLocFromMouseLoc(x, y);
// if (core.getBlockCls(mx, my)?.startsWith('enemy')) {
// // mota.plugin.fixed.showFixed.value = false;
// mota.ui.main.open('fixedDetail', {
// panel: 'critical'
// });
// }
// }
// })
// .group('action', '游戏操作', [
// 'save',
// 'load',
// 'undo',
// 'redo',
// 'turn',
// 'getNext',
// 'mark'
// ])
// .group('view', '快捷查看', [
// 'book',
// 'toolbox',
// 'equipbox',
// 'fly',
// 'menu',
// 'replay',
// 'shop',
// 'statistics',
// 'viewMap1',
// 'viewMap2',
// 'skillTree',
// 'desc',
// 'special',
// 'critical'
// ])
// .group('system', '系统按键', ['comment'])
// .groupRest('unClassed', '未分类按键');

View File

@ -2,6 +2,7 @@ import { Component, shallowReactive } from 'vue';
import { EmitableEvent, EventEmitter } from '../../common/eventEmitter';
import { KeyCode } from '@/plugin/keyCodes';
import { Hotkey } from './hotkey';
import { generateBinary } from '@/plugin/utils';
interface FocusEvent<T> extends EmitableEvent {
focus: (before: T | null, after: T) => void;
@ -136,6 +137,7 @@ export class GameUi extends EventEmitter<GameUiEvent> {
component: Component;
hotkey?: Hotkey;
id: string;
symbol: symbol = Symbol();
constructor(id: string, component: Component, hotkey?: Hotkey) {
super();
@ -206,15 +208,6 @@ export class UiController extends Focus<IndexedGameUi> {
this.show = 'all';
}
/**
*
* @param key KeyCode
* @param e
*/
emitKey(key: KeyCode, e: KeyboardEvent) {
this.focused?.ui.hotkey?.emitKey(key, e, this.focused);
}
/**
* id获取到ui
* @param id ui的id
@ -274,7 +267,10 @@ export class UiController extends Focus<IndexedGameUi> {
*/
open(id: string, vBind?: UiVBind, vOn?: UiVOn) {
const ui = this.get(id);
if (!ui) return -1;
if (!ui) {
console.warn(`Unknown UI: '${id}'.`);
return -1;
}
const num = this.num++;
const bind = {
num,