1 files changed, 43 insertions, 44 deletions

diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index 20644715d..76536ed48 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import * as React from 'react';
 import { ClientUtils, DashColor, returnFalse, returnZero } from '../../../ClientUtils';
 import { emptyFunction, numberRange } from '../../../Utils';
-import { emptyFunction, numberRange } from '../../../Utils';
 import { Doc, NumListCast } from '../../../fields/Doc';
 import { DocData } from '../../../fields/DocSymbols';
 import { Id } from '../../../fields/FieldSymbols';
@@ -49,8 +48,8 @@ export class CollectionCardView extends CollectionSubView() {
     @observable _docRefs = new ObservableMap<Doc, DocumentView>();
     _draggerRef = React.createRef<HTMLDivElement>();
     @observable _maxRowCount = 10;
-    @observable docsBeingDragged: number[] = [];
-    @observable draggedIndex: number = -1;
+    @observable _docsDraggedIndex: number[] = [];
+    @observable _isACardBeingDragged: boolean = false;
     @observable overIndex: number = -1;
 
     static getButtonGroup(groupFieldKey: 'chat' | 'star' | 'idea' | 'like', doc: Doc): number | undefined {
@@ -232,21 +231,21 @@ export class CollectionCardView extends CollectionSubView() {
      * @param index
      * @returns
      */
-    translateSelected = (index: number): number => {
-        // if (this.isSelected(index)) {
-        const middleOfPanel = this._props.PanelWidth() / 2;
-        const scaledNodeWidth = this.panelWidth() * 1.25;
+    // translateSelected = (index: number): number => {
+    //     // if (this.isSelected(index)) {
+    //     const middleOfPanel = this._props.PanelWidth() / 2;
+    //     const scaledNodeWidth = this.panelWidth() * 1.25;
 
-        // Calculate the position of the node's left edge before scaling
-        const nodeLeftEdge = index * this.panelWidth();
-        // Find the center of the node after scaling
-        const scaledNodeCenter = nodeLeftEdge + scaledNodeWidth / 2;
+    //     // Calculate the position of the node's left edge before scaling
+    //     const nodeLeftEdge = index * this.panelWidth();
+    //     // Find the center of the node after scaling
+    //     const scaledNodeCenter = nodeLeftEdge + scaledNodeWidth / 2;
 
-        // Calculate the translation needed to align the scaled node's center with the panel's center
-        const translation = middleOfPanel - scaledNodeCenter - scaledNodeWidth - scaledNodeWidth / 4;
+    //     // Calculate the translation needed to align the scaled node's center with the panel's center
+    //     const translation = middleOfPanel - scaledNodeCenter - scaledNodeWidth - scaledNodeWidth / 4;
 
-        return translation;
-    };
+    //     return translation;
+    // };
 
     /**
      * Called in the sortedDocsType method. Compares the cards' value in regards to the desired sort type-- earlier cards are move to the
@@ -498,34 +497,34 @@ export class CollectionCardView extends CollectionSubView() {
         return <FontAwesomeIcon icon={icon} size="lg" style={{ color }} />;
     };
 
-    @action
-    onDragStart = (index: number) => {
-        this.draggedIndex = index;
-    };
-
-    @action
-    onDragOver = (index: number) => {
-        if (this.draggedIndex !== index) {
-            this.overIndex = index;
-        }
-    };
-
-    @action
-    onDrop = () => {
-        if (this.draggedIndex !== -1 && this.overIndex !== -1) {
-            const draggedDoc = this.sortedDocs[this.draggedIndex];
-            this.sortedDocs.splice(this.draggedIndex, 1);
-            this.sortedDocs.splice(this.overIndex, 0, draggedDoc);
-            this.draggedIndex = -1;
-            this.overIndex = -1;
-        }
-    };
-
-    @action
-    onDragEnd = () => {
-        this.draggedIndex = -1;
-        this.overIndex = -1;
-    };
+    // @action
+    // onDragStart = (index: number) => {
+    //     this.draggedIndex = index;
+    // };
+
+    // @action
+    // onDragOver = (index: number) => {
+    //     if (this.draggedIndex !== index) {
+    //         this.overIndex = index;
+    //     }
+    // };
+
+    // @action
+    // onDrop = () => {
+    //     if (this.draggedIndex !== -1 && this.overIndex !== -1) {
+    //         const draggedDoc = this.sortedDocs[this.draggedIndex];
+    //         this.sortedDocs.splice(this.draggedIndex, 1);
+    //         this.sortedDocs.splice(this.overIndex, 0, draggedDoc);
+    //         this.draggedIndex = -1;
+    //         this.overIndex = -1;
+    //     }
+    // };
+
+    // @action
+    // onDragEnd = () => {
+    //     this.draggedIndex = -1;
+    //     this.overIndex = -1;
+    // };
 
     /**
      * Actually renders all the cards
@@ -564,7 +563,7 @@ export class CollectionCardView extends CollectionSubView() {
                 const indexInRow = index % this._maxRowCount;
                 const rowIndex = Math.trunc(index / this._maxRowCount);
                 const rowCenterIndex =  Math.min(this._maxRowCount, this.sortedDocs.length - rowIndex * this._maxRowCount)/2;
-                return (rowCenterIndex - indexInRow) * 100;
+                return (rowCenterIndex - indexInRow) * 100 - 50;
             }
             return (
                 <div