aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/trails/PresElementBox.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/trails/PresElementBox.tsx')
-rw-r--r--src/client/views/nodes/trails/PresElementBox.tsx64
1 files changed, 37 insertions, 27 deletions
diff --git a/src/client/views/nodes/trails/PresElementBox.tsx b/src/client/views/nodes/trails/PresElementBox.tsx
index cd6beac57..9fcb496b8 100644
--- a/src/client/views/nodes/trails/PresElementBox.tsx
+++ b/src/client/views/nodes/trails/PresElementBox.tsx
@@ -1,12 +1,12 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Tooltip } from '@mui/material';
-import { action, computed, IReactionDisposer, observable, reaction, runInAction } from 'mobx';
+import { action, computed, IReactionDisposer, makeObservable, observable, override, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import { Doc, DocListCast, Opt } from '../../../../fields/Doc';
import { Id } from '../../../../fields/FieldSymbols';
import { List } from '../../../../fields/List';
import { BoolCast, Cast, DocCast, NumCast, StrCast } from '../../../../fields/Types';
-import { emptyFunction, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents } from '../../../../Utils';
+import { copyProps, emptyFunction, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents } from '../../../../Utils';
import { Docs } from '../../../documents/Documents';
import { CollectionViewType } from '../../../documents/DocumentTypes';
import { DocumentManager } from '../../../util/DocumentManager';
@@ -43,9 +43,21 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
@observable _dragging = false;
+ _prevProps: FieldViewProps;
+ @override _props: FieldViewProps;
+ constructor(props: FieldViewProps) {
+ super(props);
+ this._props = this._prevProps = props;
+ makeObservable(this);
+ }
+
+ componentDidUpdate() {
+ copyProps(this);
+ }
+
// the presentation view that renders this slide
@computed get presBoxView() {
- return this.props.DocumentView?.()?.props.docViewPath().lastElement()?.ComponentView as PresBox;
+ return this._props.DocumentView?.()?._props.docViewPath().lastElement()?.ComponentView as PresBox;
}
// the presentation view document that renders this slide
@@ -56,7 +68,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
// Since this node is being rendered with a template, this method retrieves
// the actual slide being rendered from the auto-generated rendering template
@computed get slideDoc() {
- return this.props.TemplateDataDocument ?? this.props.Document;
+ return this._props.TemplateDataDocument ?? this.Document;
}
// this is the document in the workspaces that is targeted by the slide
@@ -91,9 +103,9 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
presExpandDocumentClick = () => (this.slideDoc.presentation_expandInlineButton = !this.slideDoc.presentation_expandInlineButton);
embedHeight = () => this.collapsedHeight + this.expandViewHeight;
- embedWidth = () => this.props.PanelWidth() / 2;
+ embedWidth = () => this._props.PanelWidth() / 2;
styleProvider = (doc: Doc | undefined, props: Opt<DocumentViewProps>, property: string): any => {
- return property === StyleProp.Opacity ? 1 : this.props.styleProvider?.(doc, props, property);
+ return property === StyleProp.Opacity ? 1 : this._props.styleProvider?.(doc, props, property);
};
/**
* The function that is responsible for rendering a preview or not for this
@@ -106,19 +118,19 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
Document={PresBox.targetRenderedDoc(this.slideDoc)}
PanelWidth={this.embedWidth}
PanelHeight={this.embedHeight}
- isContentActive={this.props.isContentActive}
+ isContentActive={this._props.isContentActive}
styleProvider={this.styleProvider}
hideLinkButton={true}
ScreenToLocalTransform={Transform.Identity}
- renderDepth={this.props.renderDepth + 1}
+ renderDepth={this._props.renderDepth + 1}
docViewPath={returnEmptyDoclist}
- childFilters={this.props.childFilters}
- childFiltersByRanges={this.props.childFiltersByRanges}
- searchFilterDocs={this.props.searchFilterDocs}
+ childFilters={this._props.childFilters}
+ childFiltersByRanges={this._props.childFiltersByRanges}
+ searchFilterDocs={this._props.searchFilterDocs}
addDocument={returnFalse}
removeDocument={returnFalse}
fitContentsToBox={returnTrue}
- moveDocument={this.props.moveDocument!}
+ moveDocument={this._props.moveDocument!}
focus={emptyFunction}
whenChildContentsActiveChanged={returnFalse}
addDocTab={returnFalse}
@@ -191,8 +203,8 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
const dragArray = this.presBoxView?._dragArray ?? [];
const dragData = new DragManager.DocumentDragData(this.presBoxView?.sortArray() ?? []);
if (!dragData.draggedDocuments.length) dragData.draggedDocuments.push(this.slideDoc);
- dragData.treeViewDoc = this.presBox?._type_collection === CollectionViewType.Tree ? this.presBox : undefined; // this.props.DocumentView?.()?.props.treeViewDoc;
- dragData.moveDocument = this.props.moveDocument;
+ dragData.treeViewDoc = this.presBox?._type_collection === CollectionViewType.Tree ? this.presBox : undefined; // this._props.DocumentView?.()?._props.treeViewDoc;
+ dragData.moveDocument = this._props.moveDocument;
const dragItem: HTMLElement[] = [];
const classesToRestore = new Map<HTMLElement, string>();
if (dragArray.length === 1) {
@@ -265,8 +277,8 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
@action
toggleProperties = () => {
- if (SettingsManager.propertiesWidth < 5) {
- SettingsManager.propertiesWidth = 250;
+ if (SettingsManager.Instance.propertiesWidth < 5) {
+ SettingsManager.Instance.propertiesWidth = 250;
}
};
@@ -276,7 +288,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
if (this.presBox && this.indexInPres < (this.presBoxView?.itemIndex || 0)) {
this.presBox.itemIndex = (this.presBoxView?.itemIndex || 0) - 1;
}
- this.props.removeDocument?.(this.slideDoc);
+ this._props.removeDocument?.(this.slideDoc);
this.presBoxView?.removeFromSelectedArray(this.slideDoc);
this.removeAllRecordingInOverlay();
}),
@@ -299,7 +311,6 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
* @param activeItem
*/
@undoBatch
- @action
updateCapturedContainerLayout = (presTargetDoc: Doc, activeItem: Doc) => {
const targetDoc = DocCast(presTargetDoc.annotationOn) ?? presTargetDoc;
activeItem.config_x = NumCast(targetDoc.x);
@@ -389,7 +400,6 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
);
@undoBatch
- @action
lfg = (e: React.MouseEvent) => {
e.stopPropagation();
// TODO: fix this bug
@@ -404,7 +414,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
get toolbarWidth(): number {
const presBoxDocView = DocumentManager.Instance.getDocumentView(this.presBox);
const width = NumCast(this.presBox?._width);
- return presBoxDocView ? presBoxDocView.props.PanelWidth() : width ? width : 300;
+ return presBoxDocView ? presBoxDocView._props.PanelWidth() : width ? width : 300;
}
@computed get presButtons() {
@@ -453,8 +463,8 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
{!activeItem.presentation_groupWithUp
? 'Not grouped with previous slide (click to group)'
: activeItem.presentation_groupWithUp === 1
- ? 'Run simultaneously with previous slide (click again to run after)'
- : 'Run after previous slide (click to ungroup from previous)'}
+ ? 'Run simultaneously with previous slide (click again to run after)'
+ : 'Run after previous slide (click to ungroup from previous)'}
</div>
}>
<div
@@ -530,10 +540,10 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
style={{
backgroundColor: presColorBool ? (isSelected ? 'rgba(250,250,250,0.3)' : 'transparent') : isSelected ? Colors.LIGHT_BLUE : 'transparent',
opacity: this._dragging ? 0.3 : 1,
- paddingLeft: NumCast(this.layoutDoc._xPadding, this.props.xPadding),
- paddingRight: NumCast(this.layoutDoc._xPadding, this.props.xPadding),
- paddingTop: NumCast(this.layoutDoc._yPadding, this.props.yPadding),
- paddingBottom: NumCast(this.layoutDoc._yPadding, this.props.yPadding),
+ paddingLeft: NumCast(this.layoutDoc._xPadding, this._props.xPadding),
+ paddingRight: NumCast(this.layoutDoc._xPadding, this._props.xPadding),
+ paddingTop: NumCast(this.layoutDoc._yPadding, this._props.yPadding),
+ paddingBottom: NumCast(this.layoutDoc._yPadding, this._props.yPadding),
}}
onDoubleClick={action(e => {
this.toggleProperties();
@@ -552,7 +562,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
className={`presItem-slide ${isCurrent ? 'active' : ''}${this.slideDoc.runProcess ? ' testingv2' : ''}`}
style={{
display: 'infline-block',
- backgroundColor: this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor),
+ backgroundColor: this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BackgroundColor),
//layout_boxShadow: presBoxColor && presBoxColor !== 'white' && presBoxColor !== 'transparent' ? (isCurrent ? '0 0 0px 1.5px' + presBoxColor : undefined) : undefined,
border: presBoxColor && presBoxColor !== 'white' && presBoxColor !== 'transparent' ? (isCurrent ? presBoxColor + ' solid 2.5px' : undefined) : undefined,
}}>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-14 14:32:08 +0000