fixed searchBox layout to show drag icon

2 files changed, 157 insertions, 155 deletions

diff --git a/src/client/views/collections/CollectionMapView.tsx b/src/client/views/collections/CollectionMapView.tsx
index cfec3a6bc..1af1a05aa 100644
--- a/src/client/views/collections/CollectionMapView.tsx
+++ b/src/client/views/collections/CollectionMapView.tsx
@@ -69,7 +69,7 @@ export class CollectionMapView extends CollectionSubView<MapSchema, Partial<IMap
                 if (!this._initialLookupPending.get(id)) {
                     this._initialLookupPending.set(id, true);
                     setTimeout(() => {
-                        titleLoc && Doc.SetInPlace(doc, "title", titleLoc, true);
+                        titleLoc && Doc.SetInPlace(doc, `${fieldKey}-address`, titleLoc, true);
                         this.respondToAddressChange(doc, fieldKey, address).then(() => this._initialLookupPending.delete(id));
                     });
                 }
@@ -114,12 +114,12 @@ export class CollectionMapView extends CollectionSubView<MapSchema, Partial<IMap
         }
     }
 
-    private renderMarker = (layout: Doc) => {
-        const location = this.getLocation(layout, Doc.LayoutFieldKey(layout));
+    private renderMarker = (layout: Doc, fieldKey?: string) => {
+        const location = this.getLocation(layout, fieldKey || Doc.LayoutFieldKey(layout));
         return !location ? (null) :
             <Marker
                 key={layout[Id]}
-                label={StrCast(layout.title)}
+                label={StrCast(layout[`${this.props.fieldKey}-address`])}
                 position={location}
                 onClick={() => this.markerClick(layout, location)}
                 icon={this.renderMarkerIcon(layout)}
@@ -250,7 +250,7 @@ export class CollectionMapView extends CollectionSubView<MapSchema, Partial<IMap
                     }}
                 >
                     {this.reactiveContents}
-                    {mapLoc ? this.renderMarker(this.rootDoc) : undefined}
+                    {mapLoc && StrCast(this.rootDoc[`${fieldKey}-mapCenter-address`]) ? this.renderMarker(this.rootDoc, `${fieldKey}-mapCenter`) : undefined}
                 </GeoMap>
             </div>
         </div>;
@@ -260,9 +260,10 @@ export class CollectionMapView extends CollectionSubView<MapSchema, Partial<IMap
 
 export default GoogleApiWrapper({
     apiKey: process.env.GOOGLE_MAPS!,
-    LoadingContainer: () => (
-        <div className={"loadingWrapper"}>
+    LoadingContainer: () => {
+        console.log(process.env.GOOGLE_MAPS);
+        return <div className={"loadingWrapper"}>
             <img className={"loadingGif"} src={"/assets/loading.gif"} />
-        </div>
-    )
+        </div>;
+    }
 })(CollectionMapView) as any;
\ No newline at end of file
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 084449d04..dbc30eeb6 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -872,163 +872,164 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
         height = 31 + 31 * 6;
         return (
             <div style={{ pointerEvents: "all" }} className="searchBox-container">
+                <div style={{ position: "absolute", left: 15, height: 32, alignItems: "center", display: "flex" }}>{Doc.CurrentUserEmail}</div>
                 <div className="searchBox-bar">
-                    <div style={{ position: "absolute", left: 15 }}>{Doc.CurrentUserEmail}</div>
-                    <div style={{ display: "flex", alignItems: "center" }}>
-                        <Tooltip title={<div className="dash-tooltip" >drag search results as collection</div>} ><div>
-                            <FontAwesomeIcon onPointerDown={SetupDrag(this.collectionRef, () => StrCast(this.layoutDoc._searchString) ? this.startDragCollection() : undefined)} icon={"search"} size="lg"
-                                style={{ cursor: "hand", color: "black", padding: 1, left: 35, position: "relative" }} />
-                        </div></Tooltip>
-                        <div style={{
-                            position: "relative",
-                            left: 245,
-                            zIndex: 9000,
-                            color: "grey",
-                            background: "white",
-                        }}> {`${this._results.length}` + " of " + `${this.realTotalResults}`}</div>
-                        <div style={{ cursor: "default", left: 250, position: "relative", }}>
-                            <Tooltip title={<div className="dash-tooltip" >only display documents matching search</div>} ><div>
-                                <FontAwesomeIcon icon={"filter"} size="lg"
-                                    style={{ cursor: "hand", padding: 1, backgroundColor: this.filter ? "white" : "lightgray", color: this.filter ? "black" : "white" }}
-                                    onPointerDown={e => { e.stopPropagation(); SetupDrag(this.collectionRef, () => StrCast(this.layoutDoc._searchString) ? this.startDragCollection() : undefined); }}
-                                    onClick={action(() => {
-                                        ///DONT Change without emailing andy r first.
-                                        this.filter = !this.filter && !this.searchFullDB;
-                                        if (this.filter === true && this.currentSelectedCollection !== undefined) {
-                                            this.currentSelectedCollection.props.Document._searchDocs = new List<Doc>(this.docsforfilter);
-                                            let newarray: Doc[] = [];
-                                            let docs: Doc[] = [];
-                                            docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
-                                            while (docs.length > 0) {
-                                                newarray = [];
-                                                docs.forEach((d) => {
-                                                    if (d.data !== undefined) {
-                                                        d._searchDocs = new List<Doc>(this.docsforfilter);
-                                                        const newdocs = DocListCast(d.data);
-                                                        newdocs.forEach((newdoc) => {
-                                                            newarray.push(newdoc);
-                                                        });
-                                                    }
-                                                });
-                                                docs = newarray;
-                                            }
-
-                                            this.currentSelectedCollection.props.Document._docFilters = new List<string>(this.viewspec);
-                                            this.props.Document.selectedDoc = this.currentSelectedCollection.props.Document;
-                                        }
-                                        else if (this.filter === false && this.currentSelectedCollection !== undefined) {
-                                            let newarray: Doc[] = [];
-                                            let docs: Doc[] = [];
-                                            docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
-                                            while (docs.length > 0) {
-                                                newarray = [];
-                                                docs.forEach((d) => {
-                                                    if (d.data !== undefined) {
-                                                        d._searchDocs = new List<Doc>();
-                                                        d._docFilters = new List();
-                                                        const newdocs = DocListCast(d.data);
-                                                        newdocs.forEach((newdoc) => {
-                                                            newarray.push(newdoc);
-                                                        });
-                                                    }
-                                                });
-                                                docs = newarray;
-                                            }
-
-                                            this.currentSelectedCollection.props.Document._searchDocs = new List<Doc>([]);
-                                            this.currentSelectedCollection.props.Document._docFilters = new List();
-                                            this.props.Document.selectedDoc = undefined;
-                                        }
-                                    }
-                                    )} />
-                            </div></Tooltip></div>
+                    <div style={{ position: "relative", display: "flex", width: 400 }}>
                         <input value={this.newsearchstring} autoComplete="off" onChange={this.onChange} type="text" placeholder="Search..." id="search-input" ref={this.inputRef}
                             className="searchBox-barChild searchBox-input" onPointerDown={this.openSearch} onKeyPress={this.enter} onFocus={this.openSearch}
                             style={{ padding: 1, paddingLeft: 20, paddingRight: 20, color: "black", height: 20, width: 250 }} />
-                        <div style={{
-                            height: 25,
-                            paddingLeft: "4px",
-                            paddingRight: "4px",
-                            border: "1px solid gray",
-                            borderRadius: "0.3em",
-                            borderBottom: this.open === false ? "1px solid" : "none",
-                        }}>
-                            <form className="beta" style={{ justifyContent: "space-evenly", display: "flex" }}>
-                                <div style={{ display: "contents" }}>
-                                    <div className="radio" style={{ margin: 0 }}>
-                                        <label style={{ fontSize: 12, marginTop: 6 }} >
-                                            <input type="radio" style={{ marginLeft: -16, marginTop: -1 }} checked={!this.searchFullDB} onChange={() => {
-                                                runInAction(() => {
-                                                    this.searchFullDB = !this.searchFullDB;
-                                                    this.dataDoc[this.fieldKey] = new List<Doc>([]);
-                                                    if (this.currentSelectedCollection !== undefined) {
-                                                        let newarray: Doc[] = [];
-                                                        let docs: Doc[] = [];
-                                                        docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
-                                                        while (docs.length > 0) {
-                                                            newarray = [];
-                                                            docs.forEach((d) => {
-                                                                if (d.data !== undefined) {
-                                                                    d._searchDocs = new List<Doc>();
-                                                                    d._docFilters = new List();
-                                                                    const newdocs = DocListCast(d.data);
-                                                                    newdocs.forEach((newdoc) => {
-                                                                        newarray.push(newdoc);
-                                                                    });
-                                                                }
+                        <div style={{ display: "flex", alignItems: "center" }}>
+                            <div style={{ position: "absolute", left: 10 }}>
+                                <Tooltip title={<div className="dash-tooltip" >drag search results as collection</div>}>
+                                    <div><FontAwesomeIcon onPointerDown={SetupDrag(this.collectionRef, () => StrCast(this.layoutDoc._searchString) ? this.startDragCollection() : undefined)} icon={"search"} size="lg"
+                                        style={{ cursor: "hand", color: "black", padding: 1, position: "relative" }} /></div>
+                                </Tooltip>
+                            </div>
+                            <div style={{ position: "absolute", left: 200, width: 30, zIndex: 9000, color: "grey", background: "white", }}>
+                                {`${this._results.length}` + " of " + `${this.realTotalResults}`}
+                            </div>
+                            <div style={{ cursor: "default", left: 235, position: "absolute", }}>
+                                <Tooltip title={<div className="dash-tooltip" >only display documents matching search</div>} >
+                                    <div><FontAwesomeIcon icon={"filter"} size="lg"
+                                        style={{ cursor: "hand", padding: 1, backgroundColor: this.filter ? "white" : "lightgray", color: this.filter ? "black" : "white" }}
+                                        onPointerDown={e => { e.stopPropagation(); SetupDrag(this.collectionRef, () => StrCast(this.layoutDoc._searchString) ? this.startDragCollection() : undefined); }}
+                                        onClick={action(() => {
+                                            ///DONT Change without emailing andy r first.
+                                            this.filter = !this.filter && !this.searchFullDB;
+                                            if (this.filter === true && this.currentSelectedCollection !== undefined) {
+                                                this.currentSelectedCollection.props.Document._searchDocs = new List<Doc>(this.docsforfilter);
+                                                let newarray: Doc[] = [];
+                                                let docs: Doc[] = [];
+                                                docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
+                                                while (docs.length > 0) {
+                                                    newarray = [];
+                                                    docs.forEach((d) => {
+                                                        if (d.data !== undefined) {
+                                                            d._searchDocs = new List<Doc>(this.docsforfilter);
+                                                            const newdocs = DocListCast(d.data);
+                                                            newdocs.forEach((newdoc) => {
+                                                                newarray.push(newdoc);
                                                             });
-                                                            docs = newarray;
                                                         }
-                                                        this.currentSelectedCollection.props.Document._docFilters = new List();
-                                                        this.currentSelectedCollection.props.Document._searchDocs = undefined;
-                                                        this.currentSelectedCollection = undefined;
-                                                    }
-                                                    this.submitSearch();
-                                                });
-                                            }} />
-                                        Collection
-                                    </label>
-                                    </div>
-                                    <div className="radio" style={{ margin: 0 }}>
-                                        <label style={{ fontSize: 12, marginTop: 6 }} >
-                                            <input style={{ marginLeft: -16, marginTop: -1 }} type="radio" checked={this.searchFullDB} onChange={() => {
-                                                runInAction(() => {
-                                                    this.searchFullDB = !this.searchFullDB;
-                                                    this.dataDoc[this.fieldKey] = new List<Doc>([]);
-                                                    this.filter = false;
-                                                    if (this.currentSelectedCollection !== undefined) {
-                                                        let newarray: Doc[] = [];
-                                                        let docs: Doc[] = [];
-                                                        docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
-                                                        while (docs.length > 0) {
-                                                            newarray = [];
-                                                            docs.forEach((d) => {
-                                                                if (d.data !== undefined) {
-                                                                    d._searchDocs = new List<Doc>();
-                                                                    d._docFilters = new List();
-                                                                    const newdocs = DocListCast(d.data);
-                                                                    newdocs.forEach((newdoc) => {
-                                                                        newarray.push(newdoc);
-                                                                    });
-                                                                }
+                                                    });
+                                                    docs = newarray;
+                                                }
+
+                                                this.currentSelectedCollection.props.Document._docFilters = new List<string>(this.viewspec);
+                                                this.props.Document.selectedDoc = this.currentSelectedCollection.props.Document;
+                                            }
+                                            else if (this.filter === false && this.currentSelectedCollection !== undefined) {
+                                                let newarray: Doc[] = [];
+                                                let docs: Doc[] = [];
+                                                docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
+                                                while (docs.length > 0) {
+                                                    newarray = [];
+                                                    docs.forEach((d) => {
+                                                        if (d.data !== undefined) {
+                                                            d._searchDocs = new List<Doc>();
+                                                            d._docFilters = new List();
+                                                            const newdocs = DocListCast(d.data);
+                                                            newdocs.forEach((newdoc) => {
+                                                                newarray.push(newdoc);
                                                             });
-                                                            docs = newarray;
                                                         }
-                                                        this.currentSelectedCollection.props.Document._docFilters = new List();
-                                                        this.currentSelectedCollection.props.Document._searchDocs = undefined;
-                                                        this.currentSelectedCollection = undefined;
-                                                    }
-                                                    this.submitSearch();
-                                                });
-                                            }} />
-                                            DB
-                                    </label>
+                                                    });
+                                                    docs = newarray;
+                                                }
+
+                                                this.currentSelectedCollection.props.Document._searchDocs = new List<Doc>([]);
+                                                this.currentSelectedCollection.props.Document._docFilters = new List();
+                                                this.props.Document.selectedDoc = undefined;
+                                            }
+                                        }
+                                        )} /></div>
+                                </Tooltip>
+                            </div>
+                            <div style={{
+                                height: 25,
+                                paddingLeft: "4px",
+                                paddingRight: "4px",
+                                border: "1px solid gray",
+                                borderRadius: "0.3em",
+                                borderBottom: this.open === false ? "1px solid" : "none",
+                            }}>
+                                <form className="beta" style={{ justifyContent: "space-evenly", display: "flex" }}>
+                                    <div style={{ display: "contents" }}>
+                                        <div className="radio" style={{ margin: 0 }}>
+                                            <label style={{ fontSize: 12, marginTop: 6 }} >
+                                                <input type="radio" style={{ marginLeft: -16, marginTop: -1 }} checked={!this.searchFullDB} onChange={() => {
+                                                    runInAction(() => {
+                                                        this.searchFullDB = !this.searchFullDB;
+                                                        this.dataDoc[this.fieldKey] = new List<Doc>([]);
+                                                        if (this.currentSelectedCollection !== undefined) {
+                                                            let newarray: Doc[] = [];
+                                                            let docs: Doc[] = [];
+                                                            docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
+                                                            while (docs.length > 0) {
+                                                                newarray = [];
+                                                                docs.forEach((d) => {
+                                                                    if (d.data !== undefined) {
+                                                                        d._searchDocs = new List<Doc>();
+                                                                        d._docFilters = new List();
+                                                                        const newdocs = DocListCast(d.data);
+                                                                        newdocs.forEach((newdoc) => {
+                                                                            newarray.push(newdoc);
+                                                                        });
+                                                                    }
+                                                                });
+                                                                docs = newarray;
+                                                            }
+                                                            this.currentSelectedCollection.props.Document._docFilters = new List();
+                                                            this.currentSelectedCollection.props.Document._searchDocs = undefined;
+                                                            this.currentSelectedCollection = undefined;
+                                                        }
+                                                        this.submitSearch();
+                                                    });
+                                                }} />
+                                            Collection
+                                        </label>
+                                        </div>
+                                        <div className="radio" style={{ margin: 0 }}>
+                                            <label style={{ fontSize: 12, marginTop: 6 }} >
+                                                <input style={{ marginLeft: -16, marginTop: -1 }} type="radio" checked={this.searchFullDB} onChange={() => {
+                                                    runInAction(() => {
+                                                        this.searchFullDB = !this.searchFullDB;
+                                                        this.dataDoc[this.fieldKey] = new List<Doc>([]);
+                                                        this.filter = false;
+                                                        if (this.currentSelectedCollection !== undefined) {
+                                                            let newarray: Doc[] = [];
+                                                            let docs: Doc[] = [];
+                                                            docs = DocListCast(this.currentSelectedCollection.dataDoc[Doc.LayoutFieldKey(this.currentSelectedCollection.dataDoc)]);
+                                                            while (docs.length > 0) {
+                                                                newarray = [];
+                                                                docs.forEach((d) => {
+                                                                    if (d.data !== undefined) {
+                                                                        d._searchDocs = new List<Doc>();
+                                                                        d._docFilters = new List();
+                                                                        const newdocs = DocListCast(d.data);
+                                                                        newdocs.forEach((newdoc) => {
+                                                                            newarray.push(newdoc);
+                                                                        });
+                                                                    }
+                                                                });
+                                                                docs = newarray;
+                                                            }
+                                                            this.currentSelectedCollection.props.Document._docFilters = new List();
+                                                            this.currentSelectedCollection.props.Document._searchDocs = undefined;
+                                                            this.currentSelectedCollection = undefined;
+                                                        }
+                                                        this.submitSearch();
+                                                    });
+                                                }} />
+                                                DB
+                                        </label>
+                                        </div>
                                     </div>
-                                </div>
-                            </form>
+                                </form>
+                            </div>
                         </div>
-                    </div>
 
+                    </div>
                 </div>
                 <div style={{ zIndex: 20000, color: "black" }}>
                     {this._searchbarOpen === true ?