Files
bim_engine/src/managers/radial-toolbar-manager.ts
2026-04-20 10:38:42 +08:00

76 lines
2.8 KiB
TypeScript

import { BaseManager } from '../core/base-manager';
import { ManagerRegistry } from '../core/manager-registry';
import { RadialToolbar } from '../components/radial-toolbar';
import type { RadialMenuItem } from '../components/radial-toolbar/types';
import { themeManager } from '../services/theme';
import { getIcon } from '../utils/icon-manager';
import type { BottomDockStateChange } from './bottom-dock-manager';
import { createMeasureRadialButton } from '../components/radial-toolbar/buttons/measure';
import { createSectionRadialButton } from '../components/radial-toolbar/buttons/section';
import { createSettingRadialButton } from '../components/radial-toolbar/buttons/setting';
import { createWalkRadialButton } from '../components/radial-toolbar/buttons/walk';
export interface RadialToolbarManagerOptions {
items?: RadialMenuItem[];
}
export class RadialToolbarManager extends BaseManager {
private toolbar: RadialToolbar | null = null;
private unsubscribeDockState: (() => void) | null = null;
constructor(container: HTMLElement, registry: ManagerRegistry, options?: RadialToolbarManagerOptions) {
super(registry);
this.toolbar = new RadialToolbar({
container,
items: options?.items ?? this.createDefaultItems(),
mainButtonIcon: getIcon('主视角'),
mainButtonLabel: 'toolbar.home',
onMainButtonClick: () => {
console.log('[RadialToolbar] main: home');
this.registry.engine3d?.getEngineComponent()?.CameraGoHome();
}
});
this.toolbar.setTheme(themeManager.getTheme());
this.unsubscribeDockState = this.registry.bottomDock?.onStateChange(({ id, open }: BottomDockStateChange) => {
this.toolbar?.setItemActive(id, open);
}) ?? null;
this.syncInitialToggleStates();
}
private createDefaultItems(): RadialMenuItem[] {
return [
createSettingRadialButton(this.registry),
createMeasureRadialButton(this.registry),
createSectionRadialButton(this.registry),
createWalkRadialButton(this.registry),
];
}
private syncInitialToggleStates(): void {
const dock = this.registry.bottomDock;
if (!dock || !this.toolbar) {
return;
}
this.toolbar.setItemActive('measure', dock.isOpen('measure'));
this.toolbar.setItemActive('section', dock.isOpen('section'));
this.toolbar.setItemActive('walk', dock.isOpen('walk'));
}
public addItem(item: RadialMenuItem): void {
this.toolbar?.addItem(item);
}
public destroy(): void {
if (this.unsubscribeDockState) {
this.unsubscribeDockState();
this.unsubscribeDockState = null;
}
this.toolbar?.destroy();
this.toolbar = null;
super.destroy();
}
}