+
+
+
+
diff --git a/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.scss b/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.scss
index bc5a556..f27094f 100644
--- a/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.scss
+++ b/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.scss
@@ -21,22 +21,34 @@
}
}
-
.window {
- position: absolute;
+
width: 400px;
- height: 400px;
- border: 1px solid #ccc;
+ //height: 400px;
background-color: #2e2e2e;
- display: flex;
- flex-direction: column;
- border-radius: 8px;
- overflow: hidden;
- resize: both;
- min-width: 200px;
- min-height: 200px;
- color: white;
- overflow-y: auto;
+ //display: flex;
+ //flex-direction: column;
+ //border-radius: 8px;
+ //min-width: 200px;
+ //min-height: 200px;
+ //color: white;
+ //overflow-y: auto;
+ //transition: width 0.3s ease, left 0.3s ease;
+ //z-index: 1000;
+
+ //&.side-nav {
+ // position: fixed;
+ // left: 0;
+ // top: 60px;
+ // height: 100%;
+ // width: 250px;
+ // max-width: 250px;
+ // z-index: 1100;
+ //}
+ //
+ //&.shifted {
+ // margin-left: 400px;
+ //}
}
.window-header {
@@ -48,47 +60,6 @@
align-items: center;
}
-.resize-handle {
- width: 16px;
- height: 16px;
- position: absolute;
- bottom: 0;
- right: 0;
- cursor: se-resize;
-}
-.window {
- position: absolute;
- border: 1px solid #2e2e2e;
- transition: width 0.3s ease;
- &.side-nav {
- left: 0;
- top: 0;
- height: 100%;
- width: 250px;
- max-width: 250px;
- }
- .window-header {
-
- padding: 8px;
- display: flex;
- justify-content: space-between;
- align-items: center;
- cursor: move;
- }
-
- .side-nav-button {
- margin-left: auto;
- }
-
- .resize-handle {
- width: 10px;
- height: 10px;
- position: absolute;
- bottom: 0;
- right: 0;
- cursor: nwse-resize;
- }
-}
diff --git a/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.ts b/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.ts
index e6c29db..710e466 100644
--- a/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.ts
+++ b/firebird-ng/src/app/pages/geometry-tree/geometry-tree-window/geometry-tree-window.component.ts
@@ -1,8 +1,8 @@
-import { Component, ElementRef, ViewChild, AfterViewInit, OnDestroy } from '@angular/core';
-import {MatIconButton} from "@angular/material/button";
-import {MatIcon} from "@angular/material/icon";
-import {GeometryTreeComponent} from "../geometry-tree.component";
-import {NgIf} from "@angular/common";
+import { Component, ElementRef, ViewChild, AfterViewInit, OnDestroy, Renderer2 } from '@angular/core';
+import { MatIconButton } from "@angular/material/button";
+import { MatIcon } from "@angular/material/icon";
+import { GeometryTreeComponent } from "../geometry-tree.component";
+import { NgIf } from "@angular/common";
@Component({
selector: 'geometry-tree-window',
@@ -17,8 +17,9 @@ import {NgIf} from "@angular/common";
standalone: true
})
export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
- windowOpenState = false;
- sideNavOpen = false;
+ // windowOpenState = false;
+ sideNavOpen = true;
+ isDetached = false;
@ViewChild('windowContainer', { static: false }) windowContainer!: ElementRef;
@ViewChild('windowHeader', { static: false }) windowHeader!: ElementRef;
@@ -34,11 +35,14 @@ export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
private resizeMouseMoveHandler: any;
private resizeMouseUpHandler: any;
+ constructor(private renderer: Renderer2) {}
+
ngAfterViewInit() {
- if (this.windowOpenState) {
- this.initDrag();
- this.initResize();
- }
+ // if (this.windowOpenState) {
+ // this.initDrag();
+ // this.initResize();
+ //
+ // }
}
ngOnDestroy() {
@@ -47,21 +51,49 @@ export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
}
toggleWindow() {
- this.windowOpenState = !this.windowOpenState;
-
- if (this.windowOpenState) {
- setTimeout(() => {
- this.initDrag();
- this.initResize();
- });
- } else {
- this.removeDragListeners();
- this.removeResizeListeners();
- }
+ // this.windowOpenState = !this.windowOpenState;
+ // if (this.windowOpenState) {
+ // setTimeout(() => {
+ // this.initDrag();
+ // this.initResize();
+ //
+ // });
+ // } else {
+ // this.removeDragListeners();
+ // this.removeResizeListeners();
+ //
+ // }
}
+ // toggleSideNav() {
+ // this.isDetached = !this.isDetached;
+ //
+ // if (!this.isDetached) {
+ //
+ // this.sideNavOpen = true;
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'left', '0px');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'top', '60px');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'position', 'fixed');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'width', '300px');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'height', '100vh');
+ // this.removeDragListeners();
+ // } else {
+ //
+ // this.sideNavOpen = false;
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'position', 'absolute');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'width', '400px');
+ // this.renderer.setStyle(this.windowContainer.nativeElement, 'height', '400px');
+ // this.initDrag();
+ // }
+ // this.updateMainContentShift();
+ // }
+
+
+
+
+
initDrag() {
- if (!this.windowContainer) return;
+ if (!this.windowContainer || !this.isDetached) return;
const windowElement = this.windowContainer.nativeElement;
@@ -97,7 +129,7 @@ export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
}
initResize() {
- if (!this.resizeHandle || !this.windowContainer) return;
+ if (!this.resizeHandle || !this.windowContainer || !this.isDetached) return;
const resizeHandle = this.resizeHandle.nativeElement;
const windowElement = this.windowContainer.nativeElement;
@@ -114,9 +146,13 @@ export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
const dx = e.clientX - this.lastX;
const dy = e.clientY - this.lastY;
- windowElement.style.width = windowElement.offsetWidth + dx + 'px';
- windowElement.style.height = windowElement.offsetHeight + dy + 'px';
+ if (this.sideNavOpen) {
+ windowElement.style.width = windowElement.offsetWidth + dx + 'px';
+ } else {
+ windowElement.style.width = windowElement.offsetWidth + dx + 'px';
+ windowElement.style.height = windowElement.offsetHeight + dy + 'px';
+ }
this.lastX = e.clientX;
this.lastY = e.clientY;
}
@@ -143,16 +179,4 @@ export class GeometryTreeWindowComponent implements AfterViewInit, OnDestroy {
document.removeEventListener('mouseup', this.resizeMouseUpHandler);
}
}
-
- toggleSideNav() {
- this.sideNavOpen = !this.sideNavOpen;
-
- if (this.sideNavOpen) {
- this.windowContainer.nativeElement.style.left = '0px';
- this.windowContainer.nativeElement.style.width = '400px';
- } else {
- this.windowContainer.nativeElement.style.width = '';
- }
- }
-
}
diff --git a/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.html b/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.html
index ae07d61..5e3e314 100644
--- a/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.html
+++ b/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.html
@@ -1,4 +1,6 @@
-
geometry-tree works!
+
diff --git a/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.ts b/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.ts
index 28ad2df..2437c09 100644
--- a/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.ts
+++ b/firebird-ng/src/app/pages/geometry-tree/geometry-tree.component.ts
@@ -11,11 +11,12 @@ import {NestedTreeControl, FlatTreeControl, } from '@angular/cdk/tree';
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
import {MatIcon, MatIconModule} from '@angular/material/icon';
-import {MatButtonModule, MatIconButton} from '@angular/material/button';
+import {MatButton, MatButtonModule, MatIconButton} from '@angular/material/button';
import {GeometryService} from "../../services/geometry.service";
import {Object3D} from "three";
import {EventDisplayService} from "phoenix-ui-components";
import {PhoenixThreeFacade} from "../../utils/phoenix-three-facade";
+import {MatTooltip} from "@angular/material/tooltip";
/**
* Food data with nested structure.
@@ -68,7 +69,9 @@ interface ExampleFlatNode {
MatTreeNodeDef,
MatIcon,
MatTreeNodeOutlet,
- MatTreeNodePadding
+ MatTreeNodePadding,
+ MatButton,
+ MatTooltip
],
templateUrl: './geometry-tree.component.html',
styleUrl: './geometry-tree.component.scss'
@@ -135,4 +138,9 @@ export class GeometryTreeComponent implements OnInit{
this.geomService.toggleVisibility(node.object3D);
node.visible = !node.visible;
}
+
+ refreshGeometry() {
+ this.dataSource.data = [];
+ this.dataSource.data = this.threeFacade.scene.children;
+ }
}
diff --git a/firebird-ng/src/app/pages/main-display/main-display.component.html b/firebird-ng/src/app/pages/main-display/main-display.component.html
index 5ebf5a9..ee6ce0e 100644
--- a/firebird-ng/src/app/pages/main-display/main-display.component.html
+++ b/firebird-ng/src/app/pages/main-display/main-display.component.html
@@ -5,123 +5,137 @@
-
-
-
-
-
-
-
+
-
-
-
+
-
-
+
-
+
+
+
+
+
+
+
+
-
+
+
+
-
-
+
+
-
-
+
-
-
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
-
-
+
+
+
+
-
+
+
-
+
+
+
-
-
-
-
-
+
+
-
{{currentTime | number:'1.1-1'}}
-
-
-
-
{{maxTime | number:'1.0-0'}} [ns]
-
-
-
-
-
-
-
-
{{message}}
-
+
+
+
+
+
-
-
+
{{currentTime | number:'1.1-1'}}
+
+
+
+
{{maxTime | number:'1.0-0'}} [ns]
-
{{currentGeometry}}
+
+
+
+
+
+
+
+
{{message}}
+
-
+
+
+
+
+
{{currentGeometry}}
+
+
+
+
split-window works!
+
diff --git a/firebird-ng/src/app/pages/split-window/split-window.component.scss b/firebird-ng/src/app/pages/split-window/split-window.component.scss
new file mode 100644
index 0000000..ecb1e1e
--- /dev/null
+++ b/firebird-ng/src/app/pages/split-window/split-window.component.scss
@@ -0,0 +1,40 @@
+body {
+ margin: 40px;
+}
+
+.wrapper {
+ background-color: #fff;
+ color: #444;
+ /* Use flexbox */
+ display: flex;
+}
+
+.box {
+ background-color: #444;
+ color: #fff;
+ border-radius: 5px;
+ padding: 20px;
+ font-size: 150%;
+
+ /* Use box-sizing so that element's outerwidth will match width property */
+ box-sizing: border-box;
+
+ /* Allow box to grow and shrink, and ensure they are all equally sized */
+ flex: 1 1 auto;
+}
+
+.handler {
+ width: 20px;
+ padding: 0;
+ cursor: ew-resize;
+ flex: 0 0 auto;
+}
+
+.handler::before {
+ content: '';
+ display: block;
+ width: 4px;
+ height: 100%;
+ background: red;
+ margin: 0 auto;
+}
diff --git a/firebird-ng/src/app/pages/split-window/split-window.component.spec.ts b/firebird-ng/src/app/pages/split-window/split-window.component.spec.ts
new file mode 100644
index 0000000..5f05a1a
--- /dev/null
+++ b/firebird-ng/src/app/pages/split-window/split-window.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SplitWindowComponent } from './split-window.component';
+
+describe('SplitWindowComponent', () => {
+ let component: SplitWindowComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [SplitWindowComponent]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(SplitWindowComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/firebird-ng/src/app/pages/split-window/split-window.component.ts b/firebird-ng/src/app/pages/split-window/split-window.component.ts
new file mode 100644
index 0000000..9c73c6f
--- /dev/null
+++ b/firebird-ng/src/app/pages/split-window/split-window.component.ts
@@ -0,0 +1,94 @@
+import {Component, OnInit, ChangeDetectionStrategy, AfterViewInit, ElementRef, Renderer2} from '@angular/core'
+// import { AComponent } from '../../ui/components/AComponent'
+// import { SplitAreaSize, SplitGutterInteractionEvent } from 'angular-split'
+
+// interface IConfig {
+// columns: Array<{
+// visible: boolean
+// size: SplitAreaSize
+// rows: Array<{
+// visible: boolean
+// size: SplitAreaSize
+// type: string
+// }>
+// }>
+// disabled: boolean
+// }
+
+// const defaultConfig: IConfig = {
+// columns: [
+// {
+// visible: true,
+// size: 25,
+// rows: [
+// { visible: true, size: 25, type: 'A' },
+// { visible: true, size: 75, type: 'B' },
+// ],
+// },
+// {
+// visible: true,
+// size: 50,
+// rows: [
+// { visible: true, size: 60, type: 'doc' },
+// { visible: true, size: 40, type: 'C' },
+// ],
+// },
+// {
+// visible: true,
+// size: 25,
+// rows: [
+// { visible: true, size: 20, type: 'D' },
+// { visible: true, size: 30, type: 'E' },
+// { visible: true, size: 50, type: 'F' },
+// ],
+// },
+// ],
+// disabled: false,
+// }
+
+@Component({
+ selector: 'app-split-window',
+ standalone: true,
+ imports: [],
+ templateUrl: './split-window.component.html',
+ styleUrl: './split-window.component.scss'
+})
+export class SplitWindowComponent implements AfterViewInit {
+ private isHandlerDragging = false;
+
+ constructor(private elRef: ElementRef, private renderer: Renderer2) {}
+
+ ngAfterViewInit() {
+ const handler = this.elRef.nativeElement.querySelector('.handler');
+ const wrapper = handler.closest('.container');
+ const boxA = wrapper.querySelector('.box');
+
+ this.renderer.listen(handler, 'mousedown', (e: MouseEvent) => {
+ // Если событие mousedown произошло на элементе .handler, флаг переключается на true
+ this.isHandlerDragging = true;
+ });
+
+ this.renderer.listen(document, 'mousemove', (e: MouseEvent) => {
+ if (!this.isHandlerDragging) {
+ return;
+ }
+
+
+ const containerOffsetLeft = wrapper.offsetLeft;
+
+
+ const pointerRelativeXpos = e.clientX - containerOffsetLeft;
+
+
+ const boxAminWidth = 60;
+
+
+ boxA.style.width = `${Math.max(boxAminWidth, pointerRelativeXpos - 8)}px`;
+ boxA.style.flexGrow = '0';
+ });
+
+ this.renderer.listen(document, 'mouseup', () => {
+ this.isHandlerDragging = false;
+ });
+ }
+}
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..eb4dd3b
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,77 @@
+{
+ "name": "firebird",
+ "lockfileVersion": 3,
+ "requires": true,
+ "packages": {
+ "": {
+ "dependencies": {
+ "angular-split": "^18.0.0-beta.1"
+ }
+ },
+ "node_modules/@angular/common": {
+ "version": "18.2.6",
+ "resolved": "https://registry.npmjs.org/@angular/common/-/common-18.2.6.tgz",
+ "integrity": "sha512-89793ow+wrI1c7C6kyMbnweLNIZHzXthosxAEjipRZGBrqBYjvTtkE45Fl+5yBa3JO7bAhyGkUnEoyvWtZIAEA==",
+ "peer": true,
+ "dependencies": {
+ "tslib": "^2.3.0"
+ },
+ "engines": {
+ "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+ },
+ "peerDependencies": {
+ "@angular/core": "18.2.6",
+ "rxjs": "^6.5.3 || ^7.4.0"
+ }
+ },
+ "node_modules/@angular/core": {
+ "version": "18.2.6",
+ "resolved": "https://registry.npmjs.org/@angular/core/-/core-18.2.6.tgz",
+ "integrity": "sha512-PjFad2j4YBwLVTw+0Te8CJCa/tV0W8caTHG8aOjj3ObdL6ihGI+FKnwerLc9RVzDFd14BOO4C6/+LbOQAh3Ltw==",
+ "peer": true,
+ "dependencies": {
+ "tslib": "^2.3.0"
+ },
+ "engines": {
+ "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+ },
+ "peerDependencies": {
+ "rxjs": "^6.5.3 || ^7.4.0",
+ "zone.js": "~0.14.10"
+ }
+ },
+ "node_modules/angular-split": {
+ "version": "18.0.0-beta.1",
+ "resolved": "https://registry.npmjs.org/angular-split/-/angular-split-18.0.0-beta.1.tgz",
+ "integrity": "sha512-g5QVRhESXNDh6kD6MiN2//Urd+N1sGt1MAGmkXCZgoDFPBHOZ87fY4tc/SokC4n2Nchtt1MJSTEekchtO+sjIg==",
+ "dependencies": {
+ "tslib": "^2.0.0"
+ },
+ "peerDependencies": {
+ "@angular/common": ">=18.0.0",
+ "@angular/core": ">=18.0.0",
+ "rxjs": ">=7.0.0"
+ }
+ },
+ "node_modules/rxjs": {
+ "version": "7.8.1",
+ "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
+ "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
+ "peer": true,
+ "dependencies": {
+ "tslib": "^2.1.0"
+ }
+ },
+ "node_modules/tslib": {
+ "version": "2.7.0",
+ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.7.0.tgz",
+ "integrity": "sha512-gLXCKdN1/j47AiHiOkJN69hJmcbGTHI0ImLmbYLHykhgeN0jVGola9yVjFgzCUklsZQMW55o+dW7IXv3RCXDzA=="
+ },
+ "node_modules/zone.js": {
+ "version": "0.14.10",
+ "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.14.10.tgz",
+ "integrity": "sha512-YGAhaO7J5ywOXW6InXNlLmfU194F8lVgu7bRntUF3TiG8Y3nBK0x1UJJuHUP/e8IyihkjCYqhCScpSwnlaSRkQ==",
+ "peer": true
+ }
+ }
+}
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..c7a8f68
--- /dev/null
+++ b/package.json
@@ -0,0 +1,5 @@
+{
+ "dependencies": {
+ "angular-split": "^18.0.0-beta.1"
+ }
+}