From b12143cc9822e2d590212363e02a1f8771c81e3b Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 3 May 2019 12:36:06 -0400 Subject: more icon fixes for multiple documents. --- src/client/views/DocumentDecorations.tsx | 95 ++++++++++------------ .../views/nodes/CollectionFreeFormDocumentView.tsx | 35 ++++---- src/client/views/nodes/IconBox.tsx | 6 +- 3 files changed, 64 insertions(+), 72 deletions(-) (limited to 'src') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 9771c6580..2299f4c32 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -25,6 +25,10 @@ import { faLink } from '@fortawesome/free-solid-svg-icons'; import { library } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { MINIMIZED_ICON_SIZE } from "../views/globalCssVariables.scss"; +import { CollectionFreeFormView } from "./collections/collectionFreeForm/CollectionFreeFormView"; +import { CollectionView } from "./collections/CollectionView"; +import { createCipher } from "crypto"; +import { FieldView } from "./nodes/FieldView"; library.add(faLink); @@ -41,6 +45,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> private _linkerButton = React.createRef(); private _downX = 0; private _downY = 0; + private _iconDoc?: Doc = undefined; @observable private _minimizedX = 0; @observable private _minimizedY = 0; @observable private _title: string = ""; @@ -194,6 +199,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> @action onMinimizeDown = (e: React.PointerEvent): void => { e.stopPropagation(); + this._iconDoc = undefined; if (e.button === 0) { this._downX = e.pageX; this._downY = e.pageY; @@ -220,26 +226,46 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> this._minimizedX = snapped ? selDocPos[0] + 4 : e.clientX; this._minimizedY = snapped ? selDocPos[1] - 18 : e.clientY; let selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd); - Promise.all(selectedDocs.map(selDoc => this.getIconDoc(selDoc))).then(minDocSet => - this.moveIconDocs(SelectionManager.SelectedDocuments()) - ); + + if (selectedDocs.length > 1) { + this._iconDoc = this._iconDoc ? this._iconDoc : this.createIcon(SelectionManager.SelectedDocuments(), CollectionView.LayoutString()); + this.moveIconDoc(this._iconDoc); + } else { + this.getIconDoc(selectedDocs[0]).then(icon => icon && this.moveIconDoc(this._iconDoc = icon)); + } this._removeIcon = snapped; } } + @action + onMinimizeUp = (e: PointerEvent): void => { + e.stopPropagation(); + if (e.button === 0) { + document.removeEventListener("pointermove", this.onMinimizeMove); + document.removeEventListener("pointerup", this.onMinimizeUp); + let selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd); + if (this._iconDoc && selectedDocs.length === 1 && this._removeIcon) { + selectedDocs[0].props.removeDocument && selectedDocs[0].props.removeDocument(this._iconDoc); + } + !this._removeIcon && selectedDocs.length === 1 && this.getIconDoc(selectedDocs[0]).then(icon => selectedDocs[0].props.toggleMinimized()); + this._removeIcon = false; + } + runInAction(() => this._minimizedX = this._minimizedY = 0); + } - @action createIcon = (docView: DocumentView, layoutString: string): Doc => { - let doc = docView.props.Document; + @action createIcon = (selected: DocumentView[], layoutString: string): Doc => { + let doc = selected[0].props.Document; let iconDoc = Docs.IconDocument(layoutString); - iconDoc.title = "ICON" + StrCast(doc.title); + iconDoc.title = selected.length > 1 ? "ICONset" : "ICON" + StrCast(doc.title); iconDoc.labelField = this._fieldKey; + iconDoc[this._fieldKey] = selected.length > 1 ? "collection" : undefined; iconDoc.isMinimized = false; iconDoc.width = Number(MINIMIZED_ICON_SIZE); iconDoc.height = Number(MINIMIZED_ICON_SIZE); iconDoc.x = NumCast(doc.x); iconDoc.y = NumCast(doc.y) - 24; - iconDoc.maximizedDoc = doc; + iconDoc.maximizedDocs = new List(selected.map(s => s.props.Document)); doc.minimizedDoc = iconDoc; - docView.props.addDocument && docView.props.addDocument(iconDoc, false); + selected[0].props.addDocument && selected[0].props.addDocument(iconDoc, false); return iconDoc; } @action @@ -247,56 +273,21 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> let doc = docView.props.Document; let iconDoc: Doc | undefined = await Cast(doc.minimizedDoc, Doc); if (!iconDoc) { - const background = StrCast(doc.backgroundLayout, undefined); - if (background) { - iconDoc = this.createIcon(docView, background); - } else { - const layout = StrCast(doc.layout, undefined); - if (layout) { - iconDoc = this.createIcon(docView, layout); - } - } + const layout = StrCast(doc.backgroundLayout, StrCast(doc.layout, FieldView.LayoutString(DocumentView))); + iconDoc = this.createIcon([docView], layout); } if (SelectionManager.SelectedDocuments()[0].props.addDocument !== undefined) { SelectionManager.SelectedDocuments()[0].props.addDocument!(iconDoc!); } return iconDoc; } - @action - onMinimizeUp = (e: PointerEvent): void => { - e.stopPropagation(); - if (e.button === 0) { - document.removeEventListener("pointermove", this.onMinimizeMove); - document.removeEventListener("pointerup", this.onMinimizeUp); - let selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd); - Promise.all(selectedDocs.map(selDoc => this.getIconDoc(selDoc))).then(minDocSet => { - let minDocs = minDocSet.filter(minDoc => minDoc instanceof Doc).map(minDoc => minDoc as Doc); - minDocs.map(minDoc => { - minDoc.x = NumCast(minDocs[0].x); - minDoc.y = NumCast(minDocs[0].y); - minDoc.linkedIconTags = new List(minDocs.filter(d => d !== minDoc)); - if (this._removeIcon && selectedDocs[0].props.removeDocument) { - selectedDocs[0].props.removeDocument(minDoc); - (minDoc.maximizedDoc as Doc).minimizedDoc = undefined; - } - }); - runInAction(() => this._minimizedX = this._minimizedY = 0); - selectedDocs[0].props.toggleMinimized(); - this._removeIcon = false; - }); - } - } - moveIconDocs(selViews: DocumentView[], minDocSet?: FieldResult[]) { - selViews.map(selDoc => { - let minDoc = selDoc.props.Document.minimizedDoc; - if (minDoc instanceof Doc) { - let zoom = NumCast(selDoc.props.Document.zoomBasis, 1); - let where = (selDoc.props.ScreenToLocalTransform()).scale(selDoc.props.ContentScaling()).scale(1 / zoom). - transformPoint(this._minimizedX - 12, this._minimizedY - 12); - minDoc.x = where[0] + NumCast(selDoc.props.Document.x); - minDoc.y = where[1] + NumCast(selDoc.props.Document.y); - } - }); + moveIconDoc(iconDoc: Doc) { + let selView = SelectionManager.SelectedDocuments()[0]; + let zoom = NumCast(selView.props.Document.zoomBasis, 1); + let where = (selView.props.ScreenToLocalTransform()).scale(selView.props.ContentScaling()).scale(1 / zoom). + transformPoint(this._minimizedX - 12, this._minimizedY - 12); + iconDoc.x = where[0] + NumCast(selView.props.Document.x); + iconDoc.y = where[1] + NumCast(selView.props.Document.y); } @action diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index 53298fbdd..6bb00dd5c 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -11,6 +11,7 @@ import { OmitKeys, Utils } from "../../../Utils"; import { SelectionManager } from "../../util/SelectionManager"; import { matchedData } from "express-validator/filter"; import { Doc } from "../../../new_fields/Doc"; +import { List } from "../../../new_fields/List"; export interface CollectionFreeFormDocumentViewProps extends DocumentViewProps { } @@ -112,23 +113,23 @@ export class CollectionFreeFormDocumentView extends DocComponent => { SelectionManager.DeselectAll(); let isMinimized: boolean | undefined; - let minimizedDocSet = Cast(this.props.Document.linkedIconTags, listSpec(Doc), []); - let docs = minimizedDocSet.map(d => d); - let minimDoc = Cast(this.props.Document.minimizedDoc, Doc); - if (minimDoc instanceof Doc) docs.push(minimDoc); - else docs.push(this.props.Document); - docs.map(async minimizedDoc => { - this.props.addDocument && this.props.addDocument(minimizedDoc, false); - let maximizedDoc = await Cast(minimizedDoc.maximizedDoc, Doc); - if (maximizedDoc && !maximizedDoc.isIconAnimating) { + let maximizedDocs = await Cast(this.props.Document.maximizedDocs, listSpec(Doc)); + let minimizedDoc: Doc | undefined = this.props.Document; + if (!maximizedDocs) { + minimizedDoc = await Cast(this.props.Document.minimizedDoc, Doc); + if (minimizedDoc) maximizedDocs = await Cast(minimizedDoc.maximizedDocs, listSpec(Doc)); + } + if (minimizedDoc && maximizedDocs && maximizedDocs instanceof List && !maximizedDocs.some(md => BoolCast(md.isIconAnimating))) { + let minimizedTarget = minimizedDoc; + maximizedDocs.map(maximizedDoc => { maximizedDoc.isIconAnimating = true; if (isMinimized === undefined) { let maximizedDocMinimizedState = Cast(maximizedDoc.isMinimized, "boolean"); isMinimized = (maximizedDocMinimizedState) ? true : false; } if (isMinimized) this.props.bringToFront(maximizedDoc); - let minx = NumCast(minimizedDoc.x, undefined); - let miny = NumCast(minimizedDoc.y, undefined); + let minx = NumCast(minimizedTarget.x, undefined); + let miny = NumCast(minimizedTarget.y, undefined); let maxx = NumCast(maximizedDoc.x, undefined); let maxy = NumCast(maximizedDoc.y, undefined); let maxw = NumCast(maximizedDoc.width, undefined); @@ -137,8 +138,8 @@ export class CollectionFreeFormDocumentView extends DocComponent { this._downX = e.clientX; @@ -149,9 +150,9 @@ export class CollectionFreeFormDocumentView extends DocComponent d instanceof Doc).map(maxDoc => this.props.addDocument!(maxDoc, false)); this.toggleIcon(); } } @@ -169,7 +170,7 @@ export class CollectionFreeFormDocumentView extends DocComponent { public static LayoutString() { return FieldView.LayoutString(IconBox); } - @computed get maximized() { return Cast(this.props.Document.maximizedDoc, Doc); } @computed get layout(): string { const field = Cast(this.props.Document[this.props.fieldKey], IconField); return field ? field.icon : "

Error loading icon data

"; } @computed get minimizedIcon() { return IconBox.DocumentIcon(this.layout); } @@ -54,8 +54,8 @@ export class IconBox extends React.Component { render() { let labelField = StrCast(this.props.Document.labelField); let hideLabel = BoolCast(this.props.Document.hideLabel); - let maxDoc = Cast(this.props.Document.maximizedDoc, Doc) as Doc; - let label = !hideLabel && maxDoc && labelField ? maxDoc[labelField] : ""; + let maxDoc = Cast(this.props.Document.maximizedDocs, listSpec(Doc), []); + let label = !hideLabel && maxDoc && labelField ? (maxDoc.length === 1 ? maxDoc[0][labelField] : this.props.Document[labelField]) : ""; return (
{this.minimizedIcon} -- cgit v1.2.3-70-g09d2