pretty sure things are working - committing before i start cleaning things up

1 files changed, 10 insertions, 140 deletions

diff --git a/src/client/views/search/IconButton.tsx b/src/client/views/search/IconButton.tsx
index 71f1b7f0f..cdde10fa5 100644
--- a/src/client/views/search/IconButton.tsx
+++ b/src/client/views/search/IconButton.tsx
@@ -11,6 +11,8 @@ import '../globalCssVariables.scss';
 import * as _ from "lodash";
 import { IconBar } from './IconBar';
 import { props } from 'bluebird';
+import { SearchBox } from './SearchBox';
+import { Search } from '../../../server/Search';
 
 library.add(faSearch);
 library.add(faObjectGroup);
@@ -26,10 +28,10 @@ library.add(faBan);
 
 interface IconButtonProps {
     type: string;
-    getList(): string[];
-    updateList(list: string[]): void;
+    // getList(): string[];
+    // updateList(list: string[]): void;
     // updateSelectedList(type: string): void;
-    active: boolean;
+    // active: boolean;
     // getActiveType(): string;
     // changeActiveType(value: string): void;
 }
@@ -37,7 +39,7 @@ interface IconButtonProps {
 @observer
 export class IconButton extends React.Component<IconButtonProps>{
 
-    @observable isSelected: boolean = this.props.active;
+    @observable isSelected: boolean = SearchBox.Instance.getIcons().indexOf(this.props.type) !== -1;
     // @observable removeType = false;
     @observable hover = false;
     // @observable isRemoved: boolean = (this.props.getActiveType() === "remove");
@@ -53,6 +55,8 @@ export class IconButton extends React.Component<IconButtonProps>{
     }
 
     componentDidMount = () => {
+        // console.log(this.props.type, this.isSelected)
+        
         this._resetReaction = reaction(
             () => IconBar.Instance.ResetClicked,
             () => {
@@ -81,36 +85,6 @@ export class IconButton extends React.Component<IconButtonProps>{
         )
     }
 
-    // @action
-    // downKeyHandler = (e: KeyboardEvent) => {
-    //     if (e.key !== "Control") return;
-    //     this.removeType = true;
-    //     e.preventDefault();
-    //     e.stopPropagation();
-    //     document.body.style.cursor = "not-allowed";
-    // }
-
-    // @action
-    // upKeyHandler = (e: KeyboardEvent) => {
-    //     e.preventDefault();
-    //     e.stopPropagation();
-    //     this.removeType = false;
-    //     document.body.style.cursor = "default";
-
-    // }
-
-    // componentWillMount() {
-    //     document.removeEventListener("keydown", this.downKeyHandler);
-    //     document.addEventListener("keydown", this.downKeyHandler);
-    //     document.removeEventListener("keyup", this.upKeyHandler);
-    //     document.addEventListener("keyup", this.upKeyHandler);
-    // }
-
-    // componentWillUnMount() {
-    //     document.removeEventListener("keyup", this.upKeyHandler);
-    //     document.removeEventListener("keydown", this.downKeyHandler);
-    // }
-
     @action.bound
     getIcon() {
         switch (this.props.type) {
@@ -139,25 +113,9 @@ export class IconButton extends React.Component<IconButtonProps>{
         }
     }
 
-    // public getType(): string {
-    //     return this.props.type;
-    // }
-
-    // public getIsSelected(): boolean {
-    //     return this.isSelected;
-    // }
-
-    // public getIsRemoved() {
-    //     return this.isRemoved;
-    // }
-
-    // public getIsAdded() {
-    //     return this.isAdded;
-    // }
-
     @action.bound
     onClick = () => {
-        let newList: string[] = this.props.getList();
+        let newList: string[] = SearchBox.Instance.getIcons();
 
         if(!this.isSelected){
             this.isSelected = true;
@@ -168,84 +126,14 @@ export class IconButton extends React.Component<IconButtonProps>{
             _.pull(newList, this.props.type)
         }
 
-        this.props.updateList(newList);
+        SearchBox.Instance.updateIcon(newList);
     }
 
-    // @action
-    // onClick2 = () => {
-    //     let newList: string[] = this.props.getList();
-
-    //     // if(this.removeType && this.props.getActiveType() !== "remove"){
-    //     //     this.props.changeActiveType("remove")
-    //     //     // console.log("resetting")
-    //     // }
-    //     // else if(!this.removeType && this.props.getActiveType() !== "add"){
-    //     //     this.props.changeActiveType("add");
-    //     //     // console.log("resetting")
-    //     // }
-
-    //     //if it's not already selected
-    //     if (!this.isSelected) {
-    //         this.isSelected = true;
-    //         console.log("changing")
-
-    //         //if actions pertain to removal
-    //         if (this.removeType) {
-    //             this.isAdded = false;
-    //             if (!this.isRemoved) {
-    //                 _.pull(newList, this.props.type);
-    //                 this.isRemoved = true;
-    //             }
-    //             else {
-    //                 newList.push(this.props.type);
-    //                 this.isRemoved = false;
-    //             }
-    //         }
-    //         // if actions pertain to adding
-    //         else {
-    //             this.isRemoved = false;
-    //             if (!this.isAdded) {
-    //                 if (newList.length === 9) {
-    //                     newList = [];
-    //                     newList.push(this.props.type)
-    //                 } else {
-    //                     newList.push(this.props.type);
-    //                 }
-    //                 this.isAdded = true;
-    //             }
-    //             else {
-    //                 _.pull(newList, this.props.type);
-    //                 this.isAdded = false;
-    //             }
-    //         }
-    //     }
-    //     //if it is selected already
-    //     else {
-    //         this.isSelected = false;
-    //         if (this.isAdded) {
-    //             this.isAdded = false;
-    //             _.pull(newList, this.props.type);
-    //         }
-    //         if (this.isRemoved) {
-    //             this.isRemoved = false;
-    //             newList.push(this.props.type)
-    //         }
-    //         this.props.changeActiveType("none")
-    //     }
-    //     this.props.updateList(newList)
-    //     console.log(this);
-    //     console.log(this.isAdded, this.isSelected)
-    // }
-
     selected = {
         opacity: 1,
         backgroundColor: "#c2c2c5" //$alt-accent
     }
 
-    // selectedRemoved = {
-    //     opacity: 0.2,
-    // }
-
     notSelected = {
         opacity: 0.6,
     }
@@ -255,20 +143,9 @@ export class IconButton extends React.Component<IconButtonProps>{
         backgroundColor: "rgb(178, 206, 248)" //$darker-alt-accent
     }
 
-    // hoverRemoveStyle = {
-    //     opacity: 0.2,
-    //     backgroundColor: "transparent",
-    // }
-
-    // banStyle = {
-    //     opacity: 1,
-    // }
-
     @action.bound
     public reset() {
         this.isSelected = false;
-        // this.isAdded = false;
-        // this.isRemoved = false;
     }
 
     @action.bound
@@ -320,17 +197,10 @@ export class IconButton extends React.Component<IconButtonProps>{
                 onMouseLeave={this.onMouseLeave}
                 onClick={this.onClick}>
                 <div className="type-icon" id={this.props.type + "-icon"}
-                    // style={this.hover ? this.removeType ? this.hoverRemoveStyle : this.hoverStyle :
-                    //     !this.isSelected ? this.notSelected :
-                    //         this.isAdded ? this.selectedAdded :
-                    //             this.isRemoved ? this.selectedRemoved : this.notSelected}
                     style = {this.hover ? this.hoverStyle : this.isSelected ? this.selected : this.notSelected}
                 >
                     {this.getFA()}
                 </div>
-                {/* <div className="ban-icon"
-                    style={this.hover ? (this.removeType ? this.banStyle : { opacity: 0 }) : (this.isSelected ? this.isRemoved ? this.banStyle : { opacity: 0 } : { opacity: 0 })}>
-                    <FontAwesomeIcon className="fontawesome-icon" icon={faBan} /></div> */}
                 <div className="filter-description">{this.props.type}</div>
             </div>
         );