aboutsummaryrefslogtreecommitdiff
path: root/src/client/util/DragManager.ts
diff options
context:
space:
mode:
authorgeireann <60007097+geireann@users.noreply.github.com>2020-06-11 13:38:51 +0800
committergeireann <60007097+geireann@users.noreply.github.com>2020-06-11 13:38:51 +0800
commitb14c559285d579a90bd8f7282a85283201f2f65c (patch)
treef89f5359962b8423307df2953610d20eefc821d8 /src/client/util/DragManager.ts
parenta02bbf035b9b97fcebfa2db8ba1176e116863b9e (diff)
parent4ec18458fd21bd7d7307a3bab2e787346fc3ed0d (diff)
Merge branch 'master' into mobile_revision_direct
Diffstat (limited to 'src/client/util/DragManager.ts')
-rw-r--r--src/client/util/DragManager.ts52
1 files changed, 35 insertions, 17 deletions
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 2a9c1633a..f1afaf734 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -67,6 +67,7 @@ export function SetupDrag(
export namespace DragManager {
let dragDiv: HTMLDivElement;
+ let dragLabel: HTMLDivElement;
export let StartWindowDrag: Opt<((e: any, dragDocs: Doc[]) => void)> = undefined;
export function Root() {
@@ -97,7 +98,8 @@ export namespace DragManager {
readonly shiftKey: boolean,
readonly altKey: boolean,
readonly metaKey: boolean,
- readonly ctrlKey: boolean
+ readonly ctrlKey: boolean,
+ readonly embedKey: boolean,
) { }
}
@@ -210,7 +212,7 @@ export namespace DragManager {
e.docDragData && (e.docDragData.droppedDocuments =
dragData.draggedDocuments.map(d => !dragData.isSelectionMove && !dragData.userDropAction && ScriptCast(d.onDragStart) ? addAudioTag(ScriptCast(d.onDragStart).script.run({ this: d }).result) :
dragData.userDropAction === "alias" || (!dragData.userDropAction && dragData.dropAction === "alias") ? Doc.MakeAlias(d) :
- dragData.userDropAction === "copy" || (!dragData.userDropAction && dragData.dropAction === "copy") ? Doc.MakeClone(d) : d)
+ dragData.userDropAction === "copy" || (!dragData.userDropAction && dragData.dropAction === "copy") ? Doc.MakeDelegate(d) : d)
);
e.docDragData?.droppedDocuments.forEach((drop: Doc, i: number) =>
(dragData?.removeDropProperties || []).concat(Cast(dragData.draggedDocuments[i].removeDropProperties, listSpec("string"), [])).map(prop => drop[prop] = undefined)
@@ -309,14 +311,24 @@ export namespace DragManager {
};
}
export let docsBeingDragged: Doc[] = [];
+ export let CanEmbed = false;
export function StartDrag(eles: HTMLElement[], dragData: { [id: string]: any }, downX: number, downY: number, options?: DragOptions, finishDrag?: (dropData: DragCompleteEvent) => void) {
eles = eles.filter(e => e);
+ CanEmbed = false;
if (!dragDiv) {
dragDiv = document.createElement("div");
dragDiv.className = "dragManager-dragDiv";
dragDiv.style.pointerEvents = "none";
+ dragLabel = document.createElement("div") as HTMLDivElement;
+ dragLabel.className = "dragManager-dragLabel";
+ dragLabel.style.zIndex = "100001";
+ dragLabel.style.fontSize = "10";
+ dragLabel.style.position = "absolute";
+ dragLabel.innerText = "press 'a' to embed on drop";
+ dragDiv.appendChild(dragLabel);
DragManager.Root().appendChild(dragDiv);
}
+ dragLabel.style.display = "";
SnappingManager.SetIsDragging(true);
const scaleXs: number[] = [];
const scaleYs: number[] = [];
@@ -358,6 +370,7 @@ export namespace DragManager {
dragElement.style.transform = `translate(${rect.left + (options?.offsetX || 0)}px, ${rect.top + (options?.offsetY || 0)}px) scale(${scaleX}, ${scaleY})`;
dragElement.style.width = `${rect.width / scaleX}px`;
dragElement.style.height = `${rect.height / scaleY}px`;
+ dragLabel.style.transform = `translate(${rect.left + (options?.offsetX || 0)}px, ${rect.top + (options?.offsetY || 0) - 20}px)`;
if (docsBeingDragged.length) {
const pdfBox = dragElement.getElementsByTagName("canvas");
@@ -399,20 +412,21 @@ export namespace DragManager {
if (dragData instanceof DocumentDragData) {
dragData.userDropAction = e.ctrlKey && e.altKey ? "copy" : e.ctrlKey ? "alias" : undefined;
}
- if (e.shiftKey && dragData.droppedDocuments.length === 1) {
- !dragData.dropAction && (dragData.dropAction = alias);
- if (dragData.dropAction === "move") {
- dragData.removeDocument?.(dragData.draggedDocuments[0]);
+ if (e)
+ if (e.shiftKey && dragData.droppedDocuments.length === 1) {
+ !dragData.dropAction && (dragData.dropAction = alias);
+ if (dragData.dropAction === "move") {
+ dragData.removeDocument?.(dragData.draggedDocuments[0]);
+ }
+ AbortDrag();
+ finishDrag?.(new DragCompleteEvent(true, dragData));
+ DragManager.StartWindowDrag?.({
+ pageX: e.pageX,
+ pageY: e.pageY,
+ preventDefault: emptyFunction,
+ button: 0
+ }, dragData.droppedDocuments);
}
- AbortDrag();
- finishDrag?.(new DragCompleteEvent(true, dragData));
- DragManager.StartWindowDrag?.({
- pageX: e.pageX,
- pageY: e.pageY,
- preventDefault: emptyFunction,
- button: 0
- }, dragData.droppedDocuments);
- }
const { thisX, thisY } = snapDrag(e, xFromLeft, yFromTop, xFromRight, yFromBottom);
@@ -421,12 +435,14 @@ export namespace DragManager {
const moveY = thisY - lastY;
lastX = thisX;
lastY = thisY;
+ dragLabel.style.transform = `translate(${xs[0] + moveX + (options?.offsetX || 0)}px, ${ys[0] + moveY + (options?.offsetY || 0) - 20}px)`;
dragElements.map((dragElement, i) => (dragElement.style.transform =
`translate(${(xs[i] += moveX) + (options?.offsetX || 0)}px, ${(ys[i] += moveY) + (options?.offsetY || 0)}px) scale(${scaleXs[i]}, ${scaleYs[i]})`)
);
};
const hideDragShowOriginalElements = () => {
+ dragLabel.style.display = "none";
dragElements.map(dragElement => dragElement.parentNode === dragDiv && dragDiv.removeChild(dragElement));
eles.map(ele => ele.parentElement && ele.parentElement?.className === dragData.dragDivName ? (ele.parentElement.hidden = false) : (ele.hidden = false));
};
@@ -481,7 +497,8 @@ export namespace DragManager {
shiftKey: e.shiftKey,
altKey: e.altKey,
metaKey: e.metaKey,
- ctrlKey: e.ctrlKey
+ ctrlKey: e.ctrlKey,
+ embedKey: CanEmbed
}
})
);
@@ -496,7 +513,8 @@ export namespace DragManager {
shiftKey: e.shiftKey,
altKey: e.altKey,
metaKey: e.metaKey,
- ctrlKey: e.ctrlKey
+ ctrlKey: e.ctrlKey,
+ embedKey: CanEmbed
}
})
);