aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DocumentContentsView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/DocumentContentsView.tsx')
-rw-r--r--src/client/views/nodes/DocumentContentsView.tsx116
1 files changed, 85 insertions, 31 deletions
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index aab8a183a..504c1491e 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -11,10 +11,85 @@ import { Cast, DocCast, StrCast } from '../../../fields/Types';
import { GetEffectiveAcl, TraceMobx } from '../../../fields/util';
import { ObservableReactComponent, ObserverJsxParser } from '../ObservableReactComponent';
import './DocumentView.scss';
-import { FieldViewProps } from './FieldView';
+import { FieldViewProps, FieldViewSharedProps } from './FieldView';
+import { DragManager } from '../../util/DragManager';
+import { dropActionType } from '../../util/DropActionTypes';
+import { Property } from 'csstype';
+
+interface DocOnlyProps {
+ LayoutTemplate?: () => Opt<Doc>;
+ LayoutTemplateString?: string;
+ hideDecorations?: boolean; // whether to suppress all DocumentDecorations when doc is selected
+ hideResizeHandles?: boolean; // whether to suppress resized handles on doc decorations when this document is selected
+ hideTitle?: boolean; // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
+ hideDecorationTitle?: boolean; // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
+ hideDocumentButtonBar?: boolean;
+ hideOpenButton?: boolean;
+ hideDeleteButton?: boolean;
+ hideLinkAnchors?: boolean;
+ hideLinkButton?: boolean;
+ hideCaptions?: boolean;
+ contentPointerEvents?: Property.PointerEvents | undefined; // pointer events allowed for content of a document view. eg. set to "none" in menuSidebar for sharedDocs so that you can select a document, but not interact with its contents
+ dontCenter?: 'x' | 'y' | 'xy';
+ showTags?: boolean;
+ showAIEditor?: boolean;
+ hideFilterStatus?: boolean;
+ childHideDecorationTitle?: boolean;
+ childHideResizeHandles?: boolean;
+ childDragAction?: dropActionType; // allows child documents to be dragged out of collection without holding the embedKey or dragging the doc decorations title bar.
+ dragWhenActive?: boolean;
+ dontHideOnDrag?: boolean;
+ onClickScriptDisable?: 'never' | 'always'; // undefined = only when selected
+ DataTransition?: () => string | undefined;
+ NativeWidth?: () => number;
+ NativeHeight?: () => number;
+ contextMenuItems?: () => { script?: ScriptField; method?: () => void; filter?: ScriptField; label: string; icon: string }[];
+ dragConfig?: (data: DragManager.DocumentDragData) => void;
+ dragStarting?: () => void;
+ dragEnding?: () => void;
+
+ reactParent?: React.Component; // parent React component view (see CollectionFreeFormDocumentView)
+}
+const DocOnlyProps = [
+ 'layoutFieldKey',
+ 'LayoutTemplate',
+ 'LayoutTemplateString',
+ 'hideDecorations', // whether to suppress all DocumentDecorations when doc is selected
+ 'hideResizeHandles', // whether to suppress resized handles on doc decorations when this document is selected
+ 'hideTitle', // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
+ 'hideDecorationTitle', // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
+ 'hideDocumentButtonBar',
+ 'hideOpenButton',
+ 'hideDeleteButton',
+ 'hideLinkAnchors',
+ 'hideLinkButton',
+ 'hideCaptions',
+ 'contentPointerEvents', // pointer events allowed for content of a document view. eg. set to "none" in menuSidebar for sharedDocs so that you can select a document, but not interact with its contents
+ 'dontCenter',
+ 'showTags',
+ 'showAIEditor',
+ 'hideFilterStatus',
+ 'childHideDecorationTitle',
+ 'childHideResizeHandles',
+ 'childDragAction', // allows child documents to be dragged out of collection without holding the embedKey or dragging the doc decorations title bar.
+ 'dragWhenActive',
+ 'dontHideOnDrag',
+ 'onClickScriptDisable', // undefined = only when selected
+ 'DataTransition',
+ 'NativeWidth',
+ 'NativeHeight',
+ 'contextMenuItems',
+ 'dragConfig',
+ 'dragStarting',
+ 'dragEnding',
+
+ 'reactParent', // parent React component view (see CollectionFreeFormDocumentView)
+];
+
+export interface DocumentViewProps extends DocOnlyProps, FieldViewSharedProps {}
type BindingProps = Without<FieldViewProps, 'fieldKey'>;
-export interface JsxBindings {
+interface JsxBindings {
props: BindingProps;
}
@@ -23,7 +98,6 @@ interface HTMLtagProps {
htmltag: string;
onClick?: ScriptField;
onInput?: ScriptField;
- scaling: number;
children?: JSX.Element[];
}
@@ -43,7 +117,7 @@ interface HTMLtagProps {
export class HTMLtag extends React.Component<HTMLtagProps> {
click = () => {
const clickScript = this.props.onClick as Opt<ScriptField>;
- clickScript?.script.run({ this: this.props.Document, scale: this.props.scaling });
+ clickScript?.script.run({ this: this.props.Document });
};
onInput = (e: React.FormEvent<unknown>) => {
const onInputScript = this.props.onInput as Opt<ScriptField>;
@@ -56,7 +130,6 @@ export class HTMLtag extends React.Component<HTMLtagProps> {
'dragStarting',
'dragEnding',
'htmltag',
- 'scaling',
'Document',
'key',
'onInput',
@@ -65,7 +138,7 @@ export class HTMLtag extends React.Component<HTMLtagProps> {
]).omit;
const replacer = (match: string, expr: string) =>
// bcz: this executes a script to convert a property expression string: { script } into a value
- (ScriptField.MakeFunction(expr, { this: Doc.name, scale: 'number' })?.script.run({ this: this.props.Document, scale: this.props.scaling }).result as string) || '';
+ (ScriptField.MakeFunction(expr, { this: Doc.name })?.script.run({ this: this.props.Document }).result as string) || '';
Object.keys(divKeys).forEach((prop: string) => {
const p = (this.props as unknown as { [key: string]: string })[prop] as string;
style[prop] = p?.replace(/{([^.'][^}']+)}/g, replacer);
@@ -79,7 +152,7 @@ export class HTMLtag extends React.Component<HTMLtagProps> {
}
}
-export interface DocumentContentsViewProps extends FieldViewProps {
+interface DocumentContentsViewProps extends DocumentViewProps, FieldViewProps {
layoutFieldKey: string;
}
@observer
@@ -115,29 +188,11 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
this._props.LayoutTemplate?.() ||
(this._props.LayoutTemplateString && this._props.Document) ||
(this._props.layoutFieldKey && StrCast(this._props.Document[this._props.layoutFieldKey]) && this._props.Document) ||
- Doc.Layout(this._props.Document, this._props.layoutFieldKey ? Cast(this._props.Document[this._props.layoutFieldKey], Doc, null) : undefined);
- return Doc.expandTemplateLayout(template, this._props.Document);
+ Doc.LayoutDoc(this._props.Document, DocCast(this._props.Document[this._props.layoutFieldKey]));
+ return Doc.expandTemplateLayout(template, this._props.Document, this._props.layoutFieldKey);
}
CreateBindings(onClick: Opt<ScriptField>, onInput: Opt<ScriptField>): JsxBindings {
- const docOnlyProps = [
- // these are the properties in DocumentViewProps that need to be removed to pass on only DocumentSharedViewProps to the FieldViews
- 'hideResizeHandles',
- 'hideTitle',
- 'bringToFront',
- 'childContentPointerEvents',
- 'LayoutTemplateString',
- 'LayoutTemplate',
- 'showTags',
- 'layoutFieldKey',
- 'dontCenter',
- 'DataTransition',
- 'contextMenuItems',
- // 'onClick', // don't need to omit this since it will be set
- 'onDoubleClickScript',
- 'onPointerDownScript',
- 'onPointerUpScript',
- ];
const templateDataDoc = this._props.TemplateDataDocument ?? (this.layoutDoc !== this._props.Document ? this._props.Document[DocData] : undefined);
const list: BindingProps & React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLDivElement>, HTMLDivElement> = {
...this._props,
@@ -148,7 +203,7 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
};
return {
props: {
- ...OmitKeys(list, [...docOnlyProps], '').omit,
+ ...OmitKeys(list, DocOnlyProps, '').omit,
} as BindingProps,
};
}
@@ -166,12 +221,11 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
layoutFrame = layoutFrame.replace(/(>[^{]*)[^=]\{([^.'][^<}]+)\}([^}]*<)/g, replacer);
// replace HTML<tag> with corresponding HTML tag as in: <HTMLdiv> becomes <HTMLtag Document={props.Document} htmltag='div'>
- const replacer2 = (match: string, p1: string) => `<HTMLtag Document={props.Document} scaling='${this._props.NativeDimScaling?.() || 1}' htmltag='${p1}'`;
+ const replacer2 = (match: string, p1: string) => `<HTMLtag Document={props.Document} htmltag='${p1}'`;
layoutFrame = layoutFrame.replace(/<HTML([a-zA-Z0-9_-]+)/g, replacer2);
// replace /HTML<tag> with </HTMLdiv> as in: </HTMLdiv> becomes </HTMLtag>
const replacer3 = (/* match: any, p1: string, offset: any, string: any */) => `</HTMLtag`;
-
layoutFrame = layoutFrame.replace(/<\/HTML([a-zA-Z0-9_-]+)/g, replacer3);
// add onClick function to props
@@ -181,7 +235,7 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
const code = XRegExp.matchRecursive(splits[1], '{', '}', '', { valueNames: ['between', 'left', 'match', 'right', 'between'] });
layoutFrame = splits[0] + ` ${func}={props.${func}} ` + splits[1].substring(code[1].end + 1);
const script = code[1].value.replace(/^‘/, '').replace(/’$/, ''); // ‘’ are not valid quotes in javascript so get rid of them -- they may be present to make it easier to write complex scripts - see headerTemplate in currentUserUtils.ts
- return ScriptField.MakeScript(script, { this: Doc.name, scale: 'number', value: 'string' });
+ return ScriptField.MakeScript(script, { this: Doc.name, value: 'string' });
}
return undefined;
// add input function to props