style(menu): remove default list style bullets from menu
This commit is contained in:
@@ -274,7 +274,7 @@ const initEngine = () => {
|
||||
|
||||
try {
|
||||
// 初始化引擎,使用默认配置
|
||||
const success = engine.value.initEngine({
|
||||
const success = engine.value.engine.initialize({
|
||||
backgroundColor: 0x333333, // 深色背景
|
||||
version: 'v1', // WebGL 版本
|
||||
showStats: true, // 显示性能统计
|
||||
@@ -311,7 +311,7 @@ const loadModel = () => {
|
||||
try {
|
||||
// 加载模型文件(从 model 目录)
|
||||
const modelUrl = '/model/gujianzhu.glb';
|
||||
|
||||
|
||||
engine.value.engine.loadModel(modelUrl, {
|
||||
position: [0, 0, 0], // 初始位置
|
||||
rotation: [0, 0, 0], // 初始旋转
|
||||
@@ -417,4 +417,3 @@ button.primary:hover {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -335,7 +335,7 @@
|
||||
|
||||
try {
|
||||
// 初始化引擎,使用默认配置
|
||||
const success = engine.initEngine({
|
||||
const success = engine.engine.initialize({
|
||||
backgroundColor: 0x333333, // 深色背景
|
||||
version: 'v1', // WebGL 版本
|
||||
showStats: true, // 显示性能统计
|
||||
|
||||
2867
dist/bim-engine-sdk.es.js
vendored
2867
dist/bim-engine-sdk.es.js
vendored
File diff suppressed because one or more lines are too long
2
dist/bim-engine-sdk.es.js.map
vendored
2
dist/bim-engine-sdk.es.js.map
vendored
File diff suppressed because one or more lines are too long
356
dist/bim-engine-sdk.umd.js
vendored
356
dist/bim-engine-sdk.umd.js
vendored
File diff suppressed because one or more lines are too long
2
dist/bim-engine-sdk.umd.js.map
vendored
2
dist/bim-engine-sdk.umd.js.map
vendored
File diff suppressed because one or more lines are too long
19
dist/index.d.ts
vendored
19
dist/index.d.ts
vendored
@@ -141,12 +141,10 @@ declare class BimDialog implements IBimComponent {
|
||||
export declare class BimEngine extends EventEmitter {
|
||||
private container;
|
||||
private wrapper;
|
||||
private topLeftGroup;
|
||||
toolbar: ToolbarManager | null;
|
||||
buttonGroup: ButtonGroupManager | null;
|
||||
dialog: DialogManager | null;
|
||||
engine: EngineManager | null;
|
||||
rightKey: RightKeyManager | null;
|
||||
get localeManager(): LocaleManager;
|
||||
get themeManager(): ThemeManager;
|
||||
constructor(container: HTMLElement | string, options?: {
|
||||
@@ -160,12 +158,6 @@ export declare class BimEngine extends EventEmitter {
|
||||
setTheme(theme: 'dark' | 'light'): void;
|
||||
setCustomTheme(theme: ThemeConfig): void;
|
||||
private init;
|
||||
/**
|
||||
* 初始化 3D 引擎组件
|
||||
* 注意:只初始化引擎,不加载模型。模型加载在使用层(如 demo.html)进行
|
||||
* @param options 引擎配置选项(可选)
|
||||
*/
|
||||
initEngine(options?: Omit<EngineOptions, 'container'>): boolean;
|
||||
private updateTheme;
|
||||
destroy(): void;
|
||||
}
|
||||
@@ -355,11 +347,11 @@ export declare function createEngine(r) {
|
||||
const e = r.version || "v1";
|
||||
switch (e) {
|
||||
case "v2":
|
||||
return new Bc(r);
|
||||
return new Oc(r);
|
||||
case "v1":
|
||||
return new N_(r);
|
||||
return new U_(r);
|
||||
:
|
||||
return console.warn(`Version '${e}' not found. Falling back to v2.`), new Bc(r);
|
||||
return console.warn(`Version '${e}' not found. Falling back to v2.`), new Oc(r);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -492,6 +484,7 @@ declare class EngineManager extends BimComponent {
|
||||
private container;
|
||||
/** 3D 引擎组件实例 */
|
||||
private engineInstance;
|
||||
rightKey: RightKeyManager | null;
|
||||
/**
|
||||
* 构造函数
|
||||
* @param engine 引擎实例
|
||||
@@ -505,7 +498,7 @@ declare class EngineManager extends BimComponent {
|
||||
*/
|
||||
initialize(options?: Omit<EngineOptions, 'container'>): boolean;
|
||||
/**
|
||||
* 检查 3D 引擎是否已初始化
|
||||
* 检<EFBFBD><EFBFBD><EFBFBD> 3D 引擎是否已初始化
|
||||
*/
|
||||
isInitialized(): boolean;
|
||||
/**
|
||||
@@ -713,7 +706,7 @@ declare class RightKeyManager extends BimComponent {
|
||||
* @param x 屏幕 X 坐标
|
||||
* @param y 屏幕 Y 坐标
|
||||
* @param items 菜单项列表
|
||||
* @param groupOrder 可<EFBFBD><EFBFBD>的分组顺序
|
||||
* @param groupOrder 可选的分组顺序
|
||||
*/
|
||||
showMenu(x: number, y: number, items: MenuItemConfig[], groupOrder?: string[]): void;
|
||||
/**
|
||||
|
||||
@@ -3,7 +3,6 @@ import { ToolbarManager } from './managers/toolbar-manager';
|
||||
import { ButtonGroupManager } from './managers/button-group-manager';
|
||||
import { DialogManager } from './managers/dialog-manager';
|
||||
import { EngineManager } from './managers/engine-manager';
|
||||
import { RightKeyManager } from './managers/right-key-manager';
|
||||
import type { EngineOptions, ModelLoadOptions } from './components/engine';
|
||||
import { localeManager } from './services/locale';
|
||||
import { themeManager } from './services/theme';
|
||||
@@ -17,13 +16,11 @@ export type { EngineOptions, ModelLoadOptions };
|
||||
export class BimEngine extends EventEmitter {
|
||||
private container: HTMLElement;
|
||||
private wrapper: HTMLElement | null = null;
|
||||
private topLeftGroup: any = null; // 保存左上角按钮组的引用
|
||||
|
||||
public toolbar: ToolbarManager | null = null; // 底部专用
|
||||
public buttonGroup: ButtonGroupManager | null = null; // 通用
|
||||
public dialog: DialogManager | null = null;
|
||||
public engine: EngineManager | null = null; // 3D 引擎管理器
|
||||
public rightKey: RightKeyManager | null = null; // 右键菜单管理器
|
||||
|
||||
public get localeManager() { return localeManager; }
|
||||
public get themeManager() { return themeManager; }
|
||||
@@ -74,45 +71,19 @@ export class BimEngine extends EventEmitter {
|
||||
|
||||
// 创建 3D 引擎管理器
|
||||
this.engine = new EngineManager(this, this.wrapper);
|
||||
|
||||
// 初始化其他管理器
|
||||
this.dialog = new DialogManager(this, this.wrapper);
|
||||
this.toolbar = new ToolbarManager(this, this.wrapper);
|
||||
this.buttonGroup = new ButtonGroupManager(this, this.wrapper);
|
||||
this.rightKey = new RightKeyManager(this, this.wrapper);
|
||||
|
||||
|
||||
// 初始主题
|
||||
this.updateTheme(themeManager.getTheme());
|
||||
|
||||
// 在主题更新后,设置左上角按钮组的自定义颜色
|
||||
if (this.topLeftGroup) {
|
||||
this.topLeftGroup.setColors({
|
||||
backgroundColor: '#ff00ff'
|
||||
});
|
||||
}
|
||||
// 订阅主题变化
|
||||
themeManager.subscribe((theme) => {
|
||||
this.updateTheme(theme);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 初始化 3D 引擎组件
|
||||
* 注意:只初始化引擎,不加载模型。模型加载在使用层(如 demo.html)进行
|
||||
* @param options 引擎配置选项(可选)
|
||||
*/
|
||||
public initEngine(options?: Omit<EngineOptions, 'container'>): boolean {
|
||||
if (!this.engine) {
|
||||
console.error('[BimEngine] Engine manager not available.');
|
||||
return false;
|
||||
}
|
||||
|
||||
// 调用 manager 的 initialize 方法初始化引擎
|
||||
return this.engine.initialize(options);
|
||||
}
|
||||
|
||||
private updateTheme(theme: ThemeConfig) {
|
||||
|
||||
if (this.wrapper) {
|
||||
this.wrapper.style.backgroundColor = theme.background;
|
||||
this.wrapper.style.color = theme.textPrimary;
|
||||
@@ -123,9 +94,8 @@ export class BimEngine extends EventEmitter {
|
||||
this.toolbar?.destroy();
|
||||
this.buttonGroup?.destroy();
|
||||
this.engine?.destroy();
|
||||
this.rightKey?.destroy();
|
||||
this.dialog = null;
|
||||
this.dialog?.destroy();
|
||||
this.container.innerHTML = '';
|
||||
this.clear(); // Clear all events
|
||||
this.clear();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -9,7 +9,7 @@ export const fourMenuButton = (engine: BimEngine): MenuItemConfig => {
|
||||
onClick: () => {
|
||||
console.log('dianjile')
|
||||
engine.dialog?.showInfoDialog()
|
||||
engine.rightKey?.hide()
|
||||
engine.engine?.rightKey?.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -12,7 +12,7 @@ export const homeMenuButton = (engine: BimEngine): MenuItemConfig => {
|
||||
icon: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M12 7q.425 0 .713-.288T13 6t-.288-.712T12 5t-.712.288T11 6t.288.713T12 7m0 8q.425 0 .713-.288T13 14v-4q0-.425-.288-.712T12 9t-.712.288T11 10v4q0 .425.288.713T12 15m-6 3l-2.3 2.3q-.475.475-1.088.213T2 19.575V4q0-.825.588-1.412T4 2h16q.825 0 1.413.588T22 4v12q0 .825-.587 1.413T20 18z"/></svg>',
|
||||
onClick: () => {
|
||||
engine.dialog?.showInfoDialog()
|
||||
engine.rightKey?.hide()
|
||||
engine.engine?.rightKey?.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -10,7 +10,7 @@ export const infoMenuButton = (engine: BimEngine): MenuItemConfig => {
|
||||
onClick: () => {
|
||||
console.log('dianjile')
|
||||
engine.dialog?.showInfoDialog()
|
||||
engine.rightKey?.hide()
|
||||
engine.engine?.rightKey?.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -9,7 +9,7 @@ export const secondMenuButton = (engine: BimEngine): MenuItemConfig => {
|
||||
onClick: () => {
|
||||
console.log('dianjile')
|
||||
engine.dialog?.showInfoDialog()
|
||||
engine.rightKey?.hide()
|
||||
engine.engine?.rightKey?.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -4,6 +4,8 @@
|
||||
background: var(--bim-ui_bg_color, #2b2d30);
|
||||
border-radius: 4px;
|
||||
padding: 4px 0;
|
||||
margin: 0; /* 移除默认外边距 */
|
||||
list-style: none; /* 移除列表小圆点 */
|
||||
min-width: 160px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
import { Engine, type EngineOptions, type ModelLoadOptions } from '../components/engine';
|
||||
import { BimComponent } from '../core/component';
|
||||
import type { BimEngine } from '../bim-engine';
|
||||
import { RightKeyManager } from './right-key-manager';
|
||||
import { infoMenuButton } from '../components/menu/buttons/info';
|
||||
import { homeMenuButton } from '../components/menu/buttons/home';
|
||||
|
||||
/**
|
||||
* 3D 引擎管理器
|
||||
@@ -13,6 +16,8 @@ export class EngineManager extends BimComponent {
|
||||
/** 3D 引擎组件实例 */
|
||||
private engineInstance: Engine | null = null;
|
||||
|
||||
public rightKey: RightKeyManager | null = null; // 右键菜单管理器
|
||||
|
||||
/**
|
||||
* 构造函数
|
||||
* @param engine 引擎实例
|
||||
@@ -47,6 +52,17 @@ export class EngineManager extends BimComponent {
|
||||
// 调用组件的 init 方法初始化引擎
|
||||
this.engineInstance.init();
|
||||
|
||||
// 初始化右键 (移到 return 之前)
|
||||
this.rightKey = new RightKeyManager(this.engine, this.container);
|
||||
|
||||
// 注册默认右键菜单
|
||||
this.rightKey.registerHandler((_e) => {
|
||||
return [
|
||||
infoMenuButton(this.engine),
|
||||
homeMenuButton(this.engine)
|
||||
];
|
||||
});
|
||||
|
||||
return this.engineInstance.isInitialized();
|
||||
} catch (error) {
|
||||
console.error('[EngineManager] Failed to initialize 3D engine:', error);
|
||||
@@ -54,9 +70,8 @@ export class EngineManager extends BimComponent {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查 3D 引擎是否已初始化
|
||||
* 检<EFBFBD><EFBFBD><EFBFBD> 3D 引擎是否已初始化
|
||||
*/
|
||||
public isInitialized(): boolean {
|
||||
return this.engineInstance !== null && this.engineInstance.isInitialized();
|
||||
@@ -95,6 +110,10 @@ export class EngineManager extends BimComponent {
|
||||
this.engineInstance.destroy();
|
||||
this.engineInstance = null;
|
||||
}
|
||||
if (this.rightKey) {
|
||||
this.rightKey.destroy();
|
||||
this.rightKey = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -3,8 +3,6 @@ import { BimEngine } from '../bim-engine';
|
||||
import { BimRightKey } from '../components/right-key';
|
||||
import { BimMenu } from '../components/menu';
|
||||
import { MenuItemConfig } from '../components/menu/item';
|
||||
import { infoMenuButton } from '../components/menu/buttons/info';
|
||||
import { homeMenuButton } from '../components/menu/buttons/home';
|
||||
|
||||
/**
|
||||
* 右键菜单管理器 (RightKeyManager)
|
||||
@@ -18,7 +16,7 @@ export class RightKeyManager extends BimComponent {
|
||||
private rightKeyPanel: BimRightKey;
|
||||
|
||||
// 存储注册的上下文处理器
|
||||
// 每个处理<E5A484><E79086><EFBFBD>接收鼠标事件,返回一组菜单项(如果没有对应菜单则返回 null)
|
||||
// 每个处理<E5A484><E79086>接收鼠标事件,返回一组菜单项(如果没有对应菜单则返回 null)
|
||||
private contextHandlers: Array<(e: MouseEvent) => MenuItemConfig[] | null> = [];
|
||||
|
||||
constructor(engine: BimEngine, container: HTMLElement) {
|
||||
@@ -55,7 +53,7 @@ export class RightKeyManager extends BimComponent {
|
||||
* @param x 屏幕 X 坐标
|
||||
* @param y 屏幕 Y 坐标
|
||||
* @param items 菜单项列表
|
||||
* @param groupOrder 可<EFBFBD><EFBFBD>的分组顺序
|
||||
* @param groupOrder 可选的分组顺序
|
||||
*/
|
||||
public showMenu(x: number, y: number, items: MenuItemConfig[], groupOrder?: string[]): void {
|
||||
if (!items || items.length === 0) return;
|
||||
@@ -84,11 +82,20 @@ export class RightKeyManager extends BimComponent {
|
||||
private handleContextMenu = (e: MouseEvent): void => {
|
||||
// 阻止浏览器默认的右键菜单
|
||||
e.preventDefault();
|
||||
let items: MenuItemConfig[] = [];
|
||||
items.push(infoMenuButton(this.engine))
|
||||
items.push(infoMenuButton(this.engine))
|
||||
items.push(infoMenuButton(this.engine))
|
||||
items.push(homeMenuButton(this.engine))
|
||||
|
||||
// 1. 确定上下文项
|
||||
// 遍历所有注册的处理器,找到第一个返回非空结果的处理器
|
||||
// 这种责任链模式允许插件优先处理特定对象的右键
|
||||
let items: MenuItemConfig[] | null = null;
|
||||
for (const handler of this.contextHandlers) {
|
||||
const result = handler(e);
|
||||
if (result && result.length > 0) {
|
||||
if (!items) items = [];
|
||||
items = items.concat(result);
|
||||
}
|
||||
}
|
||||
|
||||
// 2. 如果有菜单项,则显示
|
||||
if (items && items.length > 0) {
|
||||
this.showMenu(e.clientX, e.clientY, items);
|
||||
} else {
|
||||
@@ -96,4 +103,4 @@ export class RightKeyManager extends BimComponent {
|
||||
this.hide();
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user