aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes')
-rw-r--r--src/client/views/nodes/DocumentLinksButton.tsx9
-rw-r--r--src/client/views/nodes/FontIconBox.tsx21
-rw-r--r--src/client/views/nodes/PresBox.tsx22
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx20
-rw-r--r--src/client/views/nodes/formattedText/RichTextMenu.tsx11
-rw-r--r--src/client/views/nodes/formattedText/RichTextSchema.tsx10
6 files changed, 57 insertions, 36 deletions
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index bbef48e44..13bec5d7f 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -93,9 +93,6 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
if (doubleTap && this.props.InMenu && !!!this.props.StartLink) {
if (DocumentLinksButton.StartLink === this.props.View) {
DocumentLinksButton.StartLink = undefined;
- // action((e: React.PointerEvent<HTMLDivElement>) => {
- // Doc.UnBrushDoc(this.props.View.Document);
- // });
} else {
if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View) {
@@ -126,13 +123,13 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
finishLinkClick = (e: React.MouseEvent) => {
if (DocumentLinksButton.StartLink === this.props.View) {
DocumentLinksButton.StartLink = undefined;
- // action((e: React.PointerEvent<HTMLDivElement>) => {
- // Doc.UnBrushDoc(this.props.View.Document);
- // });
} else {
if (this.props.InMenu && !!!this.props.StartLink) {
if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View) {
const linkDoc = DocUtils.MakeLink({ doc: DocumentLinksButton.StartLink.props.Document }, { doc: this.props.View.props.Document }, "long drag");
+ // this notifies any of the subviews that a document is made so that they can make finer-grained hyperlinks (). see note above in onLInkButtonMoved
+ runInAction(() => DocumentLinksButton.StartLink!._link = this.props.View._link = linkDoc);
+ setTimeout(action(() => DocumentLinksButton.StartLink!._link = this.props.View._link = undefined), 0);
LinkManager.currentLink = linkDoc;
runInAction(() => {
diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx
index 86e9a4527..a4d16fe0e 100644
--- a/src/client/views/nodes/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox.tsx
@@ -11,6 +11,7 @@ import { runInAction, observable, reaction, IReactionDisposer } from 'mobx';
import { Doc } from '../../../fields/Doc';
import { ContextMenu } from '../ContextMenu';
import { ScriptField } from '../../../fields/ScriptField';
+import { Tooltip } from '@material-ui/core';
const FontIconSchema = createSchema({
icon: "string"
});
@@ -60,14 +61,16 @@ export class FontIconBox extends DocComponent<FieldViewProps, FontIconDocument>(
render() {
const referenceDoc = (this.layoutDoc.dragFactory instanceof Doc ? this.layoutDoc.dragFactory : this.layoutDoc);
const refLayout = Doc.Layout(referenceDoc);
- return <button className="fontIconBox-outerDiv" title={StrCast(this.layoutDoc.title)} ref={this._ref} onContextMenu={this.specificContextMenu}
- style={{
- padding: Cast(this.layoutDoc._xPadding, "number", null),
- background: StrCast(refLayout._backgroundColor, StrCast(refLayout.backgroundColor)),
- boxShadow: this.layoutDoc.ischecked ? `4px 4px 12px black` : undefined
- }}>
- <FontAwesomeIcon className="fontIconBox-icon" icon={this.dataDoc.icon as any} color={StrCast(this.layoutDoc.color, this._foregroundColor)} size="sm" />
- {!this.rootDoc.label ? (null) : <div className="fontIconBox-label"> {StrCast(this.rootDoc.label).substring(0, 6)} </div>}
- </button>;
+ return <Tooltip title={<div className="dash-tooltip">{StrCast(this.layoutDoc.toolTip)}</div>}>
+ <button className="fontIconBox-outerDiv" ref={this._ref} onContextMenu={this.specificContextMenu}
+ style={{
+ padding: Cast(this.layoutDoc._xPadding, "number", null),
+ background: StrCast(refLayout._backgroundColor, StrCast(refLayout.backgroundColor)),
+ boxShadow: this.layoutDoc.ischecked ? `4px 4px 12px black` : undefined
+ }}>
+ <FontAwesomeIcon className="fontIconBox-icon" icon={this.dataDoc.icon as any} color={StrCast(this.layoutDoc.color, this._foregroundColor)} size="sm" />
+ {!this.rootDoc.title ? (null) : <div className="fontIconBox-label"> {StrCast(this.rootDoc.title).substring(0, 6)} </div>}
+ </button>
+ </Tooltip>;
}
} \ No newline at end of file
diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx
index 9b942c065..5c130e20e 100644
--- a/src/client/views/nodes/PresBox.tsx
+++ b/src/client/views/nodes/PresBox.tsx
@@ -266,8 +266,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
this.navigateToElement(this.childDocs[index], fromDoc);
// this.hideIfNotPresented(index);
// this.showAfterPresented(index);
- this.hideDocumentInPres();
- // this.onHideDocumentUntilPressClick();
+ // this.hideDocumentInPres();
+ this.onHideDocumentUntilPressClick();
}
});
@@ -477,6 +477,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@observable private moreInfoTools: boolean = false;
@observable private playTools: boolean = false;
@observable private pathBoolean: boolean = false;
+ @observable private expandBoolean: boolean = false;
// For toggling transition toolbar
@action toggleTransitionTools = () => {
@@ -624,6 +625,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
}
@action togglePath = () => this.pathBoolean = !this.pathBoolean;
+ @action toggleExpand = () => this.expandBoolean = !this.expandBoolean;
/**
* The function that is called on click to turn fading document after presented option on/off.
@@ -1014,6 +1016,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
CollectionFreeFormDocumentView.setupKeyframes(docs, docs.length, true);
targetDoc.lastFrame = docs.length - 1;
} else {
+ targetDoc.editProgressivize = false;
activeItem.presProgressivize = false;
targetDoc.presProgressivize = false;
docs.forEach((doc, index) => {
@@ -1128,21 +1131,26 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
</div></Tooltip>
<div className="toolbar-divider" />
<Tooltip title={<><div className="dash-tooltip">{"View paths"}</div></>}><div className={`toolbar-button ${this.pathBoolean ? "active" : ""}`}>
- <FontAwesomeIcon icon={"object-group"} onClick={this.viewPaths} />
+ <FontAwesomeIcon icon={"exchange-alt"} onClick={this.viewPaths} />
</div></Tooltip>
+ <Tooltip title={<><div className="dash-tooltip">{this.expandBoolean ? "Minimize all" : "Expand all"}</div></>}>
+ <div className={`toolbar-button ${this.expandBoolean ? "active" : ""}`} onClick={() => { this.toggleExpand(); this.childDocs.forEach((doc, ind) => { doc.presExpandInlineButton = !doc.presExpandInlineButton; }); }}>
+ <FontAwesomeIcon icon={"image"} />
+ </div>
+ </Tooltip>
{/* <div className="toolbar-button"><FontAwesomeIcon title={"Portal"} icon={"eye"} onClick={this.toolbarTest} /></div> */}
<div className="toolbar-divider" />
- <div className={`toolbar-button ${this.transitionTools ? "active" : ""}`} onClick={this.toggleTransitionTools}>
+ <Tooltip title={<><div className="dash-tooltip">{"Transitions"}</div></>}><div className={`toolbar-button ${this.transitionTools ? "active" : ""}`} onClick={this.toggleTransitionTools}>
<FontAwesomeIcon icon={"rocket"} />
<div style={{ display: width > 400 ? "block" : "none" }} className="toolbar-buttonText">&nbsp; Transitions</div>
<FontAwesomeIcon className={`dropdown ${this.transitionTools ? "active" : ""}`} icon={"angle-down"} />
- </div>
+ </div></Tooltip>
<div className="toolbar-divider" />
- <div className={`toolbar-button ${this.progressivizeTools ? "active" : ""}`} onClick={this.toggleProgressivize}>
+ <Tooltip title={<><div className="dash-tooltip">{"Progressivize"}</div></>}><div className={`toolbar-button ${this.progressivizeTools ? "active" : ""}`} onClick={this.toggleProgressivize}>
<FontAwesomeIcon icon={"tasks"} />
<div style={{ display: width > 400 ? "block" : "none" }} className="toolbar-buttonText">&nbsp; Progressivize</div>
<FontAwesomeIcon className={`dropdown ${this.progressivizeTools ? "active" : ""}`} icon={"angle-down"} />
- </div>
+ </div></Tooltip>
<div className="toolbar-divider" />
<div className="toolbar-button" style={{ position: 'absolute', right: 23, transform: 'rotate(45deg)', fontSize: 16 }}>
<FontAwesomeIcon className={"toolbar-thumbtack"} icon={"thumbtack"} />
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index f87b28c7f..30e1fa9cd 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -232,6 +232,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
const curProto = Cast(Cast(this.dataDoc.proto, Doc, null)?.[this.fieldKey], RichTextField, null); // the default text inherited from a prototype
const curLayout = this.rootDoc !== this.layoutDoc ? Cast(this.layoutDoc[this.fieldKey], RichTextField, null) : undefined; // the default text stored in a layout template
const json = JSON.stringify(state.toJSON());
+ let unchanged = true;
if (!this.dataDoc[AclSym]) {
if (!this._applyingChange && json.replace(/"selection":.*/, "") !== curProto?.Data.replace(/"selection":.*/, "")) {
this._applyingChange = true;
@@ -243,21 +244,25 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
this.dataDoc[this.props.fieldKey] = new RichTextField(json, curText);
this.dataDoc[this.props.fieldKey + "-noTemplate"] = (curTemp?.Text || "") !== curText; // mark the data field as being split from the template if it has been edited
ScriptCast(this.layoutDoc.onTextChanged, null)?.script.run({ this: this.layoutDoc, self: this.rootDoc, text: curText });
+ unchanged = false;
}
} else { // if we've deleted all the text in a note driven by a template, then restore the template data
this.dataDoc[this.props.fieldKey] = undefined;
this._editorView.updateState(EditorState.fromJSON(this.config, JSON.parse((curProto || curTemp).Data)));
this.dataDoc[this.props.fieldKey + "-noTemplate"] = undefined; // mark the data field as not being split from any template it might have
+ unchanged = false;
}
this._applyingChange = false;
+ if (!unchanged) {
+ this.updateTitle();
+ this.tryUpdateHeight();
+ }
}
} else {
const json = JSON.parse(Cast(this.dataDoc[this.fieldKey], RichTextField)?.Data!);
json.selection = state.toJSON().selection;
this._editorView.updateState(EditorState.fromJSON(this.config, json));
}
- this.updateTitle();
- this.tryUpdateHeight();
}
}
@@ -1036,7 +1041,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
this._editorView?.destroy();
}
- static _downEvent: any;
+ _downEvent: any;
_downX = 0;
_downY = 0;
_break = false;
@@ -1056,7 +1061,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
this._downX = e.clientX;
this._downY = e.clientY;
this.doLinkOnDeselect();
- FormattedTextBox._downEvent = true;
+ this._downEvent = true;
FormattedTextBoxComment.textBox = this;
if (this.props.onClick && e.button === 0 && !this.props.isSelected(false)) {
e.preventDefault();
@@ -1072,8 +1077,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
}
onPointerUp = (e: React.PointerEvent): void => {
- if (!FormattedTextBox._downEvent) return;
- FormattedTextBox._downEvent = false;
+ if (!this._downEvent) return;
+ this._downEvent = false;
if (!(e.nativeEvent as any).formattedHandled) {
const editor = this._editorView!;
FormattedTextBoxComment.textBox = this;
@@ -1092,7 +1097,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
onDoubleClick = (e: React.MouseEvent): void => {
this.doLinkOnDeselect();
- FormattedTextBox._downEvent = true;
FormattedTextBoxComment.textBox = this;
if (this.props.onClick && e.button === 0 && !this.props.isSelected(false)) {
e.preventDefault();
@@ -1244,7 +1248,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
richTextMenuPlugin() {
return new Plugin({
view(newView) {
- RichTextMenu.Instance && RichTextMenu.Instance.changeView(newView);
+ RichTextMenu.Instance?.changeView(newView);
return RichTextMenu.Instance;
}
});
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 63f6fdc54..2e0b0e659 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -156,7 +156,9 @@ export default class RichTextMenu extends AntimodeMenu {
@action
changeView(view: EditorView) {
- this.view = view;
+ if ((view as any)?.TextView?.props.isSelected(true)) {
+ this.view = view;
+ }
}
update(view: EditorView, lastState: EditorState | undefined) {
@@ -165,8 +167,7 @@ export default class RichTextMenu extends AntimodeMenu {
@action
public async updateFromDash(view: EditorView, lastState: EditorState | undefined, props: any) {
- if (!view) {
- console.log("no editor? why?");
+ if (!view || !(view as any).TextView?.props.isSelected(true)) {
return;
}
this.view = view;
@@ -318,7 +319,7 @@ export default class RichTextMenu extends AntimodeMenu {
}
destroy() {
- this.fadeOut(true);
+ !this.TextView?.props.isSelected(true) && this.fadeOut(true);
}
@action
@@ -656,7 +657,7 @@ export default class RichTextMenu extends AntimodeMenu {
@action toggleColorDropdown() { this.showColorDropdown = !this.showColorDropdown; }
@action setActiveColor(color: string) { this.activeFontColor = color; }
- get TextView() { return (this.view as any).TextView as FormattedTextBox; }
+ get TextView() { return (this.view as any)?.TextView as FormattedTextBox; }
createColorButton() {
const self = this;
diff --git a/src/client/views/nodes/formattedText/RichTextSchema.tsx b/src/client/views/nodes/formattedText/RichTextSchema.tsx
index a989abd6a..7a50ec3af 100644
--- a/src/client/views/nodes/formattedText/RichTextSchema.tsx
+++ b/src/client/views/nodes/formattedText/RichTextSchema.tsx
@@ -54,6 +54,8 @@ export class DashDocView {
this._dashSpan.style.height = node.attrs.height;
this._dashSpan.style.position = "absolute";
this._dashSpan.style.display = "inline-block";
+ this._dashSpan.style.left = "0";
+ this._dashSpan.style.top = "0";
this._dashSpan.style.whiteSpace = "normal";
this._dashSpan.onpointerleave = () => {
@@ -160,7 +162,13 @@ export class DashDocView {
if (node.attrs.width !== dashDoc._width + "px" || node.attrs.height !== dashDoc._height + "px") {
try { // bcz: an exception will be thrown if two aliases are open at the same time when a doc view comment is made
- view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, { ...node.attrs, width: dashDoc._width + "px", height: dashDoc._height + "px" }));
+ if (getPos() !== undefined) {
+ const node = view.state.tr.doc.nodeAt(getPos());
+ if (node.attrs.width !== dashDoc._width + "px" ||
+ node.attrs.height !== dashDoc._height + "px") {
+ view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, { ...node.attrs, width: dashDoc._width + "px", height: dashDoc._height + "px" }));
+ }
+ }
} catch (e) {
console.log(e);
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-06 21:26:24 +0000