aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DocumentView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/DocumentView.tsx')
-rw-r--r--src/client/views/nodes/DocumentView.tsx39
1 files changed, 21 insertions, 18 deletions
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 0f2905d5b..5ae232aa9 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -1,6 +1,7 @@
/* eslint-disable no-use-before-define */
/* eslint-disable react/jsx-props-no-spreading */
import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { Property } from 'csstype';
import { Howl } from 'howler';
import { IReactionDisposer, action, computed, makeObservable, observable, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
@@ -32,7 +33,7 @@ import { UPDATE_SERVER_CACHE } from '../../util/LinkManager';
import { ScriptingGlobals } from '../../util/ScriptingGlobals';
import { SearchUtil } from '../../util/SearchUtil';
import { SnappingManager } from '../../util/SnappingManager';
-import { UndoManager, undoBatch, undoable } from '../../util/UndoManager';
+import { UndoManager, undoable } from '../../util/UndoManager';
import { ContextMenu } from '../ContextMenu';
import { ContextMenuProps } from '../ContextMenuItem';
import { DocComponent } from '../DocComponent';
@@ -65,7 +66,7 @@ export interface DocumentViewProps extends FieldViewSharedProps {
hideLinkAnchors?: boolean;
hideLinkButton?: boolean;
hideCaptions?: boolean;
- contentPointerEvents?: 'none' | 'all' | undefined; // pointer events allowed for content of a document view. eg. set to "none" in menuSidebar for sharedDocs so that you can select a document, but not interact with its contents
+ contentPointerEvents?: Property.PointerEvents | undefined; // pointer events allowed for content of a document view. eg. set to "none" in menuSidebar for sharedDocs so that you can select a document, but not interact with its contents
dontCenter?: 'x' | 'y' | 'xy';
childHideDecorationTitle?: boolean;
childHideResizeHandles?: boolean;
@@ -116,7 +117,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
@observable _titleDropDownInnerWidth = 0; // width of menu dropdown when setting doc title
@observable _mounted = false; // turn off all pointer events if component isn't yet mounted (enables nested Docs in alternate UI textboxes that appear on hover which otherwise would grab focus from the text box, reverting to the original UI )
@observable _isContentActive: boolean | undefined = undefined;
- @observable _pointerEvents: 'none' | 'all' | 'visiblePainted' | undefined = undefined;
+ @observable _pointerEvents: Property.PointerEvents | undefined = undefined;
@observable _componentView: Opt<ViewBoxInterface<FieldViewProps>> = undefined; // needs to be accessed from DocumentView wrapper class
@observable _animateScaleTime: Opt<number> = undefined; // milliseconds for animating between views. defaults to 300 if not uset
@observable _animateScalingTo = 0;
@@ -216,7 +217,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
{ fireImmediately: true }
);
this._disposers.pointerevents = reaction(
- () => this.style(this.Document, StyleProp.PointerEvents) as 'all' | 'none' | 'visiblePainted' | undefined,
+ () => this.style(this.Document, StyleProp.PointerEvents) as Property.PointerEvents | undefined,
pointerevents => {
this._pointerEvents = pointerevents;
},
@@ -243,7 +244,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
Object.values(this._disposers).forEach(disposer => disposer?.());
}
- startDragging(x: number, y: number, dropAction: dropActionType, hideSource = false) {
+ startDragging(x: number, y: number, dropAction: dropActionType | undefined, hideSource = false) {
const docView = this._docView;
if (this._mainCont.current && docView) {
const views = DocumentView.Selected().filter(dv => dv.ContentDiv);
@@ -310,7 +311,8 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
const defaultDblclick = this._props.defaultDoubleClick?.() || this.Document.defaultDoubleClick;
undoable(() => {
if (this.onDoubleClickHdlr?.script) {
- this.onDoubleClickHdlr.script.run(scriptProps, console.log).result?.select && this._props.select(false);
+ const res = this.onDoubleClickHdlr.script.run(scriptProps, console.log).result as { select: boolean };
+ res.select && this._props.select(false);
} else if (!Doc.IsSystem(this.Document) && defaultDblclick !== 'ignore') {
this._props.addDocTab(this.Document, OpenWhere.lightboxAlways);
DocumentView.DeselectAll();
@@ -558,7 +560,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
if (!this.Document.isFolder) {
const templateDoc = Cast(this.Document[StrCast(this.Document.layout_fieldKey)], Doc, null);
const appearance = cm.findByDescription('Appearance...');
- const appearanceItems: ContextMenuProps[] = appearance && 'subitems' in appearance ? appearance.subitems : [];
+ const appearanceItems = appearance?.subitems ?? [];
if (this._props.renderDepth === 0) {
appearanceItems.splice(0, 0, { description: 'Open in Lightbox', event: () => DocumentView.SetLightboxDoc(this.Document), icon: 'external-link-alt' });
@@ -574,7 +576,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
// creates menu for the user to select how to reveal the flashcards
if (this.Document._layout_isFlashcard) {
const revealOptions = cm.findByDescription('Reveal Options');
- const revealItems: ContextMenuProps[] = revealOptions && 'subitems' in revealOptions ? revealOptions.subitems : [];
+ const revealItems = revealOptions?.subitems ?? [];
revealItems.push({ description: 'Hover', event: () => { this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'hover'; }, icon: 'hand-point-up' }); // prettier-ignore
revealItems.push({ description: 'Flip', event: () => { this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'flip'; }, icon: 'rotate' }); // prettier-ignore
!revealOptions && cm.addItem({ description: 'Reveal Options', addDivider: false, noexpand: true, subitems: revealItems, icon: 'layer-group' });
@@ -582,15 +584,16 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
if (this._props.bringToFront) {
const zorders = cm.findByDescription('ZOrder...');
- const zorderItems: ContextMenuProps[] = zorders && 'subitems' in zorders ? zorders.subitems : [];
+ const zorderItems = zorders?.subitems ?? [];
zorderItems.push({ description: 'Bring to Front', event: () => DocumentView.Selected().forEach(dv => dv._props.bringToFront?.(dv.Document, false)), icon: 'arrow-up' });
zorderItems.push({ description: 'Send to Back', event: () => DocumentView.Selected().forEach(dv => dv._props.bringToFront?.(dv.Document, true)), icon: 'arrow-down' });
zorderItems.push({
description: !this.layoutDoc._keepZDragged ? 'Keep ZIndex when dragged' : 'Allow ZIndex to change when dragged',
- event: undoBatch(
+ event: undoable(
action(() => {
this.layoutDoc._keepZWhenDragged = !this.layoutDoc._keepZWhenDragged;
- })
+ }),
+ 'set zIndex drag'
),
icon: 'hand-point-up',
});
@@ -599,7 +602,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
if (!Doc.IsSystem(this.Document) && !this.Document.hideClickBehaviors && !this._props.hideClickBehaviors) {
const existingOnClick = cm.findByDescription('OnClick...');
- const onClicks: ContextMenuProps[] = existingOnClick && 'subitems' in existingOnClick ? existingOnClick.subitems : [];
+ const onClicks = existingOnClick?.subitems ?? [];
onClicks.push({ description: 'Enter Portal', event: undoable(() => DocUtils.makeIntoPortal(this.Document, this.layoutDoc, this._allLinks), 'make into portal'), icon: 'window-restore' });
!Doc.noviceMode && onClicks.push({ description: 'Toggle Detail', event: this.setToggleDetail, icon: 'concierge-bell' });
@@ -624,7 +627,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
}
const more = cm.findByDescription('More...');
- const moreItems = more && 'subitems' in more ? more.subitems : [];
+ const moreItems = more?.subitems ?? [];
if (!Doc.IsSystem(this.Document)) {
if (!Doc.noviceMode) {
moreItems.push({ description: 'Make View of Metadata Field', event: () => Doc.MakeMetadataFieldTemplate(this.Document, this._props.TemplateDataDocument), icon: 'concierge-bell' });
@@ -648,7 +651,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
cm.addItem({ description: 'General...', noexpand: false, subitems: constantItems, icon: 'question' });
const help = cm.findByDescription('Help...');
- const helpItems: ContextMenuProps[] = help && 'subitems' in help ? help.subitems : [];
+ const helpItems = help?.subitems ?? [];
!Doc.noviceMode && helpItems.push({ description: 'Text Shortcuts Ctrl+/', event: () => this._props.addDocTab(Docs.Create.PdfDocument('/assets/cheat-sheet.pdf', { _width: 300, _height: 300 }), OpenWhere.addRight), icon: 'keyboard' });
!Doc.noviceMode && helpItems.push({ description: 'Print Document in Console', event: () => console.log(this.Document), icon: 'hand-point-right' });
!Doc.noviceMode && helpItems.push({ description: 'Print DataDoc in Console', event: () => console.log(this.dataDoc), icon: 'hand-point-right' });
@@ -844,7 +847,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
.map(field => Field.toKeyValueString(this.Document, field))
.join('\\')
}
- SetValue={undoBatch((input: string) => {
+ SetValue={undoable((input: string) => {
if (input?.startsWith('$')) {
if (this.layoutDoc.layout_showTitle) {
this.layoutDoc._layout_showTitle = input?.substring(1) ? input.substring(1) : undefined;
@@ -855,7 +858,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
Doc.SetField(targetDoc, showTitle, input);
}
return true;
- })}
+ }, 'set title')}
/>
</div>
</div>
@@ -1245,7 +1248,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
public setToggleDetail = (scriptFieldKey = 'onClick') => this._docViewInternal?.setToggleDetail(scriptFieldKey);
public onContextMenu = (e?: React.MouseEvent, pageX?: number, pageY?: number) => this._docViewInternal?.onContextMenu?.(e, pageX, pageY);
public cleanupPointerEvents = () => this._docViewInternal?.cleanupPointerEvents();
- public startDragging = (x: number, y: number, dropAction: dropActionType, hideSource = false) => this._docViewInternal?.startDragging(x, y, dropAction, hideSource);
+ public startDragging = (x: number, y: number, dropAction: dropActionType | undefined, hideSource = false) => this._docViewInternal?.startDragging(x, y, dropAction, hideSource);
public showContextMenu = (pageX: number, pageY: number) => this._docViewInternal?.onContextMenu(undefined, pageX, pageY);
public toggleNativeDimensions = () => this._docViewInternal && this.Document.type !== DocumentType.INK && Doc.toggleNativeDimensions(this.layoutDoc, this.NativeDimScaling() ?? 1, this._props.PanelWidth(), this._props.PanelHeight());
@@ -1288,7 +1291,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
this.dataDoc.audioAnnoState = AudioAnnoState.playing;
break;
case AudioAnnoState.playing:
- this.dataDoc[AudioPlay]?.stop();
+ (this.dataDoc[AudioPlay] as Howl)?.stop();
this.dataDoc.audioAnnoState = AudioAnnoState.stopped;
break;
default: