diff options
| author | Aubrey Li <Aubrey-Li> | 2022-03-15 18:59:41 -0400 |
|---|---|---|
| committer | Aubrey Li <Aubrey-Li> | 2022-03-15 18:59:41 -0400 |
| commit | 33cb4ee1c5a6ff07f2c1096d94259c0e2999f1c1 (patch) | |
| tree | 9fdf01d9b40cf24bd41fcf55bb5951c0798076f0 /src/client/views/collections | |
| parent | 3573a81d334cf8cc13d19b04c6f2094c24c43932 (diff) | |
marquee create slide
Diffstat (limited to 'src/client/views/collections')
| -rw-r--r-- | src/client/views/collections/CollectionStackingViewFieldColumn.tsx | 13 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/MarqueeView.tsx | 48 |
2 files changed, 56 insertions, 5 deletions
diff --git a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx index 58289a161..7f96217b8 100644 --- a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx +++ b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx @@ -59,6 +59,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC @observable _paletteOn = false; @observable _heading = this.props.headingObject ? this.props.headingObject.heading : this.props.heading; @observable _color = this.props.headingObject ? this.props.headingObject.color : "#f1efeb"; + _ele: HTMLElement | null = null; createColumnDropRef = (ele: HTMLDivElement | null) => { @@ -69,6 +70,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC this.dropDisposer = DragManager.MakeDropTarget(ele, this.columnDrop.bind(this)); } } + componentWillUnmount() { this.props.unobserveHeight(this._ele); } @@ -237,6 +239,9 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC const pt = this.props.screenToLocalTransform().inverse().transformPoint(x, y); ContextMenu.Instance.displayMenu(x, y, undefined, true); } + + + @computed get innards() { TraceMobx(); const key = this.props.pivotField; @@ -307,7 +312,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC }}> {this.props.renderChildren(this.props.docList)} </div> - {!this.props.chromeHidden && type !== DocumentType.PRES ? + {!this.props.chromeHidden ? <div key={`${heading}-add-document`} className="collectionStackingView-addDocumentButton" style={{ width: this.props.columnWidth / this.props.numGroupColumns, marginBottom: 10 }}> <EditableView @@ -317,7 +322,11 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC contents={"+ NEW"} toggle={this.toggleVisibility} menuCallback={this.menuCallback} /> - </div> : null} + </div> + : null + } + + </div> } </>; diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 08da682bb..dbd15be3b 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -25,6 +25,7 @@ import { PreviewCursor } from "../../PreviewCursor"; import { CollectionDockingView } from "../CollectionDockingView"; import { SubCollectionViewProps } from "../CollectionSubView"; import { CollectionView } from "../CollectionView"; +import { CollectionStackingViewFieldColumn } from "../CollectionStackingViewFieldColumn"; import { MarqueeOptionsMenu } from "./MarqueeOptionsMenu"; import "./MarqueeView.scss"; import React = require("react"); @@ -51,7 +52,7 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque @observable _lastY: number = 0; @observable _downX: number = 0; @observable _downY: number = 0; - @observable _visible: boolean = false; + @observable _visible: boolean = false; // selection rentangle for marquee selection/free hand lasso is visible @observable _lassoPts: [number, number][] = []; @observable _lassoFreehand: boolean = false; @@ -260,7 +261,13 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque document.removeEventListener("pointerdown", hideMarquee); document.removeEventListener("wheel", hideMarquee); }; - if (!this._commandExecuted && (Math.abs(this.Bounds.height * this.Bounds.width) > 100)) { + if (PresBox.startMarquee) { + console.log(PresBox.startMarquee); + this.pinMarqueeView(); + PresBox.startMarquee = false; + console.log(PresBox.startMarquee); + } + if (!this._commandExecuted && (Math.abs(this.Bounds.height * this.Bounds.width) > 100) && !PresBox.startMarquee) { MarqueeOptionsMenu.Instance.createCollection = this.collection; MarqueeOptionsMenu.Instance.delete = this.delete; MarqueeOptionsMenu.Instance.summarize = this.summary; @@ -382,6 +389,41 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque @undoBatch @action + pinMarqueeView = () => { + const doc = this.props.Document; + const curPres = Cast(Doc.UserDoc().activePresentation, Doc) as Doc; + if (curPres) { + console.log(curPres); + if (doc === curPres) { alert("Cannot pin presentation document to itself"); return; } + const pinDoc = Doc.MakeAlias(doc); + pinDoc.presentationTargetDoc = doc; + pinDoc.presMovement = PresMovement.Zoom; + pinDoc.groupWithUp = false; + pinDoc.context = curPres; + pinDoc.title = doc.title + " - Slide"; + const presArray = PresBox.Instance?.sortArray(); + const size = PresBox.Instance?._selectedArray.size; + const presSelected = presArray && size ? presArray[size - 1] : undefined; + Doc.AddDocToList(curPres, "data", pinDoc, presSelected); + if (curPres.expandBoolean) pinDoc.presExpandInlineButton = true; + if (!DocumentManager.Instance.getDocumentView(curPres)) { + CollectionDockingView.AddSplit(curPres, "right"); + } + PresBox.Instance?._selectedArray.clear(); + pinDoc && PresBox.Instance?._selectedArray.set(pinDoc, undefined); //Updates selected array + const index = PresBox.Instance?.childDocs.indexOf(pinDoc); + index && (curPres._itemIndex = index); + const scale = Math.min(this.props.PanelWidth() / this.Bounds.width, this.props.PanelHeight() / this.Bounds.height); + pinDoc.presPinView = true; + pinDoc.presPinViewX = this.Bounds.left + this.Bounds.width / 2; + pinDoc.presPinViewY = this.Bounds.top + this.Bounds.height / 2; + pinDoc.presPinViewScale = scale; + } + this.hideMarquee(); + } + + @undoBatch + @action pinWithView = (e: KeyboardEvent | React.PointerEvent | undefined) => { const doc = this.props.Document; const curPres = Cast(Doc.UserDoc().activePresentation, Doc) as Doc; @@ -647,7 +689,7 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque return <div className="marqueeView" style={{ overflow: StrCast(this.props.Document._overflow), - cursor: CurrentUserUtils.SelectedTool === InkTool.Pen ? "crosshair" : "pointer" + cursor: CurrentUserUtils.SelectedTool === InkTool.Pen || this._visible || PresBox.startMarquee ? "crosshair" : "pointer" }} onDragOver={e => e.preventDefault()} |
