aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/DocumentButtonBar.tsx13
-rw-r--r--src/client/views/nodes/DocHolderBox.scss1
-rw-r--r--src/client/views/nodes/DocHolderBox.tsx145
-rw-r--r--src/client/views/nodes/DocumentView.tsx2
-rw-r--r--src/client/views/nodes/FieldView.tsx1
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx4
6 files changed, 89 insertions, 77 deletions
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 7ba47deb5..db566ee48 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -5,7 +5,7 @@ import { action, computed, observable, runInAction } from "mobx";
import { observer } from "mobx-react";
import { Doc, DocListCast } from "../../new_fields/Doc";
import { RichTextField } from '../../new_fields/RichTextField';
-import { NumCast, StrCast } from "../../new_fields/Types";
+import { NumCast, StrCast, Cast } from "../../new_fields/Types";
import { emptyFunction, setupMoveUpEvents } from "../../Utils";
import { Pulls, Pushes } from '../apis/google_docs/GoogleApiClientUtils';
import { UndoManager } from "../util/UndoManager";
@@ -170,11 +170,16 @@ export class DocumentButtonBar extends React.Component<{ views: (DocumentView |
style={{ backgroundColor: this.pullColor }}
onPointerEnter={e => (e.altKey || e.shiftKey) && runInAction(() => this.openHover = true)}
onPointerLeave={action(() => this.openHover = false)}
- onClick={e => {
+ onClick={async (e: React.MouseEvent) => {
if (e.shiftKey) {
e.preventDefault();
- CollectionDockingView.AddRightSplit(Docs.Create.WebDocument(`https://docs.google.com/document/d/${dataDoc[GoogleRef]}/edit`,
- { _width: 600, _nativeWidth: 960, _nativeHeight: 800, isAnnotating: false }));
+ let googleDoc = await Cast(dataDoc.googleDoc, Doc);
+ if (!googleDoc) {
+ googleDoc = Docs.Create.WebDocument(`https://docs.google.com/document/d/${dataDoc[GoogleRef]}/edit`,
+ { _width: 600, _nativeWidth: 960, _nativeHeight: 800, isAnnotating: false });
+ dataDoc.googleDoc = googleDoc;
+ }
+ CollectionDockingView.AddRightSplit(googleDoc);
} else if (e.altKey) {
e.preventDefault();
window.open(`https://docs.google.com/document/d/${dataDoc[GoogleRef]}/edit`);
diff --git a/src/client/views/nodes/DocHolderBox.scss b/src/client/views/nodes/DocHolderBox.scss
index 3a27c16c1..4949d16a3 100644
--- a/src/client/views/nodes/DocHolderBox.scss
+++ b/src/client/views/nodes/DocHolderBox.scss
@@ -8,6 +8,7 @@
margin: auto;
color: white;
position: absolute;
+ padding: 3px;
}
.contentFittingDocumentView {
position: absolute;
diff --git a/src/client/views/nodes/DocHolderBox.tsx b/src/client/views/nodes/DocHolderBox.tsx
index 9787877cc..17b2daabc 100644
--- a/src/client/views/nodes/DocHolderBox.tsx
+++ b/src/client/views/nodes/DocHolderBox.tsx
@@ -3,7 +3,7 @@ import { action, IReactionDisposer, reaction } from "mobx";
import { observer } from "mobx-react";
import { Doc, Field } from "../../../new_fields/Doc";
import { collectionSchema, documentSchema } from "../../../new_fields/documentSchemas";
-import { makeInterface } from "../../../new_fields/Schema";
+import { makeInterface, listSpec } from "../../../new_fields/Schema";
import { ComputedField } from "../../../new_fields/ScriptField";
import { Cast, NumCast, StrCast } from "../../../new_fields/Types";
import { TraceMobx } from "../../../new_fields/util";
@@ -32,7 +32,7 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
_contRef = React.createRef<HTMLDivElement>();
_curSelection = -1;
componentDidMount() {
- this._prevSelectionDisposer = reaction(() => this.layoutDoc[this.props.fieldKey], (data) => {
+ this._prevSelectionDisposer = reaction(() => this.dataDoc[this.fieldKey], (data) => {
if (data instanceof Doc && !this.isSelectionLocked()) {
this._selections.indexOf(data) !== -1 && this._selections.splice(this._selections.indexOf(data), 1);
this._selections.push(data);
@@ -53,13 +53,13 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
ContextMenu.Instance.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" });
}
lockSelection = () => {
- this.layoutDoc[this.props.fieldKey] = this.layoutDoc[this.props.fieldKey];
+ this.dataDoc[this.fieldKey] = this.dataDoc[this.fieldKey];
}
showSelection = () => {
- this.layoutDoc[this.props.fieldKey] = ComputedField.MakeFunction(`selectedDocs(self,this.excludeCollections,[_last_])?.[0]`);
+ this.dataDoc[this.fieldKey] = ComputedField.MakeFunction(`selectedDocs(self,this.excludeCollections,[_last_])?.[0]`);
}
isSelectionLocked = () => {
- const kvpstring = Field.toKeyValueString(this.layoutDoc, this.props.fieldKey);
+ const kvpstring = Field.toKeyValueString(this.dataDoc, this.fieldKey);
return !kvpstring || kvpstring.includes("DOC");
}
toggleLockSelection = () => {
@@ -69,13 +69,13 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
prevSelection = () => {
this.lockSelection();
if (this._curSelection > 0) {
- this.layoutDoc[this.props.fieldKey] = this._selections[--this._curSelection];
+ this.dataDoc[this.fieldKey] = this._selections[--this._curSelection];
return true;
}
}
nextSelection = () => {
if (this._curSelection < this._selections.length - 1 && this._selections.length) {
- this.layoutDoc[this.props.fieldKey] = this._selections[++this._curSelection];
+ this.dataDoc[this.fieldKey] = this._selections[++this._curSelection];
return true;
}
}
@@ -89,8 +89,8 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
(e.nativeEvent as any).formattedHandled = true;
e.stopPropagation();
}
- get xPad() { return NumCast(this.props.Document._xPadding); }
- get yPad() { return NumCast(this.props.Document._yPadding); }
+ get xPad() { return NumCast(this.rootDoc._xPadding); }
+ get yPad() { return NumCast(this.rootDoc._yPadding); }
onClick = (e: React.MouseEvent) => {
let hitWidget: boolean | undefined = false;
if (this._contRef.current!.getBoundingClientRect().top + this.yPad > e.clientY) hitWidget = (() => { this.props.select(false); return true; })();
@@ -107,67 +107,70 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
pwidth = () => this.props.PanelWidth() - 2 * this.xPad;
pheight = () => this.props.PanelHeight() - 2 * this.yPad;
getTransform = () => this.props.ScreenToLocalTransform().translate(-this.xPad, -this.yPad);
- isActive = () => this.active() || !this.props.renderDepth;
- layoutTemplateDoc = () => Cast(this.props.Document.childLayoutTemplate, Doc, null);
+ isActive = (outsideReaction: boolean) => this.active(outsideReaction) || this.props.renderDepth <= 1;
+ layoutTemplateDoc = () => Cast(this.layoutDoc.childLayoutTemplate, Doc, null);
get renderContents() {
- const containedDoc = Cast(this.dataDoc[this.props.fieldKey], Doc, null);
+ const containedDoc = Cast(this.dataDoc[this.fieldKey], Doc, null);
const layoutTemplate = StrCast(this.layoutDoc.childLayoutString);
- const contents = !(containedDoc instanceof Doc) ? (null) : this.layoutDoc.childLayoutString || this.layoutTemplateDoc() ?
- <DocumentView
- Document={containedDoc}
- DataDoc={undefined}
- LibraryPath={emptyPath}
- ContainingCollectionView={this as any} // bcz: hack! need to pass a prop that can be used to select the container (ie, 'this') when the up selector in document decorations is clicked. currently, the up selector allows only a containing collection to be selected
- ContainingCollectionDoc={undefined}
- fitToBox={true}
- LayoutTemplateString={layoutTemplate}
- LayoutTemplate={this.layoutTemplateDoc}
- rootSelected={this.props.isSelected}
- addDocument={this.props.addDocument}
- moveDocument={this.props.moveDocument}
- removeDocument={this.props.removeDocument}
- addDocTab={this.props.addDocTab}
- pinToPres={this.props.pinToPres}
- ScreenToLocalTransform={this.getTransform}
- renderDepth={this.props.renderDepth + 1}
- NativeHeight={returnZero}
- NativeWidth={returnZero}
- PanelWidth={this.pwidth}
- PanelHeight={this.pheight}
- focus={this.props.focus}
- parentActive={this.isActive}
- dontRegisterView={true}
- whenActiveChanged={this.props.whenActiveChanged}
- bringToFront={returnFalse}
- ContentScaling={returnOne} /> :
- <ContentFittingDocumentView
- Document={containedDoc}
- DataDoc={undefined}
- LibraryPath={emptyPath}
- ContainingCollectionView={this as any} // bcz: hack! need to pass a prop that can be used to select the container (ie, 'this') when the up selector in document decorations is clicked. currently, the up selector allows only a containing collection to be selected
- ContainingCollectionDoc={undefined}
- fitToBox={true}
- LayoutTemplateString={layoutTemplate}
- LayoutTemplate={this.layoutTemplateDoc}
- rootSelected={this.props.isSelected}
- addDocument={this.props.addDocument}
- moveDocument={this.props.moveDocument}
- removeDocument={this.props.removeDocument}
- addDocTab={this.props.addDocTab}
- pinToPres={this.props.pinToPres}
- ScreenToLocalTransform={this.getTransform}
- renderDepth={this.props.renderDepth + 1}
- NativeHeight={returnZero}
- NativeWidth={returnZero}
- PanelWidth={this.pwidth}
- PanelHeight={this.pheight}
- focus={this.props.focus}
- parentActive={this.isActive}
- dontRegisterView={true}
- whenActiveChanged={this.props.whenActiveChanged}
- bringToFront={returnFalse}
- ContentScaling={returnOne}
- />;
+ const contents = !(containedDoc instanceof Doc) ||
+ Cast(containedDoc[Doc.LayoutFieldKey(containedDoc)], listSpec(Doc), null)?.includes(this.rootDoc)
+ ? (null) : this.layoutDoc.childLayoutString || this.layoutTemplateDoc() ?
+ <DocumentView
+ Document={containedDoc}
+ DataDoc={undefined}
+ LibraryPath={emptyPath}
+ ContainingCollectionView={this as any} // bcz: hack! need to pass a prop that can be used to select the container (ie, 'this') when the up selector in document decorations is clicked. currently, the up selector allows only a containing collection to be selected
+ ContainingCollectionDoc={undefined}
+ fitToBox={true}
+ LayoutTemplateString={layoutTemplate}
+ LayoutTemplate={this.layoutTemplateDoc}
+ rootSelected={this.props.isSelected}
+ addDocument={this.props.addDocument}
+ moveDocument={this.props.moveDocument}
+ removeDocument={this.props.removeDocument}
+ addDocTab={this.props.addDocTab}
+ pinToPres={this.props.pinToPres}
+ ScreenToLocalTransform={this.getTransform}
+ renderDepth={containedDoc.type !== DocumentType.DOCHOLDER && !this.props.renderDepth ? 0 : this.props.renderDepth + 1}
+ NativeHeight={returnZero}
+ NativeWidth={returnZero}
+ PanelWidth={this.pwidth}
+ PanelHeight={this.pheight}
+ focus={this.props.focus}
+ parentActive={this.isActive}
+ dontRegisterView={true}
+ whenActiveChanged={this.props.whenActiveChanged}
+ bringToFront={returnFalse}
+ ContentScaling={returnOne} /> :
+ <ContentFittingDocumentView
+ Document={containedDoc}
+ DataDoc={undefined}
+ LibraryPath={emptyPath}
+ ContainingCollectionView={this as any} // bcz: hack! need to pass a prop that can be used to select the container (ie, 'this') when the up selector in document decorations is clicked. currently, the up selector allows only a containing collection to be selected
+ ContainingCollectionDoc={undefined}
+ fitToBox={true}
+ ignoreAutoHeight={true}
+ LayoutTemplateString={layoutTemplate}
+ LayoutTemplate={this.layoutTemplateDoc}
+ rootSelected={this.props.isSelected}
+ addDocument={this.props.addDocument}
+ moveDocument={this.props.moveDocument}
+ removeDocument={this.props.removeDocument}
+ addDocTab={this.props.addDocTab}
+ pinToPres={this.props.pinToPres}
+ ScreenToLocalTransform={this.getTransform}
+ renderDepth={containedDoc.type !== DocumentType.DOCHOLDER && !this.props.renderDepth ? 0 : this.props.renderDepth + 1}
+ NativeHeight={returnZero}
+ NativeWidth={returnZero}
+ PanelWidth={this.pwidth}
+ PanelHeight={this.pheight}
+ focus={this.props.focus}
+ parentActive={this.isActive}
+ dontRegisterView={true}
+ whenActiveChanged={this.props.whenActiveChanged}
+ bringToFront={returnFalse}
+ ContentScaling={returnOne}
+ />;
return contents;
}
render() {
@@ -183,7 +186,7 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
}}>
{this.renderContents}
<div className="documentBox-lock" onClick={this.onLockClick} ref={this.createDropTarget}
- style={{ marginTop: - this.yPad }}>
+ style={{ marginTop: - this.yPad, background: "black" }}>
<FontAwesomeIcon icon={this.isSelectionLocked() ? "lock" : "unlock"} size="sm" />
</div>
</div >;
@@ -195,13 +198,13 @@ export class DocHolderBox extends ViewBoxAnnotatableComponent<FieldViewProps, Do
if (de.complete.docDragData) {
if (de.complete.docDragData.draggedDocuments[0].type === DocumentType.FONTICON) {
const doc = Cast(de.complete.docDragData.draggedDocuments[0].dragFactory, Doc, null);
- this.props.Document.childLayoutTemplate = doc;
+ this.layoutDoc.childLayoutTemplate = doc;
}
}
}
protected createDropTarget = (ele: HTMLDivElement) => {
this._dropDisposer?.();
- ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this), this.props.Document));
+ ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this), this.rootDoc));
}
}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 5a2ad8c88..2d5d7d231 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -63,6 +63,7 @@ export interface DocumentViewProps {
LayoutTemplate?: () => Opt<Doc>;
LibraryPath: Doc[];
fitToBox?: boolean;
+ ignoreAutoHeight?: boolean;
contextMenuItems?: () => { script: ScriptField, label: string }[];
rootSelected: (outsideReaction?: boolean) => boolean; // whether the root of a template has been selected
onClick?: ScriptField;
@@ -1009,6 +1010,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
renderDepth={this.props.renderDepth}
PanelWidth={this.panelWidth}
PanelHeight={this.panelHeight}
+ ignoreAutoHeight={this.props.ignoreAutoHeight}
focus={this.props.focus}
parentActive={this.props.parentActive}
whenActiveChanged={this.props.whenActiveChanged}
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index 016d2a1ae..7db634e74 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -43,6 +43,7 @@ export interface FieldViewProps {
whenActiveChanged: (isActive: boolean) => void;
dontRegisterView?: boolean;
focus: (doc: Doc) => void;
+ ignoreAutoHeight?: boolean;
PanelWidth: () => number;
PanelHeight: () => number;
NativeHeight: () => number;
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index ce096f81b..5dc22d6f6 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -985,7 +985,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
}
if (e.button === 0 && this.active(true) && !e.altKey && !e.ctrlKey && !e.metaKey) {
if (e.clientX < this.ProseRef!.getBoundingClientRect().right) { // don't stop propagation if clicking in the sidebar
- e.stopPropagation();
+ //e.stopPropagation();
}
}
if (e.button === 2 || (e.button === 0 && e.ctrlKey)) {
@@ -1217,7 +1217,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
@action
tryUpdateHeight(limitHeight?: number) {
let scrollHeight = this._ref.current?.scrollHeight;
- if (this.layoutDoc._autoHeight && scrollHeight &&
+ if (this.layoutDoc._autoHeight && !this.props.ignoreAutoHeight && scrollHeight &&
getComputedStyle(this._ref.current!.parentElement!).top === "0px") { // if top === 0, then the text box is growing upward (as the overlay caption) which doesn't contribute to the height computation
if (limitHeight && scrollHeight > limitHeight) {
scrollHeight = limitHeight;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 15:34:27 +0000