aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DocumentView.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2024-05-03 10:23:46 -0400
committerbobzel <zzzman@gmail.com>2024-05-03 10:23:46 -0400
commit723c8b33ade753764d1d02b130c189fb65e20425 (patch)
treee278304fdace45a2c38562e72a3ccd2e8e91b759 /src/client/views/nodes/DocumentView.tsx
parentf410a7b314dd78244e18c9c52140b67b37ab0c87 (diff)
parent2caf7b7bb80b663b6ba585f88cdbd2d725f8505e (diff)
Merge branch 'master' into nathan-starter
Diffstat (limited to 'src/client/views/nodes/DocumentView.tsx')
-rw-r--r--src/client/views/nodes/DocumentView.tsx62
1 files changed, 44 insertions, 18 deletions
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index ae83819e5..21c7f3079 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -104,12 +104,11 @@ export interface DocumentViewProps extends FieldViewSharedProps {
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;
- suppressSetHeight?: boolean;
onClickScriptDisable?: 'never' | 'always'; // undefined = only when selected
DataTransition?: () => string | undefined;
NativeWidth?: () => number;
NativeHeight?: () => number;
- contextMenuItems?: () => { script: ScriptField; filter?: ScriptField; label: string; icon: string }[];
+ contextMenuItems?: () => { script?: ScriptField; method?: () => void; filter?: ScriptField; label: string; icon: string }[];
dragConfig?: (data: DragManager.DocumentDragData) => void;
dragStarting?: () => void;
dragEnding?: () => void;
@@ -201,6 +200,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
((!this.disableClickScriptFunc && //
this.onClickHandler &&
!this._props.onBrowseClickScript?.() &&
+ !this.layoutDoc.layout_isSvg &&
this.isContentActive() !== true) ||
this.isContentActive() === false)
? 'none'
@@ -223,7 +223,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
((link.link_anchor_2 as Doc)?.layout_unrendered && Doc.AreProtosEqual((link.link_anchor_2 as Doc)?.annotationOn as Doc, this.Document))
);
}
- @computed get _allLinks() {
+ @computed get _allLinks(): Doc[] {
TraceMobx();
return LinkManager.Instance.getAllRelatedLinks(this.Document).filter(link => !link.link_matchEmbeddings || link.link_anchor_1 === this.Document || link.link_anchor_2 === this.Document);
}
@@ -560,7 +560,13 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
StrListCast(this.Document.contextMenuLabels).forEach((label, i) =>
cm.addItem({ description: label, event: () => customScripts[i]?.script.run({ documentView: this, this: this.Document, scriptContext: this._props.scriptContext }), icon: 'sticky-note' })
);
- this._props.contextMenuItems?.().forEach(item => item.label && cm.addItem({ description: item.label, event: () => item.script.script.run({ this: this.Document, scriptContext: this._props.scriptContext }), icon: item.icon as IconProp }));
+ this._props
+ .contextMenuItems?.()
+ .forEach(
+ item =>
+ item.label &&
+ cm.addItem({ description: item.label, event: () => (item.method ? item.method() : item.script?.script.run({ this: this.Document, documentView: this, scriptContext: this._props.scriptContext })), icon: item.icon as IconProp })
+ );
if (!this.Document.isFolder) {
const templateDoc = Cast(this.Document[StrCast(this.Document.layout_fieldKey)], Doc, null);
@@ -597,7 +603,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
if (!this.Document.annotationOn) {
onClicks.push({ description: this.onClickHandler ? 'Remove Click Behavior' : 'Follow Link', event: () => this.toggleFollowLink(false, false), icon: 'link' });
!Doc.noviceMode && onClicks.push({ description: 'Edit onClick Script', event: () => UndoManager.RunInBatch(() => DocUtils.makeCustomViewClicked(this.Document, undefined, 'onClick'), 'edit onClick'), icon: 'terminal' });
- cm.addItem({ description: 'OnClick...', noexpand: true, subitems: onClicks, icon: 'mouse-pointer' });
+ !existingOnClick && cm.addItem({ description: 'OnClick...', noexpand: true, subitems: onClicks, icon: 'mouse-pointer' });
} else if (LinkManager.Links(this.Document).length) {
onClicks.push({ description: 'Restore On Click default', event: () => this.noOnClick(), icon: 'link' });
onClicks.push({ description: 'Follow Link on Click', event: () => this.followLinkOnClick(), icon: 'link' });
@@ -810,8 +816,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
};
/**
* displays a 'title' at the top of a document. The title contents default to the 'title' field, but can be changed to one or more fields by
- * setting layout_showTitle using the format: field1[;field2[...][:hover]]
- * from the UI, this is done by clicking the title field and prefixin the format with '#'. eg., #field1[;field2;...][:hover]
+ * setting layout_showTitle using the format: field1[:hover]
**/
@computed get titleView() {
const showTitle = this.layout_showTitle?.split(':')[0];
@@ -838,7 +843,11 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
background,
pointerEvents: (!this.disableClickScriptFunc && this.onClickHandler) || this.Document.ignoreClick ? 'none' : this.isContentActive() || this._props.isDocumentActive?.() ? 'all' : undefined,
}}>
- {!dropdownWidth ? null : <div style={{ width: dropdownWidth }}>{this.fieldsDropdown(showTitle)}</div>}
+ {!dropdownWidth ? null : (
+ <div className="documntViewInternal-dropdown" style={{ width: dropdownWidth }}>
+ {this.fieldsDropdown(showTitle)}
+ </div>
+ )}
<div
style={{
width: `calc(100% - ${dropdownWidth}px)`,
@@ -851,21 +860,26 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
contents={
showTitle
.split(';')
- .map(field => Field.toString(targetDoc[field.trim()] as Field))
+ .map(field => Field.toJavascriptString(this.Document[field] as Field))
.join(' \\ ') || '-unset-'
}
display="block"
oneLine={true}
fontSize={(this.titleHeight / 15) * 10}
- GetValue={() => (showTitle.split(';').length !== 1 ? '#' + showTitle : Field.toKeyValueString(this.Document, showTitle.split(';')[0]))}
+ GetValue={() =>
+ showTitle
+ .split(';')
+ .map(field => Field.toKeyValueString(this.Document, field))
+ .join('\\')
+ }
SetValue={undoBatch((input: string) => {
- if (input?.startsWith('#')) {
+ if (input?.startsWith('$')) {
if (this.layoutDoc.layout_showTitle) {
- this.layoutDoc._layout_showTitle = input?.substring(1);
+ this.layoutDoc._layout_showTitle = input?.substring(1) ? input.substring(1) : undefined;
} else if (!this._props.layout_showTitle) {
- Doc.UserDoc().layout_showTitle = input?.substring(1) ?? 'author_date';
+ Doc.UserDoc().layout_showTitle = input?.substring(1) ? input.substring(1) : 'title';
}
- } else if (showTitle && !showTitle.includes('Date') && showTitle !== 'author') {
+ } else if (showTitle && !showTitle.includes(';') && !showTitle.includes('Date') && showTitle !== 'author') {
KeyValueBox.SetField(targetDoc, showTitle, input);
}
return true;
@@ -892,6 +906,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
fieldKey={this.layout_showCaption}
styleProvider={this.captionStyleProvider}
dontRegisterView={true}
+ rootSelected={this.rootSelected}
noSidebar={true}
dontScale={true}
renderDepth={this._props.renderDepth}
@@ -909,7 +924,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
: this.docContents ?? (
<div
className="documentView-node"
- id={this.Document[Id]}
+ id={this.Document.type !== DocumentType.LINK ? this._docView?.DocUniqueId : undefined}
style={{
...style,
background: this.backgroundBoxColor,
@@ -1053,8 +1068,18 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
private _disposers: { [name: string]: IReactionDisposer } = {};
private _viewTimer: NodeJS.Timeout | undefined;
private _animEffectTimer: NodeJS.Timeout | undefined;
- public Guid = Utils.GenerateGuid(); // a unique id associated with the main <div>. used by LinkBox's Xanchor to find the arrowhead locations.
-
+ /**
+ * This is used to create an id for tracking a Doc. Since the Doc can be in a regular view and in the lightbox at
+ * the same time, this creates a different version of the id depending on whether the search scope will be in the lightbox or not.
+ * @param inLightbox is the id scoped to the lightbox
+ * @param id the id
+ * @returns
+ */
+ public static UniquifyId(inLightbox: boolean | undefined, id: string) {
+ return (inLightbox ? 'lightbox-' : '') + id;
+ }
+ public ViewGuid = DocumentView.UniquifyId(LightboxView.Contains(this), Utils.GenerateGuid()); // a unique id associated with the main <div>. used by LinkBox's Xanchor to find the arrowhead locations.
+ public DocUniqueId = DocumentView.UniquifyId(LightboxView.Contains(this), this.Document[Id]);
@computed public static get exploreMode() {
return () => (SnappingManager.ExploreMode ? ScriptField.MakeScript('CollectionBrowseClick(documentView, clientX, clientY)', { documentView: 'any', clientX: 'number', clientY: 'number' })! : undefined);
}
@@ -1357,6 +1382,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
}
//}
};
+ backgroundColor = () => this._docViewInternal?.backgroundBoxColor;
DataTransition = () => this._props.DataTransition?.() || StrCast(this.Document.dataTransition);
ShouldNotScale = () => this.shouldNotScale;
NativeWidth = () => this.effectiveNativeWidth;
@@ -1410,7 +1436,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
const yshift = Math.abs(this.Yshift) <= 0.001 ? this._props.PanelHeight() : undefined;
return (
- <div id={this.Guid} className="contentFittingDocumentView" onPointerEnter={action(() => (this._isHovering = true))} onPointerLeave={action(() => (this._isHovering = false))}>
+ <div id={this.ViewGuid} className="contentFittingDocumentView" onPointerEnter={action(() => (this._isHovering = true))} onPointerLeave={action(() => (this._isHovering = false))}>
{!this.Document || !this._props.PanelWidth() ? null : (
<div
className="contentFittingDocumentView-previewDoc"