From d714f8ae1940f08283c491b09a1c23127cf04064 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 30 Jul 2021 09:03:53 -0400
Subject: from last

---
 src/client/views/nodes/MapBox/MapBox.scss |   8 --
 src/client/views/nodes/MapBox/MapBox.tsx  | 142 ++++++++++++++----------------
 src/client/views/nodes/WebBox.tsx         |   2 +-
 3 files changed, 69 insertions(+), 83 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/MapBox/MapBox.scss b/src/client/views/nodes/MapBox/MapBox.scss
index e329af15c..4fae8d8ff 100644
--- a/src/client/views/nodes/MapBox/MapBox.scss
+++ b/src/client/views/nodes/MapBox/MapBox.scss
@@ -1,11 +1,4 @@
 .mapBox {
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-    display: flex;
-
-
-    .mapBox-contents {
         width: 100%;
         height: 100%;
         overflow: hidden;
@@ -44,5 +37,4 @@
             border-radius: 20px;
             cursor:grabbing;
         }
-    }
 }
diff --git a/src/client/views/nodes/MapBox/MapBox.tsx b/src/client/views/nodes/MapBox/MapBox.tsx
index 2d53116f3..2b3bcb0a2 100644
--- a/src/client/views/nodes/MapBox/MapBox.tsx
+++ b/src/client/views/nodes/MapBox/MapBox.tsx
@@ -255,88 +255,82 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     }
 
     render() {
-        return <div className="mapBox" ref={this._ref}>
-            {/* HELLO WORLD! */}
-            <div className={"mapBox-contents"}
-                style={{
-                    pointerEvents: this.isContentActive() ? undefined : "none"
-                }}
-                onWheel={e => e.stopPropagation()}
-                onPointerDown={e => (e.button === 0 && !e.ctrlKey) && e.stopPropagation()} >
-                {/* // {/* <LoadScript
+        return <div className="mapBox" ref={this._ref}
+            style={{ pointerEvents: this.isContentActive() ? undefined : "none" }} >
+            {/* // {/* <LoadScript
                 //     googleMapsApiKey={process.env.GOOGLE_MAPS!}
                 //     libraries={['places', 'drawing']}
                 // >  */}
-                <div className="mapBox-wrapper" style={{
-                    width: `calc(100% - ${this.sidebarWidthPercent})`
-                }}>
-                    <GoogleMap
-                        mapContainerStyle={mapContainerStyle}
-                        zoom={this.zoom}
-                        center={this.center}
-                        onLoad={map => this.loadHandler(map)}
-                        options={mapOptions}
-                    >
-                        <Autocomplete
-                            onLoad={this.setSearchBox}
-                            onPlaceChanged={this.handlePlaceChanged}>
-                            <input ref={this.inputRef} className="searchbox" type="text" placeholder="Search anywhere:" />
-                        </Autocomplete>
-
-                        {this.childDocs.map(place => (
-                            <Marker
-                                key={place._markerId}
-                                position={place._latlngLocation}
-                                onLoad={marker => this.markerLoadHandler(marker, place)}
-                                onClick={e => this.markerClickHandler(e, place)}
-                            />
-                        ))}
-                        {this.infoWindowOpen && this.selectedPlace && (
-                            <InfoWindow
-                                anchor={this.markerMap[this.selectedPlace._markerId!]}
-                                onCloseClick={this.handleInfoWindowClose}
-                            >
-                                <div style={{ backgroundColor: 'white', opacity: 0.75, padding: 12 }}>
-                                    <div style={{ fontSize: 16 }}>
+            <div className="mapBox-wrapper"
+                onWheel={e => e.stopPropagation()}
+                onPointerDown={e => (e.button === 0 && !e.ctrlKey) && e.stopPropagation()}
+                style={{ width: `calc(100% - ${this.sidebarWidthPercent})` }}>
+                <GoogleMap
+                    mapContainerStyle={mapContainerStyle}
+                    zoom={this.zoom}
+                    center={this.center}
+                    onLoad={map => this.loadHandler(map)}
+                    options={mapOptions}
+                >
+                    <Autocomplete
+                        onLoad={this.setSearchBox}
+                        onPlaceChanged={this.handlePlaceChanged}>
+                        <input ref={this.inputRef} className="searchbox" type="text" placeholder="Search anywhere:" />
+                    </Autocomplete>
+
+                    {this.childDocs.map(place => (
+                        <Marker
+                            key={place._markerId}
+                            position={place._latlngLocation}
+                            onLoad={marker => this.markerLoadHandler(marker, place)}
+                            onClick={e => this.markerClickHandler(e, place)}
+                        />
+                    ))}
+                    {this.infoWindowOpen && this.selectedPlace && (
+                        <InfoWindow
+                            anchor={this.markerMap[this.selectedPlace._markerId!]}
+                            onCloseClick={this.handleInfoWindowClose}
+                        >
+                            <div style={{ backgroundColor: 'white', opacity: 0.75, padding: 12 }}>
+                                <div style={{ fontSize: 16 }}>
+                                    <div>
+                                        <img src="http://placekitten.com/200/300" />
+                                        <hr />
+                                        <form>
+                                            <label>Title: </label><br />
+                                            <input type="text" id="fname" name="fname"></input><br />
+                                            <label>Desription: </label><br />
+                                            <textarea style={{ height: 150 }} id="lname" name="lname" placeholder="Notes, a short description of this location, a brief comment, etc."></textarea>
+                                        </form>
+                                        <hr />
                                         <div>
-                                            <img src="http://placekitten.com/200/300" />
-                                            <hr />
-                                            <form>
-                                                <label>Title: </label><br />
-                                                <input type="text" id="fname" name="fname"></input><br />
-                                                <label>Desription: </label><br />
-                                                <textarea style={{ height: 150 }} id="lname" name="lname" placeholder="Notes, a short description of this location, a brief comment, etc."></textarea>
-                                            </form>
-                                            <hr />
-                                            <div>
-                                                <button>New link+</button>
-                                            </div>
+                                            <button>New link+</button>
                                         </div>
                                     </div>
                                 </div>
-                            </InfoWindow>
-                        )}
-                    </GoogleMap>
-                </div>
-                {/* {/* </LoadScript > */}
-                <div className={"mapBox-sidebar"}
-                    style={{ width: `${this.sidebarWidthPercent}`, backgroundColor: `${this.sidebarColor}` }}>
-                    <SidebarAnnos ref={this._sidebarRef}
-                        {...this.props}
-                        fieldKey={this.annotationKey}
-                        rootDoc={this.rootDoc}
-                        layoutDoc={this.layoutDoc}
-                        dataDoc={this.dataDoc}
-                        usePanelWidth={true}
-                        PanelWidth={this.sidebarWidth}
-                        sidebarAddDocument={this.sidebarAddDocument}
-                        moveDocument={this.moveDocument}
-                        removeDocument={this.removeDocument}
-                        isContentActive={this.isContentActive}
-                    />
-                </div>
-                {this.sidebarHandle}
+                            </div>
+                        </InfoWindow>
+                    )}
+                </GoogleMap>
+            </div>
+            {/* {/* </LoadScript > */}
+            <div className="mapBox-sidebar"
+                style={{ width: `${this.sidebarWidthPercent}`, backgroundColor: `${this.sidebarColor}` }}>
+                <SidebarAnnos ref={this._sidebarRef}
+                    {...this.props}
+                    fieldKey={this.annotationKey}
+                    rootDoc={this.rootDoc}
+                    layoutDoc={this.layoutDoc}
+                    dataDoc={this.dataDoc}
+                    usePanelWidth={true}
+                    PanelWidth={this.sidebarWidth}
+                    sidebarAddDocument={this.sidebarAddDocument}
+                    moveDocument={this.moveDocument}
+                    removeDocument={this.removeDocument}
+                    isContentActive={this.isContentActive}
+                />
             </div>
+            {this.sidebarHandle}
         </div>;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index ffa6593e5..acf50e773 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -487,7 +487,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         const inactiveLayer = this.props.layerProvider?.(this.layoutDoc) === false;
         const scale = this.props.scaling?.() || 1;
         return (
-            <div className="webBox" ref={this._mainCont} style={{ pointerEvents: this.isContentActive() ? "all" : this.isContentActive() || SnappingManager.GetIsDragging() ? undefined : "none" }} >
+            <div className="webBox" ref={this._mainCont} style={{ pointerEvents: this.isContentActive() ? "all" : SnappingManager.GetIsDragging() ? undefined : "none" }} >
                 <div className={`webBox-container`}
                     style={{ pointerEvents: inactiveLayer ? "none" : undefined }}
                     onContextMenu={this.specificContextMenu}>
-- 
cgit v1.2.3-70-g09d2