restored keeping properties pane open when selection changes. added Doc paraemter to fitWidth() prop function. split MapBoxInfoWindow out of MapBox and added an Add Note button.

1 files changed, 86 insertions, 0 deletions

diff --git a/src/client/views/nodes/MapBox/MapBoxInfoWindow.tsx b/src/client/views/nodes/MapBox/MapBoxInfoWindow.tsx
new file mode 100644
index 000000000..e6f98e5cf
--- /dev/null
+++ b/src/client/views/nodes/MapBox/MapBoxInfoWindow.tsx
@@ -0,0 +1,86 @@
+import { InfoWindow } from '@react-google-maps/api';
+import { action, computed } from 'mobx';
+import { observer } from "mobx-react";
+import * as React from "react";
+import { Doc } from '../../../../fields/Doc';
+import { Id } from '../../../../fields/FieldSymbols';
+import { emptyFunction, OmitKeys, returnEmptyFilter, returnFalse, returnOne, returnTrue, returnZero, setupMoveUpEvents } from '../../../../Utils';
+import { Docs } from '../../../documents/Documents';
+import { DocumentType } from '../../../documents/DocumentTypes';
+import { CollectionStackingView } from '../../collections/CollectionStackingView';
+import { CollectionViewType } from '../../collections/CollectionView';
+import { ViewBoxAnnotatableProps } from '../../DocComponent';
+import { FieldViewProps } from '../FieldView';
+import { FormattedTextBox } from '../formattedText/FormattedTextBox';
+import "./MapBox.scss";
+
+
+interface MapBoxInfoWindowProps {
+    place: Doc;
+    renderDepth: number;
+    markerMap: { [id: string]: google.maps.Marker };
+    isAnyChildContentActive: () => boolean;
+}
+@observer
+export class MapBoxInfoWindow extends React.Component<MapBoxInfoWindowProps & ViewBoxAnnotatableProps & FieldViewProps>{
+
+    @action
+    private handleInfoWindowClose = () => {
+        if (this.props.place.infoWindowOpen) {
+            this.props.place.infoWindowOpen = false;
+        }
+        this.props.place.infoWindowOpen = false;
+    }
+
+    addNoteClick = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, returnFalse, emptyFunction, e => {
+            const newBox = Docs.Create.TextDocument("Note", { _autoHeight: true });
+            FormattedTextBox.SelectOnLoad = newBox[Id];// track the new text box so we can give it a prop that tells it to focus itself when it's displayed
+            Doc.AddDocToList(this.props.place, "data", newBox);
+            e.stopPropagation();
+            e.preventDefault();
+        });
+    }
+
+    // Collection stacking view for documents in the infowindow of a map marker
+    @computed get renderChildDocs() {
+        return;
+    }
+    render() {
+        return <InfoWindow anchor={this.props.markerMap[this.props.place[Id]]} onCloseClick={this.handleInfoWindowClose} >
+            <div className="mapbox-infowindow">
+                <div style={{ width: this.props.PanelWidth(), height: this.props.PanelHeight() }}>
+                    <CollectionStackingView
+                        {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
+                        Document={this.props.place}
+                        DataDoc={undefined}
+                        fieldKey="data"
+                        CollectionView={undefined}
+                        NativeWidth={returnZero}
+                        NativeHeight={returnZero}
+                        docFilters={returnEmptyFilter}
+                        setHeight={emptyFunction}
+                        isAnnotationOverlay={false}
+                        select={emptyFunction}
+                        scaling={returnOne}
+                        isContentActive={returnTrue}
+                        chromeHidden={true}
+                        rootSelected={returnFalse}
+                        childHideDecorationTitle={returnTrue}
+                        childFitWidth={doc => doc.type === DocumentType.RTF}
+                        // childDocumentsActive={returnFalse}
+                        removeDocument={(doc: Doc | Doc[]) => (doc instanceof Doc ? [doc] : doc).reduce((p, d) => p && Doc.RemoveDocFromList(this.props.place, "data", d), true as boolean)}
+                        addDocument={(doc: Doc | Doc[]) => (doc instanceof Doc ? [doc] : doc).reduce((p, d) => p && Doc.AddDocToList(this.props.place, "data", d), true as boolean)}
+                        renderDepth={this.props.renderDepth + 1}
+                        viewType={CollectionViewType.Stacking}
+                        pointerEvents="all"
+                    />
+                </div>
+                <hr />
+                <div onPointerDown={this.addNoteClick} onClick={e => { e.stopPropagation(); e.preventDefault(); }} >
+                    Add Note
+                </div>
+            </div>
+        </InfoWindow>;
+    }
+}
\ No newline at end of file