From 70c7532c8a6472f61eedd4661a172d70bc50184e Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Sun, 30 Jun 2019 01:48:47 -0400
Subject: added drag off of context search results. add fit to contents for
 preview of collections in search.

---
 src/client/views/search/SearchBox.tsx | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index f53a4e34f..a2556133b 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -15,7 +15,6 @@ import { Id } from '../../../new_fields/FieldSymbols';
 import { SearchUtil } from '../../util/SearchUtil';
 import { RouteStore } from '../../../server/RouteStore';
 import { FilterBox } from './FilterBox';
-import { Pager } from './Pager';
 
 @observer
 export class SearchBox extends React.Component {
-- 
cgit v1.2.3-70-g09d2


From 9334c8d12df76df60eedcc093b986f42d1f7f67d Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Tue, 2 Jul 2019 14:03:36 -0400
Subject: Refactored some search stuff and fixed treeview flyout min X

---
 src/client/util/SearchUtil.ts                      | 28 ++++++++++++++++------
 src/client/views/MainView.tsx                      |  2 +-
 .../views/collections/ParentDocumentSelector.tsx   |  4 ++--
 src/client/views/search/SearchBox.tsx              | 15 +-----------
 src/client/views/search/SearchItem.tsx             |  4 ++--
 src/server/Search.ts                               |  8 +++----
 6 files changed, 31 insertions(+), 30 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/util/SearchUtil.ts b/src/client/util/SearchUtil.ts
index 27d27a3b8..ac2eb72e7 100644
--- a/src/client/util/SearchUtil.ts
+++ b/src/client/util/SearchUtil.ts
@@ -4,27 +4,41 @@ import { Doc } from '../../new_fields/Doc';
 import { Id } from '../../new_fields/FieldSymbols';
 
 export namespace SearchUtil {
-    export function Search(query: string, returnDocs: true): Promise<Doc[]>;
-    export function Search(query: string, returnDocs: false): Promise<string[]>;
+    export interface IdSearchResult {
+        ids: string[];
+        numFound: number;
+    }
+
+    export interface DocSearchResult {
+        docs: Doc[];
+        numFound: number;
+    }
+
+    export function Search(query: string, returnDocs: true): Promise<DocSearchResult>;
+    export function Search(query: string, returnDocs: false): Promise<IdSearchResult>;
     export async function Search(query: string, returnDocs: boolean) {
-        const ids = JSON.parse(await rp.get(DocServer.prepend("/search"), {
+        const result: IdSearchResult = JSON.parse(await rp.get(DocServer.prepend("/search"), {
             qs: { query }
         }));
         if (!returnDocs) {
-            return ids;
+            return result;
         }
+        const { ids, numFound } = result;
         const docMap = await DocServer.GetRefFields(ids);
-        return ids.map((id: string) => docMap[id]).filter((doc: any) => doc instanceof Doc);
+        const docs = ids.map((id: string) => docMap[id]).filter((doc: any) => doc instanceof Doc);
+        return { docs, numFound };
     }
 
     export async function GetAliasesOfDocument(doc: Doc): Promise<Doc[]> {
         const proto = await Doc.GetT(doc, "proto", Doc, true);
         const protoId = (proto || doc)[Id];
-        return Search(`proto_i:"${protoId}"`, true);
+        const result = await Search(`proto_i:"${protoId}"`, true);
+        return result.docs;
         // return Search(`{!join from=id to=proto_i}id:${protoId}`, true);
     }
 
     export async function GetViewsOfDocument(doc: Doc): Promise<Doc[]> {
-        return Search(`proto_i:"${doc[Id]}"`, true);
+        const results = await Search(`proto_i:"${doc[Id]}"`, true);
+        return results.docs;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 787e240b9..04ecc47cf 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -272,7 +272,7 @@ export class MainView extends React.Component {
     }
     @action
     onPointerMove = (e: PointerEvent) => {
-        this.flyoutWidth = e.clientX;
+        this.flyoutWidth = Math.max(e.clientX, 0);
     }
     @action
     onPointerUp = (e: PointerEvent) => {
diff --git a/src/client/views/collections/ParentDocumentSelector.tsx b/src/client/views/collections/ParentDocumentSelector.tsx
index b29a30069..c0f489cd8 100644
--- a/src/client/views/collections/ParentDocumentSelector.tsx
+++ b/src/client/views/collections/ParentDocumentSelector.tsx
@@ -23,9 +23,9 @@ export class SelectorContextMenu extends React.Component<SelectorProps> {
 
     async fetchDocuments() {
         let aliases = (await SearchUtil.GetAliasesOfDocument(this.props.Document)).filter(doc => doc !== this.props.Document);
-        const docs = await SearchUtil.Search(`data_l:"${this.props.Document[Id]}"`, true);
+        const { docs } = await SearchUtil.Search(`data_l:"${this.props.Document[Id]}"`, true);
         const map: Map<Doc, Doc> = new Map;
-        const allDocs = await Promise.all(aliases.map(doc => SearchUtil.Search(`data_l:"${doc[Id]}"`, true)));
+        const allDocs = await Promise.all(aliases.map(doc => SearchUtil.Search(`data_l:"${doc[Id]}"`, true).then(result => result.docs)));
         allDocs.forEach((docs, index) => docs.forEach(doc => map.set(doc, aliases[index])));
         docs.forEach(doc => map.delete(doc));
         runInAction(() => {
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index a2556133b..1f6835c26 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -102,20 +102,7 @@ export class SearchBox extends React.Component {
 
     @action
     getResults = async (query: string) => {
-        let response = await rp.get(DocServer.prepend('/search'), {
-            qs: {
-                query
-            }
-        });
-        let res: string[] = JSON.parse(response);
-        const fields = await DocServer.GetRefFields(res);
-        const docs: Doc[] = [];
-        for (const id of res) {
-            const field = fields[id];
-            if (field instanceof Doc) {
-                docs.push(field);
-            }
-        }
+        const { docs } = await SearchUtil.Search(query, true);
         return FilterBox.Instance.filterDocsByType(docs);
     }
 
diff --git a/src/client/views/search/SearchItem.tsx b/src/client/views/search/SearchItem.tsx
index f8a0c7b16..5a7bdd24d 100644
--- a/src/client/views/search/SearchItem.tsx
+++ b/src/client/views/search/SearchItem.tsx
@@ -48,9 +48,9 @@ export class SelectorContextMenu extends React.Component<SearchItemProps> {
 
     async fetchDocuments() {
         let aliases = (await SearchUtil.GetViewsOfDocument(this.props.doc)).filter(doc => doc !== this.props.doc);
-        const docs = await SearchUtil.Search(`data_l:"${this.props.doc[Id]}"`, true);
+        const { docs } = await SearchUtil.Search(`data_l:"${this.props.doc[Id]}"`, true);
         const map: Map<Doc, Doc> = new Map;
-        const allDocs = await Promise.all(aliases.map(doc => SearchUtil.Search(`data_l:"${doc[Id]}"`, true)));
+        const allDocs = await Promise.all(aliases.map(doc => SearchUtil.Search(`data_l:"${doc[Id]}"`, true).then(result => result.docs)));
         allDocs.forEach((docs, index) => docs.forEach(doc => map.set(doc, aliases[index])));
         docs.forEach(doc => map.delete(doc));
         runInAction(() => {
diff --git a/src/server/Search.ts b/src/server/Search.ts
index 2db2b242c..e2a74b737 100644
--- a/src/server/Search.ts
+++ b/src/server/Search.ts
@@ -27,11 +27,11 @@ export class Search {
                     start: start
                 }
             }));
-            const fields = searchResults.response.docs;
-            const ids = fields.map((field: any) => field.id);
-            return ids;
+            const { docs, numFound } = searchResults.response;
+            const ids = docs.map((field: any) => field.id);
+            return { ids, numFound };
         } catch {
-            return [];
+            return { ids: [], numFound: -1 };
         }
     }
 
-- 
cgit v1.2.3-70-g09d2


From c3d4b851d81d42256b972a6b8eaa9c9210232953 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sat, 6 Jul 2019 14:52:53 -0400
Subject: free cookies!

---
 src/client/util/SearchUtil.ts           |  8 ++--
 src/client/views/search/SearchBox.tsx   | 77 +++++++++++++++++++++++++++++----
 src/client/views/search/SearchItem.scss | 41 ++++++++++++------
 src/server/Search.ts                    |  5 ++-
 src/server/index.ts                     |  8 +++-
 5 files changed, 109 insertions(+), 30 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/util/SearchUtil.ts b/src/client/util/SearchUtil.ts
index 338628960..674eeb1a8 100644
--- a/src/client/util/SearchUtil.ts
+++ b/src/client/util/SearchUtil.ts
@@ -14,11 +14,11 @@ export namespace SearchUtil {
         numFound: number;
     }
 
-    export function Search(query: string, returnDocs: true): Promise<DocSearchResult>;
-    export function Search(query: string, returnDocs: false): Promise<IdSearchResult>;
-    export async function Search(query: string, returnDocs: boolean) {
+    export function Search(query: string, returnDocs: true, start?: number, count?: number): Promise<DocSearchResult>;
+    export function Search(query: string, returnDocs: false, start?: number, count?: number): Promise<IdSearchResult>;
+    export async function Search(query: string, returnDocs: boolean, start?: number, rows?: number) {
         const result: IdSearchResult = JSON.parse(await rp.get(DocServer.prepend("/search"), {
-            qs: { query }
+            qs: { query, start, rows }
         }));
         if (!returnDocs) {
             return result;
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 1f6835c26..327f9514a 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -26,6 +26,12 @@ export class SearchBox extends React.Component {
     @observable public _pageNum: number = 0;
     //temp
     @observable public _maxNum: number = 10;
+    @observable private _visibleElements: JSX.Element[] = [];
+    @observable private _scrollY: number = 0;
+
+    private _isSearch: ("search" | "placeholder" | undefined)[] = [];
+    private _currentIndex = 0;
+    private _numResults = 0;
 
     static Instance: SearchBox;
 
@@ -90,25 +96,35 @@ export class SearchBox extends React.Component {
         else {
             //gets json result into a list of documents that can be used
             //these are filtered by type
-            results = await this.getResults(query);
+            this._currentIndex = 0;
+            results = await this.getResults(query, 12);
         }
 
         runInAction(() => {
             this._resultsOpen = true;
             this._results = results;
             this._openNoResults = true;
+            this.resultsScrolled();
         });
     }
 
     @action
-    getResults = async (query: string) => {
-        const { docs } = await SearchUtil.Search(query, true);
-        return FilterBox.Instance.filterDocsByType(docs);
+    getResults = async (query: string, count: number) => {
+        let resDocs = [];
+        while (resDocs.length < count) {
+            const { docs, numFound } = await SearchUtil.Search(query, true, count === -1 ? undefined : this._currentIndex, count === -1 ? undefined : this._maxNum);
+            if (numFound !== this._numResults) {
+                this._numResults = numFound;
+            }
+            resDocs.push(...FilterBox.Instance.filterDocsByType(docs));
+            this._currentIndex += this._maxNum;
+        }
+        return resDocs;
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
-        const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString));
+        const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
         const docs = results.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
             if (isProto) {
@@ -166,6 +182,50 @@ export class SearchBox extends React.Component {
         this._results = [];
     }
 
+    resultsScrolled = async (e?: React.UIEvent<HTMLDivElement>) => {
+        let scrollY = e ? e.currentTarget.scrollTop : 0;
+        let buffer = 4;
+        let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
+        let endIndex = Math.ceil(Math.min(this._numResults - 1, startIndex + (560 / 70) + buffer));
+
+        runInAction(() => {
+            if (this._numResults === 0 && this._openNoResults) {
+                this._visibleElements = [<div className="no-result">No Search Results</div>];
+                return;
+            }
+            else if (this._visibleElements.length !== this._numResults) {
+                this._visibleElements = Array<JSX.Element>(this._numResults);
+                this._isSearch = Array<undefined>(this._numResults);
+            }
+        });
+
+        for (let i = 0; i < this._numResults; i++) {
+            if (i < startIndex || i > endIndex) {
+                if (this._isSearch[i] !== "placeholder") {
+                    this._isSearch[i] = "placeholder";
+                    runInAction(() => {
+                        this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
+                    });
+                }
+            }
+            else {
+                if (this._isSearch[i] !== "search") {
+                    let result: Doc | undefined = undefined;
+                    if (i >= this._results.length) {
+                        this._results.push(...(await this.getResults(this._searchString, 1)));
+                    }
+                    result = this._results[i];
+                    if (result) {
+                        runInAction(() => {
+                            this._visibleElements[i] = <SearchItem doc={result!} key={result![Id]} />;
+                        });
+                        this._isSearch[i] = "search";
+                    }
+                }
+            }
+        }
+    }
+
     render() {
         return (
             <div className="searchBox-container">
@@ -178,11 +238,12 @@ export class SearchBox extends React.Component {
                         style={{ width: this._resultsOpen ? "500px" : "100px" }} />
                     <button className="searchBox-barChild searchBox-filter" onClick={FilterBox.Instance.openFilter} onPointerDown={FilterBox.Instance.stopProp}>Filter</button>
                 </div>
-                <div className="searchBox-results" style={this._resultsOpen ? { display: "flex" } : { display: "none" }}>
-                    {(this._results.length !== 0) ? (
+                <div className="searchBox-results" onScroll={this.resultsScrolled} style={this._resultsOpen ? { display: "flex" } : { display: "none" }}>
+                    {/* {(this._results.length !== 0) ? (
                         this._results.map(result => <SearchItem doc={result} key={result[Id]} />)
                     ) :
-                        this._openNoResults ? (<div className="no-result">No Search Results</div>) : null}
+                        this._openNoResults ? (<div className="no-result">No Search Results</div>) : null} */}
+                    {this._visibleElements}
                 </div>
                 {/* <div style={this._results.length !== 0 ? { display: "flex" } : { display: "none" }}>
                     <Pager />
diff --git a/src/client/views/search/SearchItem.scss b/src/client/views/search/SearchItem.scss
index fa4c9cb38..c384e3bfc 100644
--- a/src/client/views/search/SearchItem.scss
+++ b/src/client/views/search/SearchItem.scss
@@ -86,21 +86,24 @@
                 .link-container.item:hover .link-extended {
                     opacity: 1;
                 }
-                
+
                 .icon-icons {
-                    width:50px
+                    width: 50px
                 }
+
                 .icon-live {
-                    width:175px;
+                    width: 175px;
                 }
 
-                .icon-icons, .icon-live {
-                    height:50px;
-                    margin:auto;
+                .icon-icons,
+                .icon-live {
+                    height: 50px;
+                    margin: auto;
                     overflow: hidden;
+
                     .search-type {
                         display: inline-block;
-                        width:100%;
+                        width: 100%;
                         position: absolute;
                         justify-content: center;
                         align-items: center;
@@ -112,10 +115,11 @@
                         overflow: hidden;
 
                         img {
-                            width:100% !important;
-                            height:auto !important;
+                            width: 100% !important;
+                            height: auto !important;
                         }
                     }
+
                     .search-type:hover+.search-label {
                         opacity: 1;
                     }
@@ -134,16 +138,18 @@
                 }
 
                 .icon-live:hover {
-                    height:175px;
+                    height: 175px;
+
                     .pdfBox-cont {
                         img {
-                            width:100% !important;
+                            width: 100% !important;
                         }
                     }
                 }
             }
+
             .search-info:hover {
-                width:60%; 
+                width: 60%;
             }
         }
     }
@@ -176,12 +182,19 @@
     }
 
 }
+
 .search-overview:hover {
     z-index: 1;
 }
+
+.searchBox-placeholder {
+    min-height: 70px;
+}
+
 .collection {
-    display:flex;
+    display: flex;
 }
+
 .collection-item {
-    width:35px;
+    width: 35px;
 }
\ No newline at end of file
diff --git a/src/server/Search.ts b/src/server/Search.ts
index e2a74b737..5a22f7da7 100644
--- a/src/server/Search.ts
+++ b/src/server/Search.ts
@@ -18,13 +18,14 @@ export class Search {
         }
     }
 
-    public async search(query: string, start: number = 0) {
+    public async search(query: string, start: number = 0, rows: number = 10) {
         try {
             const searchResults = JSON.parse(await rp.get(this.url + "dash/select", {
                 qs: {
                     q: query,
                     fl: "id",
-                    start: start
+                    start,
+                    rows,
                 }
             }));
             const { docs, numFound } = searchResults.response;
diff --git a/src/server/index.ts b/src/server/index.ts
index bf946fc9f..66fe3c990 100644
--- a/src/server/index.ts
+++ b/src/server/index.ts
@@ -143,8 +143,12 @@ app.get("/pull", (req, res) =>
 // GETTERS
 
 app.get("/search", async (req, res) => {
-    let query = req.query.query || "hello";
-    let results = await Search.Instance.search(query);
+    const { query, start, rows } = req.query;
+    if (query === undefined) {
+        res.send([]);
+        return;
+    }
+    let results = await Search.Instance.search(query, start, rows);
     res.send(results);
 });
 
-- 
cgit v1.2.3-70-g09d2


From 6cc2335bc6d318ec780bdaecfbad4e047a7b5ac9 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Mon, 8 Jul 2019 18:49:40 -0400
Subject: end of day 7/8

---
 src/client/views/pdf/PDFMenu.tsx      |  12 ++--
 src/client/views/search/FilterBox.tsx |   2 +-
 src/client/views/search/SearchBox.tsx | 115 +++++++++++++++++++++++-----------
 3 files changed, 86 insertions(+), 43 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/pdf/PDFMenu.tsx b/src/client/views/pdf/PDFMenu.tsx
index f93b2e59f..b979a9932 100644
--- a/src/client/views/pdf/PDFMenu.tsx
+++ b/src/client/views/pdf/PDFMenu.tsx
@@ -242,24 +242,24 @@ export default class PDFMenu extends React.Component {
 
     render() {
         let buttons = this.Status === "pdf" || this.Status === "snippet" ? [
-            <button className="pdfMenu-button" title="Click to Highlight" onClick={this.highlightClicked} key="1"
+            <button key="1" className="pdfMenu-button" title="Click to Highlight" onClick={this.highlightClicked} key="1"
                 style={this.Highlighting ? { backgroundColor: "#121212" } : {}}>
                 <FontAwesomeIcon icon="highlighter" size="lg" style={{ transition: "transform 0.1s", transform: this.Highlighting ? "" : "rotate(-45deg)" }} />
             </button>,
-            <button className="pdfMenu-button" title="Drag to Annotate" onPointerDown={this.pointerDown}><FontAwesomeIcon icon="comment-alt" size="lg" key="2" /></button>,
+            <button key="2" className="pdfMenu-button" title="Drag to Annotate" onPointerDown={this.pointerDown}><FontAwesomeIcon icon="comment-alt" size="lg" key="2" /></button>,
             this.Status === "snippet" ? <button className="pdfMenu-button" title="Drag to Snippetize Selection" onPointerDown={this.snippetStart} ref={this._snippetButton}><FontAwesomeIcon icon="cut" size="lg" /></button> : undefined,
-            <button className="pdfMenu-button" title="Pin Menu" onClick={this.togglePin} key="3"
+            <button key="3" className="pdfMenu-button" title="Pin Menu" onClick={this.togglePin} key="3"
                 style={this.Pinned ? { backgroundColor: "#121212" } : {}}>
                 <FontAwesomeIcon icon="thumbtack" size="lg" style={{ transition: "transform 0.1s", transform: this.Pinned ? "rotate(45deg)" : "" }} />
             </button>
         ] : [
-                <button className="pdfMenu-button" title="Delete Anchor" onPointerDown={this.deleteClicked}><FontAwesomeIcon icon="trash-alt" size="lg" key="1" /></button>,
-                <button className="pdfMenu-button" title="Pin to Presentation" onPointerDown={this.PinToPres}><FontAwesomeIcon icon="map-pin" size="lg" key="2" /></button>,
+                <button key="4" className="pdfMenu-button" title="Delete Anchor" onPointerDown={this.deleteClicked}><FontAwesomeIcon icon="trash-alt" size="lg" key="1" /></button>,
+                <button key="5" className="pdfMenu-button" title="Pin to Presentation" onPointerDown={this.PinToPres}><FontAwesomeIcon icon="map-pin" size="lg" key="2" /></button>,
                 <div className="pdfMenu-addTag" key="3">
                     <input onChange={this.keyChanged} placeholder="Key" style={{ gridColumn: 1 }} />
                     <input onChange={this.valueChanged} placeholder="Value" style={{ gridColumn: 3 }} />
                 </div>,
-                <button className="pdfMenu-button" title={`Add tag: ${this._keyValue} with value: ${this._valueValue}`} onPointerDown={this.addTag}><FontAwesomeIcon style={{ transition: "all .2s" }} color={this._added ? "#42f560" : "white"} icon="check" size="lg" key="4" /></button>,
+                <button key="6" className="pdfMenu-button" title={`Add tag: ${this._keyValue} with value: ${this._valueValue}`} onPointerDown={this.addTag}><FontAwesomeIcon style={{ transition: "all .2s" }} color={this._added ? "#42f560" : "white"} icon="check" size="lg" key="4" /></button>,
             ];
 
         return (
diff --git a/src/client/views/search/FilterBox.tsx b/src/client/views/search/FilterBox.tsx
index 23a1b31d8..4c74c0413 100644
--- a/src/client/views/search/FilterBox.tsx
+++ b/src/client/views/search/FilterBox.tsx
@@ -242,7 +242,7 @@ export class FilterBox extends React.Component {
         let finalDocs: Doc[] = [];
         docs.forEach(doc => {
             let layoutresult = Cast(doc.type, "string");
-            if (!layoutresult || this._icons.includes(layoutresult)) {
+            if (layoutresult && this._icons.includes(layoutresult)) {
                 finalDocs.push(doc);
             }
         });
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 327f9514a..430ca3b2e 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -15,6 +15,7 @@ import { Id } from '../../../new_fields/FieldSymbols';
 import { SearchUtil } from '../../util/SearchUtil';
 import { RouteStore } from '../../../server/RouteStore';
 import { FilterBox } from './FilterBox';
+import { start } from 'repl';
 
 @observer
 export class SearchBox extends React.Component {
@@ -31,7 +32,10 @@ export class SearchBox extends React.Component {
 
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _currentIndex = 0;
-    private _numResults = 0;
+    private _numTotalResults = 0;
+    private _numFilteredResults = 0;
+    private _startIndex = -1;
+    private _endIndex = -1;
 
     static Instance: SearchBox;
 
@@ -55,15 +59,16 @@ export class SearchBox extends React.Component {
     onChange(e: React.ChangeEvent<HTMLInputElement>) {
         this._searchString = e.target.value;
 
-        if (this._searchString === "") {
-            this._results = [];
-            this._openNoResults = false;
-        }
+        this._openNoResults = false;
+        this._results = [];
+        this._visibleElements = [];
+        this._currentIndex = 0;
+        this._numTotalResults = 0;
+        this._startIndex = -1;
+        this._endIndex = -1;
     }
 
-    enter = (e: React.KeyboardEvent) => {
-        if (e.key === "Enter") { this.submitSearch(); }
-    }
+    enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
 
     public static async convertDataUri(imageUri: string, returnedFilename: string) {
         try {
@@ -111,13 +116,30 @@ export class SearchBox extends React.Component {
     @action
     getResults = async (query: string, count: number) => {
         let resDocs = [];
+        // count is total number of documents to be shown (i believe)
+        console.log(`Count: ${count}`);
         while (resDocs.length < count) {
-            const { docs, numFound } = await SearchUtil.Search(query, true, count === -1 ? undefined : this._currentIndex, count === -1 ? undefined : this._maxNum);
-            if (numFound !== this._numResults) {
-                this._numResults = numFound;
+            let index = count === -1 ? undefined : this._currentIndex;
+            let num = count === -1 ? undefined : Math.min(this._numTotalResults - this._currentIndex + 1, this._maxNum);
+            // num found has to be the number of docs before filtering happens - this is the total num
+            const { docs, numFound } = await SearchUtil.Search(query, true, index, num);
+            // accounts for the fact that there may be fewer documents than the max that are returned
+            let filteredDocs = FilterBox.Instance.filterDocsByType(docs);
+            count = Math.min(numFound, count);
+            // uh what is going on here with the first part?
+            if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
+                console.log(`Total: ${numFound}`);
+                this._numTotalResults = numFound;
             }
-            resDocs.push(...FilterBox.Instance.filterDocsByType(docs));
-            this._currentIndex += this._maxNum;
+
+            // if (filteredDocs.length < docs.length) {
+            //     this._numResults -= docs.length - filteredDocs.length;
+            //     console.log(`New Total: ${this._numResults}`);
+            // }
+            resDocs.push(...filteredDocs);
+            this._currentIndex += docs.length;
+            console.log(`ResDocs: ${resDocs.length}`);
+            console.log(`CurrIndex: ${this._currentIndex}`);
         }
         return resDocs;
     }
@@ -171,7 +193,7 @@ export class SearchBox extends React.Component {
 
     @action.bound
     closeSearch = () => {
-        console.log("closing search");
+        console.log("closing search")
         FilterBox.Instance.closeFilter();
         this.closeResults();
     }
@@ -180,46 +202,67 @@ export class SearchBox extends React.Component {
     closeResults() {
         this._resultsOpen = false;
         this._results = [];
+        this._visibleElements = [];
+        this._currentIndex = 0;
+        this._numTotalResults = 0;
+        this._startIndex = -1;
+        this._endIndex = -1;
     }
 
+    @action
     resultsScrolled = async (e?: React.UIEvent<HTMLDivElement>) => {
         let scrollY = e ? e.currentTarget.scrollTop : 0;
         let buffer = 4;
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
-        let endIndex = Math.ceil(Math.min(this._numResults - 1, startIndex + (560 / 70) + buffer));
+        let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
 
-        runInAction(() => {
-            if (this._numResults === 0 && this._openNoResults) {
-                this._visibleElements = [<div className="no-result">No Search Results</div>];
-                return;
-            }
-            else if (this._visibleElements.length !== this._numResults) {
-                this._visibleElements = Array<JSX.Element>(this._numResults);
-                this._isSearch = Array<undefined>(this._numResults);
-            }
-        });
+        if (startIndex === this._startIndex && endIndex === this._endIndex) {
+            return;
+        }
+
+        console.log(`START: ${startIndex}`);
+        console.log(`END: ${endIndex}`);
+
+        this._startIndex = startIndex;
+        this._endIndex = endIndex;
+
+        if (this._numTotalResults === 0 && this._openNoResults) {
+            this._visibleElements = [<div className="no-result">No Search Results</div>];
+            return;
+        }
 
-        for (let i = 0; i < this._numResults; i++) {
+        else if (this._visibleElements.length !== this._numTotalResults) {
+            this._visibleElements = Array<JSX.Element>(this._numTotalResults);
+            this._isSearch = Array<undefined>(this._numTotalResults);
+        }
+
+        for (let i = 0; i < this._numTotalResults; i++) {
             if (i < startIndex || i > endIndex) {
                 if (this._isSearch[i] !== "placeholder") {
                     this._isSearch[i] = "placeholder";
-                    runInAction(() => {
-                        this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
-                    });
+                    this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
                 }
             }
             else {
                 if (this._isSearch[i] !== "search") {
                     let result: Doc | undefined = undefined;
                     if (i >= this._results.length) {
-                        this._results.push(...(await this.getResults(this._searchString, 1)));
-                    }
-                    result = this._results[i];
-                    if (result) {
+                        let results = await this.getResults(this._searchString, i - this._results.length)
                         runInAction(() => {
-                            this._visibleElements[i] = <SearchItem doc={result!} key={result![Id]} />;
-                        });
-                        this._isSearch[i] = "search";
+                            this._results.push(...results);
+                            result = this._results[i];
+                            if (result) {
+                                this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                                this._isSearch[i] = "search";
+                            }
+                        })
+                    }
+                    else {
+                        result = this._results[i];
+                        if (result) {
+                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                            this._isSearch[i] = "search";
+                        }
                     }
                 }
             }
-- 
cgit v1.2.3-70-g09d2


From 701509141f793d4c7335771ade8a7b1dae49985a Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Wed, 10 Jul 2019 16:14:13 -0400
Subject: bout to do something cray

---
 src/client/views/search/SearchBox.tsx | 137 ++++++++++++++++++++++++++++++----
 1 file changed, 121 insertions(+), 16 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 430ca3b2e..296d2ccc8 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { observer } from 'mobx-react';
-import { observable, action, runInAction } from 'mobx';
+import { observable, action, runInAction, flow } from 'mobx';
 import "./SearchBox.scss";
 import "./FilterBox.scss";
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@@ -33,9 +33,9 @@ export class SearchBox extends React.Component {
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _currentIndex = 0;
     private _numTotalResults = 0;
-    private _numFilteredResults = 0;
     private _startIndex = -1;
     private _endIndex = -1;
+    private _fetchedIndices: number[] = [0];
 
     static Instance: SearchBox;
 
@@ -43,6 +43,7 @@ export class SearchBox extends React.Component {
         super(props);
 
         SearchBox.Instance = this;
+        this.resultsScrolled = this.resultsScrolled.bind(this);
     }
 
     @action
@@ -123,10 +124,13 @@ export class SearchBox extends React.Component {
             let num = count === -1 ? undefined : Math.min(this._numTotalResults - this._currentIndex + 1, this._maxNum);
             // num found has to be the number of docs before filtering happens - this is the total num
             const { docs, numFound } = await SearchUtil.Search(query, true, index, num);
-            // accounts for the fact that there may be fewer documents than the max that are returned
+
             let filteredDocs = FilterBox.Instance.filterDocsByType(docs);
+
+            // accounts for the fact that there may be fewer documents than the max that are returned
             count = Math.min(numFound, count);
-            // uh what is going on here with the first part?
+
+            // happens at the beginning
             if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
                 console.log(`Total: ${numFound}`);
                 this._numTotalResults = numFound;
@@ -137,13 +141,104 @@ export class SearchBox extends React.Component {
             //     console.log(`New Total: ${this._numResults}`);
             // }
             resDocs.push(...filteredDocs);
+
             this._currentIndex += docs.length;
+
             console.log(`ResDocs: ${resDocs.length}`);
             console.log(`CurrIndex: ${this._currentIndex}`);
         }
+        console.log(this.getResults2(query, count, []));
         return resDocs;
     }
 
+    @action
+    getResults2 = async (query: string, count: number, docs?: Doc[]) => {
+        console.log("results 2")
+        let buffer = 4;
+        // let goalIndex = this._endIndex + count;
+        // let bottomBound = Math.floor(goalIndex / 10) * 10;
+        let tempIndex = this._currentIndex;
+        let goalNum = this._endIndex + buffer;
+        let resDocs: Doc[];
+
+        if (docs) {
+            resDocs = docs;
+        } else {
+            resDocs = [];
+        }
+
+        // let topBound = bottomBound - 10;
+        // let unfilteredDocs: Doc[];
+        // let unfilteredFound: number;
+        // means this has already been fetched
+        // if (this._fetchedIndices.includes(topBound)) {
+        //     return;
+        // }
+
+        let index = count <= 0 ? undefined : this._currentIndex;
+        if (index) {
+            let topBound = Math.ceil(index / 10) * 10;
+            if (this._fetchedIndices.includes(topBound)) {
+                return;
+            }
+            let startIndex = this._fetchedIndices[this._fetchedIndices.length - 1];
+            let endIndex = startIndex + 10;
+            this._fetchedIndices.push(endIndex);
+            console.log(this._fetchedIndices)
+            let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
+
+            prom.then((res: SearchUtil.DocSearchResult) => {
+                count = Math.min(res.numFound, count);
+                console.log(res.docs);
+                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+
+                if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
+                    this._numTotalResults = res.numFound;
+                }
+
+                resDocs.push(...filteredDocs);
+
+                tempIndex += res.docs.length;
+
+                if (filteredDocs.length <= count) {
+                    runInAction(() => {
+                        return this.getResults2(query, count - filteredDocs.length, resDocs);
+                    });
+                }
+                else {
+                    return resDocs;
+                }
+                console.log(tempIndex);
+                console.log(resDocs.length);
+            })
+
+        }
+        //this is the upper bound of the last 
+        // let index = this._fetchedIndices[this._fetchedIndices.length - 1];
+        // let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
+
+        // prom.then((res: SearchUtil.DocSearchResult) => {
+        //     // unfilteredDocs = res.docs;
+        //     // unfilteredFound = res.numFound;
+
+        //     count = Math.min(res.numFound, count);
+        //     let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+
+        //     if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
+        //         console.log(`Total: ${res.numFound}`);
+        //         this._numTotalResults = res.numFound;
+        //     }
+
+        //     resDocs.push(...filteredDocs);
+
+        //     this._currentIndex += res.docs.length;
+        // })
+
+        // console.log(prom);
+
+
+    }
+
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
         const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
@@ -209,8 +304,7 @@ export class SearchBox extends React.Component {
         this._endIndex = -1;
     }
 
-    @action
-    resultsScrolled = async (e?: React.UIEvent<HTMLDivElement>) => {
+    resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
         let scrollY = e ? e.currentTarget.scrollTop : 0;
         let buffer = 4;
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
@@ -222,6 +316,7 @@ export class SearchBox extends React.Component {
 
         console.log(`START: ${startIndex}`);
         console.log(`END: ${endIndex}`);
+        console.log("_________________________________________________________________________________________________________")
 
         this._startIndex = startIndex;
         this._endIndex = endIndex;
@@ -231,12 +326,18 @@ export class SearchBox extends React.Component {
             return;
         }
 
+        // only hit right at the beginning
+        // visibleElements is all of the elements (even the ones you can't see)
         else if (this._visibleElements.length !== this._numTotalResults) {
+            // undefined until a searchitem is put in there
             this._visibleElements = Array<JSX.Element>(this._numTotalResults);
+            // indicates if things are placeholders
             this._isSearch = Array<undefined>(this._numTotalResults);
         }
 
         for (let i = 0; i < this._numTotalResults; i++) {
+            //if the index is out of the window then put a placeholder in
+            //should ones that have already been found get set to placeholders?
             if (i < startIndex || i > endIndex) {
                 if (this._isSearch[i] !== "placeholder") {
                     this._isSearch[i] = "placeholder";
@@ -247,15 +348,19 @@ export class SearchBox extends React.Component {
                 if (this._isSearch[i] !== "search") {
                     let result: Doc | undefined = undefined;
                     if (i >= this._results.length) {
-                        let results = await this.getResults(this._searchString, i - this._results.length)
-                        runInAction(() => {
-                            this._results.push(...results);
-                            result = this._results[i];
-                            if (result) {
-                                this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
-                                this._isSearch[i] = "search";
-                            }
-                        })
+                        // _________________________________________________________________________________________________
+                        let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
+                        if (results.length !== 0) {
+                            runInAction(() => {
+                                this._results.push(...results);
+                                result = this._results[i];
+                                if (result) {
+                                    this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                                    this._isSearch[i] = "search";
+                                }
+                            });
+                        }
+                        // _________________________________________________________________________________________________
                     }
                     else {
                         result = this._results[i];
@@ -267,7 +372,7 @@ export class SearchBox extends React.Component {
                 }
             }
         }
-    }
+    });
 
     render() {
         return (
-- 
cgit v1.2.3-70-g09d2


From a2e762e4a85eca92401394afe7dbc03db5a5b473 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Wed, 10 Jul 2019 18:17:14 -0400
Subject: hate this

---
 src/client/views/search/SearchBox.tsx | 55 +++++++++++++++--------------------
 1 file changed, 23 insertions(+), 32 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 296d2ccc8..db6f69ccb 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -65,8 +65,8 @@ export class SearchBox extends React.Component {
         this._visibleElements = [];
         this._currentIndex = 0;
         this._numTotalResults = 0;
-        this._startIndex = -1;
-        this._endIndex = -1;
+        this._startIndex = 0;
+        this._endIndex = 12;
     }
 
     enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
@@ -144,28 +144,21 @@ export class SearchBox extends React.Component {
 
             this._currentIndex += docs.length;
 
-            console.log(`ResDocs: ${resDocs.length}`);
+            // console.log(`ResDocs: ${resDocs.length}`);
             console.log(`CurrIndex: ${this._currentIndex}`);
         }
-        console.log(this.getResults2(query, count, []));
+        // console.log(this.getResults2(query, count, []));
         return resDocs;
     }
 
     @action
-    getResults2 = async (query: string, count: number, docs?: Doc[]) => {
-        console.log("results 2")
-        let buffer = 4;
+    getResults2 = async (query: string, count: number, docs: Doc[]) => {
+        // let buffer = 4;
         // let goalIndex = this._endIndex + count;
         // let bottomBound = Math.floor(goalIndex / 10) * 10;
-        let tempIndex = this._currentIndex;
-        let goalNum = this._endIndex + buffer;
-        let resDocs: Doc[];
-
-        if (docs) {
-            resDocs = docs;
-        } else {
-            resDocs = [];
-        }
+        // let tempIndex = this._currentIndex;
+        // let goalNum = this._endIndex + buffer;
+        let resDocs: Doc[] = docs;
 
         // let topBound = bottomBound - 10;
         // let unfilteredDocs: Doc[];
@@ -176,10 +169,12 @@ export class SearchBox extends React.Component {
         // }
 
         let index = count <= 0 ? undefined : this._currentIndex;
+        // let index = this._currentIndex;
         if (index) {
             let topBound = Math.ceil(index / 10) * 10;
             if (this._fetchedIndices.includes(topBound)) {
-                return;
+                // console.log("returning NOTHING")
+                return resDocs;
             }
             let startIndex = this._fetchedIndices[this._fetchedIndices.length - 1];
             let endIndex = startIndex + 10;
@@ -198,21 +193,17 @@ export class SearchBox extends React.Component {
 
                 resDocs.push(...filteredDocs);
 
-                tempIndex += res.docs.length;
+                this._currentIndex += res.docs.length;
 
-                if (filteredDocs.length <= count) {
-                    runInAction(() => {
-                        return this.getResults2(query, count - filteredDocs.length, resDocs);
-                    });
-                }
-                else {
-                    return resDocs;
+                if (resDocs.length < count) {
+                    return this.getResults2(query, count - resDocs.length, resDocs);
+                    // resDocs = await this.getResults2(query, count - filteredDocs.length, resDocs);
                 }
-                console.log(tempIndex);
-                console.log(resDocs.length);
-            })
 
+                return resDocs;
+            })
         }
+        return resDocs;
         //this is the upper bound of the last 
         // let index = this._fetchedIndices[this._fetchedIndices.length - 1];
         // let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
@@ -300,8 +291,8 @@ export class SearchBox extends React.Component {
         this._visibleElements = [];
         this._currentIndex = 0;
         this._numTotalResults = 0;
-        this._startIndex = -1;
-        this._endIndex = -1;
+        this._startIndex = 0;
+        this._endIndex = 12;
     }
 
     resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
@@ -316,8 +307,6 @@ export class SearchBox extends React.Component {
 
         console.log(`START: ${startIndex}`);
         console.log(`END: ${endIndex}`);
-        console.log("_________________________________________________________________________________________________________")
-
         this._startIndex = startIndex;
         this._endIndex = endIndex;
 
@@ -350,6 +339,7 @@ export class SearchBox extends React.Component {
                     if (i >= this._results.length) {
                         // _________________________________________________________________________________________________
                         let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
+                        console.log(results)
                         if (results.length !== 0) {
                             runInAction(() => {
                                 this._results.push(...results);
@@ -372,6 +362,7 @@ export class SearchBox extends React.Component {
                 }
             }
         }
+        console.log("_________________________________________________________________________________________________________")
     });
 
     render() {
-- 
cgit v1.2.3-70-g09d2


From 8888e3aef8658e4100e2fc4bee6b805e7b0feaa9 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Wed, 10 Jul 2019 20:31:57 -0400
Subject: dear god i hate this

---
 src/client/views/search/SearchBox.tsx | 173 +++++++++++++++++-----------------
 1 file changed, 87 insertions(+), 86 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index db6f69ccb..1980ddaf2 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -39,6 +39,8 @@ export class SearchBox extends React.Component {
 
     static Instance: SearchBox;
 
+    private _maxSearchIndex: number = 0;
+
     constructor(props: any) {
         super(props);
 
@@ -65,8 +67,8 @@ export class SearchBox extends React.Component {
         this._visibleElements = [];
         this._currentIndex = 0;
         this._numTotalResults = 0;
-        this._startIndex = 0;
-        this._endIndex = 12;
+        this._startIndex = -1;
+        this._endIndex = -1;
     }
 
     enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
@@ -114,6 +116,25 @@ export class SearchBox extends React.Component {
         });
     }
 
+    getResultsHelp = async (query: string) => {
+        // docs length = this._results.length --> number of docs that are shown (after filtering)
+        // stops looking once this._results.length >= maxDisplayIndex
+        // max search index = number of results looked through in solr (solr index) --> increments of 10
+        // max display index = number of documents that SHOULD be shown (should include buffer), this._endIndex + buffer (= 4)
+        // currentRequest = promise | undefined, if undefined, can run and look for more. If not undefined, then there is a request in progress and it cannot look for more yet
+
+        let buffer = 4;
+        let maxDisplayIndex: number = this._endIndex + buffer;
+        let curRequest = undefined;
+
+
+        while (this._results.length < maxDisplayIndex) {
+            if (curRequest === undefined) {
+
+            }
+        }
+    }
+
     @action
     getResults = async (query: string, count: number) => {
         let resDocs = [];
@@ -144,91 +165,72 @@ export class SearchBox extends React.Component {
 
             this._currentIndex += docs.length;
 
-            // console.log(`ResDocs: ${resDocs.length}`);
+            console.log(`ResDocs: ${resDocs.length}`);
             console.log(`CurrIndex: ${this._currentIndex}`);
         }
         // console.log(this.getResults2(query, count, []));
         return resDocs;
     }
 
-    @action
-    getResults2 = async (query: string, count: number, docs: Doc[]) => {
-        // let buffer = 4;
-        // let goalIndex = this._endIndex + count;
-        // let bottomBound = Math.floor(goalIndex / 10) * 10;
-        // let tempIndex = this._currentIndex;
-        // let goalNum = this._endIndex + buffer;
-        let resDocs: Doc[] = docs;
-
-        // let topBound = bottomBound - 10;
-        // let unfilteredDocs: Doc[];
-        // let unfilteredFound: number;
-        // means this has already been fetched
-        // if (this._fetchedIndices.includes(topBound)) {
-        //     return;
-        // }
-
-        let index = count <= 0 ? undefined : this._currentIndex;
-        // let index = this._currentIndex;
-        if (index) {
-            let topBound = Math.ceil(index / 10) * 10;
-            if (this._fetchedIndices.includes(topBound)) {
-                // console.log("returning NOTHING")
-                return resDocs;
-            }
-            let startIndex = this._fetchedIndices[this._fetchedIndices.length - 1];
-            let endIndex = startIndex + 10;
-            this._fetchedIndices.push(endIndex);
-            console.log(this._fetchedIndices)
-            let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
-
-            prom.then((res: SearchUtil.DocSearchResult) => {
-                count = Math.min(res.numFound, count);
-                console.log(res.docs);
-                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-
-                if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
-                    this._numTotalResults = res.numFound;
-                }
-
-                resDocs.push(...filteredDocs);
-
-                this._currentIndex += res.docs.length;
-
-                if (resDocs.length < count) {
-                    return this.getResults2(query, count - resDocs.length, resDocs);
-                    // resDocs = await this.getResults2(query, count - filteredDocs.length, resDocs);
-                }
-
-                return resDocs;
-            })
-        }
-        return resDocs;
-        //this is the upper bound of the last 
-        // let index = this._fetchedIndices[this._fetchedIndices.length - 1];
-        // let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
-
-        // prom.then((res: SearchUtil.DocSearchResult) => {
-        //     // unfilteredDocs = res.docs;
-        //     // unfilteredFound = res.numFound;
-
-        //     count = Math.min(res.numFound, count);
-        //     let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-
-        //     if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
-        //         console.log(`Total: ${res.numFound}`);
-        //         this._numTotalResults = res.numFound;
-        //     }
-
-        //     resDocs.push(...filteredDocs);
-
-        //     this._currentIndex += res.docs.length;
-        // })
-
-        // console.log(prom);
-
-
-    }
+    // @action
+    // getResults2 = async (query: string, count: number, docs: Doc[]) => {
+    //     console.log("results 2")
+    //     let buffer = 4;
+    //     // let goalIndex = this._endIndex + count;
+    //     // let bottomBound = Math.floor(goalIndex / 10) * 10;
+    //     let tempIndex = this._currentIndex;
+    //     let goalNum = this._endIndex + buffer;
+    //     let resDocs: Doc[] = docs;
+
+    //     // let topBound = bottomBound - 10;
+    //     // let unfilteredDocs: Doc[];
+    //     // let unfilteredFound: number;
+    //     // means this has already been fetched
+    //     // if (this._fetchedIndices.includes(topBound)) {
+    //     //     return;
+    //     // }
+
+    //     let index = count <= 0 ? undefined : this._currentIndex;
+    //     if (index) {
+    //         let topBound = Math.ceil(index / 10) * 10;
+    //         if (this._fetchedIndices.includes(topBound)) {
+    //             return;
+    //         }
+    //         let startIndex = this._fetchedIndices[this._fetchedIndices.length - 1];
+    //         let endIndex = startIndex + 10;
+    //         this._fetchedIndices.push(endIndex);
+    //         console.log(this._fetchedIndices)
+    //         let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
+
+    //         prom.then((res: SearchUtil.DocSearchResult) => {
+    //             count = Math.min(res.numFound, count);
+    //             console.log(res.docs);
+    //             let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+
+    //             if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
+    //                 this._numTotalResults = res.numFound;
+    //             }
+
+    //             resDocs.push(...filteredDocs);
+
+    //             this._currentIndex += res.docs.length;
+
+    //             if (resDocs.length <= count) {
+    //                 runInAction(() => {
+    //                     return this.getResults2(query, count, resDocs);
+    //                 });
+    //             }
+    //             else {
+    //                 return resDocs;
+    //             }
+    //             // console.log(tempIndex);
+    //             console.log(resDocs.length);
+    //         })
+
+    //     }
+
+
+    // }
 
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
@@ -291,8 +293,8 @@ export class SearchBox extends React.Component {
         this._visibleElements = [];
         this._currentIndex = 0;
         this._numTotalResults = 0;
-        this._startIndex = 0;
-        this._endIndex = 12;
+        this._startIndex = -1;
+        this._endIndex = -1;
     }
 
     resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
@@ -304,9 +306,10 @@ export class SearchBox extends React.Component {
         if (startIndex === this._startIndex && endIndex === this._endIndex) {
             return;
         }
-
+        console.log("_________________________________________________________________________________________________________")
         console.log(`START: ${startIndex}`);
         console.log(`END: ${endIndex}`);
+
         this._startIndex = startIndex;
         this._endIndex = endIndex;
 
@@ -339,7 +342,6 @@ export class SearchBox extends React.Component {
                     if (i >= this._results.length) {
                         // _________________________________________________________________________________________________
                         let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
-                        console.log(results)
                         if (results.length !== 0) {
                             runInAction(() => {
                                 this._results.push(...results);
@@ -362,7 +364,6 @@ export class SearchBox extends React.Component {
                 }
             }
         }
-        console.log("_________________________________________________________________________________________________________")
     });
 
     render() {
-- 
cgit v1.2.3-70-g09d2


From 341d173db8f1580f49dc4e9ff429b72d88da16b4 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Thu, 11 Jul 2019 18:01:35 -0400
Subject: end of day 7/11 ho boy we got problems

---
 src/client/views/search/SearchBox.tsx | 182 +++++++++++++++++++++++-----------
 1 file changed, 126 insertions(+), 56 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 1980ddaf2..0816bb9de 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -40,6 +40,7 @@ export class SearchBox extends React.Component {
     static Instance: SearchBox;
 
     private _maxSearchIndex: number = 0;
+    private _curRequest: Promise<SearchUtil.DocSearchResult> | undefined = undefined;
 
     constructor(props: any) {
         super(props);
@@ -69,6 +70,8 @@ export class SearchBox extends React.Component {
         this._numTotalResults = 0;
         this._startIndex = -1;
         this._endIndex = -1;
+        this._curRequest = undefined;
+        this._maxSearchIndex = 0;
     }
 
     enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
@@ -97,20 +100,43 @@ export class SearchBox extends React.Component {
 
         query = FilterBox.Instance.getFinalQuery(query);
 
+        // if (this._curRequest !== undefined) {
+        //     this._curRequest.then(() => {
+        //         this._curRequest = undefined;
+        //         this._results = [];
+        //     });
+        // }
+
+        // this._results = [];
+
         //if there is no query there should be no result
         if (query === "") {
-            results = [];
+            // results = [];
+            return;
         }
         else {
             //gets json result into a list of documents that can be used
             //these are filtered by type
+            // this._results = [];
             this._currentIndex = 0;
-            results = await this.getResults(query, 12);
+            this._startIndex = 0;
+            this._endIndex = 12;
+            // this._curRequest = undefined;
+            // if (this._curRequest !== undefined) {
+            //     this._curRequest.then(() => {
+            //         this._curRequest = undefined;
+            //     });
+            // }
+
+            this._maxSearchIndex = 0;
+
+            // results = await this.getResultsHelp(query);
+            await this.getResultsHelp(query);
         }
 
         runInAction(() => {
             this._resultsOpen = true;
-            this._results = results;
+            // this._results = results;
             this._openNoResults = true;
             this.resultsScrolled();
         });
@@ -123,54 +149,85 @@ export class SearchBox extends React.Component {
         // max display index = number of documents that SHOULD be shown (should include buffer), this._endIndex + buffer (= 4)
         // currentRequest = promise | undefined, if undefined, can run and look for more. If not undefined, then there is a request in progress and it cannot look for more yet
 
-        let buffer = 4;
-        let maxDisplayIndex: number = this._endIndex + buffer;
-        let curRequest = undefined;
+        // let buffer = 4;
+        // let maxDisplayIndex: number = this._endIndex + buffer;
+        console.log(`end index: ${this._endIndex}`)
+        console.log(this._results.length)
+
+        while (this._results.length < this._endIndex) {
+            console.log("looping")
+            if (this._curRequest === undefined) {
+                //start at max search index, get 10, add 10 to max search index
+                // const { docs, numFound } = await SearchUtil.Search(query, true, this._maxSearchIndex, 10);
 
+                // happens at the beginning
+                // am i gonna need this?
+                // if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
+                //     this._numTotalResults = numFound;
+                // }
 
-        while (this._results.length < maxDisplayIndex) {
-            if (curRequest === undefined) {
+                this._curRequest = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+                this._maxSearchIndex += 10;
 
+                this._curRequest.then((res: SearchUtil.DocSearchResult) => {
+
+                    // happens at the beginning
+                    if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
+                        this._numTotalResults = res.numFound;
+                    }
+
+                    let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+                    this._results.push(...filteredDocs);
+
+                    console.log(this._results)
+                    this._curRequest = undefined;
+                    console.log("setting to undefined")
+                });
+
+                //deals with if there are fewer results than can be scrolled through
+                // if (this._numTotalResults < this._endIndex) {
+                //     break;
+                // }
             }
         }
     }
 
-    @action
-    getResults = async (query: string, count: number) => {
-        let resDocs = [];
-        // count is total number of documents to be shown (i believe)
-        console.log(`Count: ${count}`);
-        while (resDocs.length < count) {
-            let index = count === -1 ? undefined : this._currentIndex;
-            let num = count === -1 ? undefined : Math.min(this._numTotalResults - this._currentIndex + 1, this._maxNum);
-            // num found has to be the number of docs before filtering happens - this is the total num
-            const { docs, numFound } = await SearchUtil.Search(query, true, index, num);
-
-            let filteredDocs = FilterBox.Instance.filterDocsByType(docs);
-
-            // accounts for the fact that there may be fewer documents than the max that are returned
-            count = Math.min(numFound, count);
-
-            // happens at the beginning
-            if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
-                console.log(`Total: ${numFound}`);
-                this._numTotalResults = numFound;
-            }
+    // @action
+    // getResults = async (query: string, count: number) => {
+    //     let resDocs = [];
+    //     // count is total number of documents to be shown (i believe)
+    //     console.log(`Count: ${count}`);
+    //     while (resDocs.length < count) {
+    //         let index = count === -1 ? undefined : this._currentIndex;
+    //         let num = count === -1 ? undefined : Math.min(this._numTotalResults - this._currentIndex + 1, this._maxNum);
+    //         // num found has to be the number of docs before filtering happens - this is the total num
+    //         const { docs, numFound } = await SearchUtil.Search(query, true, index, num);
+
+    //         let filteredDocs = FilterBox.Instance.filterDocsByType(docs);
+
+    //         // accounts for the fact that there may be fewer documents than the max that are returned
+    //         count = Math.min(numFound, count);
+
+    //         // happens at the beginning
+    //         if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
+    //             console.log(`Total: ${numFound}`);
+    //             this._numTotalResults = numFound;
+    //         }
 
-            // if (filteredDocs.length < docs.length) {
-            //     this._numResults -= docs.length - filteredDocs.length;
-            //     console.log(`New Total: ${this._numResults}`);
-            // }
-            resDocs.push(...filteredDocs);
+    //         // if (filteredDocs.length < docs.length) {
+    //         //     this._numResults -= docs.length - filteredDocs.length;
+    //         //     console.log(`New Total: ${this._numResults}`);
+    //         // }
+    //         resDocs.push(...filteredDocs);
 
-            this._currentIndex += docs.length;
+    //         this._currentIndex += docs.length;
 
-            console.log(`ResDocs: ${resDocs.length}`);
-            console.log(`CurrIndex: ${this._currentIndex}`);
-        }
-        // console.log(this.getResults2(query, count, []));
-        return resDocs;
-    }
+    //         console.log(`ResDocs: ${resDocs.length}`);
+    //         console.log(`CurrIndex: ${this._currentIndex}`);
+    //     }
+    //     // console.log(this.getResults2(query, count, []));
+    //     return resDocs;
+    // }
 
     // @action
     // getResults2 = async (query: string, count: number, docs: Doc[]) => {
@@ -234,8 +291,9 @@ export class SearchBox extends React.Component {
 
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
-        const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
-        const docs = results.map(doc => {
+        // const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
+        await this.getResultsHelp(FilterBox.Instance.getFinalQuery(this._searchString));
+        const docs = this._results.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
             if (isProto) {
                 return Doc.MakeDelegate(doc);
@@ -295,23 +353,27 @@ export class SearchBox extends React.Component {
         this._numTotalResults = 0;
         this._startIndex = -1;
         this._endIndex = -1;
+        this._curRequest = undefined;
     }
 
     resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
+        console.log("_________________________________________________________________________________________________________")
         let scrollY = e ? e.currentTarget.scrollTop : 0;
         let buffer = 4;
+        console.log(`start before: ${this._startIndex}`);
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
+        console.log(`end before: ${this._endIndex}`);
         let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
 
         if (startIndex === this._startIndex && endIndex === this._endIndex) {
+            console.log("returning")
             return;
         }
-        console.log("_________________________________________________________________________________________________________")
         console.log(`START: ${startIndex}`);
         console.log(`END: ${endIndex}`);
 
-        this._startIndex = startIndex;
-        this._endIndex = endIndex;
+        this._startIndex = startIndex === -1 ? 0 : startIndex;
+        this._endIndex = endIndex === -1 ? 12 : endIndex;
 
         if (this._numTotalResults === 0 && this._openNoResults) {
             this._visibleElements = [<div className="no-result">No Search Results</div>];
@@ -341,17 +403,25 @@ export class SearchBox extends React.Component {
                     let result: Doc | undefined = undefined;
                     if (i >= this._results.length) {
                         // _________________________________________________________________________________________________
-                        let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
-                        if (results.length !== 0) {
-                            runInAction(() => {
-                                this._results.push(...results);
-                                result = this._results[i];
-                                if (result) {
-                                    this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
-                                    this._isSearch[i] = "search";
-                                }
-                            });
+                        // let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
+
+                        // this updates this._results
+                        yield this.getResultsHelp(this._searchString);
+                        result = this._results[i];
+                        if (result) {
+                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                            this._isSearch[i] = "search";
                         }
+                        // if (results.length !== 0) {
+                        //     runInAction(() => {
+                        //         // this._results.push(...results);
+                        //         result = this._results[i];
+                        //         if (result) {
+                        //             this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                        //             this._isSearch[i] = "search";
+                        //         }
+                        //     });
+                        // }
                         // _________________________________________________________________________________________________
                     }
                     else {
-- 
cgit v1.2.3-70-g09d2


From e289ffead09b091fdb40aab47ea4d04ae5935455 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Fri, 12 Jul 2019 15:28:34 -0400
Subject: things almost working yeet yeet

---
 src/client/views/search/SearchBox.tsx | 190 ++++++++++------------------------
 1 file changed, 54 insertions(+), 136 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 0816bb9de..8e5d317f0 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -16,6 +16,8 @@ import { SearchUtil } from '../../util/SearchUtil';
 import { RouteStore } from '../../../server/RouteStore';
 import { FilterBox } from './FilterBox';
 import { start } from 'repl';
+import { getForkTsCheckerWebpackPluginHooks } from 'fork-ts-checker-webpack-plugin/lib/hooks';
+import { faThumbsDown } from '@fortawesome/free-regular-svg-icons';
 
 @observer
 export class SearchBox extends React.Component {
@@ -32,7 +34,7 @@ export class SearchBox extends React.Component {
 
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _currentIndex = 0;
-    private _numTotalResults = 0;
+    private _numTotalResults = -1;
     private _startIndex = -1;
     private _endIndex = -1;
     private _fetchedIndices: number[] = [0];
@@ -40,7 +42,7 @@ export class SearchBox extends React.Component {
     static Instance: SearchBox;
 
     private _maxSearchIndex: number = 0;
-    private _curRequest: Promise<SearchUtil.DocSearchResult> | undefined = undefined;
+    private _curRequest?: Promise<any> = undefined;
 
     constructor(props: any) {
         super(props);
@@ -67,7 +69,7 @@ export class SearchBox extends React.Component {
         this._results = [];
         this._visibleElements = [];
         this._currentIndex = 0;
-        this._numTotalResults = 0;
+        this._numTotalResults = -1;
         this._startIndex = -1;
         this._endIndex = -1;
         this._curRequest = undefined;
@@ -121,6 +123,7 @@ export class SearchBox extends React.Component {
             this._currentIndex = 0;
             this._startIndex = 0;
             this._endIndex = 12;
+            this._results = [];
             // this._curRequest = undefined;
             // if (this._curRequest !== undefined) {
             //     this._curRequest.then(() => {
@@ -129,6 +132,7 @@ export class SearchBox extends React.Component {
             // }
 
             this._maxSearchIndex = 0;
+            this._numTotalResults = -1;
 
             // results = await this.getResultsHelp(query);
             await this.getResultsHelp(query);
@@ -151,144 +155,58 @@ export class SearchBox extends React.Component {
 
         // let buffer = 4;
         // let maxDisplayIndex: number = this._endIndex + buffer;
-        console.log(`end index: ${this._endIndex}`)
-        console.log(this._results.length)
+        // console.log(`end index: ${this._endIndex}`)
+        // console.log(this._results.length)
+
+        while (this._results.length < this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
+            console.log("looping");
+            //start at max search index, get 10, add 10 to max search index
+            // const { docs, numFound } = await SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+
+            // happens at the beginning
+            // am i gonna need this?
+            // if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
+            //     this._numTotalResults = numFound;
+            // }
 
-        while (this._results.length < this._endIndex) {
-            console.log("looping")
-            if (this._curRequest === undefined) {
-                //start at max search index, get 10, add 10 to max search index
-                // const { docs, numFound } = await SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+            let prom: Promise<any>;
+            if (this._curRequest) {
+                prom = this._curRequest;
+                return;
+            } else {
+                prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+                this._maxSearchIndex += 10;
+            }
+            prom.then(action((res: SearchUtil.DocSearchResult) => {
 
                 // happens at the beginning
-                // am i gonna need this?
-                // if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
-                //     this._numTotalResults = numFound;
-                // }
+                if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
+                    this._numTotalResults = res.numFound;
+                }
 
-                this._curRequest = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
-                this._maxSearchIndex += 10;
+                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+                this._results.push(...filteredDocs);
 
-                this._curRequest.then((res: SearchUtil.DocSearchResult) => {
+                console.log(this._results);
+                if (prom === this._curRequest) {
+                    this._curRequest = undefined;
+                }
+                console.log("setting to undefined");
+            }));
 
-                    // happens at the beginning
-                    if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
-                        this._numTotalResults = res.numFound;
-                    }
 
-                    let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-                    this._results.push(...filteredDocs);
 
-                    console.log(this._results)
-                    this._curRequest = undefined;
-                    console.log("setting to undefined")
-                });
+            this._curRequest = prom;
 
-                //deals with if there are fewer results than can be scrolled through
-                // if (this._numTotalResults < this._endIndex) {
-                //     break;
-                // }
-            }
+            await prom;
+
+            //deals with if there are fewer results than can be scrolled through
+            // if (this._numTotalResults < this._endIndex) {
+            //     break;
+            // }
         }
     }
 
-    // @action
-    // getResults = async (query: string, count: number) => {
-    //     let resDocs = [];
-    //     // count is total number of documents to be shown (i believe)
-    //     console.log(`Count: ${count}`);
-    //     while (resDocs.length < count) {
-    //         let index = count === -1 ? undefined : this._currentIndex;
-    //         let num = count === -1 ? undefined : Math.min(this._numTotalResults - this._currentIndex + 1, this._maxNum);
-    //         // num found has to be the number of docs before filtering happens - this is the total num
-    //         const { docs, numFound } = await SearchUtil.Search(query, true, index, num);
-
-    //         let filteredDocs = FilterBox.Instance.filterDocsByType(docs);
-
-    //         // accounts for the fact that there may be fewer documents than the max that are returned
-    //         count = Math.min(numFound, count);
-
-    //         // happens at the beginning
-    //         if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
-    //             console.log(`Total: ${numFound}`);
-    //             this._numTotalResults = numFound;
-    //         }
-
-    //         // if (filteredDocs.length < docs.length) {
-    //         //     this._numResults -= docs.length - filteredDocs.length;
-    //         //     console.log(`New Total: ${this._numResults}`);
-    //         // }
-    //         resDocs.push(...filteredDocs);
-
-    //         this._currentIndex += docs.length;
-
-    //         console.log(`ResDocs: ${resDocs.length}`);
-    //         console.log(`CurrIndex: ${this._currentIndex}`);
-    //     }
-    //     // console.log(this.getResults2(query, count, []));
-    //     return resDocs;
-    // }
-
-    // @action
-    // getResults2 = async (query: string, count: number, docs: Doc[]) => {
-    //     console.log("results 2")
-    //     let buffer = 4;
-    //     // let goalIndex = this._endIndex + count;
-    //     // let bottomBound = Math.floor(goalIndex / 10) * 10;
-    //     let tempIndex = this._currentIndex;
-    //     let goalNum = this._endIndex + buffer;
-    //     let resDocs: Doc[] = docs;
-
-    //     // let topBound = bottomBound - 10;
-    //     // let unfilteredDocs: Doc[];
-    //     // let unfilteredFound: number;
-    //     // means this has already been fetched
-    //     // if (this._fetchedIndices.includes(topBound)) {
-    //     //     return;
-    //     // }
-
-    //     let index = count <= 0 ? undefined : this._currentIndex;
-    //     if (index) {
-    //         let topBound = Math.ceil(index / 10) * 10;
-    //         if (this._fetchedIndices.includes(topBound)) {
-    //             return;
-    //         }
-    //         let startIndex = this._fetchedIndices[this._fetchedIndices.length - 1];
-    //         let endIndex = startIndex + 10;
-    //         this._fetchedIndices.push(endIndex);
-    //         console.log(this._fetchedIndices)
-    //         let prom: Promise<SearchUtil.DocSearchResult> = SearchUtil.Search(query, true, index, 10);
-
-    //         prom.then((res: SearchUtil.DocSearchResult) => {
-    //             count = Math.min(res.numFound, count);
-    //             console.log(res.docs);
-    //             let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-
-    //             if (res.numFound !== this._numTotalResults && this._numTotalResults === 0) {
-    //                 this._numTotalResults = res.numFound;
-    //             }
-
-    //             resDocs.push(...filteredDocs);
-
-    //             this._currentIndex += res.docs.length;
-
-    //             if (resDocs.length <= count) {
-    //                 runInAction(() => {
-    //                     return this.getResults2(query, count, resDocs);
-    //                 });
-    //             }
-    //             else {
-    //                 return resDocs;
-    //             }
-    //             // console.log(tempIndex);
-    //             console.log(resDocs.length);
-    //         })
-
-    //     }
-
-
-    // }
-
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
         // const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
@@ -350,7 +268,7 @@ export class SearchBox extends React.Component {
         this._results = [];
         this._visibleElements = [];
         this._currentIndex = 0;
-        this._numTotalResults = 0;
+        this._numTotalResults = -1;
         this._startIndex = -1;
         this._endIndex = -1;
         this._curRequest = undefined;
@@ -365,10 +283,10 @@ export class SearchBox extends React.Component {
         console.log(`end before: ${this._endIndex}`);
         let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
 
-        if (startIndex === this._startIndex && endIndex === this._endIndex) {
-            console.log("returning")
-            return;
-        }
+        // if (startIndex === this._startIndex && endIndex === this._endIndex && this._results.length > this._endIndex) {
+        //     console.log("returning")
+        //     return;
+        // }
         console.log(`START: ${startIndex}`);
         console.log(`END: ${endIndex}`);
 
@@ -384,9 +302,9 @@ export class SearchBox extends React.Component {
         // visibleElements is all of the elements (even the ones you can't see)
         else if (this._visibleElements.length !== this._numTotalResults) {
             // undefined until a searchitem is put in there
-            this._visibleElements = Array<JSX.Element>(this._numTotalResults);
+            this._visibleElements = Array<JSX.Element>(this._numTotalResults === -1 ? 0 : this._numTotalResults);
             // indicates if things are placeholders
-            this._isSearch = Array<undefined>(this._numTotalResults);
+            this._isSearch = Array<undefined>(this._numTotalResults === -1 ? 0 : this._numTotalResults);
         }
 
         for (let i = 0; i < this._numTotalResults; i++) {
-- 
cgit v1.2.3-70-g09d2


From 00a9a169679baa011c66b28152ff27dec2532907 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Fri, 12 Jul 2019 18:15:31 -0400
Subject: end of day 7/12

---
 src/client/views/search/SearchBox.tsx | 175 +++++++++++-----------------------
 1 file changed, 54 insertions(+), 121 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 8e5d317f0..e5280fe8c 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -30,14 +30,12 @@ export class SearchBox extends React.Component {
     //temp
     @observable public _maxNum: number = 10;
     @observable private _visibleElements: JSX.Element[] = [];
-    @observable private _scrollY: number = 0;
+    // @observable private _sc rollY: number = 0;
 
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
-    private _currentIndex = 0;
     private _numTotalResults = -1;
     private _startIndex = -1;
     private _endIndex = -1;
-    private _fetchedIndices: number[] = [0];
 
     static Instance: SearchBox;
 
@@ -68,7 +66,6 @@ export class SearchBox extends React.Component {
         this._openNoResults = false;
         this._results = [];
         this._visibleElements = [];
-        this._currentIndex = 0;
         this._numTotalResults = -1;
         this._startIndex = -1;
         this._endIndex = -1;
@@ -97,120 +94,81 @@ export class SearchBox extends React.Component {
 
     @action
     submitSearch = async () => {
-        let query = this._searchString; // searchbox gets query
-        let results: Doc[];
-
+        let query = this._searchString;
         query = FilterBox.Instance.getFinalQuery(query);
-
-        // if (this._curRequest !== undefined) {
-        //     this._curRequest.then(() => {
-        //         this._curRequest = undefined;
-        //         this._results = [];
-        //     });
-        // }
-
-        // this._results = [];
+        this._results = [];
+        this._isSearch = [];
+        this._visibleElements = [];
 
         //if there is no query there should be no result
         if (query === "") {
-            // results = [];
             return;
         }
         else {
-            //gets json result into a list of documents that can be used
-            //these are filtered by type
-            // this._results = [];
-            this._currentIndex = 0;
             this._startIndex = 0;
             this._endIndex = 12;
-            this._results = [];
-            // this._curRequest = undefined;
-            // if (this._curRequest !== undefined) {
-            //     this._curRequest.then(() => {
-            //         this._curRequest = undefined;
-            //     });
-            // }
-
             this._maxSearchIndex = 0;
             this._numTotalResults = -1;
-
-            // results = await this.getResultsHelp(query);
-            await this.getResultsHelp(query);
+            await this.getResults(query);
         }
 
         runInAction(() => {
             this._resultsOpen = true;
-            // this._results = results;
             this._openNoResults = true;
             this.resultsScrolled();
         });
-    }
 
-    getResultsHelp = async (query: string) => {
-        // docs length = this._results.length --> number of docs that are shown (after filtering)
-        // stops looking once this._results.length >= maxDisplayIndex
-        // max search index = number of results looked through in solr (solr index) --> increments of 10
-        // max display index = number of documents that SHOULD be shown (should include buffer), this._endIndex + buffer (= 4)
-        // currentRequest = promise | undefined, if undefined, can run and look for more. If not undefined, then there is a request in progress and it cannot look for more yet
-
-        // let buffer = 4;
-        // let maxDisplayIndex: number = this._endIndex + buffer;
-        // console.log(`end index: ${this._endIndex}`)
-        // console.log(this._results.length)
-
-        while (this._results.length < this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
-            console.log("looping");
-            //start at max search index, get 10, add 10 to max search index
-            // const { docs, numFound } = await SearchUtil.Search(query, true, this._maxSearchIndex, 10);
-
-            // happens at the beginning
-            // am i gonna need this?
-            // if (numFound !== this._numTotalResults && this._numTotalResults === 0) {
-            //     this._numTotalResults = numFound;
-            // }
-
-            let prom: Promise<any>;
-            if (this._curRequest) {
-                prom = this._curRequest;
-                return;
-            } else {
-                prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
-                this._maxSearchIndex += 10;
-            }
-            prom.then(action((res: SearchUtil.DocSearchResult) => {
+        console.log(this._results)
+    }
 
-                // happens at the beginning
-                if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
-                    this._numTotalResults = res.numFound;
-                }
+    getResults = async (query: string, all: boolean = false) => {
 
-                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-                this._results.push(...filteredDocs);
+        if (all) {
+            // let { numFound, docs } = await SearchUtil.Search(query, true, this._maxSearchIndex, 100000);
+            let prom: Promise<any> = SearchUtil.Search(query, true, 0, 100000);
 
-                console.log(this._results);
-                if (prom === this._curRequest) {
-                    this._curRequest = undefined;
+            prom.then(({ docs, numFound }) => {
+                this._results = docs;
+            })
+        }
+        else {
+            while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
+
+                let prom: Promise<any>;
+                if (this._curRequest) {
+                    prom = this._curRequest;
+                    return;
+                } else {
+                    prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+                    this._maxSearchIndex += 10;
                 }
-                console.log("setting to undefined");
-            }));
+                prom.then(action((res: SearchUtil.DocSearchResult) => {
 
+                    // happens at the beginning
+                    if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
+                        this._numTotalResults = res.numFound;
+                    }
 
+                    let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+                    this._results.push(...filteredDocs);
 
-            this._curRequest = prom;
+                    if (prom === this._curRequest) {
+                        this._curRequest = undefined;
+                    }
+                }));
 
-            await prom;
+                this._curRequest = prom;
 
-            //deals with if there are fewer results than can be scrolled through
-            // if (this._numTotalResults < this._endIndex) {
-            //     break;
-            // }
+                await prom;
+            }
         }
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
-        // const results = await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), -1);
-        await this.getResultsHelp(FilterBox.Instance.getFinalQuery(this._searchString));
+        await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), true);
+        console.log(this._results)
+        // if (res !== undefined) {
         const docs = this._results.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
             if (isProto) {
@@ -244,6 +202,7 @@ export class SearchBox extends React.Component {
             }
         }
         return Docs.FreeformDocument(docs, { width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"` });
+        // }
     }
 
     @action.bound
@@ -257,7 +216,6 @@ export class SearchBox extends React.Component {
 
     @action.bound
     closeSearch = () => {
-        console.log("closing search")
         FilterBox.Instance.closeFilter();
         this.closeResults();
     }
@@ -267,7 +225,6 @@ export class SearchBox extends React.Component {
         this._resultsOpen = false;
         this._results = [];
         this._visibleElements = [];
-        this._currentIndex = 0;
         this._numTotalResults = -1;
         this._startIndex = -1;
         this._endIndex = -1;
@@ -275,21 +232,11 @@ export class SearchBox extends React.Component {
     }
 
     resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
-        console.log("_________________________________________________________________________________________________________")
         let scrollY = e ? e.currentTarget.scrollTop : 0;
         let buffer = 4;
-        console.log(`start before: ${this._startIndex}`);
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
-        console.log(`end before: ${this._endIndex}`);
         let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
 
-        // if (startIndex === this._startIndex && endIndex === this._endIndex && this._results.length > this._endIndex) {
-        //     console.log("returning")
-        //     return;
-        // }
-        console.log(`START: ${startIndex}`);
-        console.log(`END: ${endIndex}`);
-
         this._startIndex = startIndex === -1 ? 0 : startIndex;
         this._endIndex = endIndex === -1 ? 12 : endIndex;
 
@@ -298,6 +245,10 @@ export class SearchBox extends React.Component {
             return;
         }
 
+        if (this._numTotalResults <= this._maxSearchIndex) {
+            this._numTotalResults = this._results.length;
+        }
+
         // only hit right at the beginning
         // visibleElements is all of the elements (even the ones you can't see)
         else if (this._visibleElements.length !== this._numTotalResults) {
@@ -320,27 +271,12 @@ export class SearchBox extends React.Component {
                 if (this._isSearch[i] !== "search") {
                     let result: Doc | undefined = undefined;
                     if (i >= this._results.length) {
-                        // _________________________________________________________________________________________________
-                        // let results: Doc[] = yield this.getResults(this._searchString, i + 1 - this._results.length);
-
-                        // this updates this._results
-                        yield this.getResultsHelp(this._searchString);
-                        result = this._results[i];
+                        this.getResults(this._searchString);
+                        if (i < this._results.length) result = this._results[i];
                         if (result) {
                             this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
                             this._isSearch[i] = "search";
                         }
-                        // if (results.length !== 0) {
-                        //     runInAction(() => {
-                        //         // this._results.push(...results);
-                        //         result = this._results[i];
-                        //         if (result) {
-                        //             this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
-                        //             this._isSearch[i] = "search";
-                        //         }
-                        //     });
-                        // }
-                        // _________________________________________________________________________________________________
                     }
                     else {
                         result = this._results[i];
@@ -352,6 +288,10 @@ export class SearchBox extends React.Component {
                 }
             }
         }
+        if (this._maxSearchIndex >= this._numTotalResults) {
+            this._visibleElements.length = this._results.length;
+            this._isSearch.length = this._results.length;
+        }
     });
 
     render() {
@@ -367,15 +307,8 @@ export class SearchBox extends React.Component {
                     <button className="searchBox-barChild searchBox-filter" onClick={FilterBox.Instance.openFilter} onPointerDown={FilterBox.Instance.stopProp}>Filter</button>
                 </div>
                 <div className="searchBox-results" onScroll={this.resultsScrolled} style={this._resultsOpen ? { display: "flex" } : { display: "none" }}>
-                    {/* {(this._results.length !== 0) ? (
-                        this._results.map(result => <SearchItem doc={result} key={result[Id]} />)
-                    ) :
-                        this._openNoResults ? (<div className="no-result">No Search Results</div>) : null} */}
                     {this._visibleElements}
                 </div>
-                {/* <div style={this._results.length !== 0 ? { display: "flex" } : { display: "none" }}>
-                    <Pager />
-                </div> */}
             </div>
         );
     }
-- 
cgit v1.2.3-70-g09d2


From 7cd915c98db61e646ab34184613c1f6364cb620e Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 12:56:11 -0400
Subject: submit button added

---
 deploy/index.html                       |  1 -
 src/client/views/search/SearchBox.scss  |  3 +-
 src/client/views/search/SearchBox.tsx   |  1 +
 src/client/views/search/SearchItem.scss | 56 +++++++++++++++++++--------------
 4 files changed, 35 insertions(+), 26 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/deploy/index.html b/deploy/index.html
index f4a019b71..532b995f8 100644
--- a/deploy/index.html
+++ b/deploy/index.html
@@ -6,7 +6,6 @@
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
         integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/typescript/3.3.1/typescript.min.js"></script>
-    <script src="https://rawgithub.com/juliangarnier/anime/master/anime.min.js"></script>
 </head>
 
 <body>
diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 2a27bbe62..08d3a65f1 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -41,11 +41,10 @@
 }
 
 .searchBox-results {
-    margin-left: 27px;
+    margin-right: 142px;
     top: 300px;
     display: flex;
     flex-direction: column;
-    margin-right: 72px;
     height: 560px;
     overflow: hidden;
     overflow-y: auto;
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 7dcfbe1ef..cddc56a8a 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -176,6 +176,7 @@ export class SearchBox extends React.Component {
                     <input value={this._searchString} onChange={this.onChange} type="text" placeholder="Search..."
                         className="searchBox-barChild searchBox-input" onPointerDown={this.openSearch} onKeyPress={this.enter}
                         style={{ width: this._resultsOpen ? "500px" : "100px" }} />
+                    <button className="searchBox-barChild searchBox-submit" onClick={this.submitSearch} onPointerDown={FilterBox.Instance.stopProp}>Submit</button>
                     <button className="searchBox-barChild searchBox-filter" onClick={FilterBox.Instance.openFilter} onPointerDown={FilterBox.Instance.stopProp}>Filter</button>
                 </div>
                 <div className="searchBox-results" style={this._resultsOpen ? { display: "flex" } : { display: "none" }}>
diff --git a/src/client/views/search/SearchItem.scss b/src/client/views/search/SearchItem.scss
index fa4c9cb38..04ebf2714 100644
--- a/src/client/views/search/SearchItem.scss
+++ b/src/client/views/search/SearchItem.scss
@@ -73,34 +73,38 @@
                         -o-transition: opacity 0.2s ease-in-out;
                         transition: opacity 0.2s ease-in-out;
                     }
-                }
 
-                .link-container.item:hover {
-                    width: 70px;
                 }
 
-                .link-container.item:hover .link-count {
-                    opacity: 0;
-                }
+                // .link-container.item:hover {
+                //     width: 70px;
+                // }
+
+                // .link-container.item:hover .link-count {
+                //     opacity: 0;
+                // }
+
+                // .link-container.item:hover .link-extended {
+                //     opacity: 1;
+                // }
 
-                .link-container.item:hover .link-extended {
-                    opacity: 1;
-                }
-                
                 .icon-icons {
-                    width:50px
+                    width: 50px
                 }
+
                 .icon-live {
-                    width:175px;
+                    width: 175px;
                 }
 
-                .icon-icons, .icon-live {
-                    height:50px;
-                    margin:auto;
+                .icon-icons,
+                .icon-live {
+                    height: 50px;
+                    margin: auto;
                     overflow: hidden;
+
                     .search-type {
                         display: inline-block;
-                        width:100%;
+                        width: 100%;
                         position: absolute;
                         justify-content: center;
                         align-items: center;
@@ -112,10 +116,11 @@
                         overflow: hidden;
 
                         img {
-                            width:100% !important;
-                            height:auto !important;
+                            width: 100% !important;
+                            height: auto !important;
                         }
                     }
+
                     .search-type:hover+.search-label {
                         opacity: 1;
                     }
@@ -134,16 +139,18 @@
                 }
 
                 .icon-live:hover {
-                    height:175px;
+                    height: 175px;
+
                     .pdfBox-cont {
                         img {
-                            width:100% !important;
+                            width: 100% !important;
                         }
                     }
                 }
             }
+
             .search-info:hover {
-                width:60%; 
+                width: 60%;
             }
         }
     }
@@ -176,12 +183,15 @@
     }
 
 }
+
 .search-overview:hover {
     z-index: 1;
 }
+
 .collection {
-    display:flex;
+    display: flex;
 }
+
 .collection-item {
-    width:35px;
+    width: 35px;
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From b5740401b027c372edb5bbf465f91abfda663705 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 15:00:47 -0400
Subject: small ui changes done

---
 src/client/views/search/FilterBox.tsx   |  2 +-
 src/client/views/search/SearchBox.tsx   |  2 +-
 src/client/views/search/SearchItem.scss | 13 +++++++++----
 src/client/views/search/SearchItem.tsx  |  4 ++--
 4 files changed, 13 insertions(+), 8 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/FilterBox.tsx b/src/client/views/search/FilterBox.tsx
index c6c18f9b4..58a873ced 100644
--- a/src/client/views/search/FilterBox.tsx
+++ b/src/client/views/search/FilterBox.tsx
@@ -260,7 +260,7 @@ export class FilterBox extends React.Component {
     @action.bound
     handleWordQueryChange = () => { this._basicWordStatus = !this._basicWordStatus; }
 
-    @action
+    @action.bound
     getBasicWordStatus() { return this._basicWordStatus; }
 
     @action.bound
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index cddc56a8a..121abf973 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -170,7 +170,7 @@ export class SearchBox extends React.Component {
         return (
             <div className="searchBox-container">
                 <div className="searchBox-bar">
-                    <span className="searchBox-barChild searchBox-collection" onPointerDown={SetupDrag(this.collectionRef, this.startDragCollection)} ref={this.collectionRef}>
+                    <span className="searchBox-barChild searchBox-collection" onPointerDown={SetupDrag(this.collectionRef, this.startDragCollection)} ref={this.collectionRef} title="Drag Results as Collection">
                         <FontAwesomeIcon icon="object-group" size="lg" />
                     </span>
                     <input value={this._searchString} onChange={this.onChange} type="text" placeholder="Search..."
diff --git a/src/client/views/search/SearchItem.scss b/src/client/views/search/SearchItem.scss
index 140ced8e5..827cb7567 100644
--- a/src/client/views/search/SearchItem.scss
+++ b/src/client/views/search/SearchItem.scss
@@ -64,14 +64,17 @@
                     }
 
                     .link-extended {
+                        // display: none;
+                        visibility: hidden;
                         opacity: 0;
                         position: relative;
                         z-index: 500;
                         overflow: hidden;
-                        -webkit-transition: opacity 0.2s ease-in-out;
-                        -moz-transition: opacity 0.2s ease-in-out;
-                        -o-transition: opacity 0.2s ease-in-out;
-                        transition: opacity 0.2s ease-in-out;
+                        -webkit-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                        -moz-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                        -o-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                        transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                        // transition-delay: 1s;
                     }
 
                 }
@@ -86,6 +89,8 @@
 
                 .link-container.item:hover .link-extended {
                     opacity: 1;
+                    visibility: visible;
+                    // display: inline;
                 }
 
                 .icon-icons {
diff --git a/src/client/views/search/SearchItem.tsx b/src/client/views/search/SearchItem.tsx
index cd7e31b20..b3ba4c3dd 100644
--- a/src/client/views/search/SearchItem.tsx
+++ b/src/client/views/search/SearchItem.tsx
@@ -244,8 +244,8 @@ export class SearchItem extends React.Component<SearchItemProps> {
                         <div className="search-title" id="result" >{StrCast(this.props.doc.title)}</div>
                         <div className="search-info" style={{ width: this._useIcons ? "15%" : "400px" }}>
                             <div className={`icon-${this._useIcons ? "icons" : "live"}`}>
-                                <div className="search-type" >{this.DocumentIcon}</div>
-                                <div className="search-label">{this.props.doc.type}</div>
+                                <div className="search-type" title="Click to Preview">{this.DocumentIcon}</div>
+                                <div className="search-label">{this.props.doc.type ? this.props.doc.type : "Other"}</div>
                             </div>
                             <div className="link-container item">
                                 <div className="link-count">{this.linkCount}</div>
-- 
cgit v1.2.3-70-g09d2


From 2575564d70828820521074455383e940d521cca8 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 16:03:22 -0400
Subject: yeeeee

---
 src/client/views/search/SearchBox.scss |  3 +-
 src/client/views/search/SearchBox.tsx  | 73 ++++++++++++++--------------------
 2 files changed, 32 insertions(+), 44 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 2a27bbe62..4c78b2682 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -46,7 +46,8 @@
     display: flex;
     flex-direction: column;
     margin-right: 72px;
-    height: 560px;
+    height: auto;
+    max-height: 560px;
     overflow: hidden;
     overflow-y: auto;
 
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index e5280fe8c..47f951f42 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -26,11 +26,7 @@ export class SearchBox extends React.Component {
     @observable private _resultsOpen: boolean = false;
     @observable private _results: Doc[] = [];
     @observable private _openNoResults: boolean = false;
-    @observable public _pageNum: number = 0;
-    //temp
-    @observable public _maxNum: number = 10;
     @observable private _visibleElements: JSX.Element[] = [];
-    // @observable private _sc rollY: number = 0;
 
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _numTotalResults = -1;
@@ -117,59 +113,50 @@ export class SearchBox extends React.Component {
             this._openNoResults = true;
             this.resultsScrolled();
         });
+    }
 
-        console.log(this._results)
+    getAllResults = async (query: string) => {
+        return SearchUtil.Search(query, true, 0, 10000000);
     }
 
-    getResults = async (query: string, all: boolean = false) => {
+    getResults = async (query: string) => {
 
-        if (all) {
-            // let { numFound, docs } = await SearchUtil.Search(query, true, this._maxSearchIndex, 100000);
-            let prom: Promise<any> = SearchUtil.Search(query, true, 0, 100000);
+        while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
 
-            prom.then(({ docs, numFound }) => {
-                this._results = docs;
-            })
-        }
-        else {
-            while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
-
-                let prom: Promise<any>;
-                if (this._curRequest) {
-                    prom = this._curRequest;
-                    return;
-                } else {
-                    prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
-                    this._maxSearchIndex += 10;
-                }
-                prom.then(action((res: SearchUtil.DocSearchResult) => {
+            let prom: Promise<any>;
+            if (this._curRequest) {
+                prom = this._curRequest;
+                return;
+            } else {
+                prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
+                this._maxSearchIndex += 10;
+            }
+            prom.then(action((res: SearchUtil.DocSearchResult) => {
 
-                    // happens at the beginning
-                    if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
-                        this._numTotalResults = res.numFound;
-                    }
+                // happens at the beginning
+                if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
+                    this._numTotalResults = res.numFound;
+                }
 
-                    let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-                    this._results.push(...filteredDocs);
+                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+                this._results.push(...filteredDocs);
 
-                    if (prom === this._curRequest) {
-                        this._curRequest = undefined;
-                    }
-                }));
+                if (prom === this._curRequest) {
+                    this._curRequest = undefined;
+                }
+            }));
 
-                this._curRequest = prom;
+            this._curRequest = prom;
 
-                await prom;
-            }
+            await prom;
         }
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
     startDragCollection = async () => {
-        await this.getResults(FilterBox.Instance.getFinalQuery(this._searchString), true);
-        console.log(this._results)
-        // if (res !== undefined) {
-        const docs = this._results.map(doc => {
+        let res = await this.getAllResults(FilterBox.Instance.getFinalQuery(this._searchString));
+        // console.log(this._results)
+        const docs = res.docs.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
             if (isProto) {
                 return Doc.MakeDelegate(doc);
@@ -202,7 +189,7 @@ export class SearchBox extends React.Component {
             }
         }
         return Docs.FreeformDocument(docs, { width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"` });
-        // }
+
     }
 
     @action.bound
-- 
cgit v1.2.3-70-g09d2


From dcb7b3ec59b8458fc074656067b35e9068d5e3de Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 17:08:15 -0400
Subject: fixed

---
 src/client/views/search/SearchBox.scss |   2 -
 src/client/views/search/SearchBox.tsx  | 342 ++++++++++++++++++++++++++-------
 2 files changed, 277 insertions(+), 67 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 4c78b2682..1ec89ed2b 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -46,9 +46,7 @@
     display: flex;
     flex-direction: column;
     margin-right: 72px;
-    height: auto;
     max-height: 560px;
-    overflow: hidden;
     overflow-y: auto;
 
     .no-result {
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 5989e49bd..b9ada9677 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -1,26 +1,111 @@
 import * as React from 'react';
-import { observer } from 'mobx-react';
-import { observable, action, runInAction, flow } from 'mobx';
+
+import {
+    observer
+}
+
+    from 'mobx-react';
+
+import {
+    observable,
+    action,
+    runInAction,
+    flow,
+    computed
+}
+
+    from 'mobx';
 import "./SearchBox.scss";
 import "./FilterBox.scss";
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { SetupDrag } from '../../util/DragManager';
-import { Docs } from '../../documents/Documents';
-import { NumCast } from '../../../new_fields/Types';
-import { Doc } from '../../../new_fields/Doc';
-import { SearchItem } from './SearchItem';
-import { DocServer } from '../../DocServer';
+
+import {
+    FontAwesomeIcon
+}
+
+    from '@fortawesome/react-fontawesome';
+
+import {
+    SetupDrag
+}
+
+    from '../../util/DragManager';
+
+import {
+    Docs
+}
+
+    from '../../documents/Documents';
+
+import {
+    NumCast
+}
+
+    from '../../../new_fields/Types';
+
+import {
+    Doc
+}
+
+    from '../../../new_fields/Doc';
+
+import {
+    SearchItem
+}
+
+    from './SearchItem';
+
+import {
+    DocServer
+}
+
+    from '../../DocServer';
 import * as rp from 'request-promise';
-import { Id } from '../../../new_fields/FieldSymbols';
-import { SearchUtil } from '../../util/SearchUtil';
-import { RouteStore } from '../../../server/RouteStore';
-import { FilterBox } from './FilterBox';
-import { start } from 'repl';
-import { getForkTsCheckerWebpackPluginHooks } from 'fork-ts-checker-webpack-plugin/lib/hooks';
-import { faThumbsDown } from '@fortawesome/free-regular-svg-icons';
 
-@observer
-export class SearchBox extends React.Component {
+import {
+    Id
+}
+
+    from '../../../new_fields/FieldSymbols';
+
+import {
+    SearchUtil
+}
+
+    from '../../util/SearchUtil';
+
+import {
+    RouteStore
+}
+
+    from '../../../server/RouteStore';
+
+import {
+    FilterBox
+}
+
+    from './FilterBox';
+
+import {
+    start
+}
+
+    from 'repl';
+
+import {
+    getForkTsCheckerWebpackPluginHooks
+}
+
+    from 'fork-ts-checker-webpack-plugin/lib/hooks';
+
+import {
+    faThumbsDown
+}
+
+    from '@fortawesome/free-regular-svg-icons';
+import * as $ from 'jquery';
+
+
+@observer export class SearchBox extends React.Component {
 
     @observable private _searchString: string = "";
     @observable private _resultsOpen: boolean = false;
@@ -45,18 +130,19 @@ export class SearchBox extends React.Component {
         this.resultsScrolled = this.resultsScrolled.bind(this);
     }
 
-    @action
-    getViews = async (doc: Doc) => {
+    @action getViews = async (doc: Doc) => {
         const results = await SearchUtil.GetViewsOfDocument(doc);
         let toReturn: Doc[] = [];
+
         await runInAction(() => {
             toReturn = results;
-        });
+        }
+
+        );
         return toReturn;
     }
 
-    @action.bound
-    onChange(e: React.ChangeEvent<HTMLInputElement>) {
+    @action.bound onChange(e: React.ChangeEvent<HTMLInputElement>) {
         this._searchString = e.target.value;
 
         this._openNoResults = false;
@@ -69,27 +155,37 @@ export class SearchBox extends React.Component {
         this._maxSearchIndex = 0;
     }
 
-    enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
+    enter = (e: React.KeyboardEvent) => {
+        if (e.key === "Enter") {
+            this.submitSearch();
+        }
+    }
 
     public static async convertDataUri(imageUri: string, returnedFilename: string) {
         try {
             let posting = DocServer.prepend(RouteStore.dataUriToImage);
+
             const returnedUri = await rp.post(posting, {
                 body: {
                     uri: imageUri,
                     name: returnedFilename
-                },
+                }
+
+                ,
                 json: true,
-            });
+            }
+
+            );
             return returnedUri;
 
-        } catch (e) {
+        }
+
+        catch (e) {
             console.log(e);
         }
     }
 
-    @action
-    submitSearch = async () => {
+    @action submitSearch = async () => {
         let query = this._searchString;
         query = FilterBox.Instance.getFinalQuery(query);
         this._results = [];
@@ -100,6 +196,7 @@ export class SearchBox extends React.Component {
         if (query === "") {
             return;
         }
+
         else {
             this._startIndex = 0;
             this._endIndex = 12;
@@ -112,7 +209,9 @@ export class SearchBox extends React.Component {
             this._resultsOpen = true;
             this._openNoResults = true;
             this.resultsScrolled();
-        });
+        }
+
+        );
     }
 
     getAllResults = async (query: string) => {
@@ -124,13 +223,17 @@ export class SearchBox extends React.Component {
         while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
 
             let prom: Promise<any>;
+
             if (this._curRequest) {
                 prom = this._curRequest;
                 return;
-            } else {
+            }
+
+            else {
                 prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
                 this._maxSearchIndex += 10;
             }
+
             prom.then(action((res: SearchUtil.DocSearchResult) => {
 
                 // happens at the beginning
@@ -144,7 +247,9 @@ export class SearchBox extends React.Component {
                 if (prom === this._curRequest) {
                     this._curRequest = undefined;
                 }
-            }));
+            }
+
+            ));
 
             this._curRequest = prom;
 
@@ -153,47 +258,67 @@ export class SearchBox extends React.Component {
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
+
     startDragCollection = async () => {
         let res = await this.getAllResults(FilterBox.Instance.getFinalQuery(this._searchString));
+        let filtered = FilterBox.Instance.filterDocsByType(res.docs);
+
         // console.log(this._results)
-        const docs = res.docs.map(doc => {
+        const docs = filtered.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
+
             if (isProto) {
                 return Doc.MakeDelegate(doc);
-            } else {
+            }
+
+            else {
                 return Doc.MakeAlias(doc);
             }
-        });
+        }
+
+        );
         let x = 0;
         let y = 0;
+
         for (const doc of docs) {
             doc.x = x;
             doc.y = y;
             const size = 200;
             const aspect = NumCast(doc.nativeHeight) / NumCast(doc.nativeWidth, 1);
+
             if (aspect > 1) {
                 doc.height = size;
                 doc.width = size / aspect;
-            } else if (aspect > 0) {
+            }
+
+            else if (aspect > 0) {
                 doc.width = size;
                 doc.height = size * aspect;
-            } else {
+            }
+
+            else {
                 doc.width = size;
                 doc.height = size;
             }
+
             doc.zoomBasis = 1;
             x += 250;
+
             if (x > 1000) {
                 x = 0;
                 y += 300;
             }
         }
-        return Docs.Create.FreeformDocument(docs, { width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"` });
+
+        return Docs.Create.FreeformDocument(docs, {
+            width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"`
+        }
+
+        );
 
     }
 
-    @action.bound
-    openSearch(e: React.PointerEvent) {
+    @action.bound openSearch(e: React.PointerEvent) {
         e.stopPropagation();
         this._openNoResults = false;
         FilterBox.Instance.closeFilter();
@@ -201,14 +326,12 @@ export class SearchBox extends React.Component {
         FilterBox.Instance._pointerTime = e.timeStamp;
     }
 
-    @action.bound
-    closeSearch = () => {
+    @action.bound closeSearch = () => {
         FilterBox.Instance.closeFilter();
         this.closeResults();
     }
 
-    @action.bound
-    closeResults() {
+    @action.bound closeResults() {
         this._resultsOpen = false;
         this._results = [];
         this._visibleElements = [];
@@ -245,59 +368,148 @@ export class SearchBox extends React.Component {
             this._isSearch = Array<undefined>(this._numTotalResults === -1 ? 0 : this._numTotalResults);
         }
 
-        for (let i = 0; i < this._numTotalResults; i++) {
+        for (let i = 0;
+            i < this._numTotalResults;
+
+            i++) {
+
             //if the index is out of the window then put a placeholder in
             //should ones that have already been found get set to placeholders?
             if (i < startIndex || i > endIndex) {
                 if (this._isSearch[i] !== "placeholder") {
                     this._isSearch[i] = "placeholder";
-                    this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
+
+                    this._visibleElements[i] = <div className="searchBox-placeholder" key={
+                        `searchBox-placeholder-$ {
+                            i
+                        }
+
+                        `
+                    }
+
+                    ></div>;
                 }
             }
+
             else {
                 if (this._isSearch[i] !== "search") {
                     let result: Doc | undefined = undefined;
+
                     if (i >= this._results.length) {
                         this.getResults(this._searchString);
                         if (i < this._results.length) result = this._results[i];
+
                         if (result) {
-                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                            this._visibleElements[i] = <SearchItem doc={
+                                result
+                            }
+
+                                key={
+                                    result[Id]
+                                }
+
+                            />;
                             this._isSearch[i] = "search";
                         }
                     }
+
                     else {
                         result = this._results[i];
+
                         if (result) {
-                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
+                            this._visibleElements[i] = <SearchItem doc={
+                                result
+                            }
+
+                                key={
+                                    result[Id]
+                                }
+
+                            />;
                             this._isSearch[i] = "search";
                         }
                     }
                 }
             }
         }
+
         if (this._maxSearchIndex >= this._numTotalResults) {
             this._visibleElements.length = this._results.length;
             this._isSearch.length = this._results.length;
         }
-    });
+    }
+
+    );
+
+    @computed get resFull() {
+        console.log(`res full $ {
+            this._numTotalResults <=8
+        }
+
+        `) return this._numTotalResults <= 8;
+    }
+
+    @computed get resultHeight() {
+        return this._numTotalResults * 70;
+    }
 
     render() {
-        return (
-            <div className="searchBox-container">
-                <div className="searchBox-bar">
-                    <span className="searchBox-barChild searchBox-collection" onPointerDown={SetupDrag(this.collectionRef, this.startDragCollection)} ref={this.collectionRef}>
-                        <FontAwesomeIcon icon="object-group" size="lg" />
-                    </span>
-                    <input value={this._searchString} onChange={this.onChange} type="text" placeholder="Search..."
-                        className="searchBox-barChild searchBox-input" onPointerDown={this.openSearch} onKeyPress={this.enter}
-                        style={{ width: this._resultsOpen ? "500px" : "100px" }} />
-                    <button className="searchBox-barChild searchBox-filter" onClick={FilterBox.Instance.openFilter} onPointerDown={FilterBox.Instance.stopProp}>Filter</button>
-                </div>
-                <div className="searchBox-results" onScroll={this.resultsScrolled} style={this._resultsOpen ? { display: "flex" } : { display: "none" }}>
-                    {this._visibleElements}
-                </div>
-            </div>
-        );
+        return (<div className="searchBox-container"> <div className="searchBox-bar"> <span className="searchBox-barChild searchBox-collection" onPointerDown={
+            SetupDrag(this.collectionRef, this.startDragCollection)
+        }
+
+            ref={
+                this.collectionRef
+            }
+
+        > <FontAwesomeIcon icon="object-group" size="lg" /> </span> <input value={
+            this._searchString
+        }
+
+            onChange={
+                this.onChange
+            }
+
+            type="text" placeholder="Search..."
+
+            className="searchBox-barChild searchBox-input" onPointerDown={
+                this.openSearch
+            }
+
+            onKeyPress={
+                this.enter
+            }
+
+            style={
+                {
+                    width: this._resultsOpen ? "500px" : "100px"
+                }
+            }
+
+            /> <button className="searchBox-barChild searchBox-filter" onClick={
+                FilterBox.Instance.openFilter
+            }
+
+                onPointerDown={
+                    FilterBox.Instance.stopProp
+                }
+
+            >Filter</button> </div> <div className="searchBox-results" onScroll={
+                this.resultsScrolled
+            }
+
+                style={
+                    {
+                        display: this._resultsOpen ? "flex" : "none",
+                        height: this.resFull ? "560px" : this.resultHeight, overflow: this.resFull ? "auto" : "visible"
+                    }
+                }
+
+            > {
+                    this._visibleElements
+                }
+
+            </div> </div>);
     }
 
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From f0e1eae76147d9c70309dcea54f6516622efca0f Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 17:11:03 -0400
Subject: oops

---
 src/client/views/search/SearchBox.tsx | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index b9ada9677..8bf8e3bfa 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -442,11 +442,7 @@ import * as $ from 'jquery';
     );
 
     @computed get resFull() {
-        console.log(`res full $ {
-            this._numTotalResults <=8
-        }
-
-        `) return this._numTotalResults <= 8;
+        return this._numTotalResults <= 8;
     }
 
     @computed get resultHeight() {
-- 
cgit v1.2.3-70-g09d2


From 44b91eacaab13eebaaa707f42670f01a736c5bba Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 18:12:02 -0400
Subject: small changes

---
 src/client/views/search/SearchBox.tsx  | 335 +++++++--------------------------
 src/client/views/search/SearchItem.tsx |   2 +-
 src/server/Search.ts                   |  12 ++
 3 files changed, 85 insertions(+), 264 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 8bf8e3bfa..f5748d494 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -1,111 +1,28 @@
 import * as React from 'react';
-
-import {
-    observer
-}
-
-    from 'mobx-react';
-
-import {
-    observable,
-    action,
-    runInAction,
-    flow,
-    computed
-}
-
-    from 'mobx';
+import { observer } from 'mobx-react';
+import { observable, action, runInAction, flow, computed } from 'mobx';
 import "./SearchBox.scss";
 import "./FilterBox.scss";
-
-import {
-    FontAwesomeIcon
-}
-
-    from '@fortawesome/react-fontawesome';
-
-import {
-    SetupDrag
-}
-
-    from '../../util/DragManager';
-
-import {
-    Docs
-}
-
-    from '../../documents/Documents';
-
-import {
-    NumCast
-}
-
-    from '../../../new_fields/Types';
-
-import {
-    Doc
-}
-
-    from '../../../new_fields/Doc';
-
-import {
-    SearchItem
-}
-
-    from './SearchItem';
-
-import {
-    DocServer
-}
-
-    from '../../DocServer';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { SetupDrag } from '../../util/DragManager';
+import { Docs } from '../../documents/Documents';
+import { NumCast } from '../../../new_fields/Types';
+import { Doc } from '../../../new_fields/Doc';
+import { SearchItem } from './SearchItem';
+import { DocServer } from '../../DocServer';
 import * as rp from 'request-promise';
-
-import {
-    Id
-}
-
-    from '../../../new_fields/FieldSymbols';
-
-import {
-    SearchUtil
-}
-
-    from '../../util/SearchUtil';
-
-import {
-    RouteStore
-}
-
-    from '../../../server/RouteStore';
-
-import {
-    FilterBox
-}
-
-    from './FilterBox';
-
-import {
-    start
-}
-
-    from 'repl';
-
-import {
-    getForkTsCheckerWebpackPluginHooks
-}
-
-    from 'fork-ts-checker-webpack-plugin/lib/hooks';
-
-import {
-    faThumbsDown
-}
-
-    from '@fortawesome/free-regular-svg-icons';
+import { Id } from '../../../new_fields/FieldSymbols';
+import { SearchUtil } from '../../util/SearchUtil';
+import { RouteStore } from '../../../server/RouteStore';
+import { FilterBox } from './FilterBox';
+import { start } from 'repl';
+import { getForkTsCheckerWebpackPluginHooks } from 'fork-ts-checker-webpack-plugin/lib/hooks';
+import { faThumbsDown } from '@fortawesome/free-regular-svg-icons';
 import * as $ from 'jquery';
 
 
-@observer export class SearchBox extends React.Component {
+@observer
+export class SearchBox extends React.Component {
 
     @observable private _searchString: string = "";
     @observable private _resultsOpen: boolean = false;
@@ -130,19 +47,18 @@ import * as $ from 'jquery';
         this.resultsScrolled = this.resultsScrolled.bind(this);
     }
 
-    @action getViews = async (doc: Doc) => {
+    @action
+    getViews = async (doc: Doc) => {
         const results = await SearchUtil.GetViewsOfDocument(doc);
         let toReturn: Doc[] = [];
-
         await runInAction(() => {
             toReturn = results;
-        }
-
-        );
+        });
         return toReturn;
     }
 
-    @action.bound onChange(e: React.ChangeEvent<HTMLInputElement>) {
+    @action.bound
+    onChange(e: React.ChangeEvent<HTMLInputElement>) {
         this._searchString = e.target.value;
 
         this._openNoResults = false;
@@ -155,37 +71,27 @@ import * as $ from 'jquery';
         this._maxSearchIndex = 0;
     }
 
-    enter = (e: React.KeyboardEvent) => {
-        if (e.key === "Enter") {
-            this.submitSearch();
-        }
-    }
+    enter = (e: React.KeyboardEvent) => { if (e.key === "Enter") { this.submitSearch(); } }
 
     public static async convertDataUri(imageUri: string, returnedFilename: string) {
         try {
             let posting = DocServer.prepend(RouteStore.dataUriToImage);
-
             const returnedUri = await rp.post(posting, {
                 body: {
                     uri: imageUri,
                     name: returnedFilename
-                }
-
-                ,
+                },
                 json: true,
-            }
-
-            );
+            });
             return returnedUri;
 
-        }
-
-        catch (e) {
+        } catch (e) {
             console.log(e);
         }
     }
 
-    @action submitSearch = async () => {
+    @action
+    submitSearch = async () => {
         let query = this._searchString;
         query = FilterBox.Instance.getFinalQuery(query);
         this._results = [];
@@ -196,7 +102,6 @@ import * as $ from 'jquery';
         if (query === "") {
             return;
         }
-
         else {
             this._startIndex = 0;
             this._endIndex = 12;
@@ -209,9 +114,7 @@ import * as $ from 'jquery';
             this._resultsOpen = true;
             this._openNoResults = true;
             this.resultsScrolled();
-        }
-
-        );
+        });
     }
 
     getAllResults = async (query: string) => {
@@ -223,17 +126,13 @@ import * as $ from 'jquery';
         while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
 
             let prom: Promise<any>;
-
             if (this._curRequest) {
                 prom = this._curRequest;
                 return;
-            }
-
-            else {
+            } else {
                 prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
                 this._maxSearchIndex += 10;
             }
-
             prom.then(action((res: SearchUtil.DocSearchResult) => {
 
                 // happens at the beginning
@@ -247,9 +146,7 @@ import * as $ from 'jquery';
                 if (prom === this._curRequest) {
                     this._curRequest = undefined;
                 }
-            }
-
-            ));
+            }));
 
             this._curRequest = prom;
 
@@ -258,67 +155,48 @@ import * as $ from 'jquery';
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
-
     startDragCollection = async () => {
         let res = await this.getAllResults(FilterBox.Instance.getFinalQuery(this._searchString));
         let filtered = FilterBox.Instance.filterDocsByType(res.docs);
-
         // console.log(this._results)
         const docs = filtered.map(doc => {
             const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
-
             if (isProto) {
                 return Doc.MakeDelegate(doc);
-            }
-
-            else {
+            } else {
                 return Doc.MakeAlias(doc);
             }
-        }
-
-        );
+        });
         let x = 0;
         let y = 0;
-
         for (const doc of docs) {
             doc.x = x;
             doc.y = y;
             const size = 200;
             const aspect = NumCast(doc.nativeHeight) / NumCast(doc.nativeWidth, 1);
-
             if (aspect > 1) {
                 doc.height = size;
                 doc.width = size / aspect;
-            }
-
-            else if (aspect > 0) {
+            } else if (aspect > 0) {
                 doc.width = size;
                 doc.height = size * aspect;
-            }
-
-            else {
+            } else {
                 doc.width = size;
                 doc.height = size;
             }
-
             doc.zoomBasis = 1;
             x += 250;
-
             if (x > 1000) {
                 x = 0;
                 y += 300;
             }
         }
-
-        return Docs.Create.FreeformDocument(docs, {
-            width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"`
-        }
-
-        );
+        return Docs.Create.FreeformDocument(docs, { width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this._searchString}"` });
 
     }
 
-    @action.bound openSearch(e: React.PointerEvent) {
+    @action.bound
+    openSearch(e: React.PointerEvent) {
         e.stopPropagation();
         this._openNoResults = false;
         FilterBox.Instance.closeFilter();
@@ -326,12 +204,14 @@ import * as $ from 'jquery';
         FilterBox.Instance._pointerTime = e.timeStamp;
     }
 
-    @action.bound closeSearch = () => {
+    @action.bound
+    closeSearch = () => {
         FilterBox.Instance.closeFilter();
         this.closeResults();
     }
 
-    @action.bound closeResults() {
+    @action.bound
+    closeResults() {
         this._resultsOpen = false;
         this._results = [];
         this._visibleElements = [];
@@ -368,144 +248,73 @@ import * as $ from 'jquery';
             this._isSearch = Array<undefined>(this._numTotalResults === -1 ? 0 : this._numTotalResults);
         }
 
-        for (let i = 0;
-            i < this._numTotalResults;
-
-            i++) {
-
+        for (let i = 0; i < this._numTotalResults; i++) {
             //if the index is out of the window then put a placeholder in
             //should ones that have already been found get set to placeholders?
             if (i < startIndex || i > endIndex) {
                 if (this._isSearch[i] !== "placeholder") {
                     this._isSearch[i] = "placeholder";
-
-                    this._visibleElements[i] = <div className="searchBox-placeholder" key={
-                        `searchBox-placeholder-$ {
-                            i
-                        }
-
-                        `
-                    }
-
-                    ></div>;
+                    this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
                 }
             }
-
             else {
                 if (this._isSearch[i] !== "search") {
                     let result: Doc | undefined = undefined;
-
                     if (i >= this._results.length) {
                         this.getResults(this._searchString);
                         if (i < this._results.length) result = this._results[i];
-
                         if (result) {
-                            this._visibleElements[i] = <SearchItem doc={
-                                result
-                            }
-
-                                key={
-                                    result[Id]
-                                }
-
-                            />;
+                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
                             this._isSearch[i] = "search";
                         }
                     }
-
                     else {
                         result = this._results[i];
-
                         if (result) {
-                            this._visibleElements[i] = <SearchItem doc={
-                                result
-                            }
-
-                                key={
-                                    result[Id]
-                                }
-
-                            />;
+                            this._visibleElements[i] = <SearchItem doc={result} key={result[Id]} />;
                             this._isSearch[i] = "search";
                         }
                     }
                 }
             }
         }
-
         if (this._maxSearchIndex >= this._numTotalResults) {
             this._visibleElements.length = this._results.length;
             this._isSearch.length = this._results.length;
         }
-    }
+    });
 
-    );
-
-    @computed get resFull() {
+    @computed
+    get resFull() {
+        console.log(this._numTotalResults)
         return this._numTotalResults <= 8;
     }
 
-    @computed get resultHeight() {
+    @computed
+    get resultHeight() {
         return this._numTotalResults * 70;
     }
 
     render() {
-        return (<div className="searchBox-container"> <div className="searchBox-bar"> <span className="searchBox-barChild searchBox-collection" onPointerDown={
-            SetupDrag(this.collectionRef, this.startDragCollection)
-        }
-
-            ref={
-                this.collectionRef
-            }
-
-        > <FontAwesomeIcon icon="object-group" size="lg" /> </span> <input value={
-            this._searchString
-        }
-
-            onChange={
-                this.onChange
-            }
-
-            type="text" placeholder="Search..."
-
-            className="searchBox-barChild searchBox-input" onPointerDown={
-                this.openSearch
-            }
-
-            onKeyPress={
-                this.enter
-            }
-
-            style={
-                {
-                    width: this._resultsOpen ? "500px" : "100px"
-                }
-            }
-
-            /> <button className="searchBox-barChild searchBox-filter" onClick={
-                FilterBox.Instance.openFilter
-            }
-
-                onPointerDown={
-                    FilterBox.Instance.stopProp
-                }
-
-            >Filter</button> </div> <div className="searchBox-results" onScroll={
-                this.resultsScrolled
-            }
-
-                style={
-                    {
-                        display: this._resultsOpen ? "flex" : "none",
-                        height: this.resFull ? "560px" : this.resultHeight, overflow: this.resFull ? "auto" : "visible"
-                    }
-                }
-
-            > {
-                    this._visibleElements
-                }
-
-            </div> </div>);
+        return (
+            <div className="searchBox-container">
+                <div className="searchBox-bar">
+                    <span className="searchBox-barChild searchBox-collection" onPointerDown={SetupDrag(this.collectionRef, this.startDragCollection)} ref={this.collectionRef}>
+                        <FontAwesomeIcon icon="object-group" size="lg" />
+                    </span>
+                    <input value={this._searchString} onChange={this.onChange} type="text" placeholder="Search..."
+                        className="searchBox-barChild searchBox-input" onPointerDown={this.openSearch} onKeyPress={this.enter}
+                        style={{ width: this._resultsOpen ? "500px" : "100px" }} />
+                    <button className="searchBox-barChild searchBox-filter" onClick={FilterBox.Instance.openFilter} onPointerDown={FilterBox.Instance.stopProp}>Filter</button>
+                </div>
+                <div className="searchBox-results" onScroll={this.resultsScrolled} style={{
+                    display: this._resultsOpen ? "flex" : "none",
+                    height: this.resFull ? "560px" : this.resultHeight, overflow: this.resFull ? "auto" : "visible"
+                }}>
+                    {this._visibleElements}
+                </div>
+            </div>
+        );
     }
 
 }
\ No newline at end of file
diff --git a/src/client/views/search/SearchItem.tsx b/src/client/views/search/SearchItem.tsx
index cd7e31b20..134c13dc8 100644
--- a/src/client/views/search/SearchItem.tsx
+++ b/src/client/views/search/SearchItem.tsx
@@ -240,7 +240,7 @@ export class SearchItem extends React.Component<SearchItemProps> {
                 <div className="search-item" onPointerEnter={this.highlightDoc} onPointerLeave={this.unHighlightDoc} id="result"
                     onClick={this.onClick} onPointerDown={this.pointerDown} >
                     <div className="main-search-info">
-                        <div title="Drag as document" onPointerDown={this.onPointerDown}> <FontAwesomeIcon icon="file" size="lg" /> </div>
+                        <div title="Drag as document" onPointerDown={this.onPointerDown} style={{ marginRight: "7px" }}> <FontAwesomeIcon icon="file" size="lg" /> </div>
                         <div className="search-title" id="result" >{StrCast(this.props.doc.title)}</div>
                         <div className="search-info" style={{ width: this._useIcons ? "15%" : "400px" }}>
                             <div className={`icon-${this._useIcons ? "icons" : "live"}`}>
diff --git a/src/server/Search.ts b/src/server/Search.ts
index ffba4ea8e..98f421937 100644
--- a/src/server/Search.ts
+++ b/src/server/Search.ts
@@ -18,6 +18,18 @@ export class Search {
         }
     }
 
+    public async updateDocuments(documents: any[]) {
+        try {
+            const res = await rp.post(this.url + "dash/update", {
+                headers: { 'content-type': 'application/json' },
+                body: JSON.stringify(documents)
+            });
+            return res;
+        } catch (e) {
+            // console.warn("Search error: " + e + document);
+        }
+    }
+
     public async search(query: string, start: number = 0, rows: number = 10) {
         try {
             const searchResults = JSON.parse(await rp.get(this.url + "dash/select", {
-- 
cgit v1.2.3-70-g09d2


From 29840e571c2f17d0bb346186dd91f1d895684a95 Mon Sep 17 00:00:00 2001
From: monikahedman <monika_hedman@brown.edu>
Date: Sun, 14 Jul 2019 18:15:39 -0400
Subject: fixed no search results

---
 src/client/views/search/SearchBox.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index f5748d494..bfad9a845 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -230,7 +230,7 @@ export class SearchBox extends React.Component {
         this._startIndex = startIndex === -1 ? 0 : startIndex;
         this._endIndex = endIndex === -1 ? 12 : endIndex;
 
-        if (this._numTotalResults === 0 && this._openNoResults) {
+        if ((this._numTotalResults === 0 || this._results.length === 0) && this._openNoResults) {
             this._visibleElements = [<div className="no-result">No Search Results</div>];
             return;
         }
-- 
cgit v1.2.3-70-g09d2


From 8c80710f241376043e8700ec79277fc039f3a00b Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 22:19:33 -0400
Subject: Cleaned up imports

---
 src/client/views/search/SearchBox.tsx | 9 ---------
 1 file changed, 9 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index bfad9a845..67aaa387c 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -15,10 +15,6 @@ import { Id } from '../../../new_fields/FieldSymbols';
 import { SearchUtil } from '../../util/SearchUtil';
 import { RouteStore } from '../../../server/RouteStore';
 import { FilterBox } from './FilterBox';
-import { start } from 'repl';
-import { getForkTsCheckerWebpackPluginHooks } from 'fork-ts-checker-webpack-plugin/lib/hooks';
-import { faThumbsDown } from '@fortawesome/free-regular-svg-icons';
-import * as $ from 'jquery';
 
 
 @observer
@@ -32,7 +28,6 @@ export class SearchBox extends React.Component {
 
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _numTotalResults = -1;
-    private _startIndex = -1;
     private _endIndex = -1;
 
     static Instance: SearchBox;
@@ -65,7 +60,6 @@ export class SearchBox extends React.Component {
         this._results = [];
         this._visibleElements = [];
         this._numTotalResults = -1;
-        this._startIndex = -1;
         this._endIndex = -1;
         this._curRequest = undefined;
         this._maxSearchIndex = 0;
@@ -103,7 +97,6 @@ export class SearchBox extends React.Component {
             return;
         }
         else {
-            this._startIndex = 0;
             this._endIndex = 12;
             this._maxSearchIndex = 0;
             this._numTotalResults = -1;
@@ -216,7 +209,6 @@ export class SearchBox extends React.Component {
         this._results = [];
         this._visibleElements = [];
         this._numTotalResults = -1;
-        this._startIndex = -1;
         this._endIndex = -1;
         this._curRequest = undefined;
     }
@@ -227,7 +219,6 @@ export class SearchBox extends React.Component {
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
         let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
 
-        this._startIndex = startIndex === -1 ? 0 : startIndex;
         this._endIndex = endIndex === -1 ? 12 : endIndex;
 
         if ((this._numTotalResults === 0 || this._results.length === 0) && this._openNoResults) {
-- 
cgit v1.2.3-70-g09d2


From 0f429c53fc3df62a60be1da398740524545357bc Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 22:27:59 -0400
Subject: Compile errors

---
 src/client/views/pdf/PDFMenu.tsx      |  4 +-
 src/client/views/pdf/Page.tsx         |  2 +-
 src/client/views/search/Pager.scss    | 47 ---------------------
 src/client/views/search/Pager.tsx     | 78 -----------------------------------
 src/client/views/search/SearchBox.tsx |  5 ++-
 5 files changed, 6 insertions(+), 130 deletions(-)
 delete mode 100644 src/client/views/search/Pager.scss
 delete mode 100644 src/client/views/search/Pager.tsx

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/views/pdf/PDFMenu.tsx b/src/client/views/pdf/PDFMenu.tsx
index e73b759df..27c2a8f1a 100644
--- a/src/client/views/pdf/PDFMenu.tsx
+++ b/src/client/views/pdf/PDFMenu.tsx
@@ -18,7 +18,7 @@ export default class PDFMenu extends React.Component {
     @observable private _transitionDelay: string = "";
 
 
-    StartDrag: (e: PointerEvent, ele: HTMLDivElement) => void = emptyFunction;
+    StartDrag: (e: PointerEvent, ele: HTMLElement) => void = emptyFunction;
     Highlight: (d: Doc | undefined, color: string | undefined) => void = emptyFunction;
     Delete: () => void = emptyFunction;
     Snippet: (marquee: { left: number, top: number, width: number, height: number }) => void = emptyFunction;
@@ -34,7 +34,7 @@ export default class PDFMenu extends React.Component {
     private _offsetY: number = 0;
     private _offsetX: number = 0;
     private _mainCont: React.RefObject<HTMLDivElement> = React.createRef();
-    private _commentCont: React.RefObject<HTMLDivElement> = React.createRef();
+    private _commentCont = React.createRef<HTMLButtonElement>();
     private _snippetButton: React.RefObject<HTMLButtonElement> = React.createRef();
     private _dragging: boolean = false;
     @observable private _keyValue: string = "";
diff --git a/src/client/views/pdf/Page.tsx b/src/client/views/pdf/Page.tsx
index 1e22aca9e..b4a4b5806 100644
--- a/src/client/views/pdf/Page.tsx
+++ b/src/client/views/pdf/Page.tsx
@@ -152,7 +152,7 @@ export default class Page extends React.Component<IPageProps> {
      * start a drag event and create or put the necessary info into the drag event.
      */
     @action
-    startDrag = (e: PointerEvent, ele: HTMLDivElement): void => {
+    startDrag = (e: PointerEvent, ele: HTMLElement): void => {
         e.preventDefault();
         e.stopPropagation();
         let thisDoc = this.props.parent.Document;
diff --git a/src/client/views/search/Pager.scss b/src/client/views/search/Pager.scss
deleted file mode 100644
index 2b9c81b93..000000000
--- a/src/client/views/search/Pager.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-@import "../globalCssVariables";
-
-.search-pager {
-    background-color: $dark-color;
-    border-radius: 10px;
-    width: 500px;
-    display: flex;
-    justify-content: center;
-    // margin-left: 27px;
-    float: right;
-    margin-right: 74px;
-    margin-left: auto;
-
-    // flex-direction: column;
-
-    .search-arrows {
-        display: flex;
-        justify-content: center;
-        margin: 10px;
-        width: 50%;
-
-        .arrow {
-            -webkit-transition: all 0.2s ease-in-out;
-            -moz-transition: all 0.2s ease-in-out;
-            -o-transition: all 0.2s ease-in-out;
-            transition: all 0.2s ease-in-out;
-
-            .fontawesome-icon {
-                color: $light-color;
-                width: 20px;
-                height: 20px;
-                margin-right: 2px;
-                margin-left: 2px;
-                // opacity: .7;
-            }
-        }
-
-        .pager-title {
-            text-align: center;
-            // font-size: 8px;
-            // margin-bottom: 10px;
-            color: $light-color;
-            // padding: 2px;
-            width: 40%;
-        }
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/search/Pager.tsx b/src/client/views/search/Pager.tsx
deleted file mode 100644
index 1c62773b1..000000000
--- a/src/client/views/search/Pager.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import * as React from 'react';
-import { observer } from 'mobx-react';
-import { faArrowCircleRight, faArrowCircleLeft } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { library } from '@fortawesome/fontawesome-svg-core';
-import "./Pager.scss";
-import { SearchBox } from './SearchBox';
-import { observable, action } from 'mobx';
-import { FilterBox } from './FilterBox';
-
-library.add(faArrowCircleRight);
-library.add(faArrowCircleLeft);
-
-@observer
-export class Pager extends React.Component {
-
-    @observable _leftHover: boolean = false;
-    @observable _rightHover: boolean = false;
-
-    @action
-    onLeftClick(e: React.PointerEvent) {
-        FilterBox.Instance._pointerTime = e.timeStamp;
-        if (SearchBox.Instance._pageNum > 0) {
-            SearchBox.Instance._pageNum -= 1;
-        }
-    }
-
-    @action
-    onRightClick(e: React.PointerEvent) {
-        FilterBox.Instance._pointerTime = e.timeStamp;
-        if (SearchBox.Instance._pageNum + 1 < SearchBox.Instance._maxNum) {
-            SearchBox.Instance._pageNum += 1;
-        }
-    }
-
-    @action.bound
-    mouseInLeft() {
-        this._leftHover = true;
-    }
-
-    @action.bound
-    mouseOutLeft() {
-        this._leftHover = false;
-    }
-
-    @action.bound
-    mouseInRight() {
-        this._rightHover = true;
-    }
-
-    @action.bound
-    mouseOutRight() {
-        this._rightHover = false;
-    }
-
-    render() {
-        return (
-            <div className="search-pager">
-                <div className="search-arrows">
-                    <div className="arrow"
-                        onPointerDown={this.onLeftClick} style={SearchBox.Instance._pageNum === 0 ? { opacity: .2 } : this._leftHover ? { opacity: 1 } : { opacity: .7 }}
-                        onMouseEnter={this.mouseInLeft} onMouseOut={this.mouseOutLeft}>
-                        <FontAwesomeIcon className="fontawesome-icon" icon={faArrowCircleLeft} />
-                    </div>
-                    <div className="pager-title">
-                        page {SearchBox.Instance._pageNum + 1} of {SearchBox.Instance._maxNum}
-                    </div>
-                    <div className="arrow"
-                        onPointerDown={this.onRightClick} style={SearchBox.Instance._pageNum === SearchBox.Instance._maxNum - 1 ? { opacity: .2 } : this._rightHover ? { opacity: 1 } : { opacity: .7 }}
-                        onMouseEnter={this.mouseInRight} onMouseOut={this.mouseOutRight}>
-                        <FontAwesomeIcon className="fontawesome-icon" icon={faArrowCircleRight} />
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-}
\ No newline at end of file
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index c02db528a..e0c5d163e 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -213,7 +213,8 @@ export class SearchBox extends React.Component {
         this._curRequest = undefined;
     }
 
-    resultsScrolled = flow(function* (this: SearchBox, e?: React.UIEvent<HTMLDivElement>) {
+    @action
+    resultsScrolled = (e?: React.UIEvent<HTMLDivElement>) => {
         let scrollY = e ? e.currentTarget.scrollTop : 0;
         let buffer = 4;
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
@@ -273,7 +274,7 @@ export class SearchBox extends React.Component {
             this._visibleElements.length = this._results.length;
             this._isSearch.length = this._results.length;
         }
-    });
+    }
 
     @computed
     get resFull() {
-- 
cgit v1.2.3-70-g09d2


From 756b6590723c307440d7c69f9ad91073ad0f7a24 Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 23:33:35 -0400
Subject: Some search fixes and tweaks

---
 src/client/util/SerializationHelper.ts  |   7 +-
 src/client/views/search/SearchBox.tsx   |  55 +++---
 src/client/views/search/SearchItem.scss | 303 ++++++++++++++++----------------
 3 files changed, 187 insertions(+), 178 deletions(-)

(limited to 'src/client/views/search/SearchBox.tsx')

diff --git a/src/client/util/SerializationHelper.ts b/src/client/util/SerializationHelper.ts
index 17ae407c4..429fb22d9 100644
--- a/src/client/util/SerializationHelper.ts
+++ b/src/client/util/SerializationHelper.ts
@@ -1,5 +1,6 @@
 import { PropSchema, serialize, deserialize, custom, setDefaultModelSchema, getDefaultModelSchema, primitive, SKIP } from "serializr";
 import { Field } from "../../new_fields/Doc";
+import { ClientUtils } from "./ClientUtils";
 
 export namespace SerializationHelper {
     let serializing: number = 0;
@@ -38,7 +39,11 @@ export namespace SerializationHelper {
 
         serializing += 1;
         if (!obj.__type) {
-            throw Error("No property 'type' found in JSON.");
+            if (ClientUtils.RELEASE) {
+                return undefined;
+            } else {
+                throw Error("No property 'type' found in JSON.");
+            }
         }
 
         if (!(obj.__type in serializationTypes)) {
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index e0c5d163e..dc1d35b1c 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -26,6 +26,8 @@ export class SearchBox extends React.Component {
     @observable private _openNoResults: boolean = false;
     @observable private _visibleElements: JSX.Element[] = [];
 
+    private resultsRef = React.createRef<HTMLDivElement>();
+
     private _isSearch: ("search" | "placeholder" | undefined)[] = [];
     private _numTotalResults = -1;
     private _endIndex = -1;
@@ -114,37 +116,34 @@ export class SearchBox extends React.Component {
         return SearchUtil.Search(query, true, 0, 10000000);
     }
 
-    getResults = async (query: string) => {
-
-        while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
 
-            let prom: Promise<any>;
-            if (this._curRequest) {
-                prom = this._curRequest;
-                return;
-            } else {
-                prom = SearchUtil.Search(query, true, this._maxSearchIndex, 10);
-                this._maxSearchIndex += 10;
-            }
-            prom.then(action((res: SearchUtil.DocSearchResult) => {
+    private lockPromise?: Promise<void>;
+    getResults = async (query: string) => {
+        if (this.lockPromise) {
+            await this.lockPromise;
+        }
+        this.lockPromise = new Promise(async res => {
+            while (this._results.length <= this._endIndex && (this._numTotalResults === -1 || this._maxSearchIndex < this._numTotalResults)) {
+                this._curRequest = SearchUtil.Search(query, true, this._maxSearchIndex, 10).then(action((res: SearchUtil.DocSearchResult) => {
 
-                // happens at the beginning
-                if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
-                    this._numTotalResults = res.numFound;
-                }
+                    // happens at the beginning
+                    if (res.numFound !== this._numTotalResults && this._numTotalResults === -1) {
+                        this._numTotalResults = res.numFound;
+                    }
 
-                let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
-                this._results.push(...filteredDocs);
+                    let filteredDocs = FilterBox.Instance.filterDocsByType(res.docs);
+                    this._results.push(...filteredDocs);
 
-                if (prom === this._curRequest) {
                     this._curRequest = undefined;
-                }
-            }));
-
-            this._curRequest = prom;
+                }));
+                this._maxSearchIndex += 10;
 
-            await prom;
-        }
+                await this._curRequest;
+            }
+            this.resultsScrolled();
+            res();
+        });
+        return this.lockPromise;
     }
 
     collectionRef = React.createRef<HTMLSpanElement>();
@@ -215,7 +214,7 @@ export class SearchBox extends React.Component {
 
     @action
     resultsScrolled = (e?: React.UIEvent<HTMLDivElement>) => {
-        let scrollY = e ? e.currentTarget.scrollTop : 0;
+        let scrollY = e ? e.currentTarget.scrollTop : this.resultsRef.current ? this.resultsRef.current.scrollTop : 0;
         let buffer = 4;
         let startIndex = Math.floor(Math.max(0, scrollY / 70 - buffer));
         let endIndex = Math.ceil(Math.min(this._numTotalResults - 1, startIndex + (560 / 70) + buffer));
@@ -246,7 +245,7 @@ export class SearchBox extends React.Component {
             if (i < startIndex || i > endIndex) {
                 if (this._isSearch[i] !== "placeholder") {
                     this._isSearch[i] = "placeholder";
-                    this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}></div>;
+                    this._visibleElements[i] = <div className="searchBox-placeholder" key={`searchBox-placeholder-${i}`}>Loading...</div>;
                 }
             }
             else {
@@ -303,7 +302,7 @@ export class SearchBox extends React.Component {
                 <div className="searchBox-results" onScroll={this.resultsScrolled} style={{
                     display: this._resultsOpen ? "flex" : "none",
                     height: this.resFull ? "560px" : this.resultHeight, overflow: this.resFull ? "auto" : "visible"
-                }}>
+                }} ref={this.resultsRef}>
                     {this._visibleElements}
                 </div>
             </div>
diff --git a/src/client/views/search/SearchItem.scss b/src/client/views/search/SearchItem.scss
index 0fb93daad..24dd2eaa3 100644
--- a/src/client/views/search/SearchItem.scss
+++ b/src/client/views/search/SearchItem.scss
@@ -6,195 +6,200 @@
     justify-content: flex-end;
     height: 70px;
     z-index: 0;
+}
 
-    .search-item {
-        width: 500px;
-        background: $light-color-secondary;
-        border-color: $intermediate-color;
-        border-bottom-style: solid;
-        padding: 10px;
-        height: 70px;
-        z-index: 0;
-        display: inline-block;
-
-        .main-search-info {
-            display: flex;
-            flex-direction: row;
-            width: 100%;
+.searchBox-placeholder,
+.search-overview .search-item {
+    width: 500px;
+    background: $light-color-secondary;
+    border-color: $intermediate-color;
+    border-bottom-style: solid;
+    padding: 10px;
+    height: 70px;
+    z-index: 0;
+    display: inline-block;
 
-            .search-title {
-                text-transform: uppercase;
-                text-align: left;
-                width: 100%;
-                font-weight: bold;
-            }
+    .main-search-info {
+        display: flex;
+        flex-direction: row;
+        width: 100%;
 
-            .search-info {
+        .search-title {
+            text-transform: uppercase;
+            text-align: left;
+            width: 100%;
+            font-weight: bold;
+        }
+
+        .search-info {
+            display: flex;
+            justify-content: flex-end;
+
+            .link-container.item {
+                margin-left: auto;
+                margin-right: auto;
+                height: 26px;
+                width: 26px;
+                border-radius: 13px;
+                background: $dark-color;
+                color: $light-color-secondary;
                 display: flex;
-                justify-content: flex-end;
-
-                .link-container.item {
-                    margin-left: auto;
-                    margin-right: auto;
-                    height: 26px;
-                    width: 26px;
-                    border-radius: 13px;
-                    background: $dark-color;
-                    color: $light-color-secondary;
-                    display: flex;
-                    justify-content: center;
-                    align-items: center;
-                    -webkit-transition: all 0.2s ease-in-out;
-                    -moz-transition: all 0.2s ease-in-out;
-                    -o-transition: all 0.2s ease-in-out;
-                    transition: all 0.2s ease-in-out;
-                    transform-origin: top right;
-                    overflow: hidden;
+                justify-content: center;
+                align-items: center;
+                -webkit-transition: all 0.2s ease-in-out;
+                -moz-transition: all 0.2s ease-in-out;
+                -o-transition: all 0.2s ease-in-out;
+                transition: all 0.2s ease-in-out;
+                transform-origin: top right;
+                overflow: hidden;
+                position: relative;
+
+                .link-count {
+                    opacity: 1;
+                    position: absolute;
+                    z-index: 1000;
+                    text-align: center;
+                    -webkit-transition: opacity 0.2s ease-in-out;
+                    -moz-transition: opacity 0.2s ease-in-out;
+                    -o-transition: opacity 0.2s ease-in-out;
+                    transition: opacity 0.2s ease-in-out;
+                }
+
+                .link-extended {
+                    // display: none;
+                    visibility: hidden;
+                    opacity: 0;
                     position: relative;
+                    z-index: 500;
+                    overflow: hidden;
+                    -webkit-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                    -moz-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                    -o-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                    transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
+                    // transition-delay: 1s;
+                }
 
-                    .link-count {
-                        opacity: 1;
-                        position: absolute;
-                        z-index: 1000;
-                        text-align: center;
-                        -webkit-transition: opacity 0.2s ease-in-out;
-                        -moz-transition: opacity 0.2s ease-in-out;
-                        -o-transition: opacity 0.2s ease-in-out;
-                        transition: opacity 0.2s ease-in-out;
-                    }
+            }
 
-                    .link-extended {
-                        // display: none;
-                        visibility: hidden;
-                        opacity: 0;
-                        position: relative;
-                        z-index: 500;
-                        overflow: hidden;
-                        -webkit-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
-                        -moz-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
-                        -o-transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
-                        transition: opacity 0.2s ease-in-out .2s, visibility 0s linear 0s;
-                        // transition-delay: 1s;
-                    }
+            .link-container.item:hover {
+                width: 70px;
+            }
 
-                }
+            .link-container.item:hover .link-count {
+                opacity: 0;
+            }
 
-                .link-container.item:hover {
-                    width: 70px;
-                }
+            .link-container.item:hover .link-extended {
+                opacity: 1;
+                visibility: visible;
+                // display: inline;
+            }
 
-                .link-container.item:hover .link-count {
-                    opacity: 0;
-                }
+            .icon-icons {
+                width: 50px
+            }
 
-                .link-container.item:hover .link-extended {
-                    opacity: 1;
-                    visibility: visible;
-                    // display: inline;
-                }
+            .icon-live {
+                width: 175px;
+            }
 
-                .icon-icons {
-                    width: 50px
-                }
+            .icon-icons,
+            .icon-live {
+                height: 50px;
+                margin: auto;
+                overflow: hidden;
 
-                .icon-live {
-                    width: 175px;
+                .search-type {
+                    display: inline-block;
+                    width: 100%;
+                    position: absolute;
+                    justify-content: center;
+                    align-items: center;
+                    position: relative;
+                    margin-right: 5px;
                 }
 
-                .icon-icons,
-                .icon-live {
-                    height: 50px;
-                    margin: auto;
+                .pdfBox-cont {
                     overflow: hidden;
 
-                    .search-type {
-                        display: inline-block;
-                        width: 100%;
-                        position: absolute;
-                        justify-content: center;
-                        align-items: center;
-                        position: relative;
-                        margin-right: 5px;
-                    }
-
-                    .pdfBox-cont {
-                        overflow: hidden;
-
-                        img {
-                            width: 100% !important;
-                            height: auto !important;
-                        }
+                    img {
+                        width: 100% !important;
+                        height: auto !important;
                     }
+                }
 
-                    .search-type:hover+.search-label {
-                        opacity: 1;
-                    }
+                .search-type:hover+.search-label {
+                    opacity: 1;
+                }
 
-                    .search-label {
-                        font-size: 10;
-                        position: relative;
-                        right: 0px;
-                        text-transform: capitalize;
-                        opacity: 0;
-                        -webkit-transition: opacity 0.2s ease-in-out;
-                        -moz-transition: opacity 0.2s ease-in-out;
-                        -o-transition: opacity 0.2s ease-in-out;
-                        transition: opacity 0.2s ease-in-out;
-                    }
+                .search-label {
+                    font-size: 10;
+                    position: relative;
+                    right: 0px;
+                    text-transform: capitalize;
+                    opacity: 0;
+                    -webkit-transition: opacity 0.2s ease-in-out;
+                    -moz-transition: opacity 0.2s ease-in-out;
+                    -o-transition: opacity 0.2s ease-in-out;
+                    transition: opacity 0.2s ease-in-out;
                 }
+            }
 
-                .icon-live:hover {
-                    height: 175px;
+            .icon-live:hover {
+                height: 175px;
 
-                    .pdfBox-cont {
-                        img {
-                            width: 100% !important;
-                        }
+                .pdfBox-cont {
+                    img {
+                        width: 100% !important;
                     }
                 }
             }
-
-            .search-info:hover {
-                width: 60%;
-            }
         }
-    }
 
-    .search-item:hover~.searchBox-instances,
-    .searchBox-instances:hover,
-    .searchBox-instances:active {
-        opacity: 1;
-        background: $lighter-alt-accent;
-        -webkit-transform: scale(1);
-        -ms-transform: scale(1);
-        transform: scale(1);
+        .search-info:hover {
+            width: 60%;
+        }
     }
+}
 
-    .search-item:hover {
-        transition: all 0.2s;
-        background: $lighter-alt-accent;
-    }
+.search-item:hover~.searchBox-instances,
+.searchBox-instances:hover,
+.searchBox-instances:active {
+    opacity: 1;
+    background: $lighter-alt-accent;
+    -webkit-transform: scale(1);
+    -ms-transform: scale(1);
+    transform: scale(1);
+}
 
-    .searchBox-instances {
-        float: left;
-        opacity: 1;
-        width: 150px;
-        transition: all 0.2s ease;
-        color: black;
-        transform-origin: top right;
-        -webkit-transform: scale(0);
-        -ms-transform: scale(0);
-        transform: scale(0);
-    }
+.search-item:hover {
+    transition: all 0.2s;
+    background: $lighter-alt-accent;
+}
 
+.searchBox-instances {
+    float: left;
+    opacity: 1;
+    width: 150px;
+    transition: all 0.2s ease;
+    color: black;
+    transform-origin: top right;
+    -webkit-transform: scale(0);
+    -ms-transform: scale(0);
+    transform: scale(0);
 }
 
+
 .search-overview:hover {
     z-index: 1;
 }
 
 .searchBox-placeholder {
     min-height: 70px;
+    margin-left: 150px;
+    text-transform: uppercase;
+    text-align: left;
+    font-weight: bold;
 }
 
 .collection {
-- 
cgit v1.2.3-70-g09d2

