aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/PropertiesButtons.tsx2
-rw-r--r--src/client/views/PropertiesSection.tsx6
-rw-r--r--src/client/views/PropertiesView.scss3
-rw-r--r--src/client/views/PropertiesView.tsx186
-rw-r--r--src/client/views/nodes/DocumentView.tsx4
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx10
-rw-r--r--src/client/views/nodes/formattedText/marks_rts.ts2
-rw-r--r--src/fields/DocSymbols.ts2
8 files changed, 99 insertions, 116 deletions
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index d939470e9..8b2b77aca 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -512,7 +512,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
{toggle(this.layout_autoHeightButton, { display: !isText && !isStacking && !isTree ? 'none' : '' })}
{toggle(this.maskButton, { display: !isInk ? 'none' : '' })}
{toggle(this.hideImageButton, { display: !isImage ? 'none' : '' })}
- {toggle(this.chromeButton, { display: !isCollection || isNovice ? 'none' : '' })}
+ {toggle(this.chromeButton, { display: isNovice ? 'none' : '' })}
{toggle(this.gridButton, { display: !isCollection ? 'none' : '' })}
{/* {toggle(this.groupButton, { display: isTabView || !isCollection ? 'none' : '' })} */}
{toggle(this.snapButton, { display: !isCollection ? 'none' : '' })}
diff --git a/src/client/views/PropertiesSection.tsx b/src/client/views/PropertiesSection.tsx
index b72e048df..0e7cd7e92 100644
--- a/src/client/views/PropertiesSection.tsx
+++ b/src/client/views/PropertiesSection.tsx
@@ -8,7 +8,7 @@ import { StrCast } from '../../fields/Types';
export interface PropertiesSectionProps {
title: string;
- content?: JSX.Element | string | null;
+ children?: JSX.Element | string | null;
isOpen: boolean;
setIsOpen: (bool: boolean) => any;
inSection?: boolean;
@@ -33,7 +33,7 @@ export class PropertiesSection extends React.Component<PropertiesSectionProps> {
@observable isDouble: boolean = false;
render() {
- if (this.props.content === undefined || this.props.content === null) return null;
+ if (this.props.children === undefined || this.props.children === null) return null;
else
return (
<div className="propertiesView-section" onPointerEnter={action(() => this.props.setInSection && this.props.setInSection(true))} onPointerLeave={action(() => this.props.setInSection && this.props.setInSection(false))}>
@@ -58,7 +58,7 @@ export class PropertiesSection extends React.Component<PropertiesSectionProps> {
<FontAwesomeIcon icon={this.props.isOpen ? 'caret-down' : 'caret-right'} size="lg" />
</div>
</div>
- {!this.props.isOpen ? null : <div className="propertiesView-content">{this.props.content}</div>}
+ {!this.props.isOpen ? null : <div className="propertiesView-content">{this.props.children}</div>}
</div>
);
}
diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss
index 510defce4..2da2ec568 100644
--- a/src/client/views/PropertiesView.scss
+++ b/src/client/views/PropertiesView.scss
@@ -46,8 +46,7 @@
}
.propertiesView-info {
- margin-top: 20;
- margin-right: 10;
+ margin-top: -5;
float: right;
font-size: 20;
path {
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 9cc75b1c6..b25ac7903 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -5,7 +5,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Checkbox, Tooltip } from '@material-ui/core';
import { Colors, EditableText, IconButton, NumberInput, Size, Slider, Type } from 'browndash-components';
import { concat } from 'lodash';
-import { action, computed, IReactionDisposer, observable, reaction } from 'mobx';
+import { action, computed, IReactionDisposer, observable, reaction, trace } from 'mobx';
import { observer } from 'mobx-react';
import { ColorState, SketchPicker } from 'react-color';
import * as Icons from 'react-icons/bs'; //{BsCollectionFill, BsFillFileEarmarkImageFill} from "react-icons/bs"
@@ -783,39 +783,39 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
}
@computed get shapeXps() {
- return this.getField('x');
+ return NumCast(this.selectedDoc?.x);
}
@computed get shapeYps() {
- return this.getField('y');
+ return NumCast(this.selectedDoc?.y);
}
@computed get shapeHgt() {
- return this.getField('_height');
+ return NumCast(this.selectedDoc?._height);
}
@computed get shapeWid() {
- return this.getField('_width');
+ return NumCast(this.selectedDoc?._width);
}
set shapeXps(value) {
- this.selectedDoc && (this.selectedDoc.x = Number(value));
+ this.selectedDoc && (this.selectedDoc.x = Math.round(value * 100) / 100);
}
set shapeYps(value) {
- this.selectedDoc && (this.selectedDoc.y = Number(value));
+ this.selectedDoc && (this.selectedDoc.y = Math.round(value * 100) / 100);
}
set shapeWid(value) {
- this.selectedDoc && (this.selectedDoc._width = Number(value));
+ this.selectedDoc && (this.selectedDoc._width = Math.round(value * 100) / 100);
}
set shapeHgt(value) {
- this.selectedDoc && (this.selectedDoc._height = Number(value));
+ this.selectedDoc && (this.selectedDoc._height = Math.round(value * 100) / 100);
}
@computed get hgtInput() {
return this.inputBoxDuo(
'hgt',
this.shapeHgt,
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeHgt = val), 'set height'),
+ undoable((val: string) => !isNaN(Number(val)) && (this.shapeHgt = +val), 'set height'),
'H:',
'wid',
this.shapeWid,
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeWid = val), 'set width'),
+ undoable((val: string) => !isNaN(Number(val)) && (this.shapeWid = +val), 'set width'),
'W:'
);
}
@@ -823,11 +823,11 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
return this.inputBoxDuo(
'Xps',
this.shapeXps,
- undoable((val: string) => val !== '0' && !isNaN(Number(val)) && (this.shapeXps = val), 'set x coord'),
+ undoable((val: string) => val !== '0' && !isNaN(Number(val)) && (this.shapeXps = +val), 'set x coord'),
'X:',
'Yps',
this.shapeYps,
- undoable((val: string) => val !== '0' && !isNaN(Number(val)) && (this.shapeYps = val), 'set y coord'),
+ undoable((val: string) => val !== '0' && !isNaN(Number(val)) && (this.shapeYps = +val), 'set y coord'),
'Y:'
);
}
@@ -1067,11 +1067,31 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
);
}
- getNumber = (label: string, unit: string, min: number, max: number, number: number, setNumber: any) => {
+ _sliderBatch: UndoManager.Batch | undefined;
+ setFinalNumber = () => {
+ this._sliderBatch?.end();
+ };
+ getNumber = (label: string, unit: string, min: number, max: number, number: number, setNumber: any, autorange?: number, autorangeMinVal?: number) => {
return (
- <div>
+ <div key={label + this.selectedDoc?.title}>
<NumberInput formLabel={label} formLabelPlacement={'left'} type={Type.SEC} unit={unit} fillWidth color={this.color} number={number} setNumber={setNumber} min={min} max={max} />
- <Slider multithumb={false} color={this.color} size={Size.XSMALL} min={min} max={max} unit={unit} number={number} setNumber={setNumber} fillWidth />
+ <Slider
+ key={label}
+ onPointerDown={e => (this._sliderBatch = UndoManager.StartBatch('slider ' + label))}
+ multithumb={false}
+ color={this.color}
+ size={Size.XSMALL}
+ min={min}
+ max={max}
+ autorangeMinVal={autorangeMinVal}
+ autorange={autorange}
+ number={number}
+ unit={unit}
+ decimals={1}
+ setFinalNumber={this.setFinalNumber}
+ setNumber={setNumber}
+ fillWidth
+ />
</div>
);
};
@@ -1080,80 +1100,40 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
return (
<div className="transform-editor">
{this.isInk ? this.controlPointsButton : null}
- {this.getNumber(
- 'Height',
- ' px',
- 0,
- 1000,
- Number(this.shapeHgt),
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeHgt = val), 'set height')
- )}
- {this.getNumber(
- 'Width',
- ' px',
- 0,
- 1000,
- Number(this.shapeWid),
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeWid = val), 'set width')
- )}
- {this.getNumber(
- 'X', //'X Coordinate',
- ' px',
- -2000,
- 2000,
- Number(this.shapeXps),
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeXps = val), 'set x coord')
- )}
- {this.getNumber(
- 'Y', //'Y Coordinate',
- ' px',
- -2000,
- 2000,
- Number(this.shapeYps),
- undoable((val: string) => !isNaN(Number(val)) && (this.shapeYps = val), 'set y coord')
- )}
+ {this.getNumber('Width', ' px', 0, Math.max(1000, this.shapeWid), this.shapeWid, (val: number) => !isNaN(val) && (this.shapeWid = val), 1000, 1)}
+ {this.getNumber('Height', ' px', 0, Math.max(1000, this.shapeHgt), this.shapeHgt, (val: number) => !isNaN(val) && (this.shapeHgt = val), 1000, 1)}
+ {this.getNumber('X', ' px', this.shapeXps - 500, this.shapeXps + 500, this.shapeXps, (val: number) => !isNaN(val) && (this.shapeXps = val), 1000)}
+ {this.getNumber('Y', ' px', this.shapeYps - 500, this.shapeYps + 500, this.shapeYps, (val: number) => !isNaN(val) && (this.shapeYps = val), 1000)}
</div>
);
}
@computed get optionsSubMenu() {
return (
- <PropertiesSection
- title="Options"
- content={<PropertiesButtons />}
- inSection={this.inOptions}
- isOpen={this.openOptions}
- setInSection={bool => (this.inOptions = bool)}
- setIsOpen={bool => (this.openOptions = bool)}
- onDoubleClick={this.CloseAll}
- />
+ <PropertiesSection title="Options" inSection={this.inOptions} isOpen={this.openOptions} setInSection={bool => (this.inOptions = bool)} setIsOpen={bool => (this.openOptions = bool)} onDoubleClick={this.CloseAll}>
+ <PropertiesButtons />
+ </PropertiesSection>
);
}
@computed get sharingSubMenu() {
return (
- <PropertiesSection
- title="Sharing & Permissions"
- content={
- <>
- {/* <div className="propertiesView-buttonContainer"> */}
- <div className="propertiesView-acls-checkbox">
- Layout Permissions
- <Checkbox color="primary" onChange={action(() => (this.layoutDocAcls = !this.layoutDocAcls))} checked={this.layoutDocAcls} />
- </div>
- {/* <Tooltip title={<><div className="dash-tooltip">{"Re-distribute sharing settings"}</div></>}>
- <button onPointerDown={() => SharingManager.Instance.distributeOverCollection(this.selectedDoc!)}>
- <FontAwesomeIcon icon="redo-alt" size="1x" />
- </button>
+ <PropertiesSection title="Sharing and Permissions" isOpen={this.openSharing} setIsOpen={bool => (this.openSharing = bool)} onDoubleClick={() => this.CloseAll()}>
+ <>
+ {/* <div className="propertiesView-buttonContainer"> */}
+ <div className="propertiesView-acls-checkbox">
+ Layout Permissions
+ <Checkbox color="primary" onChange={action(() => (this.layoutDocAcls = !this.layoutDocAcls))} checked={this.layoutDocAcls} />
+ </div>
+ {/* <Tooltip title={<><div className="dash-tooltip">{"Re-distribute sharing settings"}</div></>}>
+ <button onPointerDown={() => SharingManager.Instance.distributeOverCollection(this.selectedDoc!)}>
+ <FontAwesomeIcon icon="redo-alt" size="1x" />
+ </button>
</Tooltip> */}
- {/* </div> */}
- {this.sharingTable}
- </>
- }
- isOpen={this.openSharing}
- setIsOpen={bool => (this.openSharing = bool)}
- onDoubleClick={() => this.CloseAll()}
- />
+ {/* </div> */}
+ {this.sharingTable}
+ </>
+ </PropertiesSection>
);
}
@@ -1183,17 +1163,11 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
@computed get filtersSubMenu() {
return (
- <PropertiesSection
- title="Filters"
- content={
- <div className="propertiesView-content filters" style={{ position: 'relative', height: 'auto' }}>
- <FilterPanel rootDoc={this.selectedDoc ?? Doc.ActiveDashboard!} />
- </div>
- }
- isOpen={this.openFilters}
- setIsOpen={bool => (this.openFilters = bool)}
- onDoubleClick={() => this.CloseAll()}
- />
+ <PropertiesSection title="Filters" isOpen={this.openFilters} setIsOpen={bool => (this.openFilters = bool)} onDoubleClick={() => this.CloseAll()}>
+ <div className="propertiesView-content filters" style={{ position: 'relative', height: 'auto' }}>
+ <FilterPanel rootDoc={this.selectedDoc ?? Doc.ActiveDashboard!} />
+ </div>
+ </PropertiesSection>
);
}
@@ -1202,36 +1176,46 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
return (
<>
- <PropertiesSection title="Appearance" content={this.isInk ? this.appearanceEditor : null} isOpen={this.openAppearance} setIsOpen={bool => (this.openAppearance = bool)} onDoubleClick={() => this.CloseAll()} />
- <PropertiesSection title="Transform" content={this.transformEditor} isOpen={this.openTransform} setIsOpen={bool => (this.openTransform = bool)} onDoubleClick={() => this.CloseAll()} />
+ <PropertiesSection title="Appearance" isOpen={this.openAppearance} setIsOpen={bool => (this.openAppearance = bool)} onDoubleClick={() => this.CloseAll()}>
+ {this.isInk ? this.appearanceEditor : null}
+ </PropertiesSection>
+ <PropertiesSection title="Transform" isOpen={this.openTransform} setIsOpen={bool => (this.openTransform = bool)} onDoubleClick={() => this.CloseAll()}>
+ {this.transformEditor}
+ </PropertiesSection>
</>
);
}
@computed get fieldsSubMenu() {
return (
- <PropertiesSection
- title="Fields & Tags"
- content={<div className="propertiesView-content fields">{Doc.noviceMode ? this.noviceFields : this.expandedField}</div>}
- isOpen={this.openFields}
- setIsOpen={bool => (this.openFields = bool)}
- onDoubleClick={() => this.CloseAll()}
- />
+ <PropertiesSection title="Fields & Tags" isOpen={this.openFields} setIsOpen={bool => (this.openFields = bool)} onDoubleClick={() => this.CloseAll()}>
+ <div className="propertiesView-content fields">{Doc.noviceMode ? this.noviceFields : this.expandedField}</div>
+ </PropertiesSection>
);
}
@computed get contextsSubMenu() {
return (
- <PropertiesSection title="Other Contexts" content={this.contextCount > 0 ? this.contexts : 'There are no other contexts.'} isOpen={this.openContexts} setIsOpen={bool => (this.openContexts = bool)} onDoubleClick={() => this.CloseAll()} />
+ <PropertiesSection title="Other Contexts" isOpen={this.openContexts} setIsOpen={bool => (this.openContexts = bool)} onDoubleClick={() => this.CloseAll()}>
+ {this.contextCount > 0 ? this.contexts : 'There are no other contexts.'}
+ </PropertiesSection>
);
}
@computed get linksSubMenu() {
- return <PropertiesSection title="Linked To" content={this.linkCount > 0 ? this.links : 'There are no current links.'} isOpen={this.openLinks} setIsOpen={bool => (this.openLinks = bool)} onDoubleClick={this.CloseAll} />;
+ return (
+ <PropertiesSection title="Linked To" isOpen={this.openLinks} setIsOpen={bool => (this.openLinks = bool)} onDoubleClick={this.CloseAll}>
+ {this.linkCount > 0 ? this.links : 'There are no current links.'}
+ </PropertiesSection>
+ );
}
@computed get layoutSubMenu() {
- return <PropertiesSection title="Layout" content={this.layoutPreview} isOpen={this.openLayout} setIsOpen={bool => (this.openLayout = bool)} onDoubleClick={this.CloseAll} />;
+ return (
+ <PropertiesSection title="Layout" isOpen={this.openLayout} setIsOpen={bool => (this.openLayout = bool)} onDoubleClick={this.CloseAll}>
+ {this.layoutPreview}
+ </PropertiesSection>
+ );
}
@computed get description() {
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index ae9977d7a..da93a1b13 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -764,10 +764,10 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
!options && cm.addItem({ description: 'Options...', subitems: optionItems, icon: 'compass' });
onClicks.push({ description: this.onClickHandler ? 'Remove Click Behavior' : 'Follow Link', event: () => this.toggleFollowLink(false, false), icon: 'link' });
- onClicks.push({ description: 'Edit onClick Script', event: () => UndoManager.RunInBatch(() => DocUtils.makeCustomViewClicked(this.props.Document, undefined, 'onClick'), 'edit onClick'), icon: 'terminal' });
+ !Doc.noviceMode && onClicks.push({ description: 'Edit onClick Script', event: () => UndoManager.RunInBatch(() => DocUtils.makeCustomViewClicked(this.props.Document, undefined, 'onClick'), 'edit onClick'), icon: 'terminal' });
!existingOnClick && cm.addItem({ description: 'OnClick...', noexpand: true, subitems: onClicks, icon: 'mouse-pointer' });
} else if (LinkManager.Links(this.Document).length) {
- onClicks.push({ description: 'Select on Click', event: () => this.noOnClick(), icon: 'link' });
+ onClicks.push({ description: 'Restore On Click default', event: () => this.noOnClick(), icon: 'link' });
onClicks.push({ description: 'Follow Link on Click', event: () => this.followLinkOnClick(), icon: 'link' });
!existingOnClick && cm.addItem({ description: 'OnClick...', subitems: onClicks, icon: 'mouse-pointer' });
}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 6fdde4b6b..42cc14f9c 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -666,7 +666,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
addStyleSheetRule(FormattedTextBox._userStyleSheet, 'UM-remote', { background: 'yellow' });
}
if (highlights.includes('My Text')) {
- addStyleSheetRule(FormattedTextBox._userStyleSheet, 'UM-' + Doc.CurrentUserEmail.replace('.', '').replace('@', ''), { background: 'moccasin' });
+ addStyleSheetRule(FormattedTextBox._userStyleSheet, 'UM-' + Doc.CurrentUserEmail.replace(/\./g, '').replace(/@/g, ''), { background: 'moccasin' });
}
if (highlights.includes('Todo Items')) {
addStyleSheetRule(FormattedTextBox._userStyleSheet, 'UT-todo', { outline: 'black solid 1px' });
@@ -862,7 +862,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
event: () => (this.layoutDoc._layout_enableAltContentUI = !this.layoutDoc._layout_enableAltContentUI),
icon: !this.Document._layout_enableAltContentUI ? 'eye-slash' : 'eye',
});
- uicontrols.push({ description: 'Show Highlights...', noexpand: true, subitems: highlighting, icon: 'hand-point-right' });
+ !Doc.noviceMode && uicontrols.push({ description: 'Show Highlights...', noexpand: true, subitems: highlighting, icon: 'hand-point-right' });
!Doc.noviceMode &&
uicontrols.push({
description: 'Broadcast Message',
@@ -2117,7 +2117,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
onPointerDown={this.onPointerDown}
onDoubleClick={this.onDoubleClick}>
<div
- className={`formattedTextBox-outer`}
+ className="formattedTextBox-outer"
ref={this._scrollRef}
style={{
width: this.props.dontSelectOnLoad ? '100%' : `calc(100% - ${this.layout_sidebarWidthPercent})`,
@@ -2138,9 +2138,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
/>
</div>
{this.noSidebar || this.props.dontSelectOnLoad || !this.SidebarShown || this.layout_sidebarWidthPercent === '0%' ? null : this.sidebarCollection}
- {this.noSidebar || this.Document._layout_noSidebar || this.props.dontSelectOnLoad || this.Document._createDocOnCR ? null : this.sidebarHandle}
+ {this.noSidebar || this.Document._layout_noSidebar || this.props.dontSelectOnLoad || this.Document._createDocOnCR || this.layoutDoc._chromeHidden ? null : this.sidebarHandle}
{this.audioHandle}
- {this.layoutDoc._layout_enableAltContentUI ? this.overlayAlternateIcon : null}
+ {this.layoutDoc._layout_enableAltContentUI && !this.layoutDoc._chromeHidden ? this.overlayAlternateIcon : null}
</div>
</div>
);
diff --git a/src/client/views/nodes/formattedText/marks_rts.ts b/src/client/views/nodes/formattedText/marks_rts.ts
index 7e17008bb..6f07588b3 100644
--- a/src/client/views/nodes/formattedText/marks_rts.ts
+++ b/src/client/views/nodes/formattedText/marks_rts.ts
@@ -348,7 +348,7 @@ export const marks: { [index: string]: MarkSpec } = {
excludes: 'user_mark',
group: 'inline',
toDOM(node: any) {
- const uid = node.attrs.userid.replace('.', '').replace('@', '');
+ const uid = node.attrs.userid.replace(/\./g, '').replace(/@/g, '');
const min = Math.round(node.attrs.modified / 60);
const hr = Math.round(min / 60);
const day = Math.round(hr / 60 / 24);
diff --git a/src/fields/DocSymbols.ts b/src/fields/DocSymbols.ts
index bb974ee74..df74cc9fe 100644
--- a/src/fields/DocSymbols.ts
+++ b/src/fields/DocSymbols.ts
@@ -25,4 +25,4 @@ export const Initializing = Symbol('DocInitializing');
export const ForceServerWrite = Symbol('DocForceServerWrite');
export const CachedUpdates = Symbol('DocCachedUpdates');
-export const DashVersion = 'v0.5.99';
+export const DashVersion = 'v0.6.00';