fix: recording box appear on bottom right corner, removed document decorations

3 files changed, 24 insertions, 18 deletions

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index bc4fec3f0..0e9bf50fc 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -468,14 +468,6 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
             return SelectionManager.Views().length > 1 ? "-multiple-" : "-unset-";
       }
 
-      @computed get canDelete() {
-            return SelectionManager.Views().some(docView => {
-                  if (docView.rootDoc.stayInCollection) return false;
-                  const collectionAcl = docView.props.ContainingCollectionView ? GetEffectiveAcl(docView.props.ContainingCollectionDoc?.[DataSym]) : AclEdit;
-                  //return (!docView.rootDoc._stayInCollection || docView.rootDoc.isInkMask) &&
-                  return (collectionAcl === AclAdmin || collectionAcl === AclEdit || GetEffectiveAcl(docView.rootDoc) === AclAdmin);
-            });
-      }
       @computed get hasIcons() {
             return SelectionManager.Views().some(docView => docView.rootDoc.layoutKey === "layout_icon");
       }
@@ -491,8 +483,13 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
             const hideTitle = seldoc.props.hideDecorationTitle || seldoc.rootDoc.hideDecorationTitle;
             const hideDocumentButtonBar = seldoc.props.hideDocumentButtonBar || seldoc.rootDoc.hideDocumentButtonBar;
             // if multiple documents have been opened at the same time, then don't show open button
-            const canOpen = SelectionManager.Views().some(docView => !docView.props.Document._stayInCollection && !docView.props.Document.isGroup && !docView.props.Document.hideOpenButton);
-            const canDelete = this.canDelete;
+            const hideOpenButton = seldoc.props.hideOpenButton || seldoc.rootDoc.hideOpenButton ||
+                  SelectionManager.Views().some(docView => docView.props.Document._stayInCollection || docView.props.Document.isGroup || docView.props.Document.hideOpenButton);
+            const hideDeleteButton = seldoc.props.hideDeleteButton || seldoc.rootDoc.hideDeleteButton ||
+                  SelectionManager.Views().some(docView => {
+                        const collectionAcl = docView.props.ContainingCollectionView ? GetEffectiveAcl(docView.props.ContainingCollectionDoc?.[DataSym]) : AclEdit;
+                        return docView.rootDoc.stayInCollection || (collectionAcl !== AclAdmin && collectionAcl !== AclEdit && GetEffectiveAcl(docView.rootDoc) !== AclAdmin);
+                  });
             const topBtn = (key: string, icon: string, pointerDown: undefined | ((e: React.PointerEvent) => void), click: undefined | ((e: any) => void), title: string) => (
                   <Tooltip key={key} title={<div className="dash-tooltip">{title}</div>} placement="top">
                         <div className={`documentDecorations-${key}Button`} onContextMenu={e => e.preventDefault()}
@@ -502,7 +499,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
                   </Tooltip>);
 
             const colorScheme = StrCast(CurrentUserUtils.ActiveDashboard?.colorScheme);
-            const titleArea = hideTitle ? <div className="documentDecorations-title" onPointerDown={this.onTitleDown} key="title" /> :
+            const titleArea = hideTitle ? (null) :
                   this._edtingTitle ?
                         <input ref={this._keyinput} className={`documentDecorations-title${colorScheme}`}
                               type="text" name="dynbox" autoComplete="on"
@@ -546,9 +543,9 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
                               width: (bounds.r - bounds.x + this._resizeBorderWidth) + "px",
                               height: (bounds.b - bounds.y + this._resizeBorderWidth + this._titleHeight) + "px",
                         }}>
-                              {!canDelete ? <div /> : topBtn("close", this.hasIcons ? "times" : "window-maximize", undefined, e => this.onCloseClick(this.hasIcons ? true : undefined), "Close")}
+                              {hideDeleteButton ? <div /> : topBtn("close", this.hasIcons ? "times" : "window-maximize", undefined, e => this.onCloseClick(this.hasIcons ? true : undefined), "Close")}
                               {titleArea}
-                              {!canOpen ? (null) : topBtn("open", "external-link-alt", this.onMaximizeDown, undefined, "Open in Tab (ctrl: as alias, shift: in new collection)")}
+                              {hideOpenButton ? (null) : topBtn("open", "external-link-alt", this.onMaximizeDown, undefined, "Open in Tab (ctrl: as alias, shift: in new collection)")}
                               {hideResizers ? (null) :
                                     <>
                                           <div key="tl" className={`documentDecorations-topLeftResizer ${resizerScheme}`} onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()} />
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 96c989e77..ddadde52a 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -164,6 +164,8 @@ export interface DocumentViewProps extends DocumentViewSharedProps {
       hideTitle?: boolean;  // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
       hideDecorationTitle?: boolean;  // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
       hideDocumentButtonBar?: boolean;
+      hideOpenButton?: boolean;
+      hideDeleteButton?: boolean;
       treeViewDoc?: Doc;
       isDocumentActive?: () => boolean | undefined; // whether a document should handle pointer events
       isContentActive: () => boolean | undefined; // whether document contents should handle pointer events
diff --git a/src/client/views/nodes/trails/PresElementBox.tsx b/src/client/views/nodes/trails/PresElementBox.tsx
index 083ca5bea..f1144b32d 100644
--- a/src/client/views/nodes/trails/PresElementBox.tsx
+++ b/src/client/views/nodes/trails/PresElementBox.tsx
@@ -324,16 +324,23 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
             } else {
                   // if we dont have any recording
-                  const recording = Docs.Create.WebCamDocument("", { _width: 400, _height: 200, hideDocumentButtonBar: true, title: "recording", cloneFieldFilter: new List<string>(["system"]) });
+                  const recording = Docs.Create.WebCamDocument("", {
+                        _width: 400, _height: 200,
+                        hideDocumentButtonBar: true,
+                        hideDecorationTitle: true,
+                        hideOpenButton: true,
+                        hideDeleteButton: true,
+                        cloneFieldFilter:
+                              new List<string>(["system"])
+                  });
 
                   // attach the recording to the slide, and attach the slide to the recording
                   recording.slides = activeItem
                   activeItem.recording = recording
 
-                  // TODO: Figure out exactly where we want the video to appear
-                  const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
-                  recording.x = pt[0];
-                  recording.y = pt[1];
+                  // make recording box appear in the bottom right corner of the screen
+                  recording.x = window.innerWidth - recording._width - 20;
+                  recording.y = window.innerHeight - recording._height - 20;
                   Doc.AddDocToList((Doc.UserDoc().myOverlayDocs as Doc), undefined, recording);
             }
       }