aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/collections/collectionSchema/CollectionSchemaView.tsx')
-rw-r--r--src/client/views/collections/collectionSchema/CollectionSchemaView.tsx75
1 files changed, 69 insertions, 6 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 20d809232..9ca1644e3 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -9,6 +9,10 @@ import { CollectionSubView } from '../CollectionSubView';
import './CollectionSchemaView.scss';
import { SchemaColumnHeader } from './SchemaColumnHeader';
import { SchemaRowBox } from './SchemaRowBox';
+import { DragManager } from '../../../util/DragManager';
+import { PresBox } from '../../nodes/trails/PresBox';
+import { UndoManager } from '../../../util/UndoManager';
+import { returnFalse } from '../../../../Utils';
export enum ColumnType {
Number,
@@ -25,7 +29,8 @@ export class CollectionSchemaView extends CollectionSubView() {
private _lastSelectedRow: number | undefined;
@observable _rowMenuWidth: number = 60;
- @observable _selectedDocs: ObservableSet = new ObservableSet<Doc>();
+ @observable _selectedDocs: ObservableSet = new ObservableSet<SchemaRowBox>();
+ @observable _isDragging: boolean = false;
@computed get columnKeys() {
return Cast(this.props.Document.columnKeys, listSpec('string'), defaultColumnKeys);
@@ -48,15 +53,18 @@ export class CollectionSchemaView extends CollectionSubView() {
};
@action
- selectRow = (doc: Doc, ctrl?: boolean, shift?: boolean) => {
+ selectRow = (e: React.PointerEvent, doc: Doc) => {
+ const ctrl = e.ctrlKey || e.metaKey;
+ const shift = e.shiftKey;
if (shift && this._lastSelectedRow !== undefined) {
- const currSelectedRow = this.childDocs.indexOf(doc);
- const startRow = Math.min(this._lastSelectedRow, currSelectedRow);
- const endRow = Math.max(this._lastSelectedRow, currSelectedRow);
+ const currRowIndex = this.childDocs.indexOf(doc);
+ const startRow = Math.min(this._lastSelectedRow, currRowIndex);
+ const endRow = Math.max(this._lastSelectedRow, currRowIndex);
for (let i = startRow; i <= endRow; i++) {
- const currDoc = this.childDocs[i];
+ const currDoc: Doc = this.childDocs[i];
if (!this._selectedDocs.has(currDoc)) this._selectedDocs.add(currDoc);
}
+ this._lastSelectedRow = endRow;
} else if (ctrl) {
if (!this._selectedDocs.has(doc)) {
this._selectedDocs.add(doc);
@@ -71,6 +79,58 @@ export class CollectionSchemaView extends CollectionSubView() {
}
};
+ @action
+ sortedSelectedDocs = (): Doc[] => {
+ return this.childDocs.filter(doc => this._selectedDocs.has(doc));
+ };
+
+ @action.bound
+ moveDocument = (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => {
+ console.log('hello');
+ console.log(targetCollection?.title);
+ if (Doc.AreProtosEqual(this.props.Document, targetCollection)) {
+ console.log('hi');
+ return true;
+ }
+ const first = document instanceof Doc ? document : document[0];
+ if (!first?._stayInCollection && addDocument !== returnFalse) {
+ UndoManager.RunInTempBatch(() => this.props.removeDocument?.(document) && addDocument(document));
+ return true;
+ }
+ return false;
+ };
+
+ @action
+ startDrag = (e: React.PointerEvent, doc: Doc) => {
+ if (this._selectedDocs.size === 0) this._selectedDocs.add(doc);
+ this._isDragging = true;
+ const dragData = new DragManager.DocumentDragData(this.sortedSelectedDocs(), 'move');
+ dragData.moveDocument = this.moveDocument;
+ const dragItem: HTMLElement[] = [];
+ const dragDiv = document.createElement('div');
+ dragDiv.className = 'presItem-multiDrag';
+ dragDiv.innerText = 'Move ' + this._selectedDocs.size + ' rows';
+ dragDiv.style.position = 'absolute';
+ dragDiv.style.top = e.clientY + 'px';
+ dragDiv.style.left = e.clientX - 50 + 'px';
+ dragItem.push(dragDiv);
+
+ DragManager.StartDocumentDrag(
+ dragItem.map(ele => ele),
+ dragData,
+ e.clientX,
+ e.clientY,
+ undefined
+ );
+ this._isDragging = false;
+ return true;
+ };
+
+ @action
+ endDrag = (e: React.PointerEvent) => {
+ // this._isDragging = false;
+ };
+
render() {
return (
<div className="collectionSchemaView">
@@ -92,6 +152,9 @@ export class CollectionSchemaView extends CollectionSubView() {
rowMenuWidth={this._rowMenuWidth}
selectedRows={this._selectedDocs}
selectRow={this.selectRow}
+ startDrag={this.startDrag}
+ endDrag={this.endDrag}
+ dragging={this._isDragging}
/>
))}
</div>