aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/DocServer.ts4
-rw-r--r--src/client/util/LinkManager.ts12
-rw-r--r--src/client/util/UndoManager.ts21
-rw-r--r--src/client/views/EditableView.tsx1
-rw-r--r--src/client/views/PreviewCursor.tsx12
-rw-r--r--src/client/views/PropertiesView.tsx2
-rw-r--r--src/client/views/TemplateMenu.tsx2
-rw-r--r--src/client/views/collections/collectionFreeForm/MarqueeView.tsx4
-rw-r--r--src/client/views/linking/LinkMenuGroup.tsx2
-rw-r--r--src/client/views/nodes/EquationBox.tsx6
-rw-r--r--src/client/views/nodes/FunctionPlotBox.tsx26
-rw-r--r--src/client/views/nodes/LinkBox.tsx10
-rw-r--r--src/client/views/nodes/LinkDescriptionPopup.tsx6
-rw-r--r--src/client/views/nodes/ScriptingBox.tsx4
-rw-r--r--src/client/views/nodes/formattedText/DashFieldView.tsx50
-rw-r--r--src/client/views/nodes/formattedText/EquationView.tsx7
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx8
-rw-r--r--src/client/views/nodes/formattedText/RichTextRules.ts6
-rw-r--r--src/debug/Viewer.tsx4
19 files changed, 117 insertions, 70 deletions
diff --git a/src/client/DocServer.ts b/src/client/DocServer.ts
index 6217cf04b..bd60a205c 100644
--- a/src/client/DocServer.ts
+++ b/src/client/DocServer.ts
@@ -65,10 +65,10 @@ export namespace DocServer {
cacheDocumentIds = newCacheUpdate;
// print out cached docs
- console.log('Set cached docs = ');
+ Doc.MyDockedBtns.linearView_IsOpen && console.log('Set cached docs = ');
const is_filtered = filtered.filter(doc => !Doc.IsSystem(doc));
const strings = is_filtered.map(doc => StrCast(doc.title) + ' ' + (Doc.IsDataProto(doc) ? '(data)' : '(embedding)'));
- strings.sort().forEach((str, i) => console.log(i.toString() + ' ' + str));
+ Doc.MyDockedBtns.linearView_IsOpen && strings.sort().forEach((str, i) => console.log(i.toString() + ' ' + str));
rp.post(Utils.prepend('/setCacheDocumentIds'), {
body: {
diff --git a/src/client/util/LinkManager.ts b/src/client/util/LinkManager.ts
index cf16c4d6d..608e05fe9 100644
--- a/src/client/util/LinkManager.ts
+++ b/src/client/util/LinkManager.ts
@@ -152,10 +152,12 @@ export class LinkManager {
}
}
public deleteLink(linkDoc: Doc) {
- return Doc.RemoveDocFromList(Doc.LinkDBDoc(), 'data', linkDoc);
+ const ret = Doc.RemoveDocFromList(Doc.LinkDBDoc(), 'data', linkDoc);
+ linkDoc[DocData].link_anchor_1 = linkDoc[DocData].link_anchor_2 = undefined;
+ return ret;
}
public deleteAllLinksOnAnchor(anchor: Doc) {
- LinkManager.Instance.relatedLinker(anchor).forEach(linkDoc => LinkManager.Instance.deleteLink(linkDoc));
+ LinkManager.Instance.relatedLinker(anchor).forEach(LinkManager.Instance.deleteLink);
}
public getAllRelatedLinks(anchor: Doc) {
@@ -209,10 +211,10 @@ export class LinkManager {
const a1 = DocCast(linkDoc.link_anchor_1);
const a2 = DocCast(linkDoc.link_anchor_2);
if (linkDoc.link_matchEmbeddings) {
- return [a2, a2.annotationOn].includes(anchor) ? '2' : '1';
+ return [a2, a2?.annotationOn].includes(anchor) ? '2' : '1';
}
- if (Doc.AreProtosEqual(DocCast(anchor.annotationOn, anchor), DocCast(a1?.annotationOn, a1))) return '1';
- if (Doc.AreProtosEqual(DocCast(anchor.annotationOn, anchor), DocCast(a2?.annotationOn, a2))) return '2';
+ if (Doc.AreProtosEqual(DocCast(anchor?.annotationOn, anchor), DocCast(a1?.annotationOn, a1))) return '1';
+ if (Doc.AreProtosEqual(DocCast(anchor?.annotationOn, anchor), DocCast(a2?.annotationOn, a2))) return '2';
if (Doc.AreProtosEqual(anchor, linkDoc)) return '0';
// const a1 = DocCast(linkDoc.link_anchor_1);
diff --git a/src/client/util/UndoManager.ts b/src/client/util/UndoManager.ts
index 421855bf3..857ca852f 100644
--- a/src/client/util/UndoManager.ts
+++ b/src/client/util/UndoManager.ts
@@ -1,5 +1,5 @@
import { observable, action, runInAction } from 'mobx';
-import { Field } from '../../fields/Doc';
+import { Doc, Field } from '../../fields/Doc';
import { RichTextField } from '../../fields/RichTextField';
import { Without } from '../../Utils';
@@ -97,13 +97,14 @@ export namespace UndoManager {
export function AddEvent(event: UndoEvent, value?: any): void {
if (currentBatch && batchCounter.get() && !undoing) {
- console.log(
- ' '.slice(0, batchCounter.get()) +
- 'UndoEvent : ' +
- event.prop +
- ' = ' +
- (value instanceof RichTextField ? value.Text : value instanceof Array ? value.map(val => Field.toJavascriptString(val)).join(',') : Field.toJavascriptString(value))
- );
+ Doc.MyDockedBtns.linearView_IsOpen &&
+ console.log(
+ ' '.slice(0, batchCounter.get()) +
+ 'UndoEvent : ' +
+ event.prop +
+ ' = ' +
+ (value instanceof RichTextField ? value.Text : value instanceof Array ? value.map(val => Field.toJavascriptString(val)).join(',') : Field.toJavascriptString(value))
+ );
currentBatch.push(event);
tempEvents?.push(event);
}
@@ -171,7 +172,7 @@ export namespace UndoManager {
}
export function StartBatch(batchName: string): Batch {
- console.log(' '.slice(0, batchCounter.get()) + 'Start ' + batchCounter + ' ' + batchName);
+ Doc.MyDockedBtns.linearView_IsOpen && console.log(' '.slice(0, batchCounter.get()) + 'Start ' + batchCounter + ' ' + batchName);
runInAction(() => batchCounter.set(batchCounter.get() + 1));
if (currentBatch === undefined) {
currentBatch = [];
@@ -181,7 +182,7 @@ export namespace UndoManager {
const EndBatch = action((batchName: string, cancel: boolean = false) => {
runInAction(() => batchCounter.set(batchCounter.get() - 1));
- console.log(' '.slice(0, batchCounter.get()) + 'End ' + batchName + ' (' + currentBatch?.length + ')');
+ Doc.MyDockedBtns.linearView_IsOpen && console.log(' '.slice(0, batchCounter.get()) + 'End ' + batchName + ' (' + currentBatch?.length + ')');
if (batchCounter.get() === 0 && currentBatch?.length) {
if (!cancel) {
undoStack.push(currentBatch);
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 4508d00a7..44c8e4e1f 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -232,7 +232,6 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
onPointerDown: this.stopPropagation,
onClick: this.stopPropagation,
onPointerUp: this.stopPropagation,
- onKeyPress: this.stopPropagation,
value: this._props.autosuggestProps.value,
// @ts-ignore
onChange: this._props.autosuggestProps.onChange,
diff --git a/src/client/views/PreviewCursor.tsx b/src/client/views/PreviewCursor.tsx
index a94c18295..4b7771f27 100644
--- a/src/client/views/PreviewCursor.tsx
+++ b/src/client/views/PreviewCursor.tsx
@@ -18,7 +18,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
return PreviewCursor._instance;
}
- _onKeyPress?: (e: KeyboardEvent) => void;
+ _onKeyDown?: (e: KeyboardEvent) => void;
_getTransform?: () => Transform;
_addDocument?: (doc: Doc | Doc[]) => boolean;
_addLiveTextDoc?: (doc: Doc) => void;
@@ -32,7 +32,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
makeObservable(this);
PreviewCursor._instance = this;
this._clickPoint = observable([0, 0]);
- document.addEventListener('keydown', this.onKeyPress);
+ document.addEventListener('keydown', this.onKeyDown);
document.addEventListener('paste', this.paste, true);
}
@@ -120,7 +120,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
};
@action
- onKeyPress = (e: KeyboardEvent) => {
+ onKeyDown = (e: KeyboardEvent) => {
// Mixing events between React and Native is finicky.
//if not these keys, make a textbox if preview cursor is active!
if (
@@ -146,7 +146,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
) {
if ((!e.metaKey && !e.ctrlKey) || (e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 65 && e.keyCode <= 90)) {
// /^[a-zA-Z0-9$*^%#@+-=_|}{[]"':;?/><.,}]$/.test(e.key)) {
- this.Visible && this._onKeyPress?.(e);
+ this.Visible && this._onKeyDown?.(e);
((!e.ctrlKey && !e.metaKey) || e.key !== 'v') && (this.Visible = false);
}
} else if (this.Visible) {
@@ -171,7 +171,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
public static Show(
x: number,
y: number,
- onKeyPress: (e: KeyboardEvent) => void,
+ onKeyDown: (e: KeyboardEvent) => void,
addLiveText: (doc: Doc) => void,
getTransform: () => Transform,
addDocument: undefined | ((doc: Doc | Doc[]) => boolean),
@@ -181,7 +181,7 @@ export class PreviewCursor extends ObservableReactComponent<{}> {
const self = PreviewCursor.Instance;
if (self) {
self._clickPoint = [x, y];
- self._onKeyPress = onKeyPress;
+ self._onKeyDown = onKeyDown;
self._addLiveTextDoc = addLiveText;
self._getTransform = getTransform;
self._addDocument = addDocument || returnFalse;
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 195b1a04c..0de44b62b 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -715,7 +715,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
value={value}
style={{ color: SettingsManager.userColor, backgroundColor: SettingsManager.userBackgroundColor }}
onChange={e => setter(e.target.value)}
- onKeyPress={e => e.stopPropagation()}
+ onKeyDown={e => e.stopPropagation()}
/>
<div className="inputBox-button">
<div className="inputBox-button-up" key="up2" onPointerDown={undoBatch(action(() => this.upDownButtons('up', key)))}>
diff --git a/src/client/views/TemplateMenu.tsx b/src/client/views/TemplateMenu.tsx
index e7269df98..5df0bea1a 100644
--- a/src/client/views/TemplateMenu.tsx
+++ b/src/client/views/TemplateMenu.tsx
@@ -99,7 +99,7 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
.forEach(template => templateMenu.push(<OtherToggle key={template} name={template} checked={templateName === template} toggle={e => this.toggleLayout(e, template)} />));
return (
<ul className="template-list">
- {Doc.noviceMode ? null : <input placeholder="+ layout" ref={this._customRef} onKeyPress={this.onCustomKeypress} />}
+ {Doc.noviceMode ? null : <input placeholder="+ layout" ref={this._customRef} onKeyDown={this.onCustomKeypress} />}
{templateMenu}
<CollectionTreeView
Document={Doc.MyTemplates}
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index cb593a993..6b3a56b0b 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -101,7 +101,7 @@ export class MarqueeView extends ObservableReactComponent<SubCollectionViewProps
};
@action
- onKeyPress = (e: KeyboardEvent) => {
+ onKeyDown = (e: KeyboardEvent) => {
//make textbox and add it to this collection
// tslint:disable-next-line:prefer-const
const cm = ContextMenu.Instance;
@@ -311,7 +311,7 @@ export class MarqueeView extends ObservableReactComponent<SubCollectionViewProps
const effectiveAcl = GetEffectiveAcl(this._props.Document[DocData]);
if ([AclAdmin, AclEdit, AclAugment].includes(effectiveAcl)) {
PreviewCursor.Instance.Doc = doc;
- PreviewCursor.Show(x, y, this.onKeyPress, this._props.addLiveTextDocument, this._props.getTransform, this._props.addDocument, this._props.nudge, this._props.slowLoadDocuments);
+ PreviewCursor.Show(x, y, this.onKeyDown, this._props.addLiveTextDocument, this._props.getTransform, this._props.addDocument, this._props.nudge, this._props.slowLoadDocuments);
}
this.clearSelection();
}
diff --git a/src/client/views/linking/LinkMenuGroup.tsx b/src/client/views/linking/LinkMenuGroup.tsx
index 028d3da53..60def5d45 100644
--- a/src/client/views/linking/LinkMenuGroup.tsx
+++ b/src/client/views/linking/LinkMenuGroup.tsx
@@ -58,7 +58,7 @@ export class LinkMenuGroup extends React.Component<LinkMenuGroupProps> {
? DocCast(linkDoc.link_anchor_2)
: DocCast(linkDoc.link_anchor_1)
: LinkManager.getOppositeAnchor(linkDoc, sourceDoc) ||
- LinkManager.getOppositeAnchor(linkDoc, Cast(linkDoc.link_anchor_2, Doc, null).annotationOn === sourceDoc ? Cast(linkDoc.link_anchor_2, Doc, null) : Cast(linkDoc.link_anchor_1, Doc, null));
+ LinkManager.getOppositeAnchor(linkDoc, Cast(linkDoc.link_anchor_2, Doc, null)?.annotationOn === sourceDoc ? Cast(linkDoc.link_anchor_2, Doc, null) : Cast(linkDoc.link_anchor_1, Doc, null));
return !destDoc || !sourceDoc ? null : (
<LinkMenuItem
key={linkDoc[Id]}
diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index 50d4c7c78..8362db37a 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
import { Id } from '../../../fields/FieldSymbols';
import { NumCast, StrCast } from '../../../fields/Types';
import { TraceMobx } from '../../../fields/util';
-import { Docs } from '../../documents/Documents';
+import { DocUtils, Docs } from '../../documents/Documents';
import { undoBatch } from '../../util/UndoManager';
import { ViewBoxBaseComponent } from '../DocComponent';
import { LightboxView } from '../LightboxView';
@@ -80,7 +80,9 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
_height: 300,
backgroundColor: 'white',
});
- this._props.addDocument?.(graph);
+ const link = DocUtils.MakeLink(this.Document, graph, { link_relationship: 'function', link_description: 'input' });
+ //this._props.addDocument?.(graph);
+ link && this._props.addDocument?.(link);
e.stopPropagation();
}
if (e.key === 'Backspace' && !this.dataDoc.text) this._props.removeDocument?.(this.Document);
diff --git a/src/client/views/nodes/FunctionPlotBox.tsx b/src/client/views/nodes/FunctionPlotBox.tsx
index 2e7a2120e..67445e552 100644
--- a/src/client/views/nodes/FunctionPlotBox.tsx
+++ b/src/client/views/nodes/FunctionPlotBox.tsx
@@ -7,12 +7,13 @@ import { List } from '../../../fields/List';
import { listSpec } from '../../../fields/Schema';
import { Cast, StrCast } from '../../../fields/Types';
import { TraceMobx } from '../../../fields/util';
-import { Docs } from '../../documents/Documents';
+import { DocUtils, Docs } from '../../documents/Documents';
import { DragManager } from '../../util/DragManager';
import { undoBatch } from '../../util/UndoManager';
import { ViewBoxAnnotatableComponent } from '../DocComponent';
import { FieldView, FieldViewProps } from './FieldView';
import { PinProps, PresBox } from './trails';
+import { LinkManager } from '../../util/LinkManager';
@observer
export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
@@ -33,7 +34,7 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
componentDidMount() {
this._props.setContentViewBox?.(this);
reaction(
- () => [DocListCast(this.dataDoc[this.fieldKey]).map(doc => doc?.text), this.layoutDoc.width, this.layoutDoc.height, this.layoutDoc.xRange, this.layoutDoc.yRange],
+ () => [this.graphFuncs, this.layoutDoc.width, this.layoutDoc.height, this.layoutDoc.xRange, this.layoutDoc.yRange],
() => this.createGraph()
);
}
@@ -45,11 +46,17 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
if (addAsAnnotation) this.addDocument(anchor);
return anchor;
};
+ @computed get graphFuncs() {
+ const links = LinkManager.Instance.getAllRelatedLinks(this.Document)
+ .map(d => LinkManager.getOppositeAnchor(d, this.Document))
+ .filter(d => d)
+ .map(d => d!);
+ return links.concat(DocListCast(this.dataDoc[this.fieldKey])).map(doc => StrCast(doc.text, 'x^2').replace(/\\frac\{(.*)\}\{(.*)\}/, '($1/$2)'));
+ }
createGraph = (ele?: HTMLDivElement) => {
this._plotEle = ele || this._plotEle;
const width = this._props.PanelWidth();
const height = this._props.PanelHeight();
- const fns = DocListCast(this.dataDoc.data).map(doc => StrCast(doc.text, 'x^2').replace(/\\frac\{(.*)\}\{(.*)\}/, '($1/$2)'));
try {
this._plotEle.children.length && this._plotEle.removeChild(this._plotEle.children[0]);
this._plot = functionPlot({
@@ -59,7 +66,7 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
xAxis: { domain: Cast(this.layoutDoc.xRange, listSpec('number'), [-10, 10]) },
yAxis: { domain: Cast(this.layoutDoc.yRange, listSpec('number'), [-1, 9]) },
grid: true,
- data: fns.map(fn => ({
+ data: this.graphFuncs.map(fn => ({
fn,
// derivative: { fn: "2 * x", updateOnMouseMove: true }
})),
@@ -72,7 +79,14 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
@undoBatch
drop = (e: Event, de: DragManager.DropEvent) => {
if (de.complete.docDragData?.droppedDocuments.length) {
- const added = de.complete.docDragData.droppedDocuments.reduce((res, doc) => res && Doc.AddDocToList(this.dataDoc, this._props.fieldKey, doc), true);
+ const added = de.complete.docDragData.droppedDocuments.reduce((res, doc) => {
+ ///const ret = res && Doc.AddDocToList(this.dataDoc, this._props.fieldKey, doc);
+ if (res) {
+ const link = DocUtils.MakeLink(doc, this.Document, { link_relationship: 'function', link_description: 'input' });
+ link && this._props.addDocument?.(link);
+ }
+ return res;
+ }, true);
!added && e.preventDefault();
e.stopPropagation(); // prevent parent Doc from registering new position so that it snaps back into place
return added;
@@ -104,7 +118,7 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
{this.theGraph}
<div
style={{
- display: this._props.isSelected() ? 'none' : undefined,
+ display: this._props.isContentActive() ? 'none' : undefined,
position: 'absolute',
width: '100%',
height: '100%',
diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx
index 0809e2ad6..8ebcefb35 100644
--- a/src/client/views/nodes/LinkBox.tsx
+++ b/src/client/views/nodes/LinkBox.tsx
@@ -23,7 +23,7 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
public static LayoutString(fieldKey: string = 'link') {
return FieldView.LayoutString(LinkBox, fieldKey);
}
- _disposer: IReactionDisposer | undefined;
+ _disposers: { [name: string]: IReactionDisposer } = {};
@observable _forceAnimate: number = 0; // forces xArrow to animate when a transition animation is detected on something that affects an anchor
@observable _hide = false; // don't render if anchor is not visible since that breaks xAnchor
@@ -40,11 +40,15 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
return DocumentManager.Instance.getDocumentView(anchor, this.DocumentView?.().containerViewPath?.().lastElement());
};
componentWillUnmount() {
- this._disposer?.();
+ Object.keys(this._disposers).forEach(key => this._disposers[key]());
}
componentDidMount() {
this._props.setContentViewBox?.(this);
- this._disposer = reaction(
+ this._disposers.deleting = reaction(
+ () => !this.anchor1 || !this.anchor2,
+ empty => empty && this._props.removeDocument?.(this.Document)
+ );
+ this._disposers.dragging = reaction(
() => ({ drag: SnappingManager.IsDragging }),
({ drag }) => {
!LightboxView.Contains(this.DocumentView?.()) &&
diff --git a/src/client/views/nodes/LinkDescriptionPopup.tsx b/src/client/views/nodes/LinkDescriptionPopup.tsx
index 1645d0813..2a96ce458 100644
--- a/src/client/views/nodes/LinkDescriptionPopup.tsx
+++ b/src/client/views/nodes/LinkDescriptionPopup.tsx
@@ -69,8 +69,10 @@ export class LinkDescriptionPopup extends React.Component<{}> {
}}>
<input
className="linkDescriptionPopup-input"
- onKeyDown={e => e.stopPropagation()}
- onKeyPress={e => e.key === 'Enter' && this.onDismiss(true)}
+ onKeyDown={e => {
+ e.key === 'Enter' && this.onDismiss(true);
+ e.stopPropagation();
+ }}
value={this.description}
placeholder={this.description || '(Optional) Enter link description...'}
onChange={e => this.descriptionChanged(e)}
diff --git a/src/client/views/nodes/ScriptingBox.tsx b/src/client/views/nodes/ScriptingBox.tsx
index d9d0dbe3e..8c65fd34e 100644
--- a/src/client/views/nodes/ScriptingBox.tsx
+++ b/src/client/views/nodes/ScriptingBox.tsx
@@ -670,7 +670,7 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
const definedParameters = !this.compileParams.length ? null : (
<div className="scriptingBox-plist" style={{ width: '30%' }}>
{this.compileParams.map((parameter, i) => (
- <div key={i} className="scriptingBox-pborder" onKeyPress={e => e.key === 'Enter' && this._overlayDisposer?.()}>
+ <div key={i} className="scriptingBox-pborder" onKeyDown={e => e.key === 'Enter' && this._overlayDisposer?.()}>
<EditableView
display={'block'}
maxHeight={72}
@@ -749,7 +749,7 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
{!this.compileParams.length || !this.paramsNames ? null : (
<div className="scriptingBox-plist">
{this.paramsNames.map((parameter: string, i: number) => (
- <div key={i} className="scriptingBox-pborder" onKeyPress={e => e.key === 'Enter' && this._overlayDisposer?.()}>
+ <div key={i} className="scriptingBox-pborder" onKeyDown={e => e.key === 'Enter' && this._overlayDisposer?.()}>
<div className="scriptingBox-wrapper" style={{ maxHeight: '40px' }}>
<div className="scriptingBox-paramNames"> {`${parameter}:${this.paramsTypes[i]} = `} </div>
{this.paramsTypes[i] === 'boolean' ? this.renderEnum(parameter, [true, false]) : null}
diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx
index 5b03e2236..8802a032f 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.tsx
+++ b/src/client/views/nodes/formattedText/DashFieldView.tsx
@@ -1,6 +1,6 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Tooltip } from '@mui/material';
-import { action, computed, IReactionDisposer, makeObservable, observable, reaction, trace } from 'mobx';
+import { action, computed, IReactionDisposer, makeObservable, observable, reaction, runInAction, trace } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import * as ReactDOM from 'react-dom/client';
@@ -22,15 +22,20 @@ import { OpenWhere } from '../DocumentView';
import './DashFieldView.scss';
import { FormattedTextBox } from './FormattedTextBox';
import { DocData } from '../../../../fields/DocSymbols';
+import { NodeSelection, TextSelection } from 'prosemirror-state';
export class DashFieldView {
dom: HTMLDivElement; // container for label and value
root: any;
node: any;
tbox: FormattedTextBox;
+ @observable expanded = false;
+ Expanded = () => this.expanded;
unclickable = () => !this.tbox._props.rootSelected?.() && this.node.marks.some((m: any) => m.type === this.tbox.EditorView?.state.schema.marks.linkAnchor && m.attrs.noPreview);
constructor(node: any, view: any, getPos: any, tbox: FormattedTextBox) {
+ makeObservable(this);
+ const self = this;
this.node = node;
this.tbox = tbox;
this.dom = document.createElement('div');
@@ -38,11 +43,26 @@ export class DashFieldView {
this.dom.style.height = node.attrs.height;
this.dom.style.position = 'relative';
this.dom.style.display = 'inline-block';
- this.dom.onkeypress = function (e: any) {
+ const tBox = this.tbox;
+ this.dom.onkeypress = function (e: KeyboardEvent) {
e.stopPropagation();
};
- this.dom.onkeydown = function (e: any) {
+ this.dom.onkeydown = function (e: KeyboardEvent) {
e.stopPropagation();
+ if (e.key === 'Tab') {
+ e.preventDefault();
+ const editor = tbox.EditorView;
+ if (editor) {
+ const state = editor.state;
+ for (var i = state.selection.to; i < state.doc.content.size; i++) {
+ if (state.doc.nodeAt(i)?.type.name === state.schema.nodes.dashField.name) {
+ editor.dispatch(state.tr.setSelection(new NodeSelection(state.doc.resolve(i))));
+ return;
+ }
+ }
+ tBox.setFocus(state.selection.to + 1);
+ }
+ }
};
this.dom.onkeyup = function (e: any) {
e.stopPropagation();
@@ -51,6 +71,8 @@ export class DashFieldView {
e.stopPropagation();
};
+ this.expanded = node.attrs.expanded;
+
this.root = ReactDOM.createRoot(this.dom);
this.root.render(
<DashFieldViewInternal
@@ -63,7 +85,7 @@ export class DashFieldView {
height={node.attrs.height}
hideKey={node.attrs.hideKey}
editable={node.attrs.editable}
- expanded={node.attrs.expanded}
+ expanded={this.Expanded}
dataDoc={node.attrs.dataDoc}
tbox={tbox}
/>
@@ -77,9 +99,11 @@ export class DashFieldView {
});
}
deselectNode() {
+ runInAction(() => (this.expanded = false));
this.dom.classList.remove('ProseMirror-selectednode');
}
selectNode() {
+ setTimeout(() => runInAction(() => (this.expanded = true)), 100);
this.dom.classList.add('ProseMirror-selectednode');
}
}
@@ -92,7 +116,7 @@ interface IDashFieldViewInternal {
width: number;
height: number;
editable: boolean;
- expanded: boolean;
+ expanded: () => boolean;
dataDoc: boolean;
node: any;
getPos: any;
@@ -106,7 +130,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
_fieldKey: string;
_fieldRef = React.createRef<HTMLDivElement>();
@observable _dashDoc: Doc | undefined = undefined;
- @observable _expanded = this._props.expanded;
+ @observable _expanded = this._props.expanded();
constructor(props: IDashFieldViewInternal) {
super(props);
@@ -132,7 +156,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
componentWillUnmount() {
this._reactionDisposer?.();
}
- isRowActive = () => this._expanded && this._props.editable;
+ isRowActive = () => (this._props.expanded() || this._expanded) && this._props.editable;
finishEdit = action(() => {
if (this._expanded) {
@@ -155,7 +179,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
deselectCell={emptyFunction}
selectCell={emptyFunction}
maxWidth={this._props.hideKey || this._hideKey ? undefined : this._props.tbox._props.PanelWidth}
- columnWidth={this._expanded ? this.columnWidth : returnZero}
+ columnWidth={this._expanded || this._props.expanded() ? this.columnWidth : returnZero}
selectedCell={this.selectedCell}
fieldKey={this._fieldKey}
rowHeight={returnZero}
@@ -164,7 +188,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
getFinfo={emptyFunction}
setColumnValues={returnFalse}
allowCRs={true}
- oneLine={!this._expanded}
+ oneLine={!this._expanded && !this._props.expanded()}
finishEdit={this.finishEdit}
transform={Transform.Identity}
menuTarget={null}
@@ -217,7 +241,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
};
@computed get values() {
- if (this._props.expanded) return [];
+ if (this._props.expanded()) return [];
const vals = FilterPanel.gatherFieldValues(DocListCast(Doc.ActiveDashboard?.data), this._fieldKey, []);
return vals.strings.map(facet => ({ value: facet, label: facet }));
@@ -239,13 +263,13 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
</span>
)}
{this._props.fieldKey.startsWith('#') ? null : this.fieldValueContent}
- {!this.values.length ? null : (
- <select className="dashFieldView-select" onChange={this.selectVal}>
+ {/* {!this.values.length ? null : (
+ <select className="dashFieldView-select" tabIndex={-1} onChange={this.selectVal}>
{this.values.map(val => (
<option value={val.value}>{val.label}</option>
))}
</select>
- )}
+ )} */}
</div>
);
}
diff --git a/src/client/views/nodes/formattedText/EquationView.tsx b/src/client/views/nodes/formattedText/EquationView.tsx
index b786c5ffb..b90653acc 100644
--- a/src/client/views/nodes/formattedText/EquationView.tsx
+++ b/src/client/views/nodes/formattedText/EquationView.tsx
@@ -8,6 +8,7 @@ import { StrCast } from '../../../../fields/Types';
import './DashFieldView.scss';
import EquationEditor from './EquationEditor';
import { FormattedTextBox } from './FormattedTextBox';
+import { DocData } from '../../../../fields/DocSymbols';
export class EquationView {
dom: HTMLDivElement; // container for label and value
@@ -88,7 +89,6 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
}
e.stopPropagation();
}}
- onKeyPress={e => e.stopPropagation()}
style={{
position: 'relative',
display: 'inline-block',
@@ -96,12 +96,11 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
height: this.props.height,
background: 'white',
borderRadius: '10%',
- bottom: 3,
}}>
<EquationEditor
ref={this._ref}
- value={StrCast(this._textBoxDoc[this._fieldKey], 'y=')}
- onChange={(str: any) => (this._textBoxDoc[this._fieldKey] = str)}
+ value={StrCast(this._textBoxDoc[DocData][this._fieldKey])}
+ onChange={(str: any) => (this._textBoxDoc[DocData][this._fieldKey] = str)}
autoCommands="pi theta sqrt sum prod alpha beta gamma rho"
autoOperatorNames="sin cos tan"
spaceBehavesLikeTab={true}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index eb7293054..70b3b52fd 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1616,10 +1616,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
e.stopPropagation();
}
};
- setFocus = () => {
- const pos = this._editorView?.state.selection.$from.pos || 1;
- (this.ProseRef?.children?.[0] as any).focus();
- setTimeout(() => this._editorView?.dispatch(this._editorView?.state.tr.setSelection(TextSelection.create(this._editorView.state.doc, pos))));
+ setFocus = (ipos?: number) => {
+ const pos = ipos ?? (this._editorView?.state.selection.$from.pos || 1);
+ setTimeout(() => this._editorView?.dispatch(this._editorView.state.tr.setSelection(TextSelection.near(this._editorView.state.doc.resolve(pos)))), 100);
+ setTimeout(() => (this.ProseRef?.children?.[0] as any).focus(), 200);
};
@action
onFocused = (e: React.FocusEvent): void => {
diff --git a/src/client/views/nodes/formattedText/RichTextRules.ts b/src/client/views/nodes/formattedText/RichTextRules.ts
index adc031636..c3eaf4dd2 100644
--- a/src/client/views/nodes/formattedText/RichTextRules.ts
+++ b/src/client/views/nodes/formattedText/RichTextRules.ts
@@ -385,10 +385,10 @@ export class RichTextRules {
}),
// create an inline equation node
- // eq:<equation>>
- new InputRule(new RegExp(/%eq([a-zA-Z-0-9\(\)]*)$/), (state, match, start, end) => {
+ // %eq
+ new InputRule(new RegExp(/%eq/), (state, match, start, end) => {
const fieldKey = 'math' + Utils.GenerateGuid();
- this.TextBox.dataDoc[fieldKey] = match[1];
+ this.TextBox.dataDoc[fieldKey] = 'y=';
const tr = state.tr.setSelection(new TextSelection(state.tr.doc.resolve(end - 3), state.tr.doc.resolve(end))).replaceSelectionWith(schema.nodes.equation.create({ fieldKey }));
return tr.setSelection(new NodeSelection(tr.doc.resolve(tr.selection.$from.pos - 1)));
}),
diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx
index f46adef77..ceff01fc2 100644
--- a/src/debug/Viewer.tsx
+++ b/src/debug/Viewer.tsx
@@ -152,7 +152,7 @@ class Viewer extends React.Component {
};
@action
- onKeyPress = (e: React.KeyboardEvent<HTMLDivElement>) => {
+ onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {
if (e.key === 'Enter') {
DocServer.GetRefField(this.idToAdd).then(
action((field: any) => {
@@ -168,7 +168,7 @@ class Viewer extends React.Component {
render() {
return (
<>
- <input value={this.idToAdd} onChange={this.inputOnChange} onKeyDown={this.onKeyPress} />
+ <input value={this.idToAdd} onChange={this.inputOnChange} onKeyDown={this.onKeyDown} />
<div>
{this.fields.map((field, index) => (
<DebugViewer field={field} key={index} setValue={() => false}></DebugViewer>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 10:22:23 +0000