From 6f1fa5e8211518cbb6ebff5cb6849101e36983ab Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Mon, 1 Feb 2021 18:40:01 -0500
Subject: filters changes

---
 src/client/views/nodes/FilterBox.scss | 11 +++++-----
 src/client/views/nodes/FilterBox.tsx  | 41 +++++++++++++++++++++++++++++++----
 2 files changed, 43 insertions(+), 9 deletions(-)

(limited to 'src/client/views/nodes')

diff --git a/src/client/views/nodes/FilterBox.scss b/src/client/views/nodes/FilterBox.scss
index 144f161bc..4b4dfa8a4 100644
--- a/src/client/views/nodes/FilterBox.scss
+++ b/src/client/views/nodes/FilterBox.scss
@@ -27,11 +27,11 @@
     }
 }
 
-.filterBox-bottom {
-    // position: fixed;
-    // bottom: 0;
-    // width: 100%;
-}
+// .filterBox-bottom {
+    //     // position: fixed;
+    //     // bottom: 0;
+    //     // width: 100%;
+    // }
 
 
 .filterBox-saveBookmark {
@@ -44,6 +44,7 @@
     margin: 8px;
     display: flex;
     font-size: 11px;
+    cursor: pointer;
 
     &:hover {
         background-color: white;
diff --git a/src/client/views/nodes/FilterBox.tsx b/src/client/views/nodes/FilterBox.tsx
index 63455e3d1..b06bfa8c3 100644
--- a/src/client/views/nodes/FilterBox.tsx
+++ b/src/client/views/nodes/FilterBox.tsx
@@ -33,12 +33,16 @@ const FilterBoxDocument = makeInterface(documentSchema);
 
 @observer
 export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDocument>(FilterBoxDocument) {
+    constructor(props: Readonly<FieldViewProps>) {
+        super(props);
+    }
     public static LayoutString(fieldKey: string) { return FieldView.LayoutString(FilterBox, fieldKey); }
 
     public _filterBoolean = "AND";
     public _filterScope = "Current Dashboard";
     public _filterSelected = false;
     public _filterMatch = "matched";
+    private myFiltersRef = React.createRef<HTMLDivElement>();
 
     @computed get allDocs() {
         const allDocs = new Set<Doc>();
@@ -103,7 +107,7 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
      * Responds to clicking the check box in the flyout menu
      */
     facetClick = (facetHeader: string) => {
-        const targetDoc = SelectionManager.Views()[0].Document; // CollectionDockingView.Instance.props.Document;
+        const targetDoc = CollectionDockingView.Instance.props.Document; //SelectionManager.Views()[0].Document; 
         const found = this.activeAttributes.findIndex(doc => doc.title === facetHeader);
         if (found !== -1) {
             (this.dataDoc[this.props.fieldKey] as List<Doc>).splice(found, 1);
@@ -193,6 +197,10 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
         console.log(this._filterMatch);
     }
 
+    @computed get yPos() {
+        return this.myFiltersRef.current?.getBoundingClientRect();
+    }
+
 
     @action
     changeSelected = (e: any) => {
@@ -206,6 +214,12 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
         console.log(this._filterSelected);
     }
 
+    saveFilter = () => {
+        Doc.AddDocToList(Doc.UserDoc(), "savedFilters", this.props.Document);
+        console.log("saved filter");
+        console.log(Doc.UserDoc().savedFilters);
+    }
+
     render() {
         const facetCollection = this.props.Document;
         // const flyout = <div className="filterBox-flyout" style={{ width: `100%` }} onWheel={e => e.stopPropagation()}>
@@ -220,6 +234,16 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
 
         // const options = this._allFacets.filter(facet => !attributes.some(attribute => attribute.title === facet)).map(facet => ({ value: facet, label: facet }));
         const options = this._allFacets.map(facet => ({ value: facet, label: facet }));
+        // console.log(this.props.Document);
+        // console.log(Doc.UserDoc().currentFilter);
+        console.log(this.yPos);
+        console.log(this.myFiltersRef.current?.getBoundingClientRect());
+
+        const flyout = <>
+            <div className="nothing for now" onWheel={e => e.stopPropagation()}>
+                testing flyout
+            </div>
+        </>;
 
         return this.props.dontRegisterView ? (null) : <div className="filterBox-treeView" style={{ width: "100%" }}>
 
@@ -320,18 +344,27 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
 
                 <div style={{ display: "flex" }}>
                     <div className="filterBox-saveWrapper">
-                        <div className="filterBox-saveBookmark">
+                        <div className="filterBox-saveBookmark"
+                            onPointerDown={this.saveFilter}
+                        >
                             <FontAwesomeIcon className="filterBox-saveBookmark-icon" icon={"save"} size={"sm"} />
                             <div>SAVE</div>
                         </div>
                     </div>
                     <div className="filterBox-saveWrapper">
-                        <div className="filterBox-saveBookmark">
+                        <div className="filterBox-saveBookmark" ref={this.myFiltersRef}>
                             <FontAwesomeIcon className="filterBox-saveBookmark-icon" icon={"bookmark"} size={"sm"} />
-                            <div>MY FILTERS</div>
+                            <Flyout className="myFilters-flyout" anchorPoint={anchorPoints.TOP} content={flyout}>
+                                <div>MY FILTERS</div>
+                            </Flyout>
                         </div>
                     </div>
                 </div>
+                <div
+                    style={{ width: 200, height: 200, backgroundColor: "black", color: "white" }}
+                >
+                    floot floot
+                </div>
             </div>
         </div>;
     }
-- 
cgit v1.2.3-70-g09d2