aboutsummaryrefslogtreecommitdiff
path: root/src/client/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views')
-rw-r--r--src/client/views/DocumentButtonBar.tsx2
-rw-r--r--src/client/views/SidebarAnnos.tsx3
-rw-r--r--src/client/views/TemplateMenu.scss4
-rw-r--r--src/client/views/collections/CollectionStackingView.tsx2
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx2
-rw-r--r--src/client/views/nodes/DocumentView.tsx70
-rw-r--r--src/client/views/nodes/formattedText/DashFieldView.scss1
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx61
-rw-r--r--src/client/views/nodes/formattedText/RichTextRules.ts2
9 files changed, 47 insertions, 100 deletions
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 9a57a5e6c..6f2f051cd 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -512,7 +512,7 @@ export class DocumentButtonBar extends ObservableReactComponent<{ views: () => (
<div className="documentButtonBar-button">{this.pinButton}</div>
<div className="documentButtonBar-button">{this.recordButton}</div>
<div className="documentButtonBar-button">{this.calendarButton}</div>
- <div className="documentButtonBar-button">{this.aiEditorButton}</div>
+ {this.view0?.HasAIEditor ? <div className="documentButtonBar-button">{this.aiEditorButton}</div> : null}
<div className="documentButtonBar-button">{this.keywordButton}</div>
{!Doc.UserDoc().documentLinksButton_fullMenu ? null : <div className="documentButtonBar-button">{this.shareButton}</div>}
<div className="documentButtonBar-button">{this.menuButton}</div>
diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index b7e6318b1..573c28ccf 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -1,7 +1,7 @@
import { computed, makeObservable } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
-import { ClientUtils, returnAll, returnFalse, returnOne, returnZero } from '../../ClientUtils';
+import { ClientUtils, returnFalse, returnOne, returnZero } from '../../ClientUtils';
import { emptyFunction } from '../../Utils';
import { Doc, DocListCast, Field, FieldResult, FieldType, StrListCast } from '../../fields/Doc';
import { Id } from '../../fields/FieldSymbols';
@@ -253,7 +253,6 @@ export class SidebarAnnos extends ObservableReactComponent<FieldViewProps & Extr
renderDepth={this._props.renderDepth + 1}
type_collection={CollectionViewType.Stacking}
fieldKey={this.sidebarKey}
- pointerEvents={returnAll}
/>
</div>
</div>
diff --git a/src/client/views/TemplateMenu.scss b/src/client/views/TemplateMenu.scss
index 8879fc20d..049945517 100644
--- a/src/client/views/TemplateMenu.scss
+++ b/src/client/views/TemplateMenu.scss
@@ -40,12 +40,16 @@
height: 100%;
width: 100%;
max-height: 250px;
+ overflow: auto;
.templateToggle,
.chromeToggle {
text-align: left;
color: black;
}
+ .collectionTreeView {
+ height: fit-content !important;
+ }
input {
margin-right: 10px;
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
index 4f60acb18..112510265 100644
--- a/src/client/views/collections/CollectionStackingView.tsx
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -720,7 +720,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection
return this._props.isContentActive() === false ? 'none' : undefined;
}
- onPassiveWheel = (e: WheelEvent) => e.stopPropagation();
+ onPassiveWheel = (e: WheelEvent) => this._props.isContentActive() && e.stopPropagation();
render() {
TraceMobx();
const editableViewProps = {
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 962fbdcd7..3497a62cb 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -467,7 +467,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
const scale = this._props.NativeDimScaling?.() || 1;
return (
- <div style={{ transform: `scale(${scale})`, transformOrigin: 'top left', width: `${100 / scale}%`, height: `${100 / scale}%` }}>
+ <div className="collectionTreeView" style={{ transform: `scale(${scale})`, transformOrigin: 'top left', width: `${100 / scale}%`, height: `${100 / scale}%` }}>
{!(this.Document instanceof Doc) || !this.treeChildren ? null : this.Document.treeView_HasOverlay ? (
<CollectionFreeFormView
{...this._props}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index bec5ea5c1..cbd92c159 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -523,7 +523,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
appearanceItems.splice(0, 0, { description: 'Open in Lightbox', event: () => DocumentView.SetLightboxDoc(this.Document), icon: 'external-link-alt' });
}
appearanceItems.push({ description: 'Pin', event: () => this._props.pinToPres(this.Document, {}), icon: 'map-pin' });
- appearanceItems.push({ description: 'AI view', event: () => this._docView?.toggleAIEditor(), icon: 'map-pin' });
+ this._componentView?.componentAIView?.() && appearanceItems.push({ description: 'AI view', event: () => this._docView?.toggleAIEditor(), icon: 'map-pin' });
!Doc.noviceMode && templateDoc && appearanceItems.push({ description: 'Open Template ', event: () => this._props.addDocTab(templateDoc, OpenWhere.addRight), icon: 'eye' });
!appearance && appearanceItems.length && cm.addItem({ description: 'Appearance...', subitems: appearanceItems, icon: 'compass' });
@@ -660,7 +660,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
this._props
.ScreenToLocalTransform()
.translate(-NumCast(this.Document.borderWidth), -this.headerMargin - NumCast(this.Document.borderWidth))
- .scale(this._props.showAIEditor ? (this._props.PanelHeight() || 1) / this.aiContentsHeight() : 1);
+ .scale(this.viewingAiEditor() ? (this._props.PanelHeight() || 1) / this.aiContentsHeight() : 1);
onClickFunc = () => (this.disableClickScriptFunc ? undefined : this.onClickHdlr);
setHeight = (height: number) => { !this._props.suppressSetHeight && (this.layoutDoc._height = Math.min(NumCast(this.layoutDoc._maxHeight, Number.MAX_SAFE_INTEGER), height + 2 * NumCast(this.Document.borderWidth))); } // prettier-ignore
setContentView = action((view: ViewBoxInterface<FieldViewProps>) => { this._componentView = view; }); // prettier-ignore
@@ -712,32 +712,34 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
aiContentsWidth = () => (this.aiContentsHeight() * (this._props.NativeWidth?.() || 1)) / (this._props.NativeHeight?.() || 1);
aiContentsHeight = () => Math.max(10, this._props.PanelHeight() - this._aiWinHeight * this.uiBtnScaling);
- aiEditor = () => (
- <>
- <div
- className="documentView-editorView-history"
- ref={r => this.historyRef(this._oldAiWheel, (this._oldAiWheel = r))}
- style={{
- transform: `scale(${this.uiBtnScaling})`,
- height: this.aiContentsHeight() / this.uiBtnScaling,
- width: ((this._props.PanelWidth() - this.aiContentsWidth()) * 0.95) / this.uiBtnScaling,
- }}>
- {this._componentView?.componentAIViewHistory?.() ?? null}
- </div>
- <div
- className="documentView-editorView"
- style={{
- background: SnappingManager.userVariantColor,
- width: `${100 / this.uiBtnScaling}%`, //
- transform: `scale(${this.uiBtnScaling})`,
- }}
- ref={r => this.historyRef(this._oldHistoryWheel, (this._oldHistoryWheel = r))}>
- <div className="documentView-editorView-resizer" />
- {this._componentView?.componentAIView?.() ?? null}
- {this._props.DocumentView?.() ? <TagsView background={this.backgroundBoxColor} Views={[this._props.DocumentView?.()]} /> : null}
- </div>
- </>
- );
+ @computed get aiEditor() {
+ return (
+ <>
+ <div
+ className="documentView-editorView-history"
+ ref={r => this.historyRef(this._oldAiWheel, (this._oldAiWheel = r))}
+ style={{
+ transform: `scale(${this.uiBtnScaling})`,
+ height: this.aiContentsHeight() / this.uiBtnScaling,
+ width: ((this._props.PanelWidth() - this.aiContentsWidth()) * 0.95) / this.uiBtnScaling,
+ }}>
+ {this._componentView?.componentAIViewHistory?.() ?? null}
+ </div>
+ <div
+ className="documentView-editorView"
+ style={{
+ background: SnappingManager.userVariantColor,
+ width: `${100 / this.uiBtnScaling}%`, //
+ transform: `scale(${this.uiBtnScaling})`,
+ }}
+ ref={r => this.historyRef(this._oldHistoryWheel, (this._oldHistoryWheel = r))}>
+ <div className="documentView-editorView-resizer" />
+ {this._componentView?.componentAIView?.() ?? null}
+ {this._props.DocumentView?.() ? <TagsView background={this.backgroundBoxColor} Views={[this._props.DocumentView?.()]} /> : null}
+ </div>
+ </>
+ );
+ }
@computed get tagsOverlay() {
return (
<div
@@ -760,6 +762,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
);
}
widgetOverlayFunc = () => (this.widgetDecorations ? this.widgetOverlay : null);
+ viewingAiEditor = () => (this._props.showAIEditor && this._componentView?.componentAIView?.() !== undefined ? this.aiEditor : null);
@computed get viewBoxContents() {
TraceMobx();
const isInk = this.layoutDoc._layout_isSvg && !this._props.LayoutTemplateString;
@@ -770,8 +773,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
className="documentView-contentsView"
style={{
pointerEvents: (isInk || noBackground ? 'none' : this.contentPointerEvents()) ?? (this._mounted ? 'all' : 'none'),
- width: this._props.showAIEditor ? this.aiContentsWidth() : undefined,
- height: this._props.showAIEditor ? this.aiContentsHeight() : this.headerMargin ? `calc(100% - ${this.headerMargin}px)` : undefined,
+ width: this.viewingAiEditor() ? this.aiContentsWidth() : undefined,
+ height: this.viewingAiEditor() ? this.aiContentsHeight() : this.headerMargin ? `calc(100% - ${this.headerMargin}px)` : undefined,
}}>
<DocumentContentsView
{...this._props}
@@ -779,8 +782,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
pointerEvents={this.contentPointerEvents}
setContentViewBox={this.setContentView}
childFilters={this.childFilters}
- PanelWidth={this._props.showAIEditor ? this.aiContentsWidth : this._props.PanelWidth}
- PanelHeight={this._props.showAIEditor ? this.aiContentsHeight : this.panelHeight}
+ PanelWidth={this.viewingAiEditor() ? this.aiContentsWidth : this._props.PanelWidth}
+ PanelHeight={this.viewingAiEditor() ? this.aiContentsHeight : this.panelHeight}
setHeight={this.setHeight}
isContentActive={this.isContentActive}
ScreenToLocalTransform={this.screenToLocalContent}
@@ -790,7 +793,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
hideClickBehaviors={BoolCast(this.Document.hideClickBehaviors)}
/>
</div>
- {this._props.showAIEditor ? this.aiEditor() : this.tagsOverlayFunc()}
+ {this.viewingAiEditor() ?? this.tagsOverlayFunc()}
{this.widgetOverlayFunc()}
</>
);
@@ -1256,6 +1259,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
public get allLinks() { return this._docViewInternal?._allLinks ?? []; } // prettier-ignore
public get TagBtnHeight() { return this._docViewInternal?.TagsBtnHeight; } // prettier-ignore
public get UIBtnScaling() { return this._docViewInternal?.uiBtnScaling; } // prettier-ignore
+ public get HasAIEditor() { return !!this._docViewInternal?._componentView?.componentAIView?.(); } // prettier-ignore
get LayoutFieldKey() {
return Doc.LayoutFieldKey(this.Document, this._props.LayoutTemplateString);
diff --git a/src/client/views/nodes/formattedText/DashFieldView.scss b/src/client/views/nodes/formattedText/DashFieldView.scss
index 6db8abc7f..3734ad9cc 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.scss
+++ b/src/client/views/nodes/formattedText/DashFieldView.scss
@@ -26,6 +26,7 @@
display: inline-block;
font-weight: normal;
background: rgba(0, 0, 0, 0.1);
+ align-content: center;
cursor: default;
}
.dashFieldView-fieldSpan {
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index bef999e6d..fbe4fd294 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1,5 +1,4 @@
/* eslint-disable no-use-before-define */
-import { IconProp } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Tooltip } from '@mui/material';
import { Property } from 'csstype';
@@ -21,7 +20,6 @@ import { AclAdmin, AclAugment, AclEdit, AclSelfEdit, DocCss, ForceServerWrite, U
import { Id, ToString } from '../../../../fields/FieldSymbols';
import { InkTool } from '../../../../fields/InkField';
import { List } from '../../../../fields/List';
-import { PrefetchProxy } from '../../../../fields/Proxy';
import { RichTextField } from '../../../../fields/RichTextField';
import { ComputedField } from '../../../../fields/ScriptField';
import { BoolCast, Cast, DateCast, DocCast, FieldValue, NumCast, RTFCast, ScriptCast, StrCast } from '../../../../fields/Types';
@@ -35,7 +33,6 @@ import { DocUtils } from '../../../documents/DocUtils';
import { DictationManager } from '../../../util/DictationManager';
import { DragManager } from '../../../util/DragManager';
import { dropActionType } from '../../../util/DropActionTypes';
-import { MakeTemplate } from '../../../util/DropConverter';
import { LinkManager } from '../../../util/LinkManager';
import { RTFMarkup } from '../../../util/RTFMarkup';
import { SnappingManager } from '../../../util/SnappingManager';
@@ -855,42 +852,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
return;
}
- const changeItems: ContextMenuProps[] = [];
- changeItems.push({
- description: 'plain',
- event: undoable(() => {
- Doc.setNativeView(this.Document);
- this.layoutDoc.layout_autoHeightMargins = undefined;
- }, 'set plain view'),
- icon: 'eye',
- });
- changeItems.push({
- description: 'metadata',
- event: undoable(() => {
- this.dataDoc.layout_meta = Cast(Doc.UserDoc().emptyHeader, Doc, null)?.layout;
- this.Document.layout_fieldKey = 'layout_meta';
- setTimeout(() => {
- this.layoutDoc._header_height = this.layoutDoc._layout_autoHeightMargins = 50;
- }, 50);
- }, 'set metadata view'),
- icon: 'eye',
- });
- const noteTypesDoc = Cast(Doc.UserDoc().template_notes, Doc, null);
- DocListCast(noteTypesDoc?.data).forEach(note => {
- const icon: IconProp = StrCast(note.icon) as IconProp;
- changeItems.push({
- description: StrCast(note.title),
- event: undoable(
- () => {
- this.layoutDoc.layout_autoHeightMargins = undefined;
- Doc.setNativeView(this.Document);
- DocUtils.makeCustomViewClicked(this.Document, Docs.Create.TreeDocument, StrCast(note.title), note);
- },
- `set ${StrCast(note.title)} view}`
- ),
- icon: icon,
- });
- });
const highlighting: ContextMenuProps[] = [];
const noviceHighlighting = ['Audio Tags', 'My Text', 'Text from Others', 'Bold Text'];
const expertHighlighting = [...noviceHighlighting, 'Important Items', 'Ignore Items', 'Disagree Items', 'By Recent Minute', 'By Recent Hour'];
@@ -952,20 +913,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
icon: 'expand-arrows-alt',
});
- appearanceItems.push({ description: 'Change Style...', noexpand: true, subitems: changeItems, icon: 'external-link-alt' });
-
- !Doc.noviceMode &&
- appearanceItems.push({
- description: 'Make Default Layout',
- event: () => {
- if (!this.layoutDoc.isTemplateDoc) {
- MakeTemplate(this.Document);
- }
- Doc.UserDoc().defaultTextLayout = new PrefetchProxy(this.Document);
- Doc.AddDocToList(Cast(Doc.UserDoc().template_notes, Doc, null), 'data', this.Document);
- },
- icon: 'eye',
- });
!appearance && appearanceItems.length && cm.addItem({ description: 'Appearance...', subitems: appearanceItems, icon: 'eye' });
const options = cm.findByDescription('Options...');
@@ -988,14 +935,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
},
icon: !this.Document._createDocOnCR ? 'grip-lines' : 'bars',
});
- !Doc.noviceMode &&
- optionItems.push({
- description: `${this.Document._layout_autoHeight ? 'Lock' : 'Auto'} Height`,
- event: () => {
- this.layoutDoc._layout_autoHeight = !this.layoutDoc._layout_autoHeight;
- },
- icon: this.Document._layout_autoHeight ? 'lock' : 'unlock',
- });
optionItems.push({
description: this.Document.savedAsSticker ? 'Sticker Saved!' : 'Save to Stickers',
event: action(undoable(async () => await StickerPalette.addToPalette(this.Document), 'save to palette')),
diff --git a/src/client/views/nodes/formattedText/RichTextRules.ts b/src/client/views/nodes/formattedText/RichTextRules.ts
index 77c00537b..04315e886 100644
--- a/src/client/views/nodes/formattedText/RichTextRules.ts
+++ b/src/client/views/nodes/formattedText/RichTextRules.ts
@@ -113,7 +113,7 @@ export class RichTextRules {
const inlineFieldKey = '$inline' + numInlines; // which field on the text document this annotation will write to
const inlineLayoutKey = '$layout_' + inlineFieldKey; // the field holding the layout string that will render the inline annotation
const textDocInline = Docs.Create.TextDocument('', {
- _layout_fieldKey: inlineLayoutKey,
+ layout_fieldKey: inlineLayoutKey,
_width: 75,
_height: 35,
annotationOn: this.Document[DocData],