From 1cbbb1b6ebdb2bbf0f05ee1dcbe9922236495f58 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 1 Dec 2021 00:18:02 -0500
Subject: cleanup DocDecorations ink rotation

---
 src/client/views/DocumentDecorations.tsx | 30 +++++++++++-------------------
 1 file changed, 11 insertions(+), 19 deletions(-)

(limited to 'src/client/views/DocumentDecorations.tsx')

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 7d3959eba..d85709f31 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -27,6 +27,8 @@ import { LightboxView } from './LightboxView';
 import { DocumentView } from "./nodes/DocumentView";
 import { FormattedTextBox } from './nodes/formattedText/FormattedTextBox';
 import React = require("react");
+import { InkingStroke } from './InkingStroke';
+import e = require('express');
 
 @observer
 export class DocumentDecorations extends React.Component<{ PanelWidth: number, PanelHeight: number, boundsLeft: number, boundsTop: number }, { value: string }> {
@@ -37,12 +39,9 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
     private _linkBoxHeight = 20 + 3; // link button height + margin
     private _titleHeight = 20;
     private _resizeUndo?: UndoManager.Batch;
-    private _rotateUndo?: UndoManager.Batch;
     private _offX = 0; _offY = 0;  // offset from click pt to inner edge of resize border
     private _snapX = 0; _snapY = 0; // last snapped location of resize border
-    private _prevY = 0;
     private _dragHeights = new Map<Doc, { start: number, lowest: number }>();
-    private _inkCenterPts: { doc: Doc, X: number, Y: number }[] = [];
     private _inkDragDocs: { doc: Doc, x: number, y: number, width: number, height: number }[] = [];
 
     @observable private _accumulatedTitle = "";
@@ -194,30 +193,22 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
 
     @action
     onRotateDown = (e: React.PointerEvent): void => {
-        this._rotateUndo = UndoManager.StartBatch("rotatedown");
-        const pt = { x: this.Bounds.c?.X ?? (this.Bounds.x + this.Bounds.r) / 2, y: this.Bounds.c?.Y ?? (this.Bounds.y + this.Bounds.b) / 2 };
+        const rotateUndo = UndoManager.StartBatch("rotatedown");
+        const centerPoint = { X: this.Bounds.c?.X ?? (this.Bounds.x + this.Bounds.r) / 2, Y: this.Bounds.c?.Y ?? (this.Bounds.y + this.Bounds.b) / 2 };
         setupMoveUpEvents(this, e,
             (e: PointerEvent, down: number[], delta: number[]) => {
-                const docView = SelectionManager.Views()[0];
-                const { left, top, right, bottom } = docView.getBounds() || { left: 0, top: 0, right: 0, bottom: 0 };
-                const centerPoint = { X: (left + right) / 2, Y: (top + bottom) / 2 };
                 const previousPoint = { X: e.clientX, Y: e.clientY };
                 const movedPoint = { X: e.clientX - delta[0], Y: e.clientY - delta[1] };
-                const angle = InkStrokeProperties.Instance.angleChange(previousPoint, movedPoint, centerPoint);
-                const selectedInk = SelectionManager.Views().filter(i => Document(i.rootDoc).type === DocumentType.INK);
-                angle && InkStrokeProperties.Instance.rotateInk(selectedInk, -angle, pt);
+                const angle = InkStrokeProperties.angleChange(previousPoint, movedPoint, centerPoint);
+                const selectedInk = SelectionManager.Views().filter(i => i.ComponentView instanceof InkingStroke);
+                angle && InkStrokeProperties.Instance.rotateInk(selectedInk, -angle, centerPoint);
                 return false;
             },
             () => {
-                this._rotateUndo?.end();
+                rotateUndo?.end();
                 UndoManager.FilterBatches(["data", "x", "y", "width", "height"]);
             },
             emptyFunction);
-        this._prevY = e.clientY;
-        this._inkCenterPts = SelectionManager.Views()
-            .filter(dv => dv.rootDoc.type === DocumentType.INK)
-            .map(dv => ({ ink: Cast(dv.rootDoc.data, InkField)?.inkData ?? [{ X: 0, Y: 0 }], doc: dv.rootDoc }))
-            .map(({ ink, doc }) => ({ doc, X: Math.min(...ink.map(p => p.X)), Y: Math.min(...ink.map(p => p.Y)) }));
     }
 
     @action
@@ -479,7 +470,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
         bounds.r = Math.max(bounds.x, Math.max(leftBounds, Math.min(window.innerWidth, bounds.r + borderRadiusDraggerWidth + this._resizeBorderWidth / 2) - this._resizeBorderWidth / 2 - borderRadiusDraggerWidth));
         bounds.b = Math.max(bounds.y, Math.max(topBounds, Math.min(window.innerHeight, bounds.b + this._resizeBorderWidth / 2 + this._linkBoxHeight) - this._resizeBorderWidth / 2 - this._linkBoxHeight));
 
-        const useRotation = seldoc.rootDoc.type === DocumentType.INK;
+        const useRotation = seldoc.ComponentView instanceof InkingStroke;
         const resizerScheme = colorScheme ? "documentDecorations-resizer" + colorScheme : "";
 
         return (<div className={`documentDecorations${colorScheme}`}>
@@ -518,7 +509,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
                             {seldoc.props.renderDepth <= 1 || !seldoc.props.ContainingCollectionView ? (null) :
                                 topBtn("selector", "arrow-alt-circle-up", undefined, this.onSelectorClick, "tap to select containing document")}
                             <div key="rot" className={`documentDecorations-${useRotation ? "rotation" : "borderRadius"}`}
-                                onPointerDown={useRotation ? this.onRotateDown : this.onRadiusDown} onContextMenu={(e) => e.preventDefault()}>{useRotation && "⟲"}</div>
+                                onPointerDown={useRotation ? this.onRotateDown : this.onRadiusDown}
+                                onContextMenu={e => e.preventDefault()}>{useRotation && "⟲"}</div>
                         </>
                     }
                 </div >
-- 
cgit v1.2.3-70-g09d2