From 246829f80c04c8f195b7a23a5546576e2433842a Mon Sep 17 00:00:00 2001 From: xu_yanfeng Date: Tue, 11 Feb 2025 17:11:07 +0800 Subject: [PATCH] =?UTF-8?q?code=20menu=20hover=E6=97=B6=EF=BC=8C=E6=8F=90?= =?UTF-8?q?=E7=A4=BA=E5=85=B7=E4=BD=93=E7=9A=84=E5=87=BD=E6=95=B0=E5=AE=9E?= =?UTF-8?q?=E7=8E=B0=E9=80=BB=E8=BE=91=EF=BC=8C=E6=96=B9=E4=BE=BF=E9=80=89?= =?UTF-8?q?=E6=8B=A9=E6=98=AF=E5=93=AA=E4=B8=AA=E5=87=BD=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/types.ts | 2 +- src/scripts/inject/code-hint.ts | 32 +++++++++++----- src/scripts/inject/inspector.ts | 6 +-- src/views/devtools/data.ts | 15 +++++--- src/views/devtools/hierarchy.vue | 66 +++++++++++++++++++++----------- 5 files changed, 78 insertions(+), 43 deletions(-) diff --git a/src/core/types.ts b/src/core/types.ts index b93a28c..2b01c88 100644 --- a/src/core/types.ts +++ b/src/core/types.ts @@ -73,7 +73,7 @@ export interface ResponseUseFrameData { export type RequestSetPropertyData = Info; export type ResponseSetPropertyData = Info; export type RequestLogData = string[]; -export type RequestOpenNodeTouchFuntionData = { uuid: string; code: ShowCode }; +export type RequestOpenNodeTouchFuntionData = { uuid: string; code: ShowCode; index: number }; export type ResponseErrorData = string; export enum Msg { None = "None", diff --git a/src/scripts/inject/code-hint.ts b/src/scripts/inject/code-hint.ts index adeee65..dbb7c6b 100644 --- a/src/scripts/inject/code-hint.ts +++ b/src/scripts/inject/code-hint.ts @@ -1,4 +1,4 @@ -import { TreeData } from "../../views/devtools/data"; +import { FunctionInfo, TreeData } from "../../views/devtools/data"; import { ShowCode } from "./types"; declare const cc: any; @@ -29,18 +29,30 @@ export function getCallbacks(node: any, code: ShowCode) { if (!funArray || funArray.length === 0) { return []; } - if (funArray.length > 1) { - console.warn(`多个事件回调函数${funArray.length}`); - } return funArray.map((fun) => { // @ts-ignore return fun.callback; }); } -export function calcCodeHint(node: any, data: TreeData) { - data.codeTouchStart = getCallbacks(node, ShowCode.TouchStart).length; - data.codeTouchMove = getCallbacks(node, ShowCode.TouchMove).length; - data.codeTouchEnd = getCallbacks(node, ShowCode.TouchEnd).length; - data.codeTouchCancel = getCallbacks(node, ShowCode.TouchCancel).length; - data.codeButtonClick = getCallbacks(node, ShowCode.ButtonClick).length; +export const ANONYMOUS = "anonymous"; + +function functionInfo(node: any, type: ShowCode): FunctionInfo[] { + return getCallbacks(node, type).map((item) => { + let desc = item.toString(); + const max = 50; + if (desc.length > max) { + // desc = desc.substr(0, max) + "..."; + } + return { + name: item.name || ANONYMOUS, + desc, + } as FunctionInfo; + }); +} +export function calcCodeHint(node: any, data: TreeData) { + data.codeTouchStart = functionInfo(node, ShowCode.TouchStart); + data.codeTouchMove = functionInfo(node, ShowCode.TouchMove); + data.codeTouchEnd = functionInfo(node, ShowCode.TouchEnd); + data.codeTouchCancel = functionInfo(node, ShowCode.TouchCancel); + data.codeButtonClick = functionInfo(node, ShowCode.ButtonClick); } diff --git a/src/scripts/inject/inspector.ts b/src/scripts/inject/inspector.ts index 841f414..c219246 100644 --- a/src/scripts/inject/inspector.ts +++ b/src/scripts/inject/inspector.ts @@ -113,11 +113,11 @@ export class Inspector extends InjectEvent { return; } const funArray = getCallbacks(node, data.code); - if (funArray && funArray.length) { + if (funArray && funArray.length && data.index < funArray.length) { // @ts-ignore - const fn = funArray[0]; + const fn = funArray[data.index]; this.target = fn; - if (funArray.length !== 1) { + if (!fn) { debugger; } } diff --git a/src/views/devtools/data.ts b/src/views/devtools/data.ts index 4b60a9c..57a4546 100644 --- a/src/views/devtools/data.ts +++ b/src/views/devtools/data.ts @@ -518,7 +518,10 @@ export class EnumData extends Info { return this; } } - +export interface FunctionInfo { + name: string; + desc: string; +} export class TreeData implements ITreeData { id: string = ""; icon: string = ""; @@ -526,11 +529,11 @@ export class TreeData implements ITreeData { /** * 回调的数量 */ - codeTouchStart: number = 0; - codeTouchMove: number = 0; - codeTouchEnd: number = 0; - codeTouchCancel: number = 0; - codeButtonClick: number = 0; + codeTouchStart: FunctionInfo[] = []; + codeTouchMove: FunctionInfo[] = []; + codeTouchEnd: FunctionInfo[] = []; + codeTouchCancel: FunctionInfo[] = []; + codeButtonClick: FunctionInfo[] = []; active: boolean = true; text: string = ""; children: TreeData[] = []; diff --git a/src/views/devtools/hierarchy.vue b/src/views/devtools/hierarchy.vue index d293f6a..5fd2c93 100644 --- a/src/views/devtools/hierarchy.vue +++ b/src/views/devtools/hierarchy.vue @@ -29,7 +29,7 @@ import { ShowCode } from "../../scripts/inject/types"; import { bridge } from "./bridge"; import { Bus, BusMsg } from "./bus"; import { RotateType } from "./const"; -import { EngineData, TreeData } from "./data"; +import { EngineData, FunctionInfo, TreeData } from "./data"; import GameInfo from "./game-info.vue"; import Refresh from "./refresh.vue"; import { appStore } from "./store"; @@ -275,48 +275,68 @@ export default defineComponent({ onMenu(event: MouseEvent, data: TreeData) { const menus: IUiMenuItem[] = []; if (data) { - function hintCode(type: ShowCode) { - bridge.send(Msg.RequestOpenNodeTouchFuntion, { uuid: data.id, code: type } as RequestOpenNodeTouchFuntionData); + function doInspect(type: ShowCode, index: number) { + bridge.send(Msg.RequestOpenNodeTouchFuntion, { uuid: data.id, code: type, index } as RequestOpenNodeTouchFuntionData); chrome.devtools.inspectedWindow.eval(`DoInspect()`); } + function hintCode(type: ShowCode, cbArray: FunctionInfo[], event: MouseEvent) { + if (cbArray.length === 1) { + doInspect(type, 0); + } else { + const subMenu: IUiMenuItem[] = []; + for (let i = 0; i < cbArray.length; i++) { + const item = cbArray[i]; + subMenu.push({ + name: item.name, + tip: item.desc, + callback: (item) => { + doInspect(type, i); + }, + }); + } + nextTick(() => { + ccui.menu.showMenuByMouseEvent(event, subMenu); + }); + } + } menus.push({ - name: `code button-click [${data.codeButtonClick}]`, - visible: !!data.codeButtonClick, - callback: (item) => { + name: `code button-click [${data.codeButtonClick.length}]`, + visible: !!data.codeButtonClick.length, + callback: (item, event: MouseEvent) => { ga.fireEventWithParam(GA_EventName.MouseMenu, ShowCode.ButtonClick); - hintCode(ShowCode.ButtonClick); + hintCode(ShowCode.ButtonClick, data.codeButtonClick, event); }, }); menus.push({ - name: `code touch-start [${data.codeTouchStart}]`, - visible: !!data.codeTouchStart, - callback: (item) => { + name: `code touch-start [${data.codeTouchStart.length}]`, + visible: !!data.codeTouchStart.length, + callback: (item, event: MouseEvent) => { ga.fireEventWithParam(GA_EventName.MouseMenu, ShowCode.TouchStart); - hintCode(ShowCode.TouchStart); + hintCode(ShowCode.TouchStart, data.codeTouchStart, event); }, }); menus.push({ - name: `code touch-move [${data.codeTouchMove}]`, - visible: !!data.codeTouchMove, - callback: (item) => { + name: `code touch-move [${data.codeTouchMove.length}]`, + visible: !!data.codeTouchMove.length, + callback: (item, event: MouseEvent) => { ga.fireEventWithParam(GA_EventName.MouseMenu, ShowCode.TouchMove); - hintCode(ShowCode.TouchMove); + hintCode(ShowCode.TouchMove, data.codeTouchMove, event); }, }); menus.push({ - name: `code touch-end [${data.codeTouchEnd}]`, - visible: !!data.codeTouchEnd, - callback: (item) => { + name: `code touch-end [${data.codeTouchEnd.length}]`, + visible: !!data.codeTouchEnd.length, + callback: (item, event: MouseEvent) => { ga.fireEventWithParam(GA_EventName.MouseMenu, ShowCode.TouchEnd); - hintCode(ShowCode.TouchEnd); + hintCode(ShowCode.TouchEnd, data.codeTouchEnd, event); }, }); menus.push({ - name: `code touch-cancel [${data.codeTouchCancel}]`, - visible: !!data.codeTouchCancel, - callback: (item) => { + name: `code touch-cancel [${data.codeTouchCancel.length}]`, + visible: !!data.codeTouchCancel.length, + callback: (item, event: MouseEvent) => { ga.fireEventWithParam(GA_EventName.MouseMenu, ShowCode.TouchCancel); - hintCode(ShowCode.TouchCancel); + hintCode(ShowCode.TouchCancel, data.codeTouchCancel, event); }, });