aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/collections')
-rw-r--r--src/client/views/collections/CollectionCardDeckView.tsx29
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx8
-rw-r--r--src/client/views/collections/CollectionNoteTakingViewColumn.tsx17
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx1
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx2
5 files changed, 28 insertions, 29 deletions
diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index a9ab9de26..92c69c3cf 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -22,6 +22,7 @@ import { GPTPopup, GPTPopupMode } from '../pdf/GPTPopup/GPTPopup';
import './CollectionCardDeckView.scss';
import { CollectionSubView, SubCollectionViewProps } from './CollectionSubView';
import { computedFn } from 'mobx-utils';
+import { DocumentDecorations } from '../DocumentDecorations';
enum cardSortings {
Time = 'time',
@@ -411,15 +412,14 @@ export class CollectionCardView extends CollectionSubView() {
translateOverflowX = (realIndex: number, calcRowCards: number) => (realIndex < this._maxRowCount ? 0 : (this._maxRowCount - calcRowCards) * (this.childPanelWidth() / 2));
/**
- * Determines how far to translate a card in the y direction depending on its index, whether or not its being hovered, or if it's selected
- * @param isHovered
- * @param isActive
- * @param realIndex
- * @param amCards
- * @param calcRowIndex
- * @returns
+ * Determines how far to translate a card in the y direction depending on its index and if it's selected
+ * @param isActive whether the card is focused for interaction
+ * @param realIndex index of card from start of deck
+ * @param amCards ??
+ * @param calcRowIndex index of card from start of row
+ * @returns Y translation of card
*/
- calculateTranslateY = (isHovered: boolean, isActive: boolean, realIndex: number, amCards: number, calcRowIndex: number) => {
+ calculateTranslateY = (isActive: boolean, realIndex: number, amCards: number, calcRowIndex: number) => {
const rowHeight = (this._props.PanelHeight() * this.fitContentScale) / this.numRows;
const rowIndex = Math.trunc(realIndex / this._maxRowCount);
const rowToCenterShift = this.numRows / 2 - rowIndex;
@@ -567,10 +567,10 @@ export class CollectionCardView extends CollectionSubView() {
} else {
// otherwise, turn off documentDecorations becase we're in a selection transition and want to avoid artifacts.
// Turn them back on when the animation has completed and the render and backend structures are in synch
- SnappingManager.SetIsResizing(doc[Id]);
+ SnappingManager.SetHideDecorations(true);
setTimeout(
action(() => {
- SnappingManager.SetIsResizing(undefined);
+ SnappingManager.SetHideDecorations(false);
this._forceChildXf++;
}),
1000
@@ -592,9 +592,8 @@ export class CollectionCardView extends CollectionSubView() {
// Map sorted documents to their rendered components
return this.sortedDocs.map((doc, index) => {
- const realIndex = this.sortedDocs.indexOf(doc);
- const calcRowIndex = this.overflowIndexCalc(realIndex);
- const amCards = this.overflowAmCardsCalc(realIndex);
+ const calcRowIndex = this.overflowIndexCalc(index);
+ const amCards = this.overflowAmCardsCalc(index);
const view = DocumentView.getDocumentView(doc, this.DocumentView?.());
const childScreenToLocal = this.childScreenToLocal(doc, index, calcRowIndex, !!view?.IsContentActive, amCards);
@@ -617,8 +616,8 @@ export class CollectionCardView extends CollectionSubView() {
style={{
width: this.childPanelWidth(),
height: 'max-content',
- transform: `translateY(${this.calculateTranslateY(this._hoveredNodeIndex === index, !!view?.IsContentActive, realIndex, amCards, calcRowIndex)}px)
- translateX(calc(${view?.IsContentActive ? translateIfSelected() : 0}% + ${this.translateOverflowX(realIndex, amCards)}px))
+ transform: `translateY(${this.calculateTranslateY(!!view?.IsContentActive, index, amCards, calcRowIndex)}px)
+ translateX(calc(${view?.IsContentActive ? translateIfSelected() : 0}% + ${this.translateOverflowX(index, amCards)}px))
rotate(${!view?.IsContentActive ? this.rotate(amCards, calcRowIndex) : 0}deg)
scale(${view?.IsContentActive ? `${Math.min(hscale, vscale) * 100}%` : this._hoveredNodeIndex === index ? 1.1 : 1})`,
}} // prettier-ignore
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index d1304b8f4..e1786d2c9 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -31,17 +31,17 @@ import { ScriptingRepl } from '../ScriptingRepl';
import { UndoStack } from '../UndoStack';
import './CollectionDockingView.scss';
import { CollectionSubView, SubCollectionViewProps } from './CollectionSubView';
-import { TabHTMLElement } from './TabDocView';
+import { TabDocView, TabHTMLElement } from './TabDocView';
@observer
export class CollectionDockingView extends CollectionSubView() {
- static tabClass: unknown = null;
+ static tabClass?: typeof TabDocView;
/**
* Initialize by assigning the add split method to DocumentView and by
* configuring golden layout to render its documents using the specified React component
* @param ele - typically would be set to TabDocView
*/
- public static Init(ele: unknown) {
+ public static Init(ele: typeof TabDocView) {
this.tabClass = ele;
DocumentView.addSplit = CollectionDockingView.AddSplit;
}
@@ -544,7 +544,7 @@ export class CollectionDockingView extends CollectionSubView() {
tabCreated = (tab: { contentItem: { element: HTMLElement[] } }) => {
this.tabMap.add(tab);
// InitTab is added to the tab's HTMLElement in TabDocView
- const tabdocviewContent = tab.contentItem.element[0]?.firstChild?.firstChild as unknown as TabHTMLElement;
+ const tabdocviewContent = tab.contentItem.element[0]?.firstChild?.firstChild as TabHTMLElement;
tabdocviewContent?.InitTab?.(tab); // have to explicitly initialize tabs that reuse contents from previous tabs (ie, when dragging a tab around a new tab is created for the old content)
};
diff --git a/src/client/views/collections/CollectionNoteTakingViewColumn.tsx b/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
index 8c6a6b551..226d06f37 100644
--- a/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
+++ b/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
@@ -1,5 +1,5 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, makeObservable, observable } from 'mobx';
+import { action, computed, makeObservable, observable, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import { lightOrDark, returnEmptyString } from '../../../ClientUtils';
@@ -87,12 +87,16 @@ export class CollectionNoteTakingViewColumn extends ObservableReactComponent<CSV
};
componentDidMount(): void {
- this._ele && this.props.refList.push(this._ele);
+ runInAction(() => {
+ this._ele && this.props.refList.push(this._ele);
+ });
}
componentWillUnmount() {
- this._ele && this.props.refList.splice(this._props.refList.indexOf(this._ele), 1);
- this._ele = null;
+ runInAction(() => {
+ this._ele && this.props.refList.splice(this._props.refList.indexOf(this._ele), 1);
+ this._ele = null;
+ });
}
@undoBatch
@@ -248,10 +252,7 @@ export class CollectionNoteTakingViewColumn extends ObservableReactComponent<CSV
<EditableView GetValue={returnEmptyString} SetValue={this.addNewTextDoc} textCallback={this.addTextNote} placeholder={"Type ':' for commands"} contents="+ Node" menuCallback={this.menuCallback} />
</div>
<div className="collectionNoteTakingView-addDocumentButton" style={{ color: lightOrDark(this._props.backgroundColor?.()) }}>
- {
- // eslint-disable-next-line react/jsx-props-no-spreading
- <EditableView {...this._props.editableViewProps()} />
- }
+ <EditableView {...this._props.editableViewProps()} />
</div>
</div>
) : null}
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
index c17371151..51add85a8 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
@@ -46,7 +46,6 @@ export function InfoState(
gif?: string,
entryFunc?: () => unknown
) {
- // eslint-disable-next-line new-cap
return new infoState(msg, arcs, gif, entryFunc);
}
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index d2bc8f2c2..4043091d5 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -138,7 +138,7 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
return this._props.layoutEngine?.() || StrCast(this.layoutDoc._layoutEngine);
}
@computed get childPointerEvents() {
- return SnappingManager.IsResizing
+ return falseSnappingManager.IsResizing
? 'none'
: (this._props.childPointerEvents?.() ??
(this._props.viewDefDivClick || //