aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/MainView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/MainView.tsx')
-rw-r--r--src/client/views/MainView.tsx236
1 files changed, 106 insertions, 130 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index da5e4f966..eca0aca4c 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -3,76 +3,81 @@ import { faBuffer, faHireAHelper } from '@fortawesome/free-brands-svg-icons';
import * as far from '@fortawesome/free-regular-svg-icons';
import * as fa from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import 'browndash-components/dist/styles/global.min.css';
-import { action, computed, configure, observable, runInAction } from 'mobx';
+import { action, computed, configure, makeObservable, observable, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import 'normalize.css';
import * as React from 'react';
+import '../../../node_modules/browndash-components/dist/styles/global.min.css';
+import { Utils, emptyFunction, lightOrDark, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue, returnZero, setupMoveUpEvents } from '../../Utils';
import { Doc, DocListCast, Opt } from '../../fields/Doc';
import { DocCast, StrCast } from '../../fields/Types';
-import { emptyFunction, lightOrDark, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue, returnZero, setupMoveUpEvents, Utils } from '../../Utils';
-import { GoogleAuthenticationManager } from '../apis/GoogleAuthenticationManager';
import { DocServer } from '../DocServer';
-import { Docs } from '../documents/Documents';
+import { GoogleAuthenticationManager } from '../apis/GoogleAuthenticationManager';
import { CollectionViewType, DocumentType } from '../documents/DocumentTypes';
+import { Docs } from '../documents/Documents';
+import { CalendarManager } from '../util/CalendarManager';
import { CaptureManager } from '../util/CaptureManager';
import { DocumentManager } from '../util/DocumentManager';
import { DragManager } from '../util/DragManager';
import { GroupManager } from '../util/GroupManager';
import { HistoryUtil } from '../util/History';
import { Hypothesis } from '../util/HypothesisUtils';
-import { ReportManager } from '../util/reportManager/ReportManager';
import { RTFMarkup } from '../util/RTFMarkup';
import { ScriptingGlobals } from '../util/ScriptingGlobals';
import { SelectionManager } from '../util/SelectionManager';
import { ServerStats } from '../util/ServerStats';
-import { ColorScheme, SettingsManager } from '../util/SettingsManager';
+import { SettingsManager } from '../util/SettingsManager';
import { SharingManager } from '../util/SharingManager';
import { SnappingManager } from '../util/SnappingManager';
import { Transform } from '../util/Transform';
-import { TimelineMenu } from './animationtimeline/TimelineMenu';
-import { CollectionDockingView } from './collections/CollectionDockingView';
-import { MarqueeOptionsMenu } from './collections/collectionFreeForm/MarqueeOptionsMenu';
-import { CollectionLinearView } from './collections/collectionLinear';
-import { CollectionMenu } from './collections/CollectionMenu';
-import './collections/TreeView.scss';
+import { ReportManager } from '../util/reportManager/ReportManager';
import { ComponentDecorations } from './ComponentDecorations';
import { ContextMenu } from './ContextMenu';
import { DashboardView } from './DashboardView';
import { DictationOverlay } from './DictationOverlay';
import { DocumentDecorations } from './DocumentDecorations';
import { GestureOverlay } from './GestureOverlay';
-import { LEFT_MENU_WIDTH, TOPBAR_HEIGHT } from './global/globalCssVariables.scss';
import { KeyManager } from './GlobalKeyHandler';
-import { InkTranscription } from './InkTranscription';
import { LightboxView } from './LightboxView';
-import { LinkMenu } from './linking/LinkMenu';
import './MainView.scss';
+import { ObservableReactComponent } from './ObservableReactComponent';
+import { OverlayView } from './OverlayView';
+import { PreviewCursor } from './PreviewCursor';
+import { PropertiesView } from './PropertiesView';
+import { DashboardStyleProvider, DefaultStyleProvider } from './StyleProvider';
+import { TimelineMenu } from './animationtimeline/TimelineMenu';
+import { CollectionDockingView } from './collections/CollectionDockingView';
+import { CollectionMenu } from './collections/CollectionMenu';
+import { TabDocView } from './collections/TabDocView';
+import './collections/TreeView.scss';
+import { CollectionFreeFormLinksView } from './collections/collectionFreeForm';
+import { MarqueeOptionsMenu } from './collections/collectionFreeForm/MarqueeOptionsMenu';
+import { CollectionLinearView } from './collections/collectionLinear';
+import { LinkMenu } from './linking/LinkMenu';
import { AudioBox } from './nodes/AudioBox';
-import { DocumentLinksButton } from './nodes/DocumentLinksButton';
-import { DocumentView, DocumentViewInternal, OpenWhere, OpenWhereMod } from './nodes/DocumentView';
-import { DashFieldViewMenu } from './nodes/formattedText/DashFieldView';
-import { FormattedTextBox } from './nodes/formattedText/FormattedTextBox';
-import { RichTextMenu } from './nodes/formattedText/RichTextMenu';
-import GenerativeFill from './nodes/generativeFill/GenerativeFill';
+import { SchemaCSVPopUp } from './nodes/DataVizBox/SchemaCSVPopUp';
+import { DocButtonState } from './nodes/DocumentLinksButton';
+import { DocumentView, DocumentViewInternal, OpenWhere, OpenWhereMod, returnEmptyDocViewList } from './nodes/DocumentView';
import { ImageBox } from './nodes/ImageBox';
import { LinkDescriptionPopup } from './nodes/LinkDescriptionPopup';
-import { LinkDocPreview } from './nodes/LinkDocPreview';
+import { LinkDocPreview, LinkInfo } from './nodes/LinkDocPreview';
+import { DirectionsAnchorMenu } from './nodes/MapBox/DirectionsAnchorMenu';
import { MapAnchorMenu } from './nodes/MapBox/MapAnchorMenu';
-import { MapBox } from './nodes/MapBox/MapBox';
-import { RadialMenu } from './nodes/RadialMenu';
import { TaskCompletionBox } from './nodes/TaskCompletedBox';
-import { OverlayView } from './OverlayView';
+import { DashFieldViewMenu } from './nodes/formattedText/DashFieldView';
+import { FormattedTextBox } from './nodes/formattedText/FormattedTextBox';
+import { RichTextMenu } from './nodes/formattedText/RichTextMenu';
+import GenerativeFill from './nodes/generativeFill/GenerativeFill';
+import { PresBox } from './nodes/trails';
import { AnchorMenu } from './pdf/AnchorMenu';
import { GPTPopup } from './pdf/GPTPopup/GPTPopup';
-import { PreviewCursor } from './PreviewCursor';
-import { PropertiesView } from './PropertiesView';
-import { DashboardStyleProvider, DefaultStyleProvider } from './StyleProvider';
import { TopBar } from './topbar/TopBar';
+import { DocData } from '../../fields/DocSymbols';
+const { default: { LEFT_MENU_WIDTH, TOPBAR_HEIGHT } } = require('./global/globalCssVariables.module.scss'); // prettier-ignore
const _global = (window /* browser */ || global) /* node */ as any;
@observer
-export class MainView extends React.Component {
+export class MainView extends ObservableReactComponent<{}> {
public static Instance: MainView;
public static Live: boolean = false;
private _docBtnRef = React.createRef<HTMLDivElement>();
@@ -112,7 +117,7 @@ export class MainView extends React.Component {
@computed private get userDoc() {
return Doc.UserDoc();
}
- @observable mainDoc: Opt<Doc>;
+ @observable mainDoc: Opt<Doc> = undefined;
@computed private get mainContainer() {
if (window.location.pathname.startsWith('/doc/') && Doc.CurrentUserEmail === 'guest') {
DocServer.GetRefField(window.location.pathname.substring('/doc/'.length)).then(main => runInAction(() => (this.mainDoc = main as Doc)));
@@ -126,21 +131,36 @@ export class MainView extends React.Component {
@computed public get mainFreeform(): Opt<Doc> {
return (docs => (docs?.length > 1 ? docs[1] : undefined))(DocListCast(this.mainContainer!.data));
}
+ @observable public headerBarHeight: number = 0;
+ headerBarHeightFunc = () => this.headerBarHeight;
+ @action
+ toggleTopBar = () => {
+ if (this.headerBarHeight > 0) {
+ this.headerBarHeight = 0;
+ } else {
+ this.headerBarHeight = 60;
+ }
+ };
headerBarDocWidth = () => this.mainDocViewWidth();
- headerBarDocHeight = () => (this._hideUI ? 0 : SettingsManager.headerBarHeight ?? 0);
+ headerBarDocHeight = () => (this._hideUI ? 0 : this.headerBarHeight ?? 0);
topMenuHeight = () => (this._hideUI ? 0 : 35);
topMenuWidth = returnZero; // value is ignored ...
leftMenuWidth = () => (this._hideUI ? 0 : Number(LEFT_MENU_WIDTH.replace('px', '')));
leftMenuHeight = () => this._dashUIHeight;
leftMenuFlyoutWidth = () => this._leftMenuFlyoutWidth;
leftMenuFlyoutHeight = () => this._dashUIHeight;
- propertiesWidth = () => Math.max(0, Math.min(this._dashUIWidth - 50, SettingsManager.propertiesWidth || 0));
+ propertiesWidth = () => Math.max(0, Math.min(this._dashUIWidth - 50, SettingsManager.Instance?.propertiesWidth || 0));
propertiesHeight = () => this._dashUIHeight;
mainDocViewWidth = () => this._dashUIWidth - this.propertiesWidth() - this.leftMenuWidth() - this.leftMenuFlyoutWidth();
mainDocViewHeight = () => this._dashUIHeight - this.headerBarDocHeight();
componentDidMount() {
+ reaction(
+ // when a multi-selection occurs, remove focus from all active elements to allow keyboad input to go only to global key manager to act upon selection
+ () => SelectionManager.Views.slice(),
+ views => views.length > 1 && (document.activeElement as any)?.blur !== undefined && (document.activeElement as any)!.blur()
+ );
const scriptTag = document.createElement('script');
scriptTag.setAttribute('type', 'text/javascript');
scriptTag.setAttribute('src', 'https://www.bing.com/api/maps/mapcontrol?callback=makeMap');
@@ -194,6 +214,10 @@ export class MainView extends React.Component {
tag.src = 'https://www.youtube.com/iframe_api';
const firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode!.insertBefore(tag, firstScriptTag);
+ window.removeEventListener('keydown', KeyManager.Instance.handleModifiers, true);
+ window.addEventListener('keydown', KeyManager.Instance.handleModifiers, true);
+ window.removeEventListener('keyup', KeyManager.Instance.unhandleModifiers);
+ window.addEventListener('keyup', KeyManager.Instance.unhandleModifiers);
window.removeEventListener('keydown', KeyManager.Instance.handle);
window.addEventListener('keydown', KeyManager.Instance.handle);
window.removeEventListener('keyup', KeyManager.Instance.unhandle);
@@ -218,8 +242,9 @@ export class MainView extends React.Component {
document.removeEventListener('linkAnnotationToDash', Hypothesis.linkListener);
}
- constructor(props: Readonly<{}>) {
+ constructor(props: any) {
super(props);
+ makeObservable(this);
DocumentViewInternal.addDocTabFunc = MainView.addDocTabFunc_impl;
MainView.Instance = this;
DashboardView._urlState = HistoryUtil.parseUrl(window.location) || ({} as any);
@@ -250,6 +275,7 @@ export class MainView extends React.Component {
fa.faShare,
fa.faTaxi,
fa.faDownload,
+ fa.faPallet,
fa.faExpandArrowsAlt,
fa.faAmbulance,
fa.faLayerGroup,
@@ -261,6 +287,8 @@ export class MainView extends React.Component {
fa.faWindowRestore,
fa.faFolder,
fa.faFolderOpen,
+ fa.faFolderPlus,
+ fa.faFolderClosed,
fa.faMapPin,
fa.faMapMarker,
fa.faFingerprint,
@@ -450,6 +478,7 @@ export class MainView extends React.Component {
fa.faSortUp,
fa.faSortDown,
fa.faTable,
+ fa.faTableCells,
fa.faTableColumns,
fa.faTh,
fa.faThList,
@@ -475,11 +504,11 @@ export class MainView extends React.Component {
fa.faBookmark,
fa.faList,
fa.faListOl,
- fa.faFolderPlus,
fa.faLightbulb,
fa.faBookOpen,
fa.faMapMarkerAlt,
fa.faSearchPlus,
+ fa.faSolarPanel,
fa.faVolumeUp,
fa.faVolumeDown,
fa.faSquareRootAlt,
@@ -560,7 +589,7 @@ export class MainView extends React.Component {
@action
openPresentation = (pres: Doc) => {
if (pres.type === DocumentType.PRES) {
- CollectionDockingView.AddSplit(pres, OpenWhereMod.right);
+ CollectionDockingView.AddSplit(pres, OpenWhereMod.right, undefined, PresBox.PanelName);
Doc.MyTrails && (Doc.ActivePresentation = pres);
Doc.AddDocToList(Doc.MyTrails, 'data', pres);
this.closeFlyout();
@@ -573,7 +602,7 @@ export class MainView extends React.Component {
Doc.AddDocToList(Doc.MyFilesystem, 'data', folder);
};
- waitForDoubleClick = () => (DocumentView.ExploreMode ? 'never' : undefined);
+ waitForDoubleClick = () => (SnappingManager.ExploreMode ? 'never' : undefined);
headerBarScreenXf = () => new Transform(-this.leftScreenOffsetOfMainDocView - this.leftMenuFlyoutWidth(), -this.headerBarDocHeight(), 1);
mainScreenToLocalXf = () => new Transform(-this.leftScreenOffsetOfMainDocView - this.leftMenuFlyoutWidth(), -this.topOfMainDocContent, 1);
addHeaderDoc = (doc: Doc | Doc[], annotationKey?: string) => (doc instanceof Doc ? [doc] : doc).reduce((done, doc) => Doc.AddDocToList(this.headerBarDoc, 'data', doc), true);
@@ -584,19 +613,17 @@ export class MainView extends React.Component {
<DocumentView
key="headerBarDoc"
Document={this.headerBarDoc}
- DataDoc={undefined}
addDocTab={DocumentViewInternal.addDocTabFunc}
pinToPres={emptyFunction}
- docViewPath={returnEmptyDoclist}
+ containerViewPath={returnEmptyDoclist}
styleProvider={DefaultStyleProvider}
- rootSelected={returnTrue}
addDocument={this.addHeaderDoc}
removeDocument={this.removeHeaderDoc}
fitContentsToBox={returnTrue}
isDocumentActive={returnTrue} // headerBar is always documentActive (ie, the docView gets pointer events)
isContentActive={returnTrue} // headerBar is awlays contentActive which means its items are always documentActive
ScreenToLocalTransform={this.headerBarScreenXf}
- childHideResizeHandles={returnTrue}
+ childHideResizeHandles={true}
childDragAction="move"
dontRegisterView={true}
hideResizeHandles={true}
@@ -605,7 +632,6 @@ export class MainView extends React.Component {
renderDepth={0}
focus={emptyFunction}
whenChildContentsActiveChanged={emptyFunction}
- bringToFront={emptyFunction}
childFilters={returnEmptyFilter}
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
@@ -614,19 +640,19 @@ export class MainView extends React.Component {
);
}
@computed get mainDocView() {
+ const headerBar = this._hideUI || !this.headerBarDocHeight?.() ? null : this.headerBarDocView;
+ console.log('Header = ' + this._hideUI + ' ' + this.headerBarDocHeight?.() + ' ' + headerBar);
return (
<>
- {this._hideUI || !this.headerBarDocHeight?.() ? null : this.headerBarDocView}
+ {headerBar}
<DocumentView
key="main"
Document={this.mainContainer!}
- DataDoc={undefined}
addDocument={undefined}
addDocTab={DocumentViewInternal.addDocTabFunc}
pinToPres={emptyFunction}
- docViewPath={returnEmptyDoclist}
+ containerViewPath={returnEmptyDoclist}
styleProvider={this._hideUI ? DefaultStyleProvider : undefined}
- rootSelected={returnTrue}
isContentActive={returnTrue}
removeDocument={undefined}
ScreenToLocalTransform={this._hideUI ? this.mainScreenToLocalXf : Transform.Identity}
@@ -634,7 +660,6 @@ export class MainView extends React.Component {
PanelHeight={this.mainDocViewHeight}
focus={emptyFunction}
whenChildContentsActiveChanged={emptyFunction}
- bringToFront={emptyFunction}
childFilters={returnEmptyFilter}
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
@@ -671,9 +696,9 @@ export class MainView extends React.Component {
setupMoveUpEvents(
this,
e,
- action(e => ((SettingsManager.propertiesWidth = Math.max(0, this._dashUIWidth - e.clientX)) ? false : false)),
- action(() => SettingsManager.propertiesWidth < 5 && (SettingsManager.propertiesWidth = 0)),
- action(() => (SettingsManager.propertiesWidth = this.propertiesWidth() < 15 ? Math.min(this._dashUIWidth - 50, 250) : 0)),
+ action(e => ((SettingsManager.Instance.propertiesWidth = Math.max(0, this._dashUIWidth - e.clientX)) ? false : false)),
+ action(() => SettingsManager.Instance.propertiesWidth < 5 && (SettingsManager.Instance.propertiesWidth = 0)),
+ action(() => (SettingsManager.Instance.propertiesWidth = this.propertiesWidth() < 15 ? Math.min(this._dashUIWidth - 50, 250) : 0)),
false
);
};
@@ -693,16 +718,17 @@ export class MainView extends React.Component {
mainContainerXf = () => this.sidebarScreenToLocal().translate(-this.leftScreenOffsetOfMainDocView, 0);
static addDocTabFunc_impl = (doc: Doc, location: OpenWhere): boolean => {
const whereFields = location.split(':');
- const keyValue = whereFields[1]?.includes('KeyValue');
- const whereMods: OpenWhereMod = whereFields.length > 1 ? (whereFields[1].replace('KeyValue', '') as OpenWhereMod) : OpenWhereMod.none;
+ const keyValue = whereFields.includes(OpenWhereMod.keyvalue);
+ const whereMods = whereFields.length > 1 ? (whereFields[1] as OpenWhereMod) : OpenWhereMod.none;
+ const panelName = whereFields.length > 1 ? whereFields.lastElement() : '';
if (doc.dockingConfig && !keyValue) return DashboardView.openDashboard(doc);
- // prettier-ignore
switch (whereFields[0]) {
- case OpenWhere.lightbox: return LightboxView.AddDocTab(doc, location);
+ case OpenWhere.lightbox: return LightboxView.Instance.AddDocTab(doc, location);
case OpenWhere.close: return CollectionDockingView.CloseSplit(doc, whereMods);
- case OpenWhere.toggle: return CollectionDockingView.ToggleSplit(doc, whereMods, undefined, "dontSelectOnActivate"); // bcz: hack! mark the toggle so that it won't be selected on activation- this is needed so that the backlinks menu can toggle views of targets on and off without selecting them
+ case OpenWhere.toggle: return CollectionDockingView.ToggleSplit(doc, whereMods, undefined, TabDocView.DontSelectOnActivate); // bcz: hack! mark the toggle so that it won't be selected on activation- this is needed so that the backlinks menu can toggle views of targets on and off without selecting them
+ case OpenWhere.replace: return CollectionDockingView.ReplaceTab(doc, whereMods, undefined, panelName);
case OpenWhere.add:default:return CollectionDockingView.AddSplit(doc, whereMods, undefined, undefined, keyValue);
- }
+ } // prettier-ignore
};
@computed get flyout() {
@@ -715,13 +741,11 @@ export class MainView extends React.Component {
<div className="mainView-contentArea">
<DocumentView
Document={this._sidebarContent.proto || this._sidebarContent}
- DataDoc={undefined}
addDocument={undefined}
addDocTab={DocumentViewInternal.addDocTabFunc}
- pinToPres={emptyFunction}
- docViewPath={returnEmptyDoclist}
- styleProvider={this._sidebarContent.proto === Doc.MyDashboards || this._sidebarContent.proto === Doc.MyFilesystem ? DashboardStyleProvider : DefaultStyleProvider}
- rootSelected={returnTrue}
+ pinToPres={TabDocView.PinDoc}
+ containerViewPath={returnEmptyDoclist}
+ styleProvider={this._sidebarContent.proto === Doc.MyDashboards || this._sidebarContent.proto === Doc.MyFilesystem || this._sidebarContent.proto === Doc.MyTrails ? DashboardStyleProvider : DefaultStyleProvider}
removeDocument={returnFalse}
ScreenToLocalTransform={this.mainContainerXf}
PanelWidth={this.leftMenuFlyoutWidth}
@@ -730,7 +754,6 @@ export class MainView extends React.Component {
isContentActive={returnTrue}
focus={emptyFunction}
whenChildContentsActiveChanged={emptyFunction}
- bringToFront={emptyFunction}
childFilters={returnEmptyFilter}
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
@@ -746,22 +769,19 @@ export class MainView extends React.Component {
<div key="menu" className="mainView-leftMenuPanel" style={{ background: SettingsManager.userBackgroundColor, display: LightboxView.LightboxDoc ? 'none' : undefined }}>
<DocumentView
Document={Doc.MyLeftSidebarMenu}
- DataDoc={undefined}
addDocument={undefined}
addDocTab={DocumentViewInternal.addDocTabFunc}
pinToPres={emptyFunction}
- rootSelected={returnTrue}
removeDocument={returnFalse}
ScreenToLocalTransform={this.sidebarScreenToLocal}
PanelWidth={this.leftMenuWidth}
PanelHeight={this.leftMenuHeight}
renderDepth={0}
- docViewPath={returnEmptyDoclist}
+ containerViewPath={returnEmptyDoclist}
focus={emptyFunction}
styleProvider={DefaultStyleProvider}
isContentActive={returnTrue}
whenChildContentsActiveChanged={emptyFunction}
- bringToFront={emptyFunction}
childFilters={returnEmptyFilter}
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
@@ -772,7 +792,7 @@ export class MainView extends React.Component {
@action
selectMenu = (button: Doc) => {
- const title = StrCast(Doc.GetProto(button).title);
+ const title = StrCast(button[DocData].title);
const willOpen = !this._leftMenuFlyoutWidth || this._panelContent !== title;
this.closeFlyout();
if (willOpen) {
@@ -860,11 +880,11 @@ export class MainView extends React.Component {
//setTimeout(action(() => (this._leftMenuFlyoutWidth += 0.5)));
this._sidebarContent.proto = DocCast(button.target);
- DocumentView.LastPressedSidebarBtn = button;
+ SettingsManager.Instance.SetLastPressedBtn(button);
});
closeFlyout = action(() => {
- DocumentView.LastPressedSidebarBtn = undefined;
+ SettingsManager.Instance.SetLastPressedBtn(undefined);
this._panelContent = 'none';
this._sidebarContent.proto = undefined;
this._leftMenuFlyoutWidth = 0;
@@ -885,18 +905,14 @@ export class MainView extends React.Component {
<div className="mainView-docButtons" style={{ background: SettingsManager.userBackgroundColor, color: SettingsManager.userColor }} ref={this._docBtnRef}>
<CollectionLinearView
Document={Doc.MyDockedBtns}
- DataDoc={undefined}
+ docViewPath={returnEmptyDocViewList}
fieldKey="data"
dropAction="embed"
- setHeight={returnFalse}
styleProvider={DefaultStyleProvider}
- rootSelected={returnTrue}
- bringToFront={emptyFunction}
select={emptyFunction}
isAnyChildContentActive={returnFalse}
isContentActive={emptyFunction}
isSelected={returnFalse}
- docViewPath={returnEmptyDoclist}
moveDocument={this.moveButtonDoc}
addDocument={this.addButtonDoc}
addDocTab={DocumentViewInternal.addDocTabFunc}
@@ -917,18 +933,16 @@ export class MainView extends React.Component {
);
}
@computed get snapLines() {
- SnappingManager.GetIsDragging();
- SnappingManager.GetIsResizing();
- const dragged = DragManager.docsBeingDragged.lastElement() ?? SelectionManager.Docs().lastElement();
- const dragPar = dragged ? DocumentManager.Instance.getDocumentView(dragged)?.props.CollectionFreeFormDocumentView?.().props.CollectionFreeFormView : undefined;
- return !dragPar?.rootDoc.freeform_snapLines ? null : (
+ const dragged = DragManager.docsBeingDragged.lastElement() ?? SelectionManager.Docs.lastElement();
+ const dragPar = dragged ? DocumentManager.Instance.getDocumentView(dragged)?.CollectionFreeFormView : undefined;
+ return !dragPar?.layoutDoc.freeform_snapLines ? null : (
<div className="mainView-snapLines">
<svg style={{ width: '100%', height: '100%' }}>
- {SnappingManager.horizSnapLines().map((l, i) => (
- <line key={i} x1="0" y1={l} x2="2000" y2={l} stroke={lightOrDark(dragPar.rootDoc.backgroundColor ?? 'gray')} opacity={0.3} strokeWidth={1} strokeDasharray={'2 2'} />
+ {SnappingManager.HorizSnapLines.map((l, i) => (
+ <line key={i} x1="0" y1={l} x2="2000" y2={l} stroke={lightOrDark(dragPar.layoutDoc.backgroundColor ?? 'gray')} opacity={0.3} strokeWidth={1} strokeDasharray={'2 2'} />
))}
- {SnappingManager.vertSnapLines().map((l, i) => (
- <line key={i} y1={this.topOfMainDocContent.toString()} x1={l} y2="2000" x2={l} stroke={lightOrDark(dragPar.rootDoc.backgroundColor ?? 'gray')} opacity={0.3} strokeWidth={1} strokeDasharray={'2 2'} />
+ {SnappingManager.VertSnapLines.map((l, i) => (
+ <line key={i} y1={this.topOfMainDocContent.toString()} x1={l} y2="2000" x2={l} stroke={lightOrDark(dragPar.layoutDoc.backgroundColor ?? 'gray')} opacity={0.3} strokeWidth={1} strokeDasharray={'2 2'} />
))}
</svg>
</div>
@@ -960,46 +974,6 @@ export class MainView extends React.Component {
);
}
- @computed get linkDocPreview() {
- return LinkDocPreview.LinkInfo ? <LinkDocPreview {...LinkDocPreview.LinkInfo} /> : null;
- }
- @observable mapBoxHackBool = false;
- @computed get mapBoxHack() {
- return this.mapBoxHackBool ? null : (
- <MapBox
- ref={action((r: any) => r && (this.mapBoxHackBool = true))}
- fieldKey="data"
- select={returnFalse}
- isSelected={returnFalse}
- Document={this.headerBarDoc}
- DataDoc={undefined}
- addDocTab={returnFalse}
- pinToPres={emptyFunction}
- docViewPath={returnEmptyDoclist}
- styleProvider={DefaultStyleProvider}
- rootSelected={returnTrue}
- addDocument={returnFalse}
- removeDocument={returnFalse}
- fitContentsToBox={returnTrue}
- isDocumentActive={returnTrue} // headerBar is always documentActive (ie, the docView gets pointer events)
- isContentActive={returnTrue} // headerBar is awlays contentActive which means its items are always documentActive
- ScreenToLocalTransform={Transform.Identity}
- childHideResizeHandles={returnTrue}
- childDragAction="move"
- dontRegisterView={true}
- PanelWidth={this.headerBarDocWidth}
- PanelHeight={this.headerBarDocHeight}
- renderDepth={0}
- focus={emptyFunction}
- whenChildContentsActiveChanged={emptyFunction}
- bringToFront={emptyFunction}
- childFilters={returnEmptyFilter}
- childFiltersByRanges={returnEmptyFilter}
- searchFilterDocs={returnEmptyDoclist}
- />
- );
- }
-
render() {
return (
<div
@@ -1021,6 +995,7 @@ export class MainView extends React.Component {
{this.inkResources}
<DictationOverlay />
<SharingManager />
+ <CalendarManager />
<ServerStats />
<RTFMarkup />
<SettingsManager />
@@ -1031,9 +1006,9 @@ export class MainView extends React.Component {
<DocumentDecorations boundsLeft={this.leftScreenOffsetOfMainDocView} boundsTop={this.topOfSidebarDoc} PanelWidth={this._windowWidth} PanelHeight={this._windowHeight} />
<ComponentDecorations boundsLeft={this.leftScreenOffsetOfMainDocView} boundsTop={this.topOfMainDocContent} />
{this._hideUI ? null : <TopBar />}
- {LinkDescriptionPopup.descriptionPopup ? <LinkDescriptionPopup /> : null}
- {DocumentLinksButton.LinkEditorDocView ? <LinkMenu clearLinkEditor={action(() => (DocumentLinksButton.LinkEditorDocView = undefined))} docView={DocumentLinksButton.LinkEditorDocView} /> : null}
- {this.linkDocPreview}
+ <LinkDescriptionPopup />
+ {DocButtonState.Instance.LinkEditorDocView ? <LinkMenu clearLinkEditor={action(() => (DocButtonState.Instance.LinkEditorDocView = undefined))} docView={DocButtonState.Instance.LinkEditorDocView} /> : null}
+ {LinkInfo.Instance?.LinkInfo ? <LinkDocPreview {...LinkInfo.Instance.LinkInfo} /> : null}
{((page: string) => {
// prettier-ignore
@@ -1041,7 +1016,7 @@ export class MainView extends React.Component {
default:
case 'dashboard': return (<>
<div key="dashdiv" style={{ position: 'relative', display: this._hideUI || LightboxView.LightboxDoc ? 'none' : undefined, zIndex: 2001 }}>
- <CollectionMenu panelWidth={this.topMenuWidth} panelHeight={this.topMenuHeight} />
+ <CollectionMenu panelWidth={this.topMenuWidth} panelHeight={this.topMenuHeight} toggleTopBar={this.toggleTopBar} topBarHeight={this.headerBarHeightFunc}/>
</div>
{this.mainDashboardArea}
</> );
@@ -1052,19 +1027,20 @@ export class MainView extends React.Component {
<PreviewCursor />
<TaskCompletionBox />
<ContextMenu />
- <RadialMenu />
<AnchorMenu />
<MapAnchorMenu />
+ <DirectionsAnchorMenu />
<DashFieldViewMenu />
<MarqueeOptionsMenu />
<TimelineMenu />
<RichTextMenu />
- <InkTranscription />
+ {/* <InkTranscription /> */}
{this.snapLines}
<LightboxView key="lightbox" PanelWidth={this._windowWidth} PanelHeight={this._windowHeight} maxBorder={[200, 50]} />
+ <CollectionFreeFormLinksView />
<OverlayView />
- {this.mapBoxHack}
<GPTPopup key="gptpopup" />
+ <SchemaCSVPopUp key="schemacsvpopup" />
<GenerativeFill imageEditorOpen={ImageBox.imageEditorOpen} imageEditorSource={ImageBox.imageEditorSource} imageRootDoc={ImageBox.imageRootDoc} addDoc={ImageBox.addDoc} />
{/* <NewLightboxView key="newLightbox" PanelWidth={this._windowWidth} PanelHeight={this._windowHeight} maxBorder={[200, 50]} /> */}
</div>