diff options
Diffstat (limited to 'src/client/views/nodes')
| -rw-r--r-- | src/client/views/nodes/DiagramBox.tsx | 5 | ||||
| -rw-r--r-- | src/client/views/nodes/DocumentContentsView.tsx | 11 | ||||
| -rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/nodes/ImageBox.tsx | 18 | ||||
| -rw-r--r-- | src/client/views/nodes/formattedText/DashFieldView.tsx | 11 | ||||
| -rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.tsx | 2 |
6 files changed, 24 insertions, 25 deletions
diff --git a/src/client/views/nodes/DiagramBox.tsx b/src/client/views/nodes/DiagramBox.tsx index e77cde431..a49c69be3 100644 --- a/src/client/views/nodes/DiagramBox.tsx +++ b/src/client/views/nodes/DiagramBox.tsx @@ -18,6 +18,7 @@ import { InkingStroke } from '../InkingStroke'; import './DiagramBox.scss'; import { FieldView, FieldViewProps } from './FieldView'; import { FormattedTextBox } from './formattedText/FormattedTextBox'; +import { Tooltip } from '@mui/material'; /** * this is a class for the diagram box doc type that can be found in the tools section of the side bar */ @@ -208,7 +209,9 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { <button type="button" onClick={this.generateMermaidCode}> Gen </button> - <input type="checkbox" onClick={action(() => (this._showCode = !this._showCode))} /> + <Tooltip title="show diagram code"> + <input type="checkbox" onClick={action(() => (this._showCode = !this._showCode))} /> + </Tooltip> </div> <div className="DIYNodeBox-content"> {this._showCode ? ( diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx index aab8a183a..47c5734f7 100644 --- a/src/client/views/nodes/DocumentContentsView.tsx +++ b/src/client/views/nodes/DocumentContentsView.tsx @@ -23,7 +23,6 @@ interface HTMLtagProps { htmltag: string; onClick?: ScriptField; onInput?: ScriptField; - scaling: number; children?: JSX.Element[]; } @@ -43,7 +42,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 +55,6 @@ export class HTMLtag extends React.Component<HTMLtagProps> { 'dragStarting', 'dragEnding', 'htmltag', - 'scaling', 'Document', 'key', 'onInput', @@ -65,7 +63,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); @@ -166,12 +164,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 +178,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 diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index a514ee04e..cac276535 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -134,7 +134,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document @computed get border() { return this.style(this.layoutDoc, StyleProp.Border) as string || ""; } // prettier-ignore @computed get borderRounding() { return this.style(this.layoutDoc, StyleProp.BorderRounding) as string; } // prettier-ignore @computed get widgetDecorations() { return this.style(this.layoutDoc, StyleProp.Decorations) as JSX.Element; } // prettier-ignore - @computed get backgroundBoxColor(){ return this.style(this.layoutDoc, StyleProp.BackgroundColor + ':docView') as string; } // prettier-ignore + @computed get backgroundBoxColor(){ return this.style(this.Document, StyleProp.BackgroundColor + ':docView') as string; } // prettier-ignore @computed get showTitle() { return this.style(this.layoutDoc, StyleProp.ShowTitle) as Opt<string>; } // prettier-ignore @computed get showCaption() { return this.style(this.layoutDoc, StyleProp.ShowCaption) as string ?? ""; } // prettier-ignore @computed get headerMargin() { return this.style(this.layoutDoc, StyleProp.HeaderMargin) as number ?? 0; } // prettier-ignore diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index 017ef7191..5b06e9fc5 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -148,9 +148,9 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { ); const { layoutDoc } = this; this._disposers.path = reaction( - () => ({ nativeSize: this.nativeSize, width: NumCast(this.layoutDoc._width) }), - ({ nativeSize, width }) => { - if ((layoutDoc === this.layoutDoc && !this.layoutDoc._layout_nativeDimEditable) || !this.layoutDoc._height) { + () => ({ nativeSize: this.nativeSize, width: NumCast(this.layoutDoc._width), height: this.layoutDoc._height }), + ({ nativeSize, width, height }) => { + if ((layoutDoc === this.layoutDoc && !this.layoutDoc._layout_nativeDimEditable) || !height) { this.layoutDoc._height = (width * nativeSize.nativeHeight) / nativeSize.nativeWidth; } }, @@ -834,14 +834,10 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { const file = input.files?.[0]; if (file) { const disposer = OverlayView.ShowSpinner(); - const [{ result }] = await Networking.UploadFilesToServer({ file }); - if (result instanceof Error) { - alert('Error uploading files - possibly due to unsupported file types'); - } else { - this.dataDoc[this.fieldKey] = new ImageField(result.accessPaths.agnostic.client); - !(result instanceof Error) && DocUtils.assignImageInfo(result, this.dataDoc); - } - disposer(); + DocUtils.uploadFileToDoc(file, {}, this.Document).then(doc => { + disposer(); + doc && (doc.height = undefined); + }); } else { console.log('No file selected'); } diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx index 18cf36603..e899b49bc 100644 --- a/src/client/views/nodes/formattedText/DashFieldView.tsx +++ b/src/client/views/nodes/formattedText/DashFieldView.tsx @@ -25,6 +25,7 @@ import './DashFieldView.scss'; import { FormattedTextBox } from './FormattedTextBox'; import { Node } from 'prosemirror-model'; import { EditorView } from 'prosemirror-view'; +import { DocumentOptions, FInfo } from '../../../documents/Documents'; @observer export class DashFieldViewMenu extends AntimodeMenu<AntimodeMenuProps> { @@ -151,6 +152,8 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi selectedCells = () => (this._dashDoc ? [this._dashDoc] : undefined); columnWidth = () => Math.min(this._props.tbox._props.PanelWidth(), Math.max(50, this._props.tbox._props.PanelWidth() - 100)); // try to leave room for the fieldKey + finfo = (fieldKey: string) => (new DocumentOptions() as Record<string, FInfo>)[fieldKey]; + // set the display of the field's value (checkbox for booleans, span of text for strings) @computed get fieldValueContent() { return !this._dashDoc ? null : ( @@ -165,7 +168,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._props.nodeSelected() ? this.columnWidth : returnZero} + columnWidth={this._expanded || this._props.nodeSelected() ? () => undefined : returnZero} selectedCells={this.selectedCells} selectedCol={returnZero} fieldKey={this._fieldKey} @@ -178,7 +181,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi rowHeight={returnZero} isRowActive={this.isRowActive} padding={0} - getFinfo={emptyFunction} + getFinfo={this.finfo} setColumnValues={returnFalse} allowCRs oneLine={!this._expanded && !this._props.nodeSelected()} @@ -196,7 +199,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi const container = this._props.tbox.DocumentView?.().containerViewPath?.().lastElement(); if (container) { const embedding = Doc.MakeEmbedding(container.Document); - embedding._type_collection = CollectionViewType.Time; + embedding._type_collection = CollectionViewType.Pivot; const colHdrKey = '_' + container.LayoutFieldKey + '_columnHeaders'; let list = Cast(embedding[colHdrKey], listSpec(SchemaHeaderField)); if (!list) { @@ -264,7 +267,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi className={`dashFieldView${this.isRowActive() ? '-active' : ''}`} ref={this._fieldRef} style={{ - width: this._props.width, + // width: this._props.width, height: this._props.height, pointerEvents: this._props.tbox._props.rootSelected?.() || this._props.tbox.isAnyChildContentActive?.() ? undefined : 'none', }}> diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 2a54cca90..9d3050d90 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1652,7 +1652,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB while (clickTarget instanceof HTMLElement && !clickTarget.dataset?.targethrefs) clickTarget = clickTarget.parentElement; const dataset = clickTarget instanceof HTMLElement ? clickTarget?.dataset : undefined; - if (dataset?.targethrefs) + if (dataset?.targethrefs && !dataset.targethrefs.startsWith('/doc')) window .open( dataset?.targethrefs |