From f1ee3a6baffb22093d81e123d70f6ec9631c2075 Mon Sep 17 00:00:00 2001 From: bobzel Date: Thu, 15 Oct 2020 15:20:51 -0400 Subject: got rid of isDragging in favor of a field on the PresElement. fixed moving items in presBox by fixing websocket to maintain ordering on sequential operations on a list. fixed list splicing to not call addToSet unless splicing is at end of list. fixed setting return scale when following link into portal --- .../views/presentationview/PresElementBox.tsx | 43 +++++++++++----------- 1 file changed, 22 insertions(+), 21 deletions(-) (limited to 'src/client/views/presentationview') diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 9052967e5..1d6721bca 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -1,5 +1,5 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { action, computed, IReactionDisposer, reaction, runInAction } from "mobx"; +import { action, computed, IReactionDisposer, reaction, runInAction, observable } from "mobx"; import { observer } from "mobx-react"; import { Doc, DataSym, DocListCast } from "../../../fields/Doc"; import { documentSchema } from '../../../fields/documentSchemas'; @@ -8,13 +8,11 @@ import { createSchema, makeInterface, listSpec } from '../../../fields/Schema'; import { Cast, NumCast, BoolCast, ScriptCast, StrCast } from "../../../fields/Types"; import { emptyFunction, emptyPath, returnFalse, returnTrue, returnOne, returnZero, numberRange, setupMoveUpEvents } from "../../../Utils"; import { Transform } from "../../util/Transform"; -import { CollectionViewType } from '../collections/CollectionView'; import { ViewBoxBaseComponent } from '../DocComponent'; import { ContentFittingDocumentView } from '../nodes/ContentFittingDocumentView'; import { FieldView, FieldViewProps } from '../nodes/FieldView'; import "./PresElementBox.scss"; import React = require("react"); -import { CollectionFreeFormDocumentView } from "../nodes/CollectionFreeFormDocumentView"; import { PresBox, PresMovement } from "../nodes/PresBox"; import { DocumentType } from "../../documents/DocumentTypes"; import { Tooltip } from "@material-ui/core"; @@ -45,6 +43,8 @@ const PresDocument = makeInterface(presSchema, documentSchema); export class PresElementBox extends ViewBoxBaseComponent(PresDocument) { public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresElementBox, fieldKey); } _heightDisposer: IReactionDisposer | undefined; + + @observable _dragging = false; // these fields are conditionally computed fields on the layout document that take this document as a parameter @computed get indexInPres() { return Number(this.lookupField("indexInPres")); } // the index field is where this document is in the presBox display list (since this value is different for each presentation element, the value can't be stored on the layout template which is used by all display elements) @computed get collapsedHeight() { return Number(this.lookupField("presCollapsedHeight")); } // the collapsed height changes depending on the state of the presBox. We could store this on the presentation element template if it's used by only one presentation - but if it's shared by multiple, then this value must be looked up @@ -159,9 +159,9 @@ export class PresElementBox extends ViewBoxBaseComponent { - const activeItem = this.rootDoc; - activeItem.dragging = false; + this._dragging = false; e.stopPropagation(); e.preventDefault(); } @@ -172,12 +172,12 @@ export class PresElementBox extends ViewBoxBaseComponent { const doc = ele; - doc.className = "presItem-slide" + doc.className = "presItem-slide"; dragItem.push(doc); }); if (activeItem) { DragManager.StartDocumentDrag(dragItem.map(ele => ele), dragData, e.clientX, e.clientY); - activeItem.dragging = true; + runInAction(() => this._dragging = true); return true; } return false; @@ -189,18 +189,20 @@ export class PresElementBox extends ViewBoxBaseComponent { - const slide = this._itemRef.current!; - const rect = slide?.getBoundingClientRect(); - let y = e.clientY - rect.top; //y position within the element. - let height = slide.clientHeight; - let halfLine = height / 2; - if (DragManager.docsBeingDragged.length > 1) { - if (y <= halfLine) { - slide.style.borderTop = "solid 2px #5B9FDD"; - slide.style.borderBottom = "0px"; - } else if (y > halfLine) { - slide.style.borderTop = "0px"; - slide.style.borderBottom = "solid 2px #5B9FDD"; + const slide = this._itemRef.current; + if (slide) { + const rect = slide.getBoundingClientRect(); + const y = e.clientY - rect.top; //y position within the element. + const height = slide.clientHeight; + const halfLine = height / 2; + if (DragManager.docsBeingDragged.length) { + if (y <= halfLine) { + slide.style.borderTop = "solid 2px #5B9FDD"; + slide.style.borderBottom = "0px"; + } else if (y > halfLine) { + slide.style.borderTop = "0px"; + slide.style.borderBottom = "solid 2px #5B9FDD"; + } } } document.removeEventListener("pointermove", this.onPointerMove); @@ -244,7 +246,6 @@ export class PresElementBox extends ViewBoxBaseComponent= 300; const targetDoc: Doc = Cast(this.rootDoc.presentationTargetDoc, Doc, null); @@ -252,7 +253,7 @@ export class PresElementBox extends ViewBoxBaseComponent { e.stopPropagation(); e.preventDefault(); -- cgit v1.2.3-70-g09d2