diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/util/CurrentUserUtils.ts | 34 | ||||
| -rw-r--r-- | src/client/views/MainView.tsx | 1 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionDockingView.scss | 15 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionDockingView.tsx | 4 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionMenu.tsx | 32 | ||||
| -rw-r--r-- | src/client/views/collections/ParentDocumentSelector.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/PropertiesView.tsx | 54 |
7 files changed, 82 insertions, 60 deletions
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index ffe29fddc..a99d9451b 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -512,19 +512,18 @@ export class CurrentUserUtils { static setupMenuPanel(doc: Doc) { if (doc.menuStack === undefined) { - const buttons = CurrentUserUtils.menuBtnDescriptions(); - const menuBtns = buttons.map(({ title, icon, click }) => Docs.Create.FontIconDocument({ - icon, - iconShape: "square", - title, - _backgroundColor: "black", - stayInCollection: true, - childDropAction: "same", - _width: 60, - _height: 60, - onDoubleClick: ScriptField.MakeScript('console.log("hi")', { scriptContext: "any" }), - onClick: ScriptField.MakeScript(click, { scriptContext: "any" }), - })); + const menuBtns = CurrentUserUtils.menuBtnDescriptions().map(({ title, icon, click }) => + Docs.Create.FontIconDocument({ + icon, + iconShape: "square", + title, + _backgroundColor: "black", + stayInCollection: true, + childDropAction: "same", + _width: 60, + _height: 60, + onClick: ScriptField.MakeScript(click, { scriptContext: "any" }), + })); const userDoc = menuBtns[menuBtns.length - 1]; userDoc.target = doc; userDoc.hidden = ComputedField.MakeFunction("self.target.noviceMode"); @@ -538,6 +537,15 @@ export class CurrentUserUtils { _yPadding: 0, _xMargin: 0, _autoHeight: false, _width: 60, _columnWidth: 60, lockedPosition: true, _chromeStatus: "disabled", })); } + // this resets all sidebar buttons to being deactivated + PromiseValue(Cast(doc.menuStack, Doc)).then(stack => { + stack && PromiseValue(stack.data).then(btns => { + DocListCastAsync(btns).then(bts => bts?.forEach(btn => { + btn.color = "white"; + btn._backgroundColor = ""; + })); + }) + }); return doc.menuStack as Doc; } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index d17b0bd32..09980ce97 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -445,7 +445,6 @@ export class MainView extends React.Component { } @computed get menuPanel() { - setTimeout(() => DocListCast((Doc.UserDoc().menuStack as Doc).data).forEach(action(doc => { doc.color = "white"; doc._backgroundColor = ""; })), 0); return <div className="mainView-menuPanel"> <DocumentView Document={Doc.UserDoc().menuStack as Doc} diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss index 4ec1c51cf..6ebd5103b 100644 --- a/src/client/views/collections/CollectionDockingView.scss +++ b/src/client/views/collections/CollectionDockingView.scss @@ -52,6 +52,20 @@ .lm_header .lm_tab { padding-right: 20px; + margin-top: -1px; + border-bottom: 1px black; + .collectionDockingView-gear { + display: none; + } +} + +.lm_header .lm_tab.lm_active { + padding-right: 20px; + margin-top: 1px; + border-bottom: unset; + .collectionDockingView-gear { + display: inline-block; + } } .lm_popout { @@ -84,7 +98,6 @@ padding-left: 5px; height: 15px; width: 18px; - display: inline-block; margin: auto; } diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index 95b68a17d..533c8bffe 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -770,6 +770,10 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> { private onActiveContentItemChanged() { if (this.props.glContainer.tab) { this._isActive = this.props.glContainer.tab.isActive; + setTimeout(() => { + const dv = this._document && DocumentManager.Instance.getFirstDocumentView(this._document); + dv && SelectionManager.SelectDoc(dv, false); + }); !this._isActive && this._document && Doc.UnBrushDoc(this._document); // bcz: bad -- trying to simulate a pointer leave event when a new tab is opened up on top of an existing one. } } diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index 8c4118e89..a7d2c07fa 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -186,12 +186,11 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp }; @computed get _freeform_commands() { return Doc.UserDoc().noviceMode ? [this._viewCommand, this._saveFilterCommand] : [this._viewCommand, this._saveFilterCommand, this._contentCommand, this._templateCommand, this._narrativeCommand]; } - - _stacking_commands = [this._contentCommand, this._templateCommand]; - _masonry_commands = [this._contentCommand, this._templateCommand]; - _schema_commands = [this._templateCommand, this._narrativeCommand]; - _doc_commands = [this._openLinkInCommand, this._onClickCommand]; - _tree_commands = []; + @computed get _stacking_commands() { return Doc.UserDoc().noviceMode ? undefined : [this._contentCommand, this._templateCommand]; } + @computed get _masonry_commands() { return Doc.UserDoc().noviceMode ? undefined : [this._contentCommand, this._templateCommand]; } + @computed get _schema_commands() { return Doc.UserDoc().noviceMode ? undefined : [this._templateCommand, this._narrativeCommand]; } + @computed get _doc_commands() { return Doc.UserDoc().noviceMode ? undefined : [this._openLinkInCommand, this._onClickCommand]; } + @computed get _tree_commands() { return undefined; } private get _buttonizableCommands() { switch (this.props.type) { default: return this._doc_commands; @@ -211,7 +210,7 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp @observable private _currentKey: string = ""; componentDidMount = action(() => { - this._currentKey = this._currentKey || (this._buttonizableCommands.length ? this._buttonizableCommands[0]?.title : ""); + this._currentKey = this._currentKey || (this._buttonizableCommands?.length ? this._buttonizableCommands[0]?.title : ""); }); @undoBatch @@ -261,7 +260,7 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp protected drop(e: Event, de: DragManager.DropEvent): boolean { const docDragData = de.complete.docDragData; if (docDragData?.draggedDocuments.length) { - this._buttonizableCommands.filter(c => c.title === this._currentKey).map(c => c.immediate(docDragData.draggedDocuments || [])); + this._buttonizableCommands?.filter(c => c.title === this._currentKey).map(c => c.immediate(docDragData.draggedDocuments || [])); e.stopPropagation(); } return true; @@ -283,12 +282,12 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp } dragCommandDown = (e: React.PointerEvent) => { setupMoveUpEvents(this, e, (e, down, delta) => { - this._buttonizableCommands.filter(c => c.title === this._currentKey).map(c => + this._buttonizableCommands?.filter(c => c.title === this._currentKey).map(c => DragManager.StartButtonDrag([this._commandRef.current!], c.script, c.title, { target: this.document }, c.params, c.initialize, e.clientX, e.clientY)); return true; }, emptyFunction, () => { - this._buttonizableCommands.filter(c => c.title === this._currentKey).map(c => c.immediate([])); + this._buttonizableCommands?.filter(c => c.title === this._currentKey).map(c => c.immediate([])); }); } @@ -302,7 +301,7 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp <select className="collectionViewBaseChrome-cmdPicker" onPointerDown={stopPropagation} onChange={this.commandChanged} value={this._currentKey}> <option className="collectionViewBaseChrome-viewOption" onPointerDown={stopPropagation} key={"empty"} value={""} /> - {this._buttonizableCommands.map(cmd => + {this._buttonizableCommands?.map(cmd => <option className="collectionViewBaseChrome-viewOption" onPointerDown={stopPropagation} key={cmd.title} value={cmd.title}>{cmd.title}</option> )} </select> @@ -344,9 +343,11 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp } else { return undefined; } } @computed get selectedDoc() { return this.selectedDocumentView?.rootDoc; } - @computed get isText() { + @computed get notACollection() { if (this.selectedDoc) { - return this.selectedDoc[Doc.LayoutFieldKey(this.selectedDoc)] instanceof RichTextField; + const layoutField = Doc.LayoutField(this.selectedDoc); + return this.props.type === CollectionViewType.Docking || + typeof (layoutField) === "string" && !layoutField?.includes("CollectionView"); } else return false; } @@ -356,9 +357,8 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp <div className="collectionMenu-cont" > <div className="collectionMenu"> <div className="collectionViewBaseChrome"> - {this.props.type === CollectionViewType.Invalid || - this.props.type === CollectionViewType.Docking || this.isText ? (null) : this.viewModes} - {this.props.type === CollectionViewType.Docking || (this.isText && Doc.UserDoc().noviceMode) ? (null) : this.templateChrome} + {this.notACollection || this.props.type === CollectionViewType.Invalid ? (null) : this.viewModes} + {!this._buttonizableCommands ? (null) : this.templateChrome} {Doc.UserDoc().noviceMode ? (null) : <Tooltip title={<div className="dash-tooltip">filter documents to show</div>} placement="bottom"> <div className="collectionViewBaseChrome-viewSpecs" style={{ display: "grid" }}> diff --git a/src/client/views/collections/ParentDocumentSelector.tsx b/src/client/views/collections/ParentDocumentSelector.tsx index 532dd6abc..4c8cac3ed 100644 --- a/src/client/views/collections/ParentDocumentSelector.tsx +++ b/src/client/views/collections/ParentDocumentSelector.tsx @@ -129,7 +129,7 @@ export class DockingViewButtonSelector extends React.Component<{ views: () => Do this.props.views()[0]?.select(false); }} className="buttonSelector"> <Flyout anchorPoint={anchorPoints.LEFT_TOP} content={this.flyout} stylesheet={this.customStylesheet}> - <FontAwesomeIcon icon={"cog"} size={"sm"} /> + <FontAwesomeIcon icon={"arrows-alt"} size={"sm"} /> </Flyout> </span>; } diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 0168c825f..f5e0cd077 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -711,12 +711,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @undoBatch @action changeDash = () => { - const dash = this.dashdStk; - if (dash === "2") { - this.dashdStk = "0"; - } else { - this.dashdStk = "2"; - } + this.dashdStk = this.dashdStk === "2" ? "0" : "2"; } @computed get appearanceEditor() { @@ -769,9 +764,10 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <FontAwesomeIcon icon={this.openActions ? "caret-down" : "caret-right"} size="lg" color="white" /> </div> </div> - {this.openActions ? <div className="propertiesView-settings-content"> - <PropertiesButtons /> - </div> : null} + {!this.openActions ? (null) : + <div className="propertiesView-settings-content"> + <PropertiesButtons /> + </div>} </div> <div className="propertiesView-sharing"> <div className="propertiesView-sharing-title" @@ -782,24 +778,27 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <FontAwesomeIcon icon={this.openSharing ? "caret-down" : "caret-right"} size="lg" color="white" /> </div> </div> - {this.openSharing ? <div className="propertiesView-sharing-content"> - {this.sharingTable} - </div> : null} + {!this.openSharing ? (null) : + <div className="propertiesView-sharing-content"> + {this.sharingTable} + </div>} </div> - {this.isInk ? <div className="propertiesView-appearance"> - <div className="propertiesView-appearance-title" - onPointerDown={() => runInAction(() => { this.openAppearance = !this.openAppearance; })} - style={{ backgroundColor: this.openAppearance ? "black" : "" }}> - Appearance - <div className="propertiesView-appearance-title-icon"> - <FontAwesomeIcon icon={this.openAppearance ? "caret-down" : "caret-right"} size="lg" color="white" /> + {!this.isInk ? (null) : + <div className="propertiesView-appearance"> + <div className="propertiesView-appearance-title" + onPointerDown={() => runInAction(() => { this.openAppearance = !this.openAppearance; })} + style={{ backgroundColor: this.openAppearance ? "black" : "" }}> + Appearance + <div className="propertiesView-appearance-title-icon"> + <FontAwesomeIcon icon={this.openAppearance ? "caret-down" : "caret-right"} size="lg" color="white" /> + </div> </div> - </div> - {this.openAppearance ? <div className="propertiesView-appearance-content"> - {this.appearanceEditor} - </div> : null} - </div> : null} + {!this.openAppearance ? (null) : + <div className="propertiesView-appearance-content"> + {this.appearanceEditor} + </div>} + </div>} {this.isInk ? <div className="propertiesView-transform"> <div className="propertiesView-transform-title" @@ -830,18 +829,17 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { {this.fieldsCheckbox} <div className="propertiesView-fields-checkbox-text">Layout</div> </div> : null} - {this.openFields ? + {!this.openFields ? (null) : <div className="propertiesView-fields-content"> {novice ? this.noviceFields : this.expandedField} - </div> : null} + </div>} </div> <div className="propertiesView-layout"> <div className="propertiesView-layout-title" onPointerDown={() => runInAction(() => { this.openLayout = !this.openLayout; })} style={{ backgroundColor: this.openLayout ? "black" : "" }}> Layout - <div className="propertiesView-layout-title-icon" - onPointerDown={() => runInAction(() => { this.openLayout = !this.openLayout; })}> + <div className="propertiesView-layout-title-icon" onPointerDown={() => runInAction(() => { this.openLayout = !this.openLayout; })}> <FontAwesomeIcon icon={this.openLayout ? "caret-down" : "caret-right"} size="lg" color="white" /> </div> </div> |