fixed map anchors to be configs, not maps! fixed doc decorations to not allow clicking on them when showNothing is set. increased font size of map search.

4 files changed, 28 insertions, 9 deletions

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index d5d6fb2ba..9ae55d7f9 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -1108,9 +1108,6 @@ export namespace Docs {
                 id
             );
         }
-        export function MapanchorDocument(options: DocumentOptions = {}, id?: string) {
-            return InstanceFromProto(Prototypes.get(DocumentType.MAP), options?.data, options, id);
-        }
 
         export function LinearDocument(documents: Array<Doc>, options: DocumentOptions, id?: string) {
             return InstanceFromProto(Prototypes.get(DocumentType.COL), new List(documents), { ...options, _type_collection: CollectionViewType.Linear }, id);
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index f3daf3ffa..90425f264 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -80,8 +80,10 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
             // show decorations whenever pointer moves outside of selection bounds.
             'pointermove',
             action(e => {
-                if (this.Bounds.x !== Number.MAX_VALUE && (this.Bounds.x > e.clientX || this.Bounds.r < e.clientX || this.Bounds.y > e.clientY || this.Bounds.b < e.clientY)) {
-                    this._showNothing = false;
+                if (this.Bounds.x || this.Bounds.y || this.Bounds.r || this.Bounds.b) {
+                    if (this.Bounds.x !== Number.MAX_VALUE && (this.Bounds.x > e.clientX || this.Bounds.r < e.clientX || this.Bounds.y > e.clientY || this.Bounds.b < e.clientY)) {
+                        this._showNothing = false;
+                    }
                 }
             })
         );
@@ -885,7 +887,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
         );
 
         return (
-            <div className={`documentDecorations${colorScheme}`} style={{ opacity: this._showNothing ? 0.1 : undefined }}>
+            <div className={`documentDecorations${colorScheme}`} style={{ display: this._showNothing ? 'none' : undefined }}>
                 <div
                     className="documentDecorations-background"
                     style={{
diff --git a/src/client/views/nodes/MapBox/MapBox.scss b/src/client/views/nodes/MapBox/MapBox.scss
index 464646a23..242677231 100644
--- a/src/client/views/nodes/MapBox/MapBox.scss
+++ b/src/client/views/nodes/MapBox/MapBox.scss
@@ -17,6 +17,7 @@
         width: calc(100% - 40px);
         .editableText-container {
             width: 100%;
+            font-size: 16px !important;
         }
         input {
             width: 100%;
diff --git a/src/client/views/nodes/MapBox/MapBox.tsx b/src/client/views/nodes/MapBox/MapBox.tsx
index 94944b83d..284e598c5 100644
--- a/src/client/views/nodes/MapBox/MapBox.tsx
+++ b/src/client/views/nodes/MapBox/MapBox.tsx
@@ -5,7 +5,7 @@ import { action, computed, IReactionDisposer, observable, ObservableMap, reactio
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { Doc, DocListCast, Opt } from '../../../../fields/Doc';
-import { Highlight, Width } from '../../../../fields/DocSymbols';
+import { DocCss, Highlight, Width } from '../../../../fields/DocSymbols';
 import { InkTool } from '../../../../fields/InkField';
 import { DocCast, NumCast, StrCast } from '../../../../fields/Types';
 import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnEmptyString, returnFalse, returnOne, returnTrue, setupMoveUpEvents, Utils } from '../../../../Utils';
@@ -62,6 +62,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     public static LayoutString(fieldKey: string) {
         return FieldView.LayoutString(MapBox, fieldKey);
     }
+    private _dragRef = React.createRef<HTMLDivElement>();
     private _mainCont: React.RefObject<HTMLDivElement> = React.createRef();
     private _annotationLayer: React.RefObject<HTMLDivElement> = React.createRef();
     private _sidebarRef = React.createRef<SidebarAnnos>();
@@ -430,7 +431,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
      */
     getAnchor = (addAsAnnotation: boolean, pinProps?: PinProps) => {
         /// this should use SELECTED pushpin for lat/long  if there is a selection, otherwise CENTER
-        const anchor = Docs.Create.MapanchorDocument({
+        const anchor = Docs.Create.ConfigDocument({
             title: 'MapAnchor:' + this.rootDoc.title,
             text: StrCast(this.selectedPin?.map) || StrCast(this.rootDoc.map) || 'map location',
             config_latitude: NumCast(this.selectedPin?.latitude ?? this.dataDoc.latitude),
@@ -667,8 +668,26 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
     searchbarKeyDown = (e: any) => e.key === 'Enter' && this.bingSearch();
 
-    _dragRef = React.createRef<HTMLDivElement>();
+    static _firstRender = true;
+    static _rerenderDelay = 0;
+    _rerenderTimeout: any;
     render() {
+        // bcz:  no idea what's going on here, but bings maps have some kind of bug
+        // such that we need to delay rendering a second map on startup until the first map is rendered.
+        this.rootDoc[DocCss];
+        if (MapBox._firstRender) {
+            MapBox._firstRender = false;
+            MapBox._rerenderDelay = 500;
+        } else if (MapBox._rerenderDelay) {
+            // prettier-ignore
+            this._rerenderTimeout = this._rerenderTimeout ??
+                setTimeout(action(() => {
+                    MapBox._rerenderDelay = 0;
+                    this.rootDoc[DocCss] = this.rootDoc[DocCss] + 1;
+                }), MapBox._rerenderDelay);
+            return null;
+        }
+
         const renderAnnotations = (childFilters?: () => string[]) => null;
         return (
             <div className="mapBox" ref={this._ref}>