aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/DocumentDecorations.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/DocumentDecorations.tsx')
-rw-r--r--src/client/views/DocumentDecorations.tsx67
1 files changed, 34 insertions, 33 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index dfcb6cda9..13eeaa3e7 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -25,6 +25,7 @@ import React = require("react");
import e = require('express');
import { CurrentUserUtils } from '../util/CurrentUserUtils';
import { InkStrokeProperties } from './InkStrokeProperties';
+import { KeyManager } from './GlobalKeyHandler';
@observer
export class DocumentDecorations extends React.Component<{}, { value: string }> {
@@ -119,7 +120,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
}
@action onTitleDown = (e: React.PointerEvent): void => {
- setupMoveUpEvents(this, e, this.onBackgroundMove, (e) => { }, this.onTitleClick);
+ setupMoveUpEvents(this, e, e => this.onBackgroundMove(true, e), (e) => { }, this.onTitleClick);
}
@action onTitleClick = (e: PointerEvent): void => {
!this._edtingTitle && (this._accumulatedTitle = this._titleControlString.startsWith("#") ? this.selectionTitle : this._titleControlString);
@@ -128,22 +129,26 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
onBackgroundDown = (e: React.PointerEvent): void => {
- setupMoveUpEvents(this, e, this.onBackgroundMove, (e) => { }, (e) => { });
+ setupMoveUpEvents(this, e, e => this.onBackgroundMove(false, e), (e) => { }, (e) => { });
}
@action
- onBackgroundMove = (e: PointerEvent, down: number[]): boolean => {
+ onBackgroundMove = (dragTitle: boolean, e: PointerEvent): boolean => {
const dragDocView = SelectionManager.SelectedDocuments()[0];
const dragData = new DragManager.DocumentDragData(SelectionManager.SelectedDocuments().map(dv => dv.props.Document));
const [left, top] = dragDocView.props.ScreenToLocalTransform().scale(dragDocView.props.ContentScaling()).inverse().transformPoint(0, 0);
dragData.offset = dragDocView.props.ScreenToLocalTransform().scale(dragDocView.props.ContentScaling()).transformDirection(e.x - left, e.y - top);
dragData.moveDocument = dragDocView.props.moveDocument;
dragData.isSelectionMove = true;
+ dragData.canEmbed = dragTitle;
dragData.dropAction = dragDocView.props.dropAction;
this.Interacting = true;
this._hidden = true;
DragManager.StartDocumentDrag(SelectionManager.SelectedDocuments().map(dv => dv.ContentDiv!), dragData, e.x, e.y, {
- dragComplete: action(e => this._hidden = this.Interacting = false),
+ dragComplete: action(e => {
+ dragData.canEmbed && SelectionManager.DeselectAll();
+ this._hidden = this.Interacting = false;
+ }),
hideSource: true
});
return true;
@@ -172,19 +177,17 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
const selectedDocs = SelectionManager.SelectedDocuments();
if (selectedDocs.length) {
if (e.ctrlKey) { // open an alias in a new tab with Ctrl Key
- const alias = Doc.MakeAlias(selectedDocs[0].props.Document);
- alias.context = undefined;
- //CollectionDockingView.Instance?.OpenFullScreen(selectedDocs[0]);
- CollectionDockingView.AddSplit(alias, "right");
+ selectedDocs[0].props.Document._fullScreenView = Doc.MakeAlias(selectedDocs[0].props.Document);
+ (selectedDocs[0].props.Document._fullScreenView as Doc).context = undefined;
+ CollectionDockingView.AddSplit(selectedDocs[0].props.Document._fullScreenView as Doc, "right");
} else if (e.shiftKey) { // open centered in a new workspace with Shift Key
const alias = Doc.MakeAlias(selectedDocs[0].props.Document);
alias.context = undefined;
alias.x = -alias[WidthSym]() / 2;
alias.y = -alias[HeightSym]() / 2;
- //CollectionDockingView.Instance?.OpenFullScreen(selectedDocs[0]);
CollectionDockingView.AddSplit(Docs.Create.FreeformDocument([alias], { title: "Tab for " + alias.title }), "right");
} else { // open same document in new tab
- CollectionDockingView.ToggleSplit(selectedDocs[0].props.Document, "right");
+ CollectionDockingView.ToggleSplit(Cast(selectedDocs[0].props.Document._fullScreenView, Doc, null) || selectedDocs[0].props.Document, "right");
}
}
}
@@ -323,8 +326,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
if (doc.type === DocumentType.INK && doc.x && doc.y && doc._width && doc._height) {
this._inkDocs.push({ x: doc.x, y: doc.y, width: doc._width, height: doc._height });
if (InkStrokeProperties.Instance?._lock) {
- doc._nativeHeight = doc._height;
- doc._nativeWidth = doc._width;
+ Doc.SetNativeHeight(doc, doc._height);
+ Doc.SetNativeWidth(doc, doc._width);
}
}
}));
@@ -352,11 +355,11 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
onPointerMove = (e: PointerEvent, down: number[], move: number[]): boolean => {
const first = SelectionManager.SelectedDocuments()[0];
let thisPt = { thisX: e.clientX - this._offX, thisY: e.clientY - this._offY };
- var fixedAspect = first.layoutDoc._nativeWidth ? NumCast(first.layoutDoc._nativeWidth) / NumCast(first.layoutDoc._nativeHeight) : 0;
+ var fixedAspect = Doc.NativeAspect(first.layoutDoc);
SelectionManager.SelectedDocuments().forEach(action((element: DocumentView) => {
const doc = Document(element.rootDoc);
if (doc.type === DocumentType.INK && doc._width && doc._height && InkStrokeProperties.Instance?._lock) {
- fixedAspect = NumCast(doc._nativeWidth) / NumCast(doc._nativeHeight);
+ fixedAspect = Doc.NativeHeight(doc);
}
}));
@@ -390,7 +393,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
((element.rootDoc.type === DocumentType.RTF ||
element.rootDoc.type === DocumentType.COMPARISON ||
(element.rootDoc.type === DocumentType.WEB && Doc.LayoutField(element.rootDoc) instanceof HtmlField))
- && element.layoutDoc._nativeHeight) && element.toggleNativeDimensions()));
+ && Doc.NativeHeight(element.layoutDoc)) && element.toggleNativeDimensions()));
switch (this._resizeHdlId) {
case "": break;
case "documentDecorations-topLeftResizer":
@@ -436,17 +439,17 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
SelectionManager.SelectedDocuments().forEach(action((docView: DocumentView) => {
- if (e.ctrlKey && !docView.props.Document._nativeHeight) docView.toggleNativeDimensions();
+ if (e.ctrlKey && !Doc.NativeHeight(docView.props.Document)) docView.toggleNativeDimensions();
if (dX !== 0 || dY !== 0 || dW !== 0 || dH !== 0) {
const doc = Document(docView.rootDoc);
- let nwidth = returnVal(docView.NativeWidth?.(), doc._nativeWidth);
- let nheight = returnVal(docView.NativeHeight?.(), doc._nativeHeight);
+ let nwidth = returnVal(docView.NativeWidth?.(), Doc.NativeWidth(doc));
+ let nheight = returnVal(docView.NativeHeight?.(), Doc.NativeHeight(doc));
const width = (doc._width || 0);
let height = (doc._height || (nheight / nwidth * width));
height = !height || isNaN(height) ? 20 : height;
const scale = docView.props.ScreenToLocalTransform().Scale * docView.props.ContentScaling();
if (nwidth && nheight) {
- if (nwidth / nheight !== width / height) {
+ if (nwidth / nheight !== width / height && !dragBottom) {
height = nheight / nwidth * width;
}
if (e.ctrlKey || (!dragBottom || !docView.layoutDoc._fitWidth)) { // ctrl key enables modification of the nativeWidth or nativeHeight durin the interaction
@@ -459,26 +462,23 @@ 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 = docView.LayoutFieldKey;
if (fixedAspect && (!nwidth || !nheight)) {
- doc[DataSym][fieldKey + "-nativeWidth"] = doc._nativeWidth = nwidth = doc._width || 0;
- doc[DataSym][fieldKey + "-nativeHeight"] = doc._nativeHeight = nheight = doc._height || 0;
+ doc._nativeWidth = nwidth = doc._width || 0;
+ doc._nativeHeight = nheight = doc._height || 0;
}
- const anno = Cast(doc.annotationOn, Doc, null);
- if (e.ctrlKey && (anno || doc.type === DocumentType.IMG)) {
+ if (e.ctrlKey && [DocumentType.IMG, DocumentType.SCREENSHOT, DocumentType.VID].includes(doc.type as DocumentType)) {
dW !== 0 && runInAction(() => {
- const dataDoc = (anno ?? doc)[DataSym];
- const annoFieldKey = Doc.LayoutFieldKey(anno ?? doc);
- 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;
+ const dataDoc = doc[DataSym];
+ const nw = Doc.NativeWidth(dataDoc);
+ const nh = Doc.NativeHeight(dataDoc);
+ Doc.SetNativeWidth(dataDoc, nw + (dW > 0 ? 10 : -10));
+ Doc.SetNativeHeight(dataDoc, nh + (dW > 0 ? 10 : -10) * nh / nw);
});
}
else if (nwidth > 0 && nheight > 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._nativeWidth = actualdW / (doc._width || 1) * Doc.NativeWidth(doc);
}
doc._width = actualdW;
if (fixedAspect && !doc._fitWidth) doc._height = nheight / nwidth * doc._width;
@@ -486,7 +486,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
else {
if (!fixedAspect || (dragBottom && (e.ctrlKey || docView.layoutDoc._fitWidth))) {
- doc[DataSym][fieldKey + "-nativeHeight"] = doc._nativeHeight = actualdH / (doc._height || 1) * (doc._nativeHeight || 0);
+ doc._nativeHeight = actualdH / (doc._height || 1) * Doc.NativeHeight(doc);
}
doc._height = actualdH;
if (fixedAspect && !doc._fitWidth) doc._width = nwidth / nheight * doc._height;
@@ -572,6 +572,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
"caret-up";
return <FontAwesomeIcon icon={button} className="documentView-minimizedIcon" />;
}
+
render() {
const darkScheme = CurrentUserUtils.ActiveDashboard?.darkScheme ? "dimgray" : undefined;
const bounds = this.Bounds;
@@ -622,7 +623,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
height: (bounds.b - bounds.y + this._resizeBorderWidth) + "px",
left: bounds.x - this._resizeBorderWidth / 2,
top: bounds.y - this._resizeBorderWidth / 2,
- pointerEvents: this.Interacting ? "none" : "all",
+ pointerEvents: KeyManager.Instance.ShiftPressed || this.Interacting ? "none" : "all",
zIndex: SelectionManager.SelectedDocuments().length > 1 ? 900 : 0,
}} onPointerDown={this.onBackgroundDown} onContextMenu={e => { e.preventDefault(); e.stopPropagation(); }} >
</div>