aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/DocComponent.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/DocComponent.tsx')
-rw-r--r--src/client/views/DocComponent.tsx120
1 files changed, 35 insertions, 85 deletions
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index de4df1830..94e84e647 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -1,64 +1,18 @@
import { action, computed, makeObservable, observable } from 'mobx';
import * as React from 'react';
-import { returnFalse } from '../../Utils';
+import { returnFalse } from '../../ClientUtils';
import { DateField } from '../../fields/DateField';
-import { Doc, DocListCast, Field, Opt } from '../../fields/Doc';
+import { Doc, DocListCast, Opt } from '../../fields/Doc';
import { AclAdmin, AclAugment, AclEdit, AclPrivate, AclReadonly, DocData } from '../../fields/DocSymbols';
import { List } from '../../fields/List';
-import { RefField } from '../../fields/RefField';
+import { toList } from '../../fields/Types';
import { GetEffectiveAcl, inheritParentAcls } from '../../fields/util';
import { DocumentType } from '../documents/DocumentTypes';
-import { DocUtils } from '../documents/Documents';
-import { DocumentManager } from '../util/DocumentManager';
-import { DragManager } from '../util/DragManager';
import { ObservableReactComponent } from './ObservableReactComponent';
-import { CollectionFreeFormView } from './collections/collectionFreeForm';
-import { DocumentView, OpenWhere } from './nodes/DocumentView';
-import { FieldViewProps, FocusViewOptions } from './nodes/FieldView';
-import { PinProps } from './nodes/trails';
+import { ViewBoxInterface } from './ViewBoxInterface';
+import { FieldViewProps } from './nodes/FieldView';
/**
- * Shared interface among all viewBox'es (ie, react classes that render the contents of a Doc)
- * Many of these methods only make sense for specific viewBox'es, but they should be written to
- * be as general as possible
- */
-export interface ViewBoxInterface {
- fieldKey?: string;
- annotationKey?: string;
- updateIcon?: () => void; // updates the icon representation of the document
- getAnchor?: (addAsAnnotation: boolean, pinData?: PinProps) => Doc; // returns an Anchor Doc that represents the current state of the doc's componentview (e.g., the current playhead location of a an audio/video box)
- restoreView?: (viewSpec: Doc) => boolean;
- scrollPreview?: (docView: DocumentView, doc: Doc, focusSpeed: number, options: FocusViewOptions) => Opt<number>; // returns the duration of the focus
- brushView?: (view: { width: number; height: number; panX: number; panY: number }, transTime: number, holdTime: number) => void; // highlight a region of a view (used by freeforms)
- getView?: (doc: Doc, options: FocusViewOptions) => Promise<Opt<DocumentView>>; // returns a nested DocumentView for the specified doc or undefined
- addDocTab?: (doc: Doc, where: OpenWhere) => boolean; // determines how to add a document - used in following links to open the target ina local lightbox
- addDocument?: (doc: Doc | Doc[], annotationKey?: string) => boolean; // add a document (used only by collections)
- removeDocument?: (doc: Doc | Doc[], annotationKey?: string, leavePushpin?: boolean, dontAddToRemoved?: boolean) => boolean; // add a document (used only by collections)
- select?: (ctrlKey: boolean, shiftKey: boolean) => void;
- focus?: (textAnchor: Doc, options: FocusViewOptions) => Opt<number>;
- viewTransition?: () => Opt<string>; // duration of a view transition animation
- isAnyChildContentActive?: () => boolean; // is any child content of the document active
- onClickScriptDisable?: () => 'never' | 'always'; // disable click scripts : never, always, or undefined = only when selected
- getKeyFrameEditing?: () => boolean; // whether the document is in keyframe editing mode (if it is, then all hidden documents that are not active at the keyframe time will still be shown)
- setKeyFrameEditing?: (set: boolean) => void; // whether the document is in keyframe editing mode (if it is, then all hidden documents that are not active at the keyframe time will still be shown)
- playFrom?: (time: number, endTime?: number) => void;
- Pause?: () => void; // pause a media document (eg, audio/video)
- IsPlaying?: () => boolean; // is a media document playing
- TogglePause?: (keep?: boolean) => void; // toggle media document playing state
- setFocus?: () => void; // sets input focus to the componentView
- setData?: (data: Field | Promise<RefField | undefined>) => boolean;
- componentUI?: (boundsLeft: number, boundsTop: number) => JSX.Element | null;
- dragStarting?: (snapToDraggedDoc: boolean, showGroupDragTarget: boolean, visited: Set<Doc>) => void;
- dragConfig?: (dragData: DragManager.DocumentDragData) => void; // function to setup dragData in custom way (see TreeViews which add a tree view flag)
- incrementalRendering?: () => void;
- infoUI?: () => JSX.Element | null;
- screenBounds?: () => Opt<{ left: number; top: number; right: number; bottom: number; transition?: string }>;
- ptToScreen?: (pt: { X: number; Y: number }) => { X: number; Y: number };
- ptFromScreen?: (pt: { X: number; Y: number }) => { X: number; Y: number };
- snapPt?: (pt: { X: number; Y: number }, excludeSegs?: number[]) => { nearestPt: { X: number; Y: number }; distance: number };
- search?: (str: string, bwd?: boolean, clear?: boolean) => boolean;
-}
-/**
* DocComponent returns a React base class used by Doc views with accessors for unpacking the Document,layoutDoc, and dataDoc's
* (note: this should not be used for the 'Box' views that render the contents of Doc views)
* Example derived views: CollectionFreeFormDocumentView, DocumentView, DocumentViewInternal)
@@ -108,7 +62,7 @@ export function DocComponent<P extends DocComponentProps>() {
* Example views include: InkingStroke, FontIconBox, EquationBox, etc
*/
export function ViewBoxBaseComponent<P extends FieldViewProps>() {
- class Component extends ObservableReactComponent<React.PropsWithChildren<P>> {
+ class Component extends ViewBoxInterface<P> {
constructor(props: P) {
super(props);
makeObservable(this);
@@ -163,7 +117,7 @@ export function ViewBoxBaseComponent<P extends FieldViewProps>() {
* Example views include: PDFBox, ImageBox, MapBox, etc
*/
export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
- class Component extends ObservableReactComponent<React.PropsWithChildren<P>> {
+ class Component extends ViewBoxInterface<P> {
@observable _annotationKeySuffix = () => 'annotations';
@observable _isAnyChildContentActive = false;
@@ -214,11 +168,9 @@ export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
return this.fieldKey + (this._annotationKeySuffix() ? '_' + this._annotationKeySuffix() : '');
}
- @action.bound
- removeDocument(doc: Doc | Doc[], annotationKey?: string, leavePushpin?: boolean, dontAddToRemoved?: boolean): boolean {
+ override removeDocument = (docIn: Doc | Doc[], annotationKey?: string, leavePushpin?: boolean, dontAddToRemoved?: boolean): boolean => {
const effectiveAcl = GetEffectiveAcl(this.dataDoc);
- const indocs = doc instanceof Doc ? [doc] : doc;
- const docs = indocs.filter(doc => [AclEdit, AclAdmin].includes(effectiveAcl) || GetEffectiveAcl(doc) === AclAdmin);
+ const docs = toList(docIn).filter(fdoc => [AclEdit, AclAdmin].includes(effectiveAcl) || GetEffectiveAcl(fdoc) === AclAdmin);
// docs.forEach(doc => doc.annotationOn === this.Document && Doc.SetInPlace(doc, 'annotationOn', undefined, true));
const targetDataDoc = this.Document[DocData]; // this.dataDoc; // we want to write to the template, not the actual data doc
@@ -227,44 +179,39 @@ export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
if (toRemove.length !== 0) {
const recentlyClosed = this.Document !== Doc.MyRecentlyClosed ? Doc.MyRecentlyClosed : undefined;
- toRemove.forEach(doc => {
- leavePushpin && DocUtils.LeavePushpin(doc, annotationKey ?? this.annotationKey);
- Doc.RemoveDocFromList(targetDataDoc, annotationKey ?? this.annotationKey, doc, true);
- doc.embedContainer = undefined;
- if (recentlyClosed && !dontAddToRemoved && doc.type !== DocumentType.LOADING) {
- Doc.AddDocToList(recentlyClosed, 'data', doc, undefined, true, true);
- Doc.RemoveEmbedding(doc, doc);
+ toRemove.forEach(rdoc => {
+ // leavePushpin && DocUtils.LeavePushpin(doc, annotationKey ?? this.annotationKey);
+ Doc.RemoveDocFromList(targetDataDoc, annotationKey ?? this.annotationKey, rdoc, true);
+ rdoc.embedContainer = undefined;
+ if (recentlyClosed && !dontAddToRemoved && rdoc.type !== DocumentType.LOADING) {
+ Doc.AddDocToList(recentlyClosed, 'data', rdoc, undefined, true, true);
+ Doc.RemoveEmbedding(rdoc, rdoc);
}
});
- if (targetDataDoc.isGroup && DocListCast(targetDataDoc[annotationKey ?? this.annotationKey]).length < 2) {
- (DocumentManager.Instance.getFirstDocumentView(targetDataDoc)?.ComponentView as CollectionFreeFormView)?.promoteCollection();
- } else {
- this.isAnyChildContentActive() && this._props.select(false);
- }
+ this.isAnyChildContentActive() && this._props.select(false);
return true;
}
return false;
- }
+ };
// this is called with the document that was dragged and the collection to move it into.
// if the target collection is the same as this collection, then the move will be allowed.
// otherwise, the document being moved must be able to be removed from its container before
// moving it into the target.
- @action.bound
- moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[], annotationKey?: string) => boolean, annotationKey?: string): boolean => {
+ moveDocument = (docs: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[], annotationKey?: string) => boolean, annotationKey?: string): boolean => {
if (Doc.AreProtosEqual(this._props.Document, targetCollection)) {
return true;
}
- const first = doc instanceof Doc ? doc : doc[0];
+ const first = toList(docs)[0];
if (!first?._dragOnlyWithinContainer && addDocument !== returnFalse) {
- return this.removeDocument(doc, annotationKey, false, true) && addDocument(doc, annotationKey);
+ return this.removeDocument(docs, annotationKey, false, true) && addDocument(docs, annotationKey);
}
return false;
};
- @action.bound
- addDocument = (doc: Doc | Doc[], annotationKey?: string): boolean => {
- const docs = doc instanceof Doc ? [doc] : doc;
- if (this._props.filterAddDocument?.(docs) === false || docs.find(doc => Doc.AreProtosEqual(doc, this.Document) && Doc.LayoutField(doc) === Doc.LayoutField(this.Document))) {
+
+ override addDocument = (docIn: Doc | Doc[], annotationKey?: string): boolean => {
+ const docs = toList(docIn);
+ if (this._props.filterAddDocument?.(docs) === false || docs.find(fdoc => Doc.AreProtosEqual(fdoc, this.Document) && Doc.LayoutField(fdoc) === Doc.LayoutField(this.Document))) {
return false;
}
const targetDataDoc = this.Document[DocData]; // this.dataDoc; // we want to write to the template, not the actual data doc
@@ -276,12 +223,12 @@ export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
const added = docs;
if (added.length) {
if ([AclAugment, AclEdit, AclAdmin].includes(effectiveAcl)) {
- added.forEach(doc => {
- doc._dragOnlyWithinContainer = undefined;
- if (annotationKey ?? this._annotationKeySuffix()) doc[DocData].annotationOn = this.Document;
- else doc[DocData].annotationOn = undefined;
- Doc.SetContainer(doc, this.Document);
- inheritParentAcls(targetDataDoc, doc, true);
+ added.forEach(adoc => {
+ adoc._dragOnlyWithinContainer = undefined;
+ if (annotationKey ?? this._annotationKeySuffix()) adoc[DocData].annotationOn = this.Document;
+ else adoc[DocData].annotationOn = undefined;
+ Doc.SetContainer(adoc, this.Document);
+ inheritParentAcls(targetDataDoc, adoc, true);
});
const annoDocs = Doc.Get(targetDataDoc, annotationKey ?? this.annotationKey, true) as List<Doc>; // get the dataDoc directly ... when using templates there may be some default items already there, but we can't change them, so we copy them below (should really be some kind of inheritance since the template contents could change)
@@ -295,7 +242,10 @@ export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
isAnyChildContentActive = () => this._isAnyChildContentActive;
- whenChildContentsActiveChanged = action((isActive: boolean) => this._props.whenChildContentsActiveChanged((this._isAnyChildContentActive = isActive)));
+ whenChildContentsActiveChanged = action((isActive: boolean) => {
+ this._isAnyChildContentActive = isActive;
+ this._props.whenChildContentsActiveChanged(isActive);
+ });
}
return Component;
}