aboutsummaryrefslogtreecommitdiff
path: root/src/client/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views')
-rw-r--r--src/client/views/nodes/MapBox/MapBox.scss4
-rw-r--r--src/client/views/nodes/MapBox/MapBox.tsx201
-rw-r--r--src/client/views/nodes/MapBox/MapPushpinBox.tsx4
-rw-r--r--src/client/views/nodes/trails/PresBox.tsx5
4 files changed, 119 insertions, 95 deletions
diff --git a/src/client/views/nodes/MapBox/MapBox.scss b/src/client/views/nodes/MapBox/MapBox.scss
index fcd4fc9be..39fa3262e 100644
--- a/src/client/views/nodes/MapBox/MapBox.scss
+++ b/src/client/views/nodes/MapBox/MapBox.scss
@@ -11,6 +11,10 @@
padding: 12;
font-size: 17;
}
+ .mapBox-searchbar{
+ display:flex;
+ flex-direction: row;
+ }
.mapBox-topbar{
display:flex;
flex-direction: row;
diff --git a/src/client/views/nodes/MapBox/MapBox.tsx b/src/client/views/nodes/MapBox/MapBox.tsx
index 283d57bb6..bad1a3ebd 100644
--- a/src/client/views/nodes/MapBox/MapBox.tsx
+++ b/src/client/views/nodes/MapBox/MapBox.tsx
@@ -1,7 +1,7 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { GoogleMapProps, Marker } from '@react-google-maps/api';
import BingMapsReact from 'bingmaps-react';
-import { EditableText, Toggle } from 'browndash-components';
+import { EditableText, IconButton, Toggle, Type } from 'browndash-components';
import e from 'connect-flash';
import { truncateSync } from 'fs';
import { action, computed, IReactionDisposer, observable, ObservableMap, reaction, runInAction } from 'mobx';
@@ -13,12 +13,12 @@ import { Id } from '../../../../fields/FieldSymbols';
import { InkTool } from '../../../../fields/InkField';
import { ScriptField } from '../../../../fields/ScriptField';
import { NumCast, StrCast } from '../../../../fields/Types';
-import { emptyFunction, returnAll, returnEmptyDoclist, returnEmptyString, returnFalse, returnIgnore, returnOne, setupMoveUpEvents, Utils } from '../../../../Utils';
+import { emptyFunction, returnAll, returnEmptyDoclist, returnEmptyFilter, returnEmptyString, returnFalse, returnIgnore, returnOne, setupMoveUpEvents, Utils } from '../../../../Utils';
import { Docs } from '../../../documents/Documents';
import { DragManager } from '../../../util/DragManager';
import { SnappingManager } from '../../../util/SnappingManager';
import { Transform } from '../../../util/Transform';
-import { UndoManager } from '../../../util/UndoManager';
+import { undoable, UndoManager } from '../../../util/UndoManager';
import { MarqueeOptionsMenu } from '../../collections/collectionFreeForm';
import { ViewBoxAnnotatableComponent, ViewBoxAnnotatableProps } from '../../DocComponent';
import { Colors } from '../../global/globalEnums';
@@ -116,7 +116,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
@observable private _marqueeing: number[] | undefined;
@observable private inputRef = React.createRef<HTMLInputElement>();
@observable private searchMarkers: google.maps.Marker[] = [];
- // @observable private searchBox = new window.google.maps.places.Autocomplete(this.inputRef.current!, options);
+ @observable private searchBox = undefined as any; // new window.google.maps.places.Autocomplete(this.inputRef.current!, options);
@observable private _savedAnnotations = new ObservableMap<number, HTMLDivElement[]>();
@computed get allSidebarDocs() {
return DocListCast(this.dataDoc[this.SidebarKey]);
@@ -138,45 +138,6 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
private _ref: React.RefObject<HTMLDivElement> = React.createRef();
private _disposer: {[key:string]:IReactionDisposer} = {}
componentDidMount() {
- this.props.setContentView?.(this);
- this._disposer.location = reaction(() => ({lat:this.rootDoc.latitude, lng:this.rootDoc.longitude, zoom:this.rootDoc.zoom,mapType:this.rootDoc.mapType}),
- (locationObject) => {
-
- this._bingMap.current.setView({
- mapTypeId: locationObject.mapType,
- zoom:locationObject.zoom,
- center: new this.MicrosoftMaps.Location(locationObject.lat, locationObject.lng),
- });
-
- }, {fireImmediately: true});
- // this._disposer.pins = reaction(() => ({pinList:this.dataDoc[this.annotationKey]}),
- // (pinsObject) => {
- // this._bingMap.current.entities.clear();
- // pinsObject.pinList.map((pushpin: Doc) => (
- // <DocumentView
- // {...this.props}
- // Document={pushpin}
- // DataDoc={undefined}
- // PanelWidth={returnOne}
- // PanelHeight={returnOne}
- // NativeWidth={returnOne}
- // NativeHeight={returnOne}
- // onClick={()=>new ScriptField(undefined)}
- // onKey={undefined}
- // onDoubleClick={undefined}
- // onBrowseClick={undefined}
- // docFilters={returnEmptyDoclist}
- // docRangeFilters={returnEmptyDoclist}
- // searchFilterDocs={returnEmptyDoclist}
- // isDocumentActive={returnFalse}
- // isContentActive={returnFalse}
- // addDocTab={returnFalse}
- // ScreenToLocalTransform={()=>new Transform(0,0,0)}
- // fitContentsToBox={undefined}
- // focus={returnOne}
- // />));
-
- // }, {fireImmediately: false});
}
@@ -638,7 +599,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
*
*
**/
-
+ @observable
bingSearchBarContents: any = 'Boston, MA'; // For Bing Maps: The contents of the Bing search bar (string)
geoDataRequestOptions = {
@@ -675,7 +636,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
* Pushpin onclick
*/
@action
- pushpinClicked = (pinDoc:Doc,pin:any) => {
+ pushpinClicked = (pinDoc:Doc) => {
// TODO:
// if (sidebarannos is not open) open sidebarannos
// creates button onclick removes the doc from annotations
@@ -685,27 +646,6 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
this.dataDoc.longitude = pinDoc.lng;
-
-
- // @action
- // onPointerDown = (e: React.PointerEvent) => {
- // if (e.button === 2 || e.ctrlKey) {
- // AnchorMenu.Instance.Status = 'annotation';
- // AnchorMenu.Instance.Delete = this.deleteAnnotation.bind(this);
- // AnchorMenu.Instance.Pinned = false;
- // AnchorMenu.Instance.PinToPres = this.pinToPres;
- // AnchorMenu.Instance.MakeTargetToggle = this.makeTargretToggle;
- // AnchorMenu.Instance.IsTargetToggler = this.isTargetToggler;
- // AnchorMenu.Instance.ShowTargetTrail = () => this.showTargetTrail(this.annoTextRegion);
- // AnchorMenu.Instance.jumpTo(e.clientX, e.clientY, true);
- // e.stopPropagation();
- // } else if (e.button === 0) {
- // e.stopPropagation();
- // LinkFollower.FollowLink(undefined, this.annoTextRegion, false);
- // }
- // };
-
- // TODO: UPDATE FOR DASHDOC SELECTION
};
/**
@@ -811,10 +751,10 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
presLat: NumCast(this.dataDoc.latitude),
presLong: NumCast(this.dataDoc.longitude),
presZoom: NumCast(this.dataDoc.zoom),
- presMapType: this.dataDoc.mapType,
+ presMapType: StrCast(this.dataDoc.mapType),
// preslocationToLookAt:this.dataDoc.locationToLookAt,
// presType:
- unrendered: true,
+ layout_unrendered: true,
annotationOn: this.rootDoc,
});
if (anchor) {
@@ -839,7 +779,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
this._bingMap.current.entities.push(pushPin);
- this.MicrosoftMaps.Events.addHandler(pushPin, 'click', (e: any) => this.pushpinClicked(pin,pushPin));
+ this.MicrosoftMaps.Events.addHandler(pushPin, 'click', (e: any) => this.pushpinClicked(pin));
this.MicrosoftMaps.Events.addHandler(pushPin, 'dblclick', (e: any) => this.pushpinDblClicked(pushPin, pin));
}
@@ -876,7 +816,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
* Map options
*/
bingMapOptions = {
- navigationBarMode: 'compact',
+ navigationBarMode: 'square',
backgroundColor: '#f1f3f4',
enableInertia: true,
supportedMapTypes:['grayscale', 'canvasLight'],
@@ -901,19 +841,71 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
else this.placePinOn = true;
};
+ @action
+ searchbarOnEdit=(newText:string)=>{
+ this.bingSearchBarContents = newText
+ }
+
/*
* Called when BingMap is first rendered
* Initializes starting values
*/
bingMapReady = (map: any) => {
this._bingMap = map.map;
- this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'click', this.mapOnClick);
- this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'viewchangeend', this.updateLayout);
- this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'maptypechanged', this.updateMapType);
- this.updateLayout();
- this.updateMapType();
+ if (!this._bingMap.current) {
+ alert("NO Map!?")
+ }
+ this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'click', undoable(this.mapOnClick, "Added Pin to Map"));
+ this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'viewchangeend', undoable(this.updateLayout, "Map Layout Change"));
+ this.MicrosoftMaps.Events.addHandler(this._bingMap.current, 'maptypechanged', undoable(this.updateMapType, "Map ViewType Change"));
+ //this.updateLayout();
+ // this.updateMapType();
+ this.props.setContentView?.(this);
+ this._disposer.location = reaction(() => ({lat:this.rootDoc.latitude, lng:this.rootDoc.longitude, zoom:this.rootDoc.zoom,mapType:this.rootDoc.mapType}),
+ (locationObject) => {
+ // if (this._bingMap.current)
+ this._bingMap.current?.setView({
+ mapTypeId: locationObject.mapType,
+ zoom:locationObject.zoom,
+ center: new this.MicrosoftMaps.Location(locationObject.lat, locationObject.lng),
+ });
+
+ }, {fireImmediately: true});
+ // this._disposer.pins = reaction(() => ({pinList:this.dataDoc[this.annotationKey]}),
+ // (pinsObject) => {
+ // this._bingMap.current.entities.clear();
+ // pinsObject.pinList.map((pushpin: Doc) => (
+ // <DocumentView
+ // {...this.props}
+ // Document={pushpin}
+ // DataDoc={undefined}
+ // PanelWidth={returnOne}
+ // PanelHeight={returnOne}
+ // NativeWidth={returnOne}
+ // NativeHeight={returnOne}
+ // onClick={()=>new ScriptField(undefined)}
+ // onKey={undefined}
+ // onDoubleClick={undefined}
+ // onBrowseClick={undefined}
+ // docFilters={returnEmptyDoclist}
+ // docRangeFilters={returnEmptyDoclist}
+ // searchFilterDocs={returnEmptyDoclist}
+ // isDocumentActive={returnFalse}
+ // isContentActive={returnFalse}
+ // addDocTab={returnFalse}
+ // ScreenToLocalTransform={()=>new Transform(0,0,0)}
+ // fitContentsToBox={undefined}
+ // focus={returnOne}
+ // />));
+
+ // }, {fireImmediately: false});
+ }
+ searchbarKeyDown = (e:any)=>{
+ if (e.key === 'Enter') {
+ this.bingSearch()
+ }
+
}
-
render() {
const renderAnnotations = (childFilters?: () => string[]) => null;
return (
@@ -937,9 +929,44 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
{SnappingManager.GetIsDragging() ? null : renderAnnotations()}
{this.annotationLayer}
- <EditableText setEditing={(isEditing: boolean) => ({})} editing onEdit={(newText: string) => (this.bingSearchBarContents = newText)} placeholder="Boston, MA" text="Boston, MA" />
+
+ <div className='mapBox-searchbar'>
+ <EditableText
+ // editing
+ setVal={(newText:string|number) => typeof newText === "string" && this.searchbarOnEdit(newText)}
+ placeholder="Boston"
+ // text="text"
+ />
+ <IconButton
+ icon={<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="magnifying-glass" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" color="#DFDFDF"><path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"></path></svg>}
+ onClick={this.bingSearch}
+ onDoubleClick={function noRefCheck(){}}
+ onPointerDown={function noRefCheck(){}}
+ onPointerDownCapture={function noRefCheck(){}}
+ onPointerMove={function noRefCheck(){}}
+ onPointerMoveCapture={function noRefCheck(){}}
+ onPointerUp={function noRefCheck(){}}
+ type={Type.TERT}
+ />
+ <input type="checkbox"
+ id="switch"
+ className="checkbox"
+ checked={this.placePinOn}
+ onChange={this.togglePlacePin}
+ />
+
+ <label htmlFor="switch"
+ className="toggle">
+ <p>
+ {this.placePinOn ? 'Place Pin ON' : 'Place Pin OFF'}
+ </p>
+ </label>
+ </div>
+
+
<div className='mapBox-topbar'>
- <input type="button" value="Search" onClick={this.bingSearch} />
+ {/* <input type="button" value="Search" onClick={this.bingSearch} /> */}
+
{/* {this.placePinOn ? <input type="button" value="Place Pin Mode On" onClick={this.togglePlacePin} /> : <input type="button" value="Place Pin Mode Off" onClick={this.togglePlacePin} />} */}
{/* {this.placePinOn ? <input type="button" value="Place Pin Mode On" onClick={this.togglePlacePin} /> : <input type="button" value="Place Pin Mode Off" onClick={this.togglePlacePin} />}
@@ -957,19 +984,7 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
type="secondary"
/> */}
- <input type="checkbox"
- id="switch"
- className="checkbox"
- checked={this.placePinOn}
- onChange={this.togglePlacePin}
- />
-
- <label htmlFor="switch"
- className="toggle">
- <p>
- {this.placePinOn ? 'Place Pin ON' : 'Place Pin OFF'}
- </p>
- </label>
+
</div>
@@ -992,8 +1007,8 @@ export class MapBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
onKey={undefined}
onDoubleClick={undefined}
onBrowseClick={undefined}
- docFilters={returnEmptyDoclist}
- docRangeFilters={returnEmptyDoclist}
+ childFilters={returnEmptyFilter}
+ childFiltersByRanges={returnEmptyFilter}
searchFilterDocs={returnEmptyDoclist}
isDocumentActive={returnFalse}
isContentActive={returnFalse}
diff --git a/src/client/views/nodes/MapBox/MapPushpinBox.tsx b/src/client/views/nodes/MapBox/MapPushpinBox.tsx
index 588bddd1a..6369f9e04 100644
--- a/src/client/views/nodes/MapBox/MapPushpinBox.tsx
+++ b/src/client/views/nodes/MapBox/MapPushpinBox.tsx
@@ -5,6 +5,7 @@ import { FieldView, FieldViewProps } from '../FieldView';
import React = require('react');
import { computed } from 'mobx';
import { MapBox } from './MapBox';
+import { undoable } from '../../../util/UndoManager';
/**
@@ -18,7 +19,8 @@ export class MapPushpinBox extends ViewBoxBaseComponent<FieldViewProps>() {
return FieldView.LayoutString(MapPushpinBox, fieldKey);
}
componentDidMount() {
- this.mapBoxView.addPushpin(this.rootDoc);
+ // if (this.mapBoxView)
+ this.mapBoxView.addPushpin(this.rootDoc);
}
componentWillUnmount() {
// this.mapBoxView.removePushpin(this.rootDoc);
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index 76f42778b..1560ce3e1 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -659,7 +659,10 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
pinDoc.presYRange = undefined; //targetDoc?.yrange;
}
if (pinProps.pinData.map) {
- pinDoc.presLat = targetDoc?.lat;
+ pinDoc.presLat = targetDoc?.latitude;
+ pinDoc.presLong = targetDoc?.longitude;
+ pinDoc.presZoom = targetDoc?.zoom;
+ pinDoc.mapType = targetDoc?.mapType;
//...
}
if (pinProps.pinData.poslayoutview)
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 22:40:42 +0000