aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/PropertiesButtons.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/PropertiesButtons.tsx')
-rw-r--r--src/client/views/PropertiesButtons.tsx100
1 files changed, 45 insertions, 55 deletions
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index 18f53b8e7..bba6285c2 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -2,6 +2,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Dropdown, DropdownType, IListItemProps, Toggle, ToggleType, Type } from 'browndash-components';
import { action, computed, observable } from 'mobx';
import { observer } from 'mobx-react';
+import * as React from 'react';
import { AiOutlineColumnWidth } from 'react-icons/ai';
import { BiHide, BiShow } from 'react-icons/bi';
import { BsGrid3X3GapFill } from 'react-icons/bs';
@@ -12,42 +13,37 @@ import { RxWidth } from 'react-icons/rx';
import { TbEditCircle, TbEditCircleOff, TbHandOff, TbHandStop, TbHighlight, TbHighlightOff } from 'react-icons/tb';
import { TfiBarChart } from 'react-icons/tfi';
import { Doc, DocListCast, Opt } from '../../fields/Doc';
-import { InkField } from '../../fields/InkField';
import { RichTextField } from '../../fields/RichTextField';
import { BoolCast, ScriptCast } from '../../fields/Types';
import { ImageField } from '../../fields/URLField';
-import { DocUtils } from '../documents/Documents';
import { CollectionViewType, DocumentType } from '../documents/DocumentTypes';
+import { DocUtils } from '../documents/Documents';
import { IsFollowLinkScript } from '../util/LinkFollower';
import { LinkManager } from '../util/LinkManager';
import { SelectionManager } from '../util/SelectionManager';
import { SettingsManager } from '../util/SettingsManager';
-import { undoable, undoBatch } from '../util/UndoManager';
-import { Colors } from './global/globalEnums';
+import { undoBatch, undoable } from '../util/UndoManager';
import { InkingStroke } from './InkingStroke';
-import { DocumentView, OpenWhere } from './nodes/DocumentView';
import './PropertiesButtons.scss';
-import React = require('react');
-
-enum UtilityButtonState {
- Default,
- OpenRight,
- OpenExternally,
-}
+import { Colors } from './global/globalEnums';
+import { DocumentView, OpenWhere } from './nodes/DocumentView';
@observer
export class PropertiesButtons extends React.Component<{}, {}> {
@observable public static Instance: PropertiesButtons;
@computed get selectedDoc() {
- return SelectionManager.SelectedSchemaDoc() || SelectionManager.Views().lastElement()?.rootDoc;
+ return SelectionManager.SelectedSchemaDoc || SelectionManager.Views.lastElement()?.Document;
+ }
+ @computed get selectedLayoutDoc() {
+ return SelectionManager.SelectedSchemaDoc || SelectionManager.Views.lastElement()?.layoutDoc;
}
@computed get selectedTabView() {
- return !SelectionManager.SelectedSchemaDoc() && SelectionManager.Views().lastElement()?.topMost;
+ return !SelectionManager.SelectedSchemaDoc && SelectionManager.Views.lastElement()?.topMost;
}
propertyToggleBtn = (label: (on?: any) => string, property: string, tooltip: (on?: any) => string, icon: (on?: any) => any, onClick?: (dv: Opt<DocumentView>, doc: Doc, property: string) => void, useUserDoc?: boolean) => {
- const targetDoc = useUserDoc ? Doc.UserDoc() : this.selectedDoc;
+ const targetDoc = useUserDoc ? Doc.UserDoc() : this.selectedLayoutDoc;
const onPropToggle = (dv: Opt<DocumentView>, doc: Doc, prop: string) => ((dv?.layoutDoc || doc)[prop] = (dv?.layoutDoc || doc)[prop] ? false : true);
return !targetDoc ? null : (
<Toggle
@@ -61,8 +57,8 @@ export class PropertiesButtons extends React.Component<{}, {}> {
fillWidth={true}
toggleType={ToggleType.BUTTON}
onClick={undoable(() => {
- if (SelectionManager.Views().length > 1) {
- SelectionManager.Views().forEach(dv => (onClick ?? onPropToggle)(dv, dv.rootDoc, property));
+ if (SelectionManager.Views.length > 1) {
+ SelectionManager.Views.forEach(dv => (onClick ?? onPropToggle)(dv, dv.Document, property));
} else if (targetDoc) (onClick ?? onPropToggle)(undefined, targetDoc, property);
}, property)}
/>
@@ -79,8 +75,8 @@ export class PropertiesButtons extends React.Component<{}, {}> {
on => `${on ? 'Set' : 'Remove'} lightbox flag`,
on => 'window-restore',
onClick => {
- SelectionManager.Views().forEach(dv => {
- const containerDoc = dv.rootDoc;
+ SelectionManager.Views.forEach(dv => {
+ const containerDoc = dv.Document;
//containerDoc.followAllLinks =
// containerDoc.noShadow =
// containerDoc.layout_disableBrushing =
@@ -88,8 +84,8 @@ export class PropertiesButtons extends React.Component<{}, {}> {
//containerDoc._freeform_fitContentsToBox =
containerDoc._isLightbox = !containerDoc._isLightbox;
//containerDoc._xPadding = containerDoc._yPadding = containerDoc._isLightbox ? 10 : undefined;
- const containerContents = DocListCast(dv.dataDoc[dv.props.fieldKey ?? Doc.LayoutFieldKey(containerDoc)]);
- //dv.rootDoc.onClick = ScriptField.MakeScript('{self.data = undefined; documentView.select(false)}', { documentView: 'any' });
+ const containerContents = DocListCast(dv.dataDoc[Doc.LayoutFieldKey(containerDoc)]);
+ //dv.Docuemnt.onClick = ScriptField.MakeScript('{self.data = undefined; documentView.select(false)}', { documentView: 'any' });
containerContents.forEach(doc => LinkManager.Links(doc).forEach(link => (link.link_displayLine = false)));
});
}
@@ -103,7 +99,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
on => 'Switch between title styles',
on => (on ? <MdSubtitlesOff /> : <MdSubtitles />), // {currentIcon}, //(on ? <MdSubtitles/> :) , //,'text-width', on ? <MdSubtitles/> : <MdSubtitlesOff/>,
(dv, doc) => {
- const tdoc = dv?.rootDoc || doc;
+ const tdoc = dv?.Document || doc;
const newtitle = !tdoc._layout_showTitle ? 'title' : tdoc._layout_showTitle === 'title' ? 'title:hover' : '';
tdoc._layout_showTitle = newtitle ? newtitle : undefined;
}
@@ -197,8 +193,8 @@ export class PropertiesButtons extends React.Component<{}, {}> {
// on => `${on ? 'Set' : 'Remove'} lightbox flag`,
// on => 'window-restore',
// onClick => {
- // SelectionManager.Views().forEach(dv => {
- // const containerDoc = dv.rootDoc;
+ // SelectionManager.Views.forEach(dv => {
+ // const containerDoc = dv.Document;
// //containerDoc.followAllLinks =
// // containerDoc.noShadow =
// // containerDoc.disableDocBrushing =
@@ -207,7 +203,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
// containerDoc._isLightbox = !containerDoc._isLightbox;
// //containerDoc._xPadding = containerDoc._yPadding = containerDoc._isLightbox ? 10 : undefined;
// const containerContents = DocListCast(dv.dataDoc[dv.props.fieldKey ?? Doc.LayoutFieldKey(containerDoc)]);
- // //dv.rootDoc.onClick = ScriptField.MakeScript('{self.data = undefined; documentView.select(false)}', { documentView: 'any' });
+ // //dv.Document.onClick = ScriptField.MakeScript('{self.data = undefined; documentView.select(false)}', { documentView: 'any' });
// containerContents.forEach(doc => LinkManager.Links(doc).forEach(link => (link.layout_linkDisplay = false)));
// });
// }
@@ -233,7 +229,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
'_layout_showCaption',
on => `${on ? 'Hide' : 'Show'} caption footer`,
on => (on ? <MdClosedCaptionDisabled /> : <MdClosedCaption />), //'closed-captioning',
- (dv, doc) => ((dv?.rootDoc || doc)._layout_showCaption = (dv?.rootDoc || doc)._layout_showCaption === undefined ? 'caption' : undefined)
+ (dv, doc) => ((dv?.Document || doc)._layout_showCaption = (dv?.Document || doc)._layout_showCaption === undefined ? 'caption' : undefined)
);
}
@@ -244,7 +240,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
'_chromeHidden',
on => `${on ? 'Show' : 'Hide'} editing UI`,
on => (on ? <TbEditCircle /> : <TbEditCircleOff />), // 'edit',
- (dv, doc) => ((dv?.rootDoc || doc)._chromeHidden = !(dv?.rootDoc || doc)._chromeHidden)
+ (dv, doc) => ((dv?.Document || doc)._chromeHidden = !(dv?.Document || doc)._chromeHidden)
);
}
@@ -349,10 +345,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
@undoBatch
handlePerspectiveChange = (e: any) => {
this.selectedDoc && (this.selectedDoc._type_collection = e.target.value);
- SelectionManager.Views()
- .filter(dv => dv.docView)
- .map(dv => dv.docView!)
- .forEach(docView => (docView.layoutDoc._type_collection = e.target.value));
+ SelectionManager.Views.forEach(docView => (docView.layoutDoc._type_collection = e.target.value));
};
@computed get onClickVal() {
const linkButton = IsFollowLinkScript(this.selectedDoc.onClick);
@@ -413,34 +406,31 @@ export class PropertiesButtons extends React.Component<{}, {}> {
@undoBatch
@action
handleOptionChange = (onClick: string) => {
- SelectionManager.Views()
- .filter(dv => dv.docView)
- .map(dv => dv.docView!)
- .forEach(docView => {
- const linkButton = IsFollowLinkScript(docView.props.Document.onClick);
- docView.noOnClick();
- switch (onClick) {
- case 'enterPortal':
- docView.makeIntoPortal();
- break;
- case 'toggleDetail':
- docView.setToggleDetail();
- break;
- case 'linkInPlace':
- docView.toggleFollowLink(false, false);
- docView.props.Document.followLinkLocation = linkButton ? OpenWhere.lightbox : undefined;
- break;
- case 'linkOnRight':
- docView.toggleFollowLink(false, false);
- docView.props.Document.followLinkLocation = linkButton ? OpenWhere.addRight : undefined;
- break;
- }
- });
+ SelectionManager.Views.forEach(docView => {
+ const linkButton = IsFollowLinkScript(docView.Document.onClick);
+ docView.noOnClick();
+ switch (onClick) {
+ case 'enterPortal':
+ docView.makeIntoPortal();
+ break;
+ case 'toggleDetail':
+ docView.setToggleDetail();
+ break;
+ case 'linkInPlace':
+ docView.toggleFollowLink(false, false);
+ docView.Document.followLinkLocation = linkButton ? OpenWhere.lightbox : undefined;
+ break;
+ case 'linkOnRight':
+ docView.toggleFollowLink(false, false);
+ docView.Document.followLinkLocation = linkButton ? OpenWhere.addRight : undefined;
+ break;
+ }
+ });
};
@undoBatch
editOnClickScript = () => {
- if (SelectionManager.Views().length) SelectionManager.Views().forEach(dv => DocUtils.makeCustomViewClicked(dv.rootDoc, undefined, 'onClick'));
+ if (SelectionManager.Views.length) SelectionManager.Views.forEach(dv => DocUtils.makeCustomViewClicked(dv.Document, undefined, 'onClick'));
else this.selectedDoc && DocUtils.makeCustomViewClicked(this.selectedDoc, undefined, 'onClick');
};
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-17 20:02:20 +0000