Merge branch 'master' into linking-anh

1 files changed, 19 insertions, 15 deletions

diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index bbf21f22c..6ccbd3fd7 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -14,6 +14,7 @@ import { DocUtils } from "../documents/Documents";
 import { CurrentUserUtils } from "../util/CurrentUserUtils";
 import { InteractionUtils } from "../util/InteractionUtils";
 import { Scripting } from "../util/Scripting";
+import { SelectionManager } from "../util/SelectionManager";
 import { Transform } from "../util/Transform";
 import { CollectionFreeFormViewChrome } from "./collections/CollectionMenu";
 import "./GestureOverlay.scss";
@@ -23,7 +24,6 @@ import { RadialMenu } from "./nodes/RadialMenu";
 import HorizontalPalette from "./Palette";
 import { Touchable } from "./Touchable";
 import TouchScrollableMenu, { TouchScrollableMenuItem } from "./TouchScrollableMenu";
-import { SelectionManager } from "../util/SelectionManager";
 
 @observer
 export class GestureOverlay extends Touchable {
@@ -31,7 +31,7 @@ export class GestureOverlay extends Touchable {
 
     @observable public InkShape: string = "";
     @observable public SavedColor?: string;
-    @observable public SavedWidth?: string;
+    @observable public SavedWidth?: number;
     @observable public Tool: ToolglassTools = ToolglassTools.None;
 
     @observable private _thumbX?: number;
@@ -494,6 +494,7 @@ export class GestureOverlay extends Touchable {
         if (InteractionUtils.IsType(e, InteractionUtils.PENTYPE) || [InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
             this._points.push({ X: e.clientX, Y: e.clientY });
             setupMoveUpEvents(this, e, this.onPointerMove, this.onPointerUp, emptyFunction);
+            // if (CurrentUserUtils.SelectedTool === InkTool.Highlighter) SetActiveInkColor("rgba(245, 230, 95, 0.75)");
         }
     }
 
@@ -588,8 +589,9 @@ export class GestureOverlay extends Touchable {
                 this.makePolygon(this.InkShape, false);
                 this.dispatchGesture(GestureUtils.Gestures.Stroke);
                 this._points = [];
-                if (!CollectionFreeFormViewChrome.Instance._keepPrimitiveMode) {
+                if (!CollectionFreeFormViewChrome.Instance?._keepPrimitiveMode) {
                     this.InkShape = "";
+                    Doc.UserDoc().activeInkTool = InkTool.None;
                 }
             }
             // if we're not drawing in a toolglass try to recognize as gesture
@@ -687,25 +689,26 @@ export class GestureOverlay extends Touchable {
             case "rectangle":
                 this._points.push({ X: left, Y: top });
                 this._points.push({ X: left, Y: top });
-
                 this._points.push({ X: right, Y: top });
                 this._points.push({ X: right, Y: top });
+
                 this._points.push({ X: right, Y: top });
                 this._points.push({ X: right, Y: top });
-
                 this._points.push({ X: right, Y: bottom });
                 this._points.push({ X: right, Y: bottom });
+
                 this._points.push({ X: right, Y: bottom });
                 this._points.push({ X: right, Y: bottom });
-
                 this._points.push({ X: left, Y: bottom });
                 this._points.push({ X: left, Y: bottom });
+
                 this._points.push({ X: left, Y: bottom });
                 this._points.push({ X: left, Y: bottom });
-
                 this._points.push({ X: left, Y: top });
                 this._points.push({ X: left, Y: top });
+
                 break;
+                
             case "triangle":
                 this._points.push({ X: left, Y: bottom });
                 this._points.push({ X: left, Y: bottom });
@@ -733,12 +736,8 @@ export class GestureOverlay extends Touchable {
                 const centerX = (Math.max(left, right) + Math.min(left, right)) / 2;
                 const centerY = (Math.max(top, bottom) + Math.min(top, bottom)) / 2;
                 const radius = Math.max(centerX - Math.min(left, right), centerY - Math.min(top, bottom));
-                // Dividing the circle into four equal sections, and fitting each section to a cubic Bézier curve.   
-                this._points.push({ X: centerX - radius, Y: centerY });
-                this._points.push({ X: centerX - radius, Y: centerY + (c * radius) });
-                this._points.push({ X: centerX - (c * radius), Y: centerY + radius });
-                this._points.push({ X: centerX, Y: centerY + radius });
 
+                // Dividing the circle into four equal sections, and fitting each section to a cubic Bézier curve.   
                 this._points.push({ X: centerX, Y: centerY + radius });
                 this._points.push({ X: centerX + (c * radius), Y: centerY + radius });
                 this._points.push({ X: centerX + radius, Y: centerY + (c * radius) });
@@ -754,6 +753,11 @@ export class GestureOverlay extends Touchable {
                 this._points.push({ X: centerX - radius, Y: centerY - (c * radius) });
                 this._points.push({ X: centerX - radius, Y: centerY });
 
+                this._points.push({ X: centerX - radius, Y: centerY });
+                this._points.push({ X: centerX - radius, Y: centerY + (c * radius) });
+                this._points.push({ X: centerX - (c * radius), Y: centerY + radius });
+                this._points.push({ X: centerX, Y: centerY + radius });
+
                 break;
 
             case "line":
@@ -842,12 +846,12 @@ export class GestureOverlay extends Touchable {
                 return <svg key={i} width={b.width} height={b.height} style={{ transform: `translate(${b.left}px, ${b.top}px)`, pointerEvents: "none", position: "absolute", zIndex: 30000, overflow: "visible" }}>
                     {InteractionUtils.CreatePolyline(l, b.left, b.top, ActiveInkColor(), width, width,
                         ActiveInkBezierApprox(), ActiveFillColor(), ActiveArrowStart(), ActiveArrowEnd(),
-                        ActiveDash(), 1, 1, this.InkShape, "none", false, false)}
+                        ActiveDash(), 1, 1, this.InkShape, "none", 1.0, false)}
                 </svg>;
             }),
             this._points.length <= 1 ? (null) : <svg key="svg" width={B.width} height={B.height}
                 style={{ transform: `translate(${B.left}px, ${B.top}px)`, pointerEvents: "none", position: "absolute", zIndex: 30000, overflow: "visible" }}>
-                {InteractionUtils.CreatePolyline(this._points.map(p => ({ X: p.X, Y: p.Y - (rect?.y || 0) })), B.left, B.top, ActiveInkColor(), width, width, ActiveInkBezierApprox(), ActiveFillColor(), ActiveArrowStart(), ActiveArrowEnd(), ActiveDash(), 1, 1, this.InkShape, "none", false, false)}
+                {InteractionUtils.CreatePolyline(this._points.map(p => ({ X: p.X, Y: p.Y - (rect?.y || 0) })), B.left, B.top, ActiveInkColor(), width, width, ActiveInkBezierApprox(), ActiveFillColor(), ActiveArrowStart(), ActiveArrowEnd(), ActiveDash(), 1, 1, this.InkShape, "none", 1.0, false)}
             </svg>]
         ];
     }
@@ -952,7 +956,7 @@ Scripting.addGlobal(function setPen(width: any, color: any, fill: any, arrowStar
 Scripting.addGlobal(function resetPen() {
     runInAction(() => {
         SetActiveInkColor(GestureOverlay.Instance.SavedColor ?? "rgb(0, 0, 0)");
-        SetActiveInkWidth(GestureOverlay.Instance.SavedWidth ?? "2");
+        SetActiveInkWidth(GestureOverlay.Instance.SavedWidth?.toString() ?? "2");
     });
 }, "resets the pen tool");
 Scripting.addGlobal(function createText(text: any, x: any, y: any) {