Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into new_audio

1 files changed, 25 insertions, 38 deletions

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index f1169763e..03746a1d2 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -197,17 +197,9 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
     @action
     onCloseClick = async (e: React.MouseEvent | undefined) => {
         if (!e?.button) {
-            const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc;
             const selected = SelectionManager.SelectedDocuments().slice();
             SelectionManager.DeselectAll();
-
-            selected.map(dv => {
-                const effectiveAcl = GetEffectiveAcl(dv.props.Document);
-                if (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) { // deletes whatever you have the right to delete
-                    recent && Doc.AddDocToList(recent, "data", dv.props.Document, undefined, true, true);
-                    dv.props.removeDocument?.(dv.props.Document);
-                }
-            });
+            selected.map(dv => dv.props.removeDocument?.(dv.props.Document));
         }
     }
     @action
@@ -418,6 +410,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
         this._snapX = thisPt.thisX;
         this._snapY = thisPt.thisY;
         let dragBottom = false;
+        let dragRight = false;
         let dX = 0, dY = 0, dW = 0, dH = 0;
         const unfreeze = () =>
             SelectionManager.SelectedDocuments().forEach(action((element: DocumentView) =>
@@ -465,6 +458,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
             case "documentDecorations-rightResizer":
                 unfreeze();
                 dW = move[0];
+                dragRight = true;
                 break;
         }
 
@@ -482,7 +476,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
                     if (nwidth / nheight !== width / height) {
                         height = nheight / nwidth * width;
                     }
-                    if (!e.ctrlKey && (!dragBottom || !element.layoutDoc._fitWidth)) { // ctrl key enables modification of the nativeWidth or nativeHeight durin the interaction
+                    if (e.ctrlKey || (!dragBottom || !element.layoutDoc._fitWidth)) { // ctrl key enables modification of the nativeWidth or nativeHeight durin the interaction
                         if (Math.abs(dW) > Math.abs(dH)) dH = dW * nheight / nwidth;
                         else dW = dH * nwidth / nheight;
                     }
@@ -492,33 +486,34 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
                 doc.x = (doc.x || 0) + dX * (actualdW - width);
                 doc.y = (doc.y || 0) + dY * (actualdH - height);
                 const fixedAspect = (nwidth && nheight);
+                const fieldKey = Doc.LayoutFieldKey(doc);
                 if (fixedAspect && (!nwidth || !nheight)) {
-                    doc._nativeWidth = nwidth = doc._width || 0;
-                    doc._nativeHeight = nheight = doc._height || 0;
+                    doc[DataSym][fieldKey + "-nativeWidth"] = doc._nativeWidth = nwidth = doc._width || 0;
+                    doc[DataSym][fieldKey + "-nativeHeight"] = doc._nativeHeight = nheight = doc._height || 0;
                 }
                 const anno = Cast(doc.annotationOn, Doc, null);
                 if (e.ctrlKey && anno) {
                     dW !== 0 && runInAction(() => {
                         const dataDoc = anno[DataSym];
-                        const fieldKey = Doc.LayoutFieldKey(anno);
-                        const nw = NumCast(dataDoc[fieldKey + "-nativeWidth"]);
-                        const nh = NumCast(dataDoc[fieldKey + "-nativeHeight"]);
-                        dataDoc[fieldKey + "-nativeWidth"] = nw + (dW > 0 ? 10 : -10);
-                        dataDoc[fieldKey + "-nativeHeight"] = nh + (dW > 0 ? 10 : -10) * nh / nw;
+                        const annoFieldKey = Doc.LayoutFieldKey(anno);
+                        const nw = NumCast(dataDoc[annoFieldKey + "-nativeWidth"]);
+                        const nh = NumCast(dataDoc[annoFieldKey + "-nativeHeight"]);
+                        dataDoc[annoFieldKey + "-nativeWidth"] = nw + (dW > 0 ? 10 : -10);
+                        dataDoc[annoFieldKey + "-nativeHeight"] = nh + (dW > 0 ? 10 : -10) * nh / nw;
                     });
                 }
                 else if (nwidth > 0 && nheight > 0) {
-                    if (Math.abs(dW) > Math.abs(dH)) {
-                        if (!fixedAspect || e.ctrlKey) {
-                            doc._nativeWidth = actualdW / (doc._width || 1) * (doc._nativeWidth || 0);
+                    if (Math.abs(dW) > Math.abs(dH) || dragRight) {
+                        if (!fixedAspect || (dragRight && e.ctrlKey)) {
+                            doc[DataSym][fieldKey + "-nativeWidth"] = doc._nativeWidth = actualdW / (doc._width || 1) * (doc._nativeWidth || 0);
                         }
                         doc._width = actualdW;
                         if (fixedAspect && !doc._fitWidth) doc._height = nheight / nwidth * doc._width;
                         else if (!fixedAspect || !e.ctrlKey) doc._height = actualdH;
                     }
                     else {
-                        if (!fixedAspect || e.ctrlKey || (dragBottom && element.layoutDoc._fitWidth)) {
-                            doc._nativeHeight = actualdH / (doc._height || 1) * (doc._nativeHeight || 0);
+                        if (!fixedAspect || (dragBottom && (e.ctrlKey || element.layoutDoc._fitWidth))) {
+                            doc[DataSym][fieldKey + "-nativeHeight"] = doc._nativeHeight = actualdH / (doc._height || 1) * (doc._nativeHeight || 0);
                         }
                         doc._height = actualdH;
                         if (fixedAspect && !doc._fitWidth) doc._width = nwidth / nheight * doc._height;
@@ -612,9 +607,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
             return (null);
         }
         const canDelete = SelectionManager.SelectedDocuments().some(docView => {
-            const docAcl = GetEffectiveAcl(docView.props.Document);
-            const collectionAcl = GetEffectiveAcl(docView.props.ContainingCollectionDoc);
-            return [docAcl, collectionAcl].some(acl => [AclAdmin, AclEdit].includes(acl));
+            const collectionAcl = GetEffectiveAcl(docView.props.ContainingCollectionDoc?.[DataSym]);
+            return collectionAcl === AclAdmin || collectionAcl === AclEdit;
         });
         const minimal = bounds.r - bounds.x < 100 ? true : false;
         const maximizeIcon = minimal ? (
@@ -622,7 +616,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
                 <div className="documentDecorations-contextMenu" onPointerDown={this.onSettingsDown}>
                     <FontAwesomeIcon size="lg" icon="cog" />
                 </div></Tooltip>) : canDelete ? (
-                    <Tooltip title={<><div className="dash-tooltip">Delete</div></>} placement="top">
+                    <Tooltip title={<><div className="dash-tooltip">Close</div></>} placement="top">
                         <div className="documentDecorations-closeButton" onClick={this.onCloseClick}>
                             {/* Currently, this is set to be enabled if there is no ink selected. It might be interesting to think about minimizing ink if it's useful? -syip2*/}
                             <FontAwesomeIcon className="documentdecorations-times" icon={faTimes} size="lg" />
@@ -666,13 +660,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
             bounds.y = bounds.b - (this._resizeBorderWidth + this._linkBoxHeight + this._titleHeight);
         }
         var offset = 0;
-        var rotButton = <></>;
-        //make offset larger for ink to edit points
-        if (seldoc.rootDoc.type === DocumentType.INK) {
-            offset = 20;
-            rotButton = <div id="documentDecorations-rotation" title="rotate" className="documentDecorations-rotation"
-                onPointerDown={this.onRotateDown}> ⟲ </div>;
-        }
+        let useRotation = seldoc.rootDoc.type === DocumentType.INK;
 
         return (<div className="documentDecorations" style={{ background: darkScheme }} >
             <div className="documentDecorations-background" style={{
@@ -696,12 +684,11 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
                     {SelectionManager.SelectedDocuments().length !== 1 || seldoc.Document.type === DocumentType.INK ? (null) :
                         <Tooltip title={<><div className="dash-tooltip">{`${seldoc.finalLayoutKey.includes("icon") ? "De" : ""}Iconify Document`}</div></>} placement="top">
                             <div className="documentDecorations-iconifyButton" onPointerDown={this.onIconifyDown}>
-                                {"_"}
+                                <FontAwesomeIcon icon={seldoc.finalLayoutKey.includes("icon") ? "window-restore" : "window-minimize"} className="documentView-minimizedIcon" />
                             </div></Tooltip>}
-                    <Tooltip title={<><div className="dash-tooltip">Open Document In Tab</div></>} placement="top"><div className="documentDecorations-openInTab" onPointerDown={this.onMaximizeDown}>
+                    <Tooltip title={<><div className="dash-tooltip">Open In a New Pane</div></>} placement="top"><div className="documentDecorations-openInTab" onPointerDown={this.onMaximizeDown}>
                         {SelectionManager.SelectedDocuments().length === 1 ? <FontAwesomeIcon icon="external-link-alt" className="documentView-minimizedIcon" /> : "..."}
                     </div></Tooltip>
-                    {rotButton}
                     <div id="documentDecorations-topLeftResizer" className="documentDecorations-resizer"
                         onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
                     <div id="documentDecorations-topResizer" className="documentDecorations-resizer"
@@ -725,8 +712,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
                                 onPointerDown={this.onSelectorUp} onContextMenu={e => e.preventDefault()}>
                                 <FontAwesomeIcon className="documentdecorations-times" icon={faArrowAltCircleUp} size="lg" />
                             </div></Tooltip>}
-                    <div id="documentDecorations-borderRadius" className="documentDecorations-radius"
-                        onPointerDown={this.onRadiusDown} onContextMenu={(e) => e.preventDefault()}></div>
+                    <div id={`documentDecorations-${useRotation ? "rotation" : "borderRadius"}`}
+                        onPointerDown={useRotation ? this.onRotateDown : this.onRadiusDown} onContextMenu={(e) => e.preventDefault()}>{useRotation && "⟲"}</div>
 
                 </div >
                 <div className="link-button-container" key="links" style={{ left: bounds.x - this._resizeBorderWidth / 2 + 10, top: bounds.b + this._resizeBorderWidth / 2 }}>