things are sort of working with selection??

1 files changed, 3 insertions, 138 deletions

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index c6e8553fb..4c4a223cc 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { observer } from 'mobx-react';
 import { observable, action, runInAction } from 'mobx';
 import "./SearchBox.scss";
-import { faSearch, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote, faMusic, faLink, faChartBar, faGlobeAsia, faBan } from '@fortawesome/free-solid-svg-icons';
+import { faSearch, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote, faMusic, faLink, faChartBar, faGlobeAsia, faBan, faThList } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { library } from '@fortawesome/fontawesome-svg-core';
 import * as rp from 'request-promise';
@@ -23,142 +23,6 @@ import { findDOMNode } from 'react-dom';
 import { ToggleBar } from './ToggleBar';
 import { IconBar } from './IconBar';
 
-// import * as anime from '../../../node_modules/@types';
-// const anime = require('lib/anime.js');
-// import anime from 'animejs/lib/anime.es';
-// import anime = require ('lib/anime.min.js');
-// import Anime from 'react-anime';
-
-// library.add(faSearch);
-// library.add(faObjectGroup);
-// library.add(faImage);
-// library.add(faStickyNote);
-// library.add(faFilePdf);
-// library.add(faFilm);
-// library.add(faMusic);
-// library.add(faLink);
-// library.add(faChartBar);
-// library.add(faGlobeAsia);
-// library.add(faBan);
-
-// export interface IconBarProps {
-//     updateIcon(newIcons: string[]): void;
-//     getIcons(): string[];
-// }
-
-// @observer
-// export class IconBar extends React.Component<IconBarProps> {
-
-//     @observable newIcons: string[] = [];
-
-//     //changes colors of buttons on click - not sure if this is the best method (it probably isn't)
-//     //but i spent a ton of time on it and this is the only thing i could get to work
-//     componentDidMount = () => {
-
-//         let buttons = document.querySelectorAll<HTMLDivElement>(".type-icon").forEach(node =>
-//             node.addEventListener('click', function () {
-//                 if (this.style.backgroundColor === "rgb(194, 194, 197)") {
-//                     this.style.backgroundColor = "#121721";
-//                 }
-//                 else {
-//                     this.style.backgroundColor = "#c2c2c5"
-//                 }
-//             })
-//         );
-
-//     }
-
-//     onClick = (value: string) => {
-//         let oldIcons = this.props.getIcons()
-//         if (value === DocTypes.NONE) {
-//             this.newIcons = [value];
-//             //if its none, change the color of all the other circles
-//             document.querySelectorAll<HTMLDivElement>(".type-icon").forEach(node => {
-//                 if (node.id === "none") {
-//                     node.style.backgroundColor = "#c2c2c5";
-//                 }
-//                 else {
-//                     node.style.backgroundColor = "#121721";
-//                 }
-//             }
-//             );
-//         }
-//         else {
-//             //turns "none" button off
-//             let noneDoc = document.getElementById(DocTypes.NONE)
-//             if (noneDoc) {
-//                 noneDoc.style.backgroundColor = "#121721";
-//             }
-//             if (oldIcons.includes(value)) {
-//                 this.newIcons = _.remove(oldIcons, value);
-//                 if (this.newIcons.length === 0) {
-//                     this.newIcons = [DocTypes.NONE];
-//                 }
-//             }
-//             else {
-//                 this.newIcons = oldIcons;
-//                 if (this.newIcons.length === 1 && this.newIcons[0] === DocTypes.NONE) {
-//                     this.newIcons = [value]
-//                 }
-//                 else { this.newIcons.push(value); }
-//             }
-//         }
-//         this.props.updateIcon(this.newIcons)
-
-//     }
-
-//     render() {
-
-//         return (
-//             <div>
-//                 <div className="icon-bar">
-//                     <div className="type-icon" id="none"
-//                         onClick={() => { this.onClick(DocTypes.NONE) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: -2 }} icon={faBan} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.PDF) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 0 }} icon={faFilePdf} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.HIST) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 1 }} icon={faChartBar} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.COL) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 2 }} icon={faObjectGroup} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.IMG) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 3 }} icon={faImage} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.VID) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 4 }} icon={faFilm} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.WEB) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 5 }} icon={faGlobeAsia} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.LINK) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 6 }} icon={faLink} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.AUDIO) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 7 }} icon={faMusic} />
-//                     </div>
-//                     <div className="type-icon"
-//                         onClick={() => { this.onClick(DocTypes.TEXT) }}>
-//                         <FontAwesomeIcon className="fontawesome-icon" style={{ order: 8 }} icon={faStickyNote} />
-//                     </div>
-//                 </div>
-//             </div>
-//         )
-//     }
-// }
-
-
 
 @observer
 export class SearchBox extends React.Component {
@@ -168,6 +32,7 @@ export class SearchBox extends React.Component {
     @observable private _open: boolean = false;
     @observable private _resultsOpen: boolean = false;
     @observable private _results: Doc[] = [];
+    @observable forceReRender: boolean = false;
 
     @action.bound
     onChange(e: React.ChangeEvent<HTMLInputElement>) {
@@ -365,7 +230,7 @@ export class SearchBox extends React.Component {
                                 <ToggleBar optionOne={"Include Any Keywords"} optionTwo={"Include All Keywords"} changeStatus={this.handleWordQueryChange} />
                             </div>
                             <div className="type-of-node">
-                               <IconBar updateIcon={this.updateIcon} getIcons={this.getIcons} />
+                               <IconBar updateIcon={this.updateIcon} getIcons={this.getIcons}/>
                             </div>
                             <div className="filter-collection">
                                 temp for filtering by collection