in src/component/tag/handlers/EditVertexHandler.ts [59:186]
protected _enable(): void {
const interaction$: Observable<TagInteraction> = this._tagSet.changed$.pipe(
map(
(tagSet: TagSet): RenderTag<Tag>[] => {
return tagSet.getAll();
}),
switchMap(
(tags: RenderTag<Tag>[]): Observable<TagInteraction> => {
return observableFrom(tags).pipe(
mergeMap(
(tag: RenderTag<Tag>): Observable<TagInteraction> => {
return tag.interact$;
}));
}),
switchMap(
(interaction: TagInteraction): Observable<TagInteraction> => {
return observableConcat(
observableOf(interaction),
this._container.mouseService.documentMouseUp$.pipe(
map(
(): TagInteraction => {
return { offsetX: 0, offsetY: 0, operation: TagOperation.None, tag: null };
}),
first()));
}),
share());
const mouseMove$: Observable<MouseEvent> = observableMerge(
this._container.mouseService.mouseMove$,
this._container.mouseService.domMouseMove$).pipe(
share());
this._claimMouseSubscription = interaction$.pipe(
switchMap(
(interaction: TagInteraction): Observable<MouseEvent> => {
return !!interaction.tag ? this._container.mouseService.domMouseDragStart$ : observableEmpty();
}))
.subscribe(
(): void => {
this._container.mouseService.claimMouse(this._name, 3);
});
this._cursorSubscription = interaction$.pipe(
map(
(interaction: TagInteraction): string => {
return interaction.cursor;
}),
distinctUntilChanged())
.subscribe(
(cursor: string): void => {
const interactionCursors: InteractionCursor[] = ["crosshair", "move", "nesw-resize", "nwse-resize"];
for (const interactionCursor of interactionCursors) {
this._container.container.classList.remove(`component-tag-edit-${interactionCursor}`);
}
if (!!cursor) {
this._container.container.classList.add(`component-tag-edit-${cursor}`);
}
});
this._unclaimMouseSubscription = this._container.mouseService
.filtered$(this._name, this._container.mouseService.domMouseDragEnd$)
.subscribe(
(e: MouseEvent): void => {
this._container.mouseService.unclaimMouse(this._name);
});
this._preventDefaultSubscription = interaction$.pipe(
switchMap(
(interaction: TagInteraction): Observable<MouseEvent> => {
return !!interaction.tag ?
this._container.mouseService.documentMouseMove$ :
observableEmpty();
}))
.subscribe(
(event: MouseEvent): void => {
event.preventDefault(); // prevent selection of content outside the viewer
});
this._updateGeometrySubscription = interaction$.pipe(
switchMap(
(interaction: TagInteraction): Observable<[MouseEvent, RenderCamera, TagInteraction, Transform]> => {
if (interaction.operation === TagOperation.None || !interaction.tag) {
return observableEmpty();
}
const mouseDrag$: Observable<MouseEvent> =
this._container.mouseService
.filtered$(
this._name,
this._container.mouseService.domMouseDrag$).pipe(
filter(
(event: MouseEvent): boolean => {
return this._viewportCoords.insideElement(event, this._container.container);
}));
return observableCombineLatest(
mouseDrag$,
this._container.renderService.renderCamera$).pipe(
withLatestFrom(
observableOf(interaction),
this._navigator.stateService.currentTransform$,
(
[event, render]: [MouseEvent, RenderCamera],
i: TagInteraction,
transform: Transform):
[MouseEvent, RenderCamera, TagInteraction, Transform] => {
return [event, render, i, transform];
}));
}))
.subscribe(
([mouseEvent, renderCamera, interaction, transform]: [MouseEvent, RenderCamera, TagInteraction, Transform]): void => {
const basic: number[] = this._mouseEventToBasic(
mouseEvent,
this._container.container,
renderCamera,
transform,
interaction.offsetX,
interaction.offsetY);
const geometry: Geometry = interaction.tag.geometry;
if (interaction.operation === TagOperation.Centroid) {
geometry.setCentroid2d(basic, transform);
} else if (interaction.operation === TagOperation.Vertex) {
(<VertexGeometry>geometry).setVertex2d(interaction.vertexIndex, basic, transform);
}
});
}