aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/collections/CollectionMapView.tsx111
-rw-r--r--src/client/views/nodes/DocumentView.tsx2
2 files changed, 55 insertions, 58 deletions
diff --git a/src/client/views/collections/CollectionMapView.tsx b/src/client/views/collections/CollectionMapView.tsx
index 5d0b0c982..fced52275 100644
--- a/src/client/views/collections/CollectionMapView.tsx
+++ b/src/client/views/collections/CollectionMapView.tsx
@@ -10,8 +10,8 @@ import "./CollectionMapView.scss";
import { CollectionSubView } from "./CollectionSubView";
import React = require("react");
import { DocumentManager } from "../../util/DocumentManager";
-import { UndoManager } from "../../util/UndoManager";
-import { IReactionDisposer, reaction, action } from "mobx";
+import { UndoManager, undoBatch } from "../../util/UndoManager";
+import { IReactionDisposer, reaction, action, computed } from "mobx";
import requestPromise = require("request-promise");
type MapSchema = makeInterface<[typeof documentSchema]>;
@@ -28,7 +28,13 @@ const base = "https://maps.googleapis.com/maps/api/geocode/json?";
@observer
class CollectionMapView extends CollectionSubView<MapSchema, Partial<MapProps> & { google: any }>(MapSchema) {
- private mapRef = React.createRef<GeoMap>();
+ // private mapRef = React.createRef<GeoMap>();
+ // private get map() {
+ // return (this.mapRef.current as any).map;
+ // }
+
+ private _cancelAddrReq = new Map<string, boolean>();
+ private _cancelLocReq = new Map<string, boolean>();
private addressUpdaters: IReactionDisposer[] = [];
private latlngUpdaters: IReactionDisposer[] = [];
@@ -42,62 +48,62 @@ class CollectionMapView extends CollectionSubView<MapSchema, Partial<MapProps> &
return undefined;
}
- renderMarker(layout: Doc, icon: Opt<google.maps.Icon>) {
+ markerClick = action(async (layout: Doc, location: LocationData) => {
+ //this.map.panTo(location);
+ const batch = UndoManager.StartBatch("marker click");
+ this.layoutDoc[this.props.fieldKey + "-mapCenter-lat"] = location.lat;
+ this.layoutDoc[this.props.fieldKey + "-mapCenter-lng"] = location.lng;
+ location.zoom && (this.layoutDoc[this.props.fieldKey + "-mapCenter-zoom"] = location.zoom);
+ if (layout.isLinkButton && DocListCast(layout.links).length) {
+ await DocumentManager.Instance.FollowLink(undefined, layout, (doc: Doc, where: string, finished?: () => void) => {
+ this.props.addDocTab(doc, where);
+ finished?.();
+ }, false, this.props.ContainingCollectionDoc, batch.end, undefined);
+ } else {
+ ScriptCast(layout.onClick)?.script.run({ this: layout, self: Cast(layout.rootDocument, Doc, null) || layout });
+ batch.end();
+ }
+ });
+
+ renderMarkerIcon(layout: Doc) {
+ const iconUrl = StrCast(this.props.Document.mapIconUrl, null);
+ if (iconUrl) {
+ const iconWidth = NumCast(layout["mapLocation-iconWidth"], 45);
+ const iconHeight = NumCast(layout["mapLocation-iconHeight"], 45);
+ const iconSize = new google.maps.Size(iconWidth, iconHeight);
+ return {
+ size: iconSize,
+ scaledSize: iconSize,
+ url: iconUrl
+ };
+ }
+ }
+ renderMarker(layout: Doc) {
const location = this.getLocation(layout, "mapLocation");
return !location ? (null) :
<Marker
key={layout[Id]}
label={StrCast(layout.title)}
- position={{ lat: location.lat, lng: location.lng }}
- onClick={async () => {
- this.map.panTo(location);
- this.layoutDoc[this.props.fieldKey + "-mapCenter-lat"] = location.lat;
- this.layoutDoc[this.props.fieldKey + "-mapCenter-lng"] = location.lng;
- location.zoom && (this.layoutDoc[this.props.fieldKey + "-mapCenter-zoom"] = location.zoom);
- if (layout.isLinkButton && DocListCast(layout.links).length) {
- const batch = UndoManager.StartBatch("follow link click");
- await DocumentManager.Instance.FollowLink(undefined, layout, (doc: Doc, where: string, finished?: () => void) => {
- this.props.addDocTab(doc, where);
- finished?.();
- }, false, this.props.ContainingCollectionDoc, batch.end, undefined);
- } else {
- ScriptCast(layout.onClick)?.script.run({ this: layout, self: Cast(layout.rootDocument, Doc, null) || layout });
- }
- }}
- icon={icon}
+ position={location}
+ onClick={() => this.markerClick(layout, location)}
+ icon={this.renderMarkerIcon(layout)}
/>;
}
- _cancelAddrReq = new Map<string, boolean>();
- _cancelLocReq = new Map<string, boolean>();
- private get contents() {
+ @computed get contents() {
this.addressUpdaters.forEach(disposer => disposer());
this.addressUpdaters = [];
this.latlngUpdaters.forEach(disposer => disposer());
this.latlngUpdaters = [];
- return this.childLayoutPairs.map(({ layout, data }) => {
- let icon: Opt<google.maps.Icon>, iconUrl: Opt<string>;
- if ((iconUrl = StrCast(this.props.Document.mapIconUrl, null))) {
- const iconWidth = NumCast(layout["mapLocation-iconWidth"], 45);
- const iconHeight = NumCast(layout["mapLocation-iconHeight"], 45);
- const iconSize = new google.maps.Size(iconWidth, iconHeight);
- icon = {
- size: iconSize,
- scaledSize: iconSize,
- url: iconUrl
- };
- }
+ return this.childLayoutPairs.map(({ layout }) => {
this.addressUpdaters.push(reaction(
- () => ({
- lat: NumCast(layout["mapLocation-lat"]),
- lng: NumCast(layout["mapLocation-lng"])
- }),
+ () => ({ lat: layout["mapLocation-lat"], lng: layout["mapLocation-lng"] }),
({ lat, lng }) => {
if (this._cancelLocReq.get(layout[Id])) {
this._cancelLocReq.set(layout[Id], false);
}
else if (lat !== undefined && lng !== undefined) {
- const target = `${base}latlng=${lat},${lng}&key=${process.env.GOOGLE_MAPS_GEO!}`;
+ const target = `${base}latlng=${NumCast(lat)},${NumCast(lng)}&key=${process.env.GOOGLE_MAPS_GEO!}`;
requestPromise.get(target).then(res => {
const formatted_address = JSON.parse(res).results[0].formatted_address || "<invalid address>";
if (formatted_address !== layout["mapLocation-address"]) {
@@ -132,14 +138,9 @@ class CollectionMapView extends CollectionSubView<MapSchema, Partial<MapProps> &
}
}
));
- return this.renderMarker(layout, icon);
+ return this.renderMarker(layout);
});
}
-
- private get map() {
- return (this.mapRef.current as any).map;
- }
-
render() {
const { childLayoutPairs } = this;
const { Document } = this.props;
@@ -156,16 +157,15 @@ class CollectionMapView extends CollectionSubView<MapSchema, Partial<MapProps> &
onWheel={e => e.stopPropagation()}
onPointerDown={e => (e.button === 0 && !e.ctrlKey) && e.stopPropagation()} >
<GeoMap
- ref={this.mapRef}
+ //ref={this.mapRef}
google={this.props.google}
zoom={center.zoom || 10}
initialCenter={center}
center={center}
- onDragend={() => {
- const { center } = this.map;
- Document[this.props.fieldKey + "-mapCenter-lat"] = center.lat();
- Document[this.props.fieldKey + "-mapCenter-lng"] = center.lng();
- }}
+ onDragend={undoBatch(action((e: any, map: any) => {
+ Document[this.props.fieldKey + "-mapCenter-lat"] = map.center.lat();
+ Document[this.props.fieldKey + "-mapCenter-lng"] = map.center.lng();
+ }))}
>
{this.contents}
</GeoMap>
@@ -174,8 +174,5 @@ class CollectionMapView extends CollectionSubView<MapSchema, Partial<MapProps> &
}
-const LoadingContainer = () => {
- return <div className={"loadingWrapper"}><img className={"loadingGif"} src={"/assets/loading.gif"} /></div>;
-};
-
+const LoadingContainer = () => <div className={"loadingWrapper"}><img className={"loadingGif"} src={"/assets/loading.gif"} /></div>;
export default GoogleApiWrapper({ apiKey: process.env.GOOGLE_MAPS!, LoadingContainer })(CollectionMapView) as any; \ No newline at end of file
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 5b6478e66..0ef7ece9c 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -586,7 +586,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
}
const docTemplate = docLayoutTemplate || creator?.(fieldTemplate ? [fieldTemplate] : [], { title: customName + "(" + doc.title + ")", isTemplateDoc: true, _width: _width + 20, _height: Math.max(100, _height + 45) });
- fieldTemplate && Doc.MakeMetadataFieldTemplate(fieldTemplate, Doc.GetProto(docTemplate));
+ fieldTemplate && Doc.MakeMetadataFieldTemplate(fieldTemplate, docTemplate ? Doc.GetProto(docTemplate) : docTemplate);
docTemplate && Doc.ApplyTemplateTo(docTemplate, doc, customName, undefined);
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 04:24:24 +0000