From 87124df2d90c905f5b10a6cef58d2db44cb6aed6 Mon Sep 17 00:00:00 2001 From: Sam Wilkins Date: Tue, 14 Jan 2020 19:46:50 -0500 Subject: initial propagation of collectionmulticolumnview --- src/client/views/CollectionMulticolumnView.tsx | 4 ++-- src/client/views/collections/CollectionSubView.tsx | 6 ++++-- src/client/views/collections/CollectionView.tsx | 8 ++++++-- 3 files changed, 12 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/views/CollectionMulticolumnView.tsx b/src/client/views/CollectionMulticolumnView.tsx index 94e86c048..da5b18155 100644 --- a/src/client/views/CollectionMulticolumnView.tsx +++ b/src/client/views/CollectionMulticolumnView.tsx @@ -12,6 +12,7 @@ const MulticolumnDocument = makeInterface(documentSchema); @observer export default class CollectionMulticolumnView extends CollectionSubView(MulticolumnDocument) { + private _dropDisposer?: DragManager.DragDropDisposer; constructor(props: Readonly) { super(props); @@ -19,8 +20,7 @@ export default class CollectionMulticolumnView extends CollectionSubView(Multico Document.multicolumnData = new Doc(); } - private _dropDisposer?: DragManager.DragDropDisposer; - protected createDropTarget = (ele: HTMLDivElement) => { //used for stacking and masonry view + protected createDropTarget = (ele: HTMLDivElement) => { this._dropDisposer && this._dropDisposer(); if (ele) { this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)); diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx index 062521690..5753dd34e 100644 --- a/src/client/views/collections/CollectionSubView.tsx +++ b/src/client/views/collections/CollectionSubView.tsx @@ -85,8 +85,10 @@ export function CollectionSubView(schemaCtor: (doc: Doc) => T) { return this.props.annotationsKey ? (this.extensionDoc ? this.extensionDoc[this.props.annotationsKey] : undefined) : this.dataDoc[this.props.fieldKey]; } - get childLayoutPairs() { - return this.childDocs.map(cd => Doc.GetLayoutDataDocPair(this.props.Document, this.props.DataDoc, this.props.fieldKey, cd)).filter(pair => pair.layout).map(pair => ({ layout: pair.layout!, data: pair.data! })); + get childLayoutPairs(): { layout: Doc; data: Doc; }[] { + const { Document, DataDoc, fieldKey } = this.props; + const validPairs = this.childDocs.map(doc => Doc.GetLayoutDataDocPair(Document, DataDoc, fieldKey, doc)).filter(pair => pair.layout); + return validPairs.map(({ data, layout }) => ({ data: data!, layout: layout! })); // this mapping is a bit of a hack to coerce types } get childDocList() { return Cast(this.dataField, listSpec(Doc)); diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index 55f0de779..26df89796 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -35,6 +35,7 @@ import { Touchable } from '../Touchable'; import { TraceMobx } from '../../../new_fields/util'; import { Utils } from '../../../Utils'; import { ScriptBox } from '../ScriptBox'; +import CollectionMulticolumnView from '../CollectionMulticolumnView'; const path = require('path'); library.add(faTh, faTree, faSquare, faProjectDiagram, faSignature, faThList, faFingerprint, faColumns, faEllipsisV, faImage, faEye as any, faCopy); @@ -48,7 +49,8 @@ export enum CollectionViewType { Masonry, Pivot, Linear, - Staff + Staff, + Multicolumn } export namespace CollectionViewType { @@ -61,7 +63,8 @@ export namespace CollectionViewType { ["stacking", CollectionViewType.Stacking], ["masonry", CollectionViewType.Masonry], ["pivot", CollectionViewType.Pivot], - ["linear", CollectionViewType.Linear] + ["linear", CollectionViewType.Linear], + ["multicolumn", CollectionViewType.Multicolumn] ]); export const valueOf = (value: string) => stringMapping.get(value.toLowerCase()); @@ -173,6 +176,7 @@ export class CollectionView extends Touchable { case CollectionViewType.Docking: return (); case CollectionViewType.Tree: return (); case CollectionViewType.Staff: return (); + case CollectionViewType.Multicolumn: return (); case CollectionViewType.Linear: { return (); } case CollectionViewType.Stacking: { this.props.Document.singleColumn = true; return (); } case CollectionViewType.Masonry: { this.props.Document.singleColumn = false; return (); } -- cgit v1.2.3-70-g09d2