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.tsx47
1 files changed, 30 insertions, 17 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index dde04dcc0..0a3389fc2 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -10,13 +10,14 @@ import 'normalize.css';
import * as React from 'react';
import { Doc, DocListCast, Opt } from '../../fields/Doc';
import { DocCast, StrCast } from '../../fields/Types';
-import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue, returnZero, setupMoveUpEvents, Utils } from '../../Utils';
+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 { CollectionViewType, DocumentType } from '../documents/DocumentTypes';
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';
@@ -111,9 +112,6 @@ export class MainView extends React.Component {
@computed private get userDoc() {
return Doc.UserDoc();
}
- @computed private get colorScheme() {
- return StrCast(Doc.ActiveDashboard?.colorScheme);
- }
@observable mainDoc: Opt<Doc>;
@computed private get mainContainer() {
if (window.location.pathname.startsWith('/doc/') && Doc.CurrentUserEmail === 'guest') {
@@ -143,6 +141,12 @@ export class MainView extends React.Component {
mainDocViewHeight = () => this._dashUIHeight - this.headerBarDocHeight();
componentDidMount() {
+ const scriptTag = document.createElement('script');
+ scriptTag.setAttribute('type', 'text/javascript');
+ scriptTag.setAttribute('src', 'https://www.bing.com/api/maps/mapcontrol?callback=makeMap');
+ scriptTag.async = true;
+ scriptTag.defer = true;
+ document.body.appendChild(scriptTag);
document.getElementById('root')?.addEventListener('scroll', e => (ele => (ele.scrollLeft = ele.scrollTop = 0))(document.getElementById('root')!));
const ele = document.getElementById('loader');
const prog = document.getElementById('dash-progress');
@@ -696,7 +700,7 @@ export class MainView extends React.Component {
switch (whereFields[0]) {
case OpenWhere.lightbox: return LightboxView.AddDocTab(doc, location);
case OpenWhere.close: return CollectionDockingView.CloseSplit(doc, whereMods);
- case OpenWhere.toggle: return CollectionDockingView.ToggleSplit(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.add:default:return CollectionDockingView.AddSplit(doc, whereMods, undefined, undefined, keyValue);
}
};
@@ -724,7 +728,6 @@ export class MainView extends React.Component {
PanelHeight={this.leftMenuFlyoutHeight}
renderDepth={0}
isContentActive={returnTrue}
- scriptContext={CollectionDockingView.Instance?.props.Document}
focus={emptyFunction}
whenChildContentsActiveChanged={emptyFunction}
bringToFront={emptyFunction}
@@ -762,7 +765,6 @@ export class MainView extends React.Component {
childFilters={returnEmptyFilter}
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
- scriptContext={this}
/>
</div>
);
@@ -793,7 +795,7 @@ export class MainView extends React.Component {
return (
<>
{this._hideUI ? null : this.leftMenuPanel}
- <div key="inner" className={`mainView-innerContent${this.colorScheme}`}>
+ <div key="inner" className="mainView-innerContent">
{this.flyout}
<div
className="mainView-libraryHandle"
@@ -805,12 +807,20 @@ export class MainView extends React.Component {
{this.dockingContent}
{this._hideUI ? null : (
- <div className="mainView-propertiesDragger" key="props" onPointerDown={this.onPropertiesPointerDown} style={{ background: SettingsManager.userBackgroundColor, right: this.propertiesWidth() - 1 }}>
+ <div
+ className={`mainView-propertiesDragger${this.propertiesWidth() < 10 ? '-minified' : ''}`}
+ key="props"
+ onPointerDown={this.onPropertiesPointerDown}
+ style={{ background: SettingsManager.userVariantColor, right: this.propertiesWidth() - 1 }}>
<FontAwesomeIcon icon={this.propertiesWidth() < 10 ? 'chevron-left' : 'chevron-right'} color={SettingsManager.userColor} size="sm" />
</div>
)}
- <div className="properties-container" style={{ width: this.propertiesWidth() }}>
- {this.propertiesWidth() < 10 ? null : <PropertiesView styleProvider={DefaultStyleProvider} addDocTab={DocumentViewInternal.addDocTabFunc} width={this.propertiesWidth()} height={this.propertiesHeight()} />}
+ <div className="properties-container" style={{ width: this.propertiesWidth(), color: SettingsManager.userColor }}>
+ {
+ <div style={{ display: this.propertiesWidth() < 10 ? 'none' : undefined }}>
+ <PropertiesView styleProvider={DefaultStyleProvider} addDocTab={DocumentViewInternal.addDocTabFunc} width={this.propertiesWidth()} height={this.propertiesHeight()} />
+ </div>
+ }
</div>
</div>
</div>
@@ -832,7 +842,7 @@ export class MainView extends React.Component {
).observe(r);
}}
style={{
- color: this.colorScheme === ColorScheme.Dark ? 'rgb(205,205,205)' : 'black',
+ color: 'black',
height: `calc(100% - ${this.topOfDashUI + this.topMenuHeight()}px)`,
width: '100%',
}}>
@@ -902,19 +912,22 @@ export class MainView extends React.Component {
childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
/>
- {['watching', 'recording'].includes(String(this.userDoc?.presentationMode) ?? '') ? <div style={{ border: '.5rem solid green', padding: '5px' }}>{StrCast(this.userDoc?.presentationMode)}</div> : <></>}
+ {['watching', 'recording'].includes(StrCast(this.userDoc?.presentationMode)) ? <div style={{ border: '.5rem solid green', padding: '5px' }}>{StrCast(this.userDoc?.presentationMode)}</div> : <></>}
</div>
);
}
@computed get snapLines() {
- return !SelectionManager.Views().some(dv => dv.rootDoc.freeform_snapLines) ? null : (
+ SnappingManager.GetIsDragging();
+ const dragged = DragManager.docsBeingDragged.lastElement();
+ const dragPar = dragged ? DocumentManager.Instance.getDocumentView(dragged)?.props.CollectionFreeFormDocumentView?.().props.CollectionFreeFormView : undefined;
+ return !dragPar?.rootDoc.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="black" opacity={0.3} strokeWidth={0.5} strokeDasharray={'1 1'} />
+ <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.vertSnapLines().map((l, i) => (
- <line key={i} y1="0" x1={l} y2="2000" x2={l} stroke="black" opacity={0.3} strokeWidth={0.5} strokeDasharray={'1 1'} />
+ <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'} />
))}
</svg>
</div>
@@ -989,7 +1002,7 @@ export class MainView extends React.Component {
render() {
return (
<div
- className={`mainView-container ${this.colorScheme}`}
+ className="mainView-container"
style={{
color: SettingsManager.userColor,
background: SettingsManager.userBackgroundColor,