aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/client/util/CurrentUserUtils.ts3
-rw-r--r--src/client/util/DragManager.ts2
-rw-r--r--src/client/util/SettingsManager.tsx6
-rw-r--r--src/client/util/SnappingManager.ts3
-rw-r--r--src/client/views/DocumentDecorations.tsx2
-rw-r--r--src/client/views/LightboxView.tsx7
-rw-r--r--src/client/views/MainView.tsx6
-rw-r--r--src/client/views/StyleProvider.tsx11
-rw-r--r--src/client/views/collections/TabDocView.tsx2
-rw-r--r--src/client/views/collections/collectionFreeForm/MarqueeView.tsx3
-rw-r--r--src/client/views/newlightbox/ButtonMenu/ButtonMenu.tsx5
-rw-r--r--src/client/views/newlightbox/NewLightboxView.tsx3
-rw-r--r--src/client/views/nodes/DocumentView.tsx6
-rw-r--r--src/client/views/topbar/TopBar.tsx7
14 files changed, 39 insertions, 27 deletions
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index dd72051fa..c1d74c398 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -30,6 +30,7 @@ import { LinkManager } from "./LinkManager";
import { ScriptingGlobals } from "./ScriptingGlobals";
import { ColorScheme } from "./SettingsManager";
import { UndoManager } from "./UndoManager";
+import { SnappingManager } from "./SnappingManager";
interface Button {
// DocumentOptions fields a button can set
@@ -1018,7 +1019,7 @@ export class CurrentUserUtils {
}
ScriptingGlobals.add(function MySharedDocs() { return Doc.MySharedDocs; }, "document containing all shared Docs");
-ScriptingGlobals.add(function IsExploreMode() { return DocumentView.ExploreMode; }, "is Dash in exploration mode");
+ScriptingGlobals.add(function IsExploreMode() { return SnappingManager.ExploreMode; }, "is Dash in exploration mode");
ScriptingGlobals.add(function IsNoviceMode() { return Doc.noviceMode; }, "is Dash in novice mode");
ScriptingGlobals.add(function toggleComicMode() { Doc.UserDoc().renderStyle = Doc.UserDoc().renderStyle === "comic" ? undefined : "comic"; }, "switches between comic and normal document rendering");
ScriptingGlobals.add(function importDocument() { return CurrentUserUtils.importDocument(); }, "imports files from device directly into the import sidebar");
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index c711db31a..fe3a52be7 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -333,7 +333,7 @@ export namespace DragManager {
export let CanEmbed = false;
export let DocDragData: DocumentDragData | undefined;
export function StartDrag(eles: HTMLElement[], dragData: { [id: string]: any }, downX: number, downY: number, options?: DragOptions, finishDrag?: (dropData: DragCompleteEvent) => void, dragUndoName?: string) {
- if (dragData.dropAction === 'none' || DocumentView.ExploreMode) return;
+ if (dragData.dropAction === 'none' || SnappingManager.ExploreMode) return;
DocDragData = dragData as DocumentDragData;
const batch = UndoManager.StartBatch(dragUndoName ?? 'document drag');
eles = eles.filter(e => e);
diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx
index ccf6fb820..0233c4051 100644
--- a/src/client/util/SettingsManager.tsx
+++ b/src/client/util/SettingsManager.tsx
@@ -5,7 +5,7 @@ import { observer } from 'mobx-react';
import * as React from 'react';
import { BsGoogle } from 'react-icons/bs';
import { FaFillDrip, FaPalette } from 'react-icons/fa';
-import { Doc } from '../../fields/Doc';
+import { Doc, Opt } from '../../fields/Doc';
import { DashVersion } from '../../fields/DocSymbols';
import { BoolCast, Cast, NumCast, StrCast } from '../../fields/Types';
import { addStyleSheet, addStyleSheetRule, Utils } from '../../Utils';
@@ -43,6 +43,7 @@ export class SettingsManager extends React.Component<{}> {
@observable private curr_password = '';
@observable private new_password = '';
@observable private new_confirm = '';
+ @observable private _lastPressedSidebarBtn: Opt<Doc> = undefined; // bcz: this is a hack to handle highlighting buttons in the leftpanel menu .. need to find a cleaner approach
@observable activeTab = 'Accounts';
@observable public propertiesWidth: number = 0;
@@ -94,6 +95,9 @@ export class SettingsManager extends React.Component<{}> {
return StrCast(Doc.UserDoc().userBackgroundColor);
}
+ public get LastPressedBtn() { return this._lastPressedSidebarBtn; } // prettier-ignore
+ public SetLastPressedBtn = (state?:Doc) => runInAction(() => (this._lastPressedSidebarBtn = state)); // prettier-ignore
+
@undoBatch selectUserMode = action((mode: string) => (Doc.noviceMode = mode === 'Novice'));
@undoBatch changelayout_showTitle = action((e: React.ChangeEvent) => (Doc.UserDoc().layout_showTitle = (e.currentTarget as any).value ? 'title' : undefined));
@undoBatch changeFontFamily = action((font: string) => (Doc.UserDoc().fontFamily = font));
diff --git a/src/client/util/SnappingManager.ts b/src/client/util/SnappingManager.ts
index b8bd90983..c4d299fa1 100644
--- a/src/client/util/SnappingManager.ts
+++ b/src/client/util/SnappingManager.ts
@@ -14,6 +14,7 @@ export class SnappingManager {
@observable _canEmbed: boolean = false;
@observable _horizSnapLines: number[] = [];
@observable _vertSnapLines: number[] = [];
+ @observable _exploreMode = false;
private constructor() {
SnappingManager._manager = this;
@@ -33,9 +34,11 @@ export class SnappingManager {
public static get IsDragging() { return this.Instance._isDragging; } // prettier-ignore
public static get IsResizing() { return this.Instance._isResizing; } // prettier-ignore
public static get CanEmbed() { return this.Instance._canEmbed; } // prettier-ignore
+ public static get ExploreMode() { return this.Instance._exploreMode; } // prettier-ignore
public static SetShiftKey = (down: boolean) => runInAction(() => (this.Instance._shiftKey = down)); // prettier-ignore
public static SetCtrlKey = (down: boolean) => runInAction(() => (this.Instance._ctrlKey = down)); // prettier-ignore
public static SetIsDragging = (drag: boolean) => runInAction(() => (this.Instance._isDragging = drag)); // prettier-ignore
public static SetIsResizing = (doc: Opt<Doc>) => runInAction(() => (this.Instance._isResizing = doc)); // prettier-ignore
public static SetCanEmbed = (embed:boolean) => runInAction(() => (this.Instance._canEmbed = embed)); // prettier-ignore
+ public static SetExploreMode= (state:boolean) => runInAction(() => (this.Instance._exploreMode = state)); // prettier-ignore
}
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index f3da133c3..d2f23c2f3 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -97,7 +97,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
}
@computed get Bounds() {
- return (LinkFollower.IsFollowing || DocumentView.ExploreMode) ?
+ return (LinkFollower.IsFollowing || SnappingManager.ExploreMode) ?
{ x: 0, y: 0, r: 0, b: 0 }
: SelectionManager.Views
.filter(dv => dv._props.renderDepth > 0)
diff --git a/src/client/views/LightboxView.tsx b/src/client/views/LightboxView.tsx
index 7577f2935..ab3be3d7a 100644
--- a/src/client/views/LightboxView.tsx
+++ b/src/client/views/LightboxView.tsx
@@ -22,6 +22,7 @@ import './LightboxView.scss';
import { DocumentView, OpenWhere, OpenWhereMod } from './nodes/DocumentView';
import { DefaultStyleProvider, wavyBorderPath } from './StyleProvider';
import { ObservableReactComponent } from './ObservableReactComponent';
+import { SnappingManager } from '../util/SnappingManager';
interface LightboxViewProps {
PanelWidth: number;
@@ -77,7 +78,7 @@ export class LightboxView extends ObservableReactComponent<LightboxViewProps> {
this._future = [];
this._history = [];
Doc.ActiveTool = InkTool.None;
- DocumentView.ExploreMode = false;
+ SnappingManager.SetExploreMode(false);
}
SelectionManager.DeselectAll();
if (future) {
@@ -172,7 +173,7 @@ export class LightboxView extends ObservableReactComponent<LightboxViewProps> {
};
toggleFitWidth = () => this._doc && (this._doc._layout_fitWidth = !this._doc._layout_fitWidth);
togglePen = () => (Doc.ActiveTool = Doc.ActiveTool === InkTool.Pen ? InkTool.None : InkTool.Pen);
- toggleExplore = () => (DocumentView.ExploreMode = !DocumentView.ExploreMode);
+ toggleExplore = () => SnappingManager.SetExploreMode(!SnappingManager.ExploreMode);
lightboxDoc = () => this._doc;
lightboxWidth = () => this._props.PanelWidth - this.leftBorder * 2;
@@ -286,7 +287,7 @@ export class LightboxView extends ObservableReactComponent<LightboxViewProps> {
{toggleBtn('lightboxView-navBtn', 'toggle reading view', this._doc?._layout_fitWidth, 'book-open', 'book', this.toggleFitWidth)}
{toggleBtn('lightboxView-tabBtn', 'open document in a tab', false, 'file-download', '', this.downloadDoc)}
{toggleBtn('lightboxView-penBtn', 'toggle pen annotation', Doc.ActiveTool === InkTool.Pen, 'pen', '', this.togglePen)}
- {toggleBtn('lightboxView-exploreBtn', 'toggle navigate only mode', DocumentView.ExploreMode, 'globe-americas', '', this.toggleExplore)}
+ {toggleBtn('lightboxView-exploreBtn', 'toggle navigate only mode', SnappingManager.ExploreMode, 'globe-americas', '', this.toggleExplore)}
</div>
);
}
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index f2a1ca57e..094bd2adb 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -593,7 +593,7 @@ export class MainView extends ObservableReactComponent<{}> {
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);
@@ -873,11 +873,11 @@ export class MainView extends ObservableReactComponent<{}> {
//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;
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 3e7e4be90..c8f6d6013 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -4,6 +4,7 @@ import { Tooltip } from '@mui/material';
import { Dropdown, DropdownType, IconButton, IListItemProps, Shadows, Size, Type } from 'browndash-components';
import { action, runInAction, untracked } from 'mobx';
import { extname } from 'path';
+import * as React from 'react';
import { BsArrowDown, BsArrowDownUp, BsArrowUp } from 'react-icons/bs';
import { FaFilter } from 'react-icons/fa';
import { Doc, Opt, StrListCast } from '../../fields/Doc';
@@ -15,15 +16,15 @@ import { DocFocusOrOpen, DocumentManager } from '../util/DocumentManager';
import { IsFollowLinkScript } from '../util/LinkFollower';
import { LinkManager } from '../util/LinkManager';
import { SettingsManager } from '../util/SettingsManager';
+import { SnappingManager } from '../util/SnappingManager';
import { undoBatch, UndoManager } from '../util/UndoManager';
import { TreeSort } from './collections/TreeSort';
import { Colors } from './global/globalEnums';
-import { DocumentView, DocumentViewProps } from './nodes/DocumentView';
+import { DocumentViewProps } from './nodes/DocumentView';
import { FieldViewProps } from './nodes/FieldView';
import { KeyValueBox } from './nodes/KeyValueBox';
import { PropertiesView } from './PropertiesView';
import './StyleProvider.scss';
-import * as React from 'react';
export enum StyleProp {
TreeViewIcon = 'treeView_Icon',
@@ -164,7 +165,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
''
);
case StyleProp.Color:
- if (DocumentView.LastPressedSidebarBtn === doc) return SettingsManager.userBackgroundColor;
+ if (SettingsManager.Instance.LastPressedBtn === doc) return SettingsManager.userBackgroundColor;
if (Doc.IsSystem(doc!)) return SettingsManager.userColor;
if (doc?.type === DocumentType.FONTICON) return SettingsManager.userColor;
const docColor: Opt<string> = StrCast(doc?.[fieldKey + 'color'], StrCast(doc?._color));
@@ -199,7 +200,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
? titleHeight()
: 0;
case StyleProp.BackgroundColor: {
- if (DocumentView.LastPressedSidebarBtn === doc) return SettingsManager.userColor; // hack to indicate active menu panel item
+ if (SettingsManager.Instance.LastPressedBtn === doc) return SettingsManager.userColor; // hack to indicate active menu panel item
let docColor: Opt<string> = StrCast(doc?.[fieldKey + '_backgroundColor'], StrCast(doc?._backgroundColor, isCaption ? 'rgba(0,0,0,0.4)' : ''));
// prettier-ignore
switch (doc?.type) {
@@ -266,7 +267,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
case StyleProp.PointerEvents:
if (StrCast(doc?.pointerEvents) && !docProps?.LayoutTemplateString?.includes(KeyValueBox.name)) return StrCast(doc!.pointerEvents); // honor pointerEvents field (set by lock button usually) if it's not a keyValue view of the Doc
if (docProps?.DocumentView?.()._props.LayoutTemplateString?.includes(KeyValueBox.name)) return 'all';
- if (DocumentView.ExploreMode || doc?.layout_unrendered) return isInk() ? 'visiblePainted' : 'all';
+ if (SnappingManager.ExploreMode || doc?.layout_unrendered) return isInk() ? 'visiblePainted' : 'all';
if (props?.pointerEvents?.() === 'none') return 'none';
if (opacity() === 0) return 'none';
if (props?.isGroupActive?.() ) return isInk() ? 'visiblePainted': (doc?.
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 783817b06..ac0ce7a2a 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -435,7 +435,7 @@ export class TabDocView extends ObservableReactComponent<TabDocViewProps> {
disableMinimap = () => !this._document;
whenChildContentActiveChanges = (isActive: boolean) => (this._isAnyChildContentActive = isActive);
isContentActive = () => this._isContentActive;
- waitForDoubleClick = () => (DocumentView.ExploreMode ? 'never' : undefined);
+ waitForDoubleClick = () => (SnappingManager.ExploreMode ? 'never' : undefined);
@computed get docView() {
return !this._activated || !this._document ? null : (
<>
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index 2c65726b2..b22fdfa19 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -27,6 +27,7 @@ import { FormattedTextBox } from '../../nodes/formattedText/FormattedTextBox';
import { SubCollectionViewProps } from '../CollectionSubView';
import { MarqueeOptionsMenu } from './MarqueeOptionsMenu';
import './MarqueeView.scss';
+import { SnappingManager } from '../../../util/SnappingManager';
interface MarqueeViewProps {
getContainerTransform: () => Transform;
@@ -321,7 +322,7 @@ export class MarqueeView extends ObservableReactComponent<SubCollectionViewProps
if (Utils.isClick(e.clientX, e.clientY, this._downX, this._downY, Date.now())) {
if (Doc.ActiveTool === InkTool.None) {
if (!this._props.trySelectCluster(e.shiftKey)) {
- !DocumentView.ExploreMode && this.setPreviewCursor(e.clientX, e.clientY, false, false, this._props.Document);
+ !SnappingManager.ExploreMode && this.setPreviewCursor(e.clientX, e.clientY, false, false, this._props.Document);
} else e.stopPropagation();
}
// let the DocumentView stopPropagation of this event when it selects this document
diff --git a/src/client/views/newlightbox/ButtonMenu/ButtonMenu.tsx b/src/client/views/newlightbox/ButtonMenu/ButtonMenu.tsx
index 3a95e5f74..72b63cf8f 100644
--- a/src/client/views/newlightbox/ButtonMenu/ButtonMenu.tsx
+++ b/src/client/views/newlightbox/ButtonMenu/ButtonMenu.tsx
@@ -8,6 +8,7 @@ import { DocumentView, OpenWhereMod } from '../../nodes/DocumentView';
import { NewLightboxView } from '../NewLightboxView';
import './ButtonMenu.scss';
import { IButtonMenu } from './utils';
+import { SnappingManager } from '../../../util/SnappingManager';
export const ButtonMenu = (props: IButtonMenu) => {
return (
@@ -39,10 +40,10 @@ export const ButtonMenu = (props: IButtonMenu) => {
<div
className="newLightboxView-exploreBtn"
title="toggle explore mode to navigate among documents only"
- style={{ background: DocumentView.ExploreMode ? 'white' : undefined }}
+ style={{ background: SnappingManager.ExploreMode ? 'white' : undefined }}
onClick={action(e => {
e.stopPropagation();
- DocumentView.ExploreMode = !DocumentView.ExploreMode;
+ SnappingManager.SetExploreMode(!SnappingManager.ExploreMode);
})}></div>
</div>
);
diff --git a/src/client/views/newlightbox/NewLightboxView.tsx b/src/client/views/newlightbox/NewLightboxView.tsx
index f3cde3f5a..6980e31c1 100644
--- a/src/client/views/newlightbox/NewLightboxView.tsx
+++ b/src/client/views/newlightbox/NewLightboxView.tsx
@@ -23,6 +23,7 @@ import { emptyBounds, IBounds } from './ExploreView/utils';
import { NewLightboxHeader } from './Header';
import './NewLightboxView.scss';
import { RecommendationList } from './RecommendationList';
+import { SnappingManager } from '../../util/SnappingManager';
enum LightboxStatus {
RECOMMENDATIONS = 'recommendations',
@@ -126,7 +127,7 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
this._docFilters && (this._docFilters.length = 0);
this._future = this._history = [];
Doc.ActiveTool = InkTool.None;
- DocumentView.ExploreMode = false;
+ SnappingManager.SetExploreMode(false);
} else {
const l = DocUtils.MakeLinkToActiveAudio(() => doc).lastElement();
l && (Cast(l.link_anchor_2, Doc, null).backgroundColor = 'lightgreen');
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 336f65b85..cc7fca8d2 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -712,7 +712,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
}
const cm = ContextMenu.Instance;
- if (!cm || (e as any)?.nativeEvent?.SchemaHandled || DocumentView.ExploreMode) return;
+ if (!cm || (e as any)?.nativeEvent?.SchemaHandled || SnappingManager.ExploreMode) return;
if (e && !(e.nativeEvent as any).dash) {
const onDisplay = () => {
@@ -1337,10 +1337,8 @@ export class DocumentView extends ObservableReactComponent<DocumentViewProps> {
runInAction(() => (this._selected = val));
}
@observable public static LongPress = false;
- @observable public static ExploreMode = false;
- @observable public static LastPressedSidebarBtn: Opt<Doc> = undefined; // bcz: this is a hack to handle highlighting buttons in the leftpanel menu .. need to find a cleaner approach
@computed public static get exploreMode() {
- return () => (DocumentView.ExploreMode ? ScriptField.MakeScript('CollectionBrowseClick(documentView, clientX, clientY)', { documentView: 'any', clientX: 'number', clientY: 'number' })! : undefined);
+ return () => (SnappingManager.ExploreMode ? ScriptField.MakeScript('CollectionBrowseClick(documentView, clientX, clientY)', { documentView: 'any', clientX: 'number', clientY: 'number' })! : undefined);
}
@observable public docView: DocumentViewInternal | undefined | null = undefined;
@observable public textHtmlOverlay: Opt<string> = undefined;
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index d1c039d95..0f3487cd1 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -24,6 +24,7 @@ import { Colors } from '../global/globalEnums';
import { DocumentView, DocumentViewInternal } from '../nodes/DocumentView';
import { DefaultStyleProvider } from '../StyleProvider';
import './TopBar.scss';
+import { SnappingManager } from '../../util/SnappingManager';
/**
* ABOUT: This is the topbar in Dash, which included the current Dashboard as well as access to information on the user
@@ -84,9 +85,9 @@ export class TopBar extends React.Component {
type={Type.TERT}
tooltip="Browsing mode for directly navigating to documents"
size={Size.SMALL}
- color={DocumentView.ExploreMode ? this.variantColor : this.color}
- background={DocumentView.ExploreMode ? this.color : 'transparent'}
- onClick={action(() => (DocumentView.ExploreMode = !DocumentView.ExploreMode))}
+ color={SnappingManager.ExploreMode ? this.variantColor : this.color}
+ background={SnappingManager.ExploreMode ? this.color : 'transparent'}
+ onClick={() => SnappingManager.SetExploreMode(!SnappingManager.ExploreMode)}
/>
)}
</div>