diff options
| -rw-r--r-- | src/client/views/PropertiesView.tsx | 51 |
1 files changed, 27 insertions, 24 deletions
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 6b208f25e..89a355ae3 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -43,7 +43,7 @@ import { ImageField, VideoField, WebField } from '../../fields/URLField'; import { FaFileVideo } from 'react-icons/fa'; //* as Icons from "react-icons/fa"; // import { IconButton } from 'browndash-components'; import { IconBase } from 'react-icons'; -import { MdOutlineMedicalServices } from 'react-icons/md'; +import { MdOutlineAddShoppingCart, MdOutlineMedicalServices } from 'react-icons/md'; import { createPromiseCapability } from 'pdfjs-dist'; const higflyout = require('@hig/flyout'); export const { anchorPoints } = higflyout; @@ -115,9 +115,6 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @observable inOptions: boolean = false; @observable _controlButton: boolean = false; - - @observable allClose: boolean = false; - componentDidMount() { this.selectedDocListenerDisposer?.(); // this.selectedDocListenerDisposer = autorun(() => this.openFilters && this.selectedDoc && this.checkFilterDoc()); @@ -1055,7 +1052,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get optionsSubMenu() { return ( <div className="propertiesView-settings" onPointerEnter={action(() => (this.inOptions = true))} onPointerLeave={action(() => (this.inOptions = false))}> - <div className="propertiesView-settings-title" onPointerDown={action(() => (this.openOptions = !this.openOptions))} style={{ backgroundColor: this.openOptions ? 'black' : '' }}> + <div className="propertiesView-settings-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, + this.openFields = false, this.openSharing = false, this.openFilters = false, this.openLayout = false))} + onClick={action(() => (this.openOptions = !this.openOptions))} style={{ backgroundColor: this.openOptions ? 'black' : '' }}> Options <div className="propertiesView-settings-title-icon"> <FontAwesomeIcon icon={this.openOptions ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1073,7 +1072,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get sharingSubMenu() { return ( <div className="propertiesView-sharing"> - <div className="propertiesView-sharing-title" onPointerDown={action(() => (this.openSharing = !this.openSharing))} style={{ backgroundColor: this.openSharing ? 'black' : '' }}> + <div className="propertiesView-sharing-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, + this.openOptions = false, this.openFields = false, this.openFilters = false, this.openLayout))} + onClick={action(() => (this.openSharing = !this.openSharing))} style={{ backgroundColor: this.openSharing ? 'black' : '' }}> Sharing {'&'} Permissions <div className="propertiesView-sharing-title-icon"> <FontAwesomeIcon icon={this.openSharing ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1128,7 +1129,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get filtersSubMenu() { return ( <div className="propertiesView-filters"> - <div className="propertiesView-filters-title" onPointerDown={action(() => (this.openFilters = !this.openFilters))} style={{ backgroundColor: this.openFilters ? 'black' : '' }}> + <div className="propertiesView-filters-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, + this.openOptions = false, this.openFields = false, this.openSharing = false, this.openLayout = false))} + onClick={action(() => (this.openFilters = !this.openFilters))} style={{ backgroundColor: this.openFilters ? 'black' : '' }}> Filters <div className="propertiesView-filters-title-icon"> <FontAwesomeIcon icon={this.openFilters ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1159,7 +1162,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { )} <div className="propertiesView-transform"> - <div className="propertiesView-transform-title" onPointerDown={action(() => (this.openTransform = !this.openTransform))} style={{ backgroundColor: this.openTransform ? 'black' : '' }}> + <div className="propertiesView-transform-title" onClick={action(() => (this.openTransform = !this.openTransform))} onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openOptions = false, + this.openFields = false, this.openSharing = false, this.openFilters = false, this.openLayout = false, this.openTransform = true))} + style={{ backgroundColor: this.openTransform ? 'black' : '' }}> Transform <div className="propertiesView-transform-title-icon"> <FontAwesomeIcon icon={this.openTransform ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1174,7 +1179,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get fieldsSubMenu() { return ( <div className="propertiesView-fields"> - <div className="propertiesView-fields-title" onPointerDown={action(() => (this.openFields = !this.openFields))} style={{ backgroundColor: this.openFields ? 'black' : '' }}> + <div className="propertiesView-fields-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, + this.openOptions = false, this.openSharing = false, this.openFilters = false, this.openLayout = false))} + onClick={action(() => (this.openFields = !this.openFields))} style={{ backgroundColor: this.openFields ? 'black' : '' }}> Fields {'&'} Tags <div className="propertiesView-fields-title-icon"> <FontAwesomeIcon icon={this.openFields ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1194,7 +1201,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get contextsSubMenu() { return ( <div className="propertiesView-contexts"> - <div className="propertiesView-contexts-title" onPointerDown={action(() => (this.openContexts = !this.openContexts))} style={{ backgroundColor: this.openContexts ? 'black' : '' }}> + <div className="propertiesView-contexts-title" onDoubleClick={action(() => (this.openLinks = false, this.openTransform = false, this.openOptions = false, this.openFields = false, + this.openSharing = false, this.openFilters = false, this.openLayout = false ))} + onClick ={action(() => (this.openContexts = !this.openContexts))} style={{ backgroundColor: this.openContexts ? 'black' : '' }}> Other Contexts <div className="propertiesView-contexts-title-icon"> <FontAwesomeIcon icon={this.openContexts ? 'caret-down' : 'caret-right'} size="lg" color="white" /> @@ -1205,30 +1214,22 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { ); } + @computed get linksSubMenu() { + var isDouble: boolean = false; -// create observable with current property -// if everyother one is closed, set allClsoe = true -// on double click close all except current -// if everything is closed on double clikc then open everythigng - -// if everythign is closed except current property ==> double click = open all -// else ==> double click = close except current property - @computed get linksSubMenu() { - // onPointerDown={action(() => (this.openLinks = !this.openLinks))} - //(this.openContexts = false, this.openOptions = false, this.openTransform = false))} onClick={action(() => (this.openLinks = !this.openLinks)) - //this.allClose == false ? (this.openContexts = false , this.allClose = true ): (this.openContexts = true, this.allClose = false) return ( <div className="propertiesView-contexts"> - <div className="propertiesView-contexts-title" style={{ backgroundColor: this.openLinks ? 'black' : '' }}> + <div className="propertiesView-contexts-title" onClick={action(() => (this.openLinks = !this.openLinks))} onDoubleClick={action(() => (this.openContexts = false, this.openOptions = false, this.openTransform = false, + this.openFields = false, this.openSharing = false, this.openLayout = false, this.openFilters = false, this.openLinks = false ))} + style={{ backgroundColor: this.openLinks ? 'black' : '' }}> Linked To <div className="propertiesView-contexts-title-icon"> <FontAwesomeIcon icon={this.openLinks ? 'caret-down' : 'caret-right'} size="lg" color="white" /> </div> </div> {!this.openLinks ? null : this.linkCount > 0 ? <div className="propertiesView-contexts-content">{this.links}</div> : <div className="propertiesView-contexts-content">There are no current links.</div>} - {/* {!this.openLinks ? null : <div className="propertiesView-contexts-content">{this.links}</div>} */} </div> ); } @@ -1236,7 +1237,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @computed get layoutSubMenu() { return ( <div className="propertiesView-layout"> - <div className="propertiesView-layout-title" onPointerDown={action(() => (this.openLayout = !this.openLayout))} style={{ backgroundColor: this.openLayout ? 'black' : '' }}> + <div className="propertiesView-layout-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, + this.openOptions = false, this.openFields = false, this.openSharing = false, this.openFilters = false ))} + onClick={action(() => (this.openLayout = !this.openLayout))} style={{ backgroundColor: this.openLayout ? 'black' : '' }}> Layout <div className="propertiesView-layout-title-icon"> <FontAwesomeIcon icon={this.openLayout ? 'caret-down' : 'caret-right'} size="lg" color="white" /> |