fixed scrolling conflict on description editor

dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.html

@@ -9,7 +9,7 @@
 		<ng-container >
 
 			<span class="table-entry" 
-			(click)="toggleExpand(idx);navigateToFieldSet(entry, $event); onEntrySelected(entry)"
+			(click)="onScrollStarted(entry); toggleExpand(idx);navigateToFieldSet(entry, $event); onEntrySelected(entry);"
 			[ngStyle]="calculateStyle(entry)"
 			[ngClass]="calculateClass(entry)"
 			>
@@ -41,6 +41,8 @@
 				[propertiesFormGroup]="propertiesFormGroup"
 				[parentId]="entry.id"
 				[parentMap]="updatedMap"
+				(scrollFinished)="onScrollFinished($event)"
+				(scrollStarted)="onScrollStarted($event)"
 				>
 		
 				</table-of-contents-internal>

dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.ts

@@ -19,6 +19,8 @@ export class TableOfContentsInternal implements OnInit, OnDestroy {
 	@Input() selected: ToCEntry = null;
 	// @Input() visibilityRules:Rule[] = [];
 	@Output() entrySelected = new EventEmitter<ToCEntry>();
+	@Output() scrollStarted = new EventEmitter<ToCEntry>();
+	@Output() scrollFinished = new EventEmitter<ToCEntry>();
 	@Input() propertiesFormGroup: UntypedFormGroup;
 
 	expandChildren: boolean[];
@@ -162,18 +164,28 @@ export class TableOfContentsInternal implements OnInit, OnDestroy {
 					const element = document.getElementById(fieldSetId);
 					if (element) {
 						element.scrollIntoView({ behavior: 'smooth' });
+						// element.focus({preventScroll: true});
+						setTimeout(() => {
+							this.scrollFinished.emit(entry);
+						}, 1000);
 					}
 				}, 300);
 			}
-
 		}
 	}
 
-
 	onEntrySelected(entry: ToCEntry) {
 		this.entrySelected.emit(entry);
 	}
 
+	onScrollStarted(entry: ToCEntry) {
+		this.scrollStarted.emit(entry);
+	}
+
+	onScrollFinished(entry: ToCEntry) {
+		this.scrollFinished.emit(entry);
+	}
+
 
 	calculateStyle(entry: ToCEntry) {
 		const style = {};

dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents.component.html

@@ -17,6 +17,8 @@
 		[visibilityRulesService]="visibilityRulesService"
 		[propertiesFormGroup]="formGroup"
 		[parentMap]="pageToFieldSetMap"
+		(scrollFinished)="onScrollFinished($event)"
+		(scrollStarted)="onScrollStarted($event)"
 		>
 
 		</table-of-contents-internal>

dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents.component.ts

@@ -55,6 +55,7 @@ export class TableOfContentsComponent extends BaseComponent implements OnInit, O
 
 	private _tocentrySelected: ToCEntry = null;
 	private isSelecting: boolean = false;
+	private isScrolling: boolean = false;
 	private _intersectionObserver: IntersectionObserver;
 	private _actOnObservation: boolean = true;
 	public hiddenEntries: string[] = [];
@@ -219,15 +220,30 @@ export class TableOfContentsComponent extends BaseComponent implements OnInit, O
 			}
 
 			entries.forEach(ie => {
+				if (this.isScrolling) return;
+
 				if (ie.isIntersecting) {
 					try {
-						const target_id = ie.target.id;
+						if(!this.isScrolling) {
-						if (this.visibilityRulesService.isVisibleMap[target_id] ?? true) {
+							const target_id = ie.target.id;
-							this.onToCentrySelected(this._findTocEntryById(target_id, this.tocentries));
+							if (this.visibilityRulesService.isVisibleMap[target_id] ?? true) {
+								this.onToCentrySelected(this._findTocEntryById(target_id, this.tocentries));
+							}
 						}
 					} catch {
-
 					}
+
+					// setTimeout(() => {
+					// 	try {
+					// 		if(!this.isSelecting) {
+					// 			const target_id = ie.target.id;
+					// 			if (this.visibilityRulesService.isVisibleMap[target_id] ?? true) {
+					// 				this.onToCentrySelected(this._findTocEntryById(target_id, this.tocentries));
+					// 			}
+					// 		}
+					// 	} catch {
+					// 	}
+					// }, 1000)
 				}
 			})
 		}, options);
@@ -428,6 +444,14 @@ export class TableOfContentsComponent extends BaseComponent implements OnInit, O
 		}
 	}
 
+	onScrollStarted(entry: ToCEntry) {
+		this.isScrolling = true;
+	}
+
+	onScrollFinished(entry: ToCEntry) {
+		this.isScrolling = false;
+	}
+
 	private _findTocEntryById(id: string, tocentries: ToCEntry[]): ToCEntry {
 		if (!tocentries || !tocentries.length) {
 			return null;