diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/client/util/DragManager.ts | 9 | ||||
-rw-r--r-- | src/client/views/TemplateMenu.tsx | 41 | ||||
-rw-r--r-- | src/client/views/nodes/CollectionFreeFormDocumentView.tsx | 1 | ||||
-rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 2 |
4 files changed, 25 insertions, 28 deletions
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts index b681387d1..9e6224d97 100644 --- a/src/client/util/DragManager.ts +++ b/src/client/util/DragManager.ts @@ -209,6 +209,7 @@ export namespace DragManager { } draggedDocuments: Doc[]; droppedDocuments: Doc[]; + dragDivName?: string; offset: number[]; dropAction: dropActionType; userDropAction: dropActionType; @@ -366,7 +367,7 @@ export namespace DragManager { dragElement.style.color = "black"; dragElement.style.transformOrigin = "0 0"; dragElement.style.zIndex = globalCssVariables.contextMenuZindex;// "1000"; - dragElement.style.transform = `translate(${x}px, ${y}px) scale(${scaleX}, ${scaleY})`; + dragElement.style.transform = `translate(${x + (options?.offsetX || 0)}px, ${y + (options?.offsetY || 0)}px) scale(${scaleX}, ${scaleY})`; dragElement.style.width = `${rect.width / scaleX}px`; dragElement.style.height = `${rect.height / scaleY}px`; @@ -408,7 +409,7 @@ export namespace DragManager { } } - eles.map(ele => ele.hidden = hideSource); + eles.map(ele => ele.parentElement && ele.parentElement?.className === dragData.dragDivName ? (ele.parentElement.hidden = hideSource) : (ele.hidden = hideSource)); let lastX = downX; let lastY = downY; @@ -433,13 +434,13 @@ export namespace DragManager { lastX = e.pageX; lastY = e.pageY; dragElements.map((dragElement, i) => (dragElement.style.transform = - `translate(${(xs[i] += moveX) + (options ? (options.offsetX || 0) : 0)}px, ${(ys[i] += moveY) + (options ? (options.offsetY || 0) : 0)}px) scale(${scaleXs[i]}, ${scaleYs[i]})`) + `translate(${(xs[i] += moveX) + (options?.offsetX || 0)}px, ${(ys[i] += moveY) + (options?.offsetY || 0)}px) scale(${scaleXs[i]}, ${scaleYs[i]})`) ); }; const hideDragShowOriginalElements = () => { dragElements.map(dragElement => dragElement.parentNode === dragDiv && dragDiv.removeChild(dragElement)); - eles.map(ele => ele.hidden = false); + eles.map(ele => ele.parentElement && ele.parentElement?.className === dragData.dragDivName ? (ele.parentElement.hidden = false) : (ele.hidden = false)); }; const endDrag = () => { document.removeEventListener("pointermove", moveHandler, true); diff --git a/src/client/views/TemplateMenu.tsx b/src/client/views/TemplateMenu.tsx index e6116ca09..8d9dc4cf7 100644 --- a/src/client/views/TemplateMenu.tsx +++ b/src/client/views/TemplateMenu.tsx @@ -63,31 +63,24 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> { SelectionManager.DeselectAll(); const topDocView = this.props.docs[0]; const topDoc = topDocView.props.Document; - const xf = topDocView.props.ScreenToLocalTransform(); - const ex = e.target.clientLeft; - const ey = e.target.clientTop; + const ex = e.target.getBoundingClientRect().left; + const ey = e.target.getBoundingClientRect().top; + const de = new DragManager.DocumentDragData([topDoc]); + de.dragDivName = topDocView.props.dragDivName; + de.moveDocument = topDocView.props.moveDocument; undoBatch(action(() => topDoc.z = topDoc.z ? 0 : 1))(); - if (e.target.checked) { - setTimeout(() => { - const newDocView = DocumentManager.Instance.getDocumentView(topDoc); - if (newDocView) { - const de = new DragManager.DocumentDragData([topDoc]); - de.moveDocument = topDocView.props.moveDocument; - const xf = newDocView.ContentDiv!.getBoundingClientRect(); - DragManager.StartDocumentDrag([newDocView.ContentDiv!], de, ex, ey, { - offsetX: (ex - xf.left), offsetY: (ey - xf.top), - handlers: { dragComplete: () => { }, }, - hideSource: false - }); - } - }, 10); - } else if (topDocView.props.ContainingCollectionView) { - const collView = topDocView.props.ContainingCollectionView; - const [sx, sy] = xf.inverse().transformPoint(0, 0); - const [x, y] = collView.props.ScreenToLocalTransform().transformPoint(sx, sy); - topDoc.x = x; - topDoc.y = y; - } + setTimeout(() => { + const newDocView = DocumentManager.Instance.getDocumentView(topDoc); + if (newDocView) { + const contentDiv = newDocView.ContentDiv!; + const xf = contentDiv.getBoundingClientRect(); + DragManager.StartDocumentDrag([contentDiv], de, ex, ey, { + offsetX: ex - xf.left, offsetY: ey - xf.top, + handlers: { dragComplete: () => { }, }, + hideSource: true + }); + } + }, 0); } @undoBatch diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index d599de56e..261a88deb 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -104,6 +104,7 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF zIndex: this.Document.zIndex || 0, }} > <DocumentView {...this.props} + dragDivName={"collectionFreeFormDocumentView-container"} ContentScaling={this.contentScaling} ScreenToLocalTransform={this.getTransform} backgroundColor={this.clusterColorFunc} diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 11c012252..1b2d92027 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -57,6 +57,7 @@ export interface DocumentViewProps { LibraryPath: Doc[]; fitToBox?: boolean; onClick?: ScriptField; + dragDivName?: string; addDocument?: (doc: Doc) => boolean; removeDocument?: (doc: Doc) => boolean; moveDocument?: (doc: Doc, targetCollection: Doc, addDocument: (document: Doc) => boolean) => boolean; @@ -130,6 +131,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu dragData.dropAction = dropAction; dragData.moveDocument = this.Document.onDragStart ? undefined : this.props.moveDocument; dragData.applyAsTemplate = applyAsTemplate; + dragData.dragDivName = this.props.dragDivName; DragManager.StartDocumentDrag([this._mainCont.current], dragData, x, y, { handlers: { dragComplete: action((emptyFunction)) |