diff options
| -rw-r--r-- | src/client/views/PropertiesView.tsx | 45 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionTreeView.tsx | 5 | ||||
| -rw-r--r-- | src/client/views/nodes/FilterBox.scss | 9 | ||||
| -rw-r--r-- | src/client/views/nodes/FilterBox.tsx | 4 |
4 files changed, 51 insertions, 12 deletions
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 6e33b5c2f..a8b65c114 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -11,7 +11,7 @@ import { InkField } from "../../fields/InkField"; import { ComputedField } from "../../fields/ScriptField"; import { Cast, NumCast, StrCast } from "../../fields/Types"; import { denormalizeEmail, GetEffectiveAcl, SharingPermissions } from "../../fields/util"; -import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse } from "../../Utils"; +import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../Utils"; import { DocumentType } from "../documents/DocumentTypes"; import { DocumentManager } from "../util/DocumentManager"; import { SelectionManager } from "../util/SelectionManager"; @@ -29,6 +29,7 @@ import { PropertiesButtons } from "./PropertiesButtons"; import { PropertiesDocContextSelector } from "./PropertiesDocContextSelector"; import "./PropertiesView.scss"; import { DefaultStyleProvider } from "./StyleProvider"; +import { FilterBox } from "./nodes/FilterBox"; const higflyout = require("@hig/flyout"); export const { anchorPoints } = higflyout; export const Flyout = higflyout.default; @@ -67,6 +68,8 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { @observable openContexts: boolean = true; @observable openAppearance: boolean = true; @observable openTransform: boolean = true; + @observable openFilters: boolean = true; + // @observable selectedUser: string = ""; // @observable addButtonPressed: boolean = false; @observable layoutDocAcls: boolean = false; @@ -510,8 +513,6 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { } } - - @computed get controlPointsButton() { const formatInstance = InkStrokeProperties.Instance; @@ -907,6 +908,44 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { </div>} </div> + <div className="propertiesView-settings"> + <div className="propertiesView-settings-title" + onPointerDown={action(() => this.openFilters = !this.openFilters)} + style={{ backgroundColor: this.openFilters ? "black" : "" }}> + Filters + <div className="propertiesView-settings-title-icon"> + <FontAwesomeIcon icon={this.openFilters ? "caret-down" : "caret-right"} size="lg" color="white" /> + </div> + </div> + {!this.openFilters ? (null) : + <div className="propertiesView-settings-content"> + <DocumentView + Document={Doc.UserDoc().myFilter as any as Doc} + DataDoc={undefined} + addDocument={undefined} + addDocTab={returnFalse} + pinToPres={emptyFunction} + rootSelected={returnTrue} + removeDocument={returnFalse} + ScreenToLocalTransform={this.getTransform} + PanelWidth={this.docWidth} + PanelHeight={this.docHeight} + renderDepth={0} + scriptContext={CollectionDockingView.Instance.props.Document} + focus={emptyFunction} + styleProvider={DefaultStyleProvider} + parentActive={returnTrue} + whenActiveChanged={emptyFunction} + bringToFront={emptyFunction} + docFilters={returnEmptyFilter} + docRangeFilters={returnEmptyFilter} + searchFilterDocs={returnEmptyDoclist} + ContainingCollectionView={undefined} + ContainingCollectionDoc={undefined} + /> + </div>} + </div> + {!this.isInk ? (null) : <div className="propertiesView-appearance"> <div className="propertiesView-appearance-title" diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index d1e0a0f02..b9ad1680a 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -35,7 +35,8 @@ export type collectionTreeViewProps = { }; @observer -export class CollectionTreeView extends CollectionSubView<Document, Partial<collectionTreeViewProps>>(Document) { +export class + CollectionTreeView extends CollectionSubView<Document, Partial<collectionTreeViewProps>>(Document) { private treedropDisposer?: DragManager.DragDropDisposer; private _isChildActive = false; private _mainEle?: HTMLDivElement; @@ -212,7 +213,7 @@ export class CollectionTreeView extends CollectionSubView<Document, Partial<coll render() { TraceMobx(); if (!(this.doc instanceof Doc)) return (null); - const background = this.props.treeViewHideTitle && this.props.treeViewHideHeaderFields ? "#D3D3D3" : this.props.styleProvider?.(this.doc, this.props, StyleProp.BackgroundColor); + const background = this.props.treeViewHideTitle && this.props.treeViewHideHeaderFields ? "#9F9F9F" : this.props.styleProvider?.(this.doc, this.props, StyleProp.BackgroundColor); const paddingX = `${NumCast(this.doc._xPadding, 15)}px`; const paddingTop = `${NumCast(this.doc._yPadding, 20)}px`; const pointerEvents = !this.props.active() && !SnappingManager.GetIsDragging() && !this._isChildActive ? "none" : undefined; diff --git a/src/client/views/nodes/FilterBox.scss b/src/client/views/nodes/FilterBox.scss index d19fc07d3..8ebc7820a 100644 --- a/src/client/views/nodes/FilterBox.scss +++ b/src/client/views/nodes/FilterBox.scss @@ -28,9 +28,9 @@ } .filterBox-bottom { - position: fixed; - bottom: 0; - width: 100%; + // position: fixed; + // bottom: 0; + // width: 100%; } @@ -147,9 +147,8 @@ position: absolute; right: 0; top: 0; - border-left: solid 1px; z-index: 1; - background-color: #D3D3D3; + background-color: #9F9F9F; .filterBox-addfacet { display: inline-block; diff --git a/src/client/views/nodes/FilterBox.tsx b/src/client/views/nodes/FilterBox.tsx index d81fd9fe7..cea1e6742 100644 --- a/src/client/views/nodes/FilterBox.tsx +++ b/src/client/views/nodes/FilterBox.tsx @@ -210,13 +210,13 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc return this.props.dontRegisterView ? (null) : <div className="filterBox-treeView" style={{ width: "100%" }}> {/* <div className="filterBox-top"> */} - <div className="filter-bookmark"> + {/* <div className="filter-bookmark"> <FontAwesomeIcon className="filter-bookmark-icon" icon={"bookmark"} size={"lg"} /> </div> <div className="filterBox-title"> <span className="filterBox-span">Choose Filters</span> - </div> + </div> */} <div className="filterBox-select-bool"> <select className="filterBox-selection" onChange={e => this.changeBool(e)}> |