aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/MapMarker/MapMarker.tsx
blob: d87fd1b119fd12556fe185a894ddd29129470f46 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
import { action, computed, IReactionDisposer, observable } from "mobx";
import { observer } from "mobx-react";
import { Transaction } from "prosemirror-state";
import { EditorView } from "prosemirror-view";
import * as React from "react";
import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
import { documentSchema } from "../../../../fields/documentSchemas";
import { Id } from "../../../../fields/FieldSymbols";
import { createSchema, makeInterface } from "../../../../fields/Schema";
import { CurrentUserUtils } from "../../../util/CurrentUserUtils";
import { DragManager } from "../../../util/DragManager";
import { ViewBoxAnnotatableProps, ViewBoxAnnotatableComponent } from "../../DocComponent";
import { AnchorMenu } from "../../pdf/AnchorMenu";
import { FieldView, FieldViewProps } from "../FieldView";
import { FormattedTextBox } from "../formattedText/FormattedTextBox";
import { RichTextMenu } from "../formattedText/RichTextMenu";

type MarkerDocument = makeInterface<[typeof documentSchema]>;
const MarkerDocument = makeInterface(documentSchema);

@observer
export class MapMarker extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps & FieldViewProps, MarkerDocument>(MarkerDocument) {
    makeLinkAnchor(arg1: string, undefined: undefined, arg3: string) {
        throw new Error("Method not implemented.");
    }
    public static LayoutString(fieldKey: string) { return FieldView.LayoutString(MapMarker, fieldKey); }
    private _markerRef: React.RefObject<google.maps.Marker> = React.createRef();
    private _disposers: { [name: string]: IReactionDisposer } = {};
    private _latlngLocation!: google.maps.LatLng;
    private _markerId!: number;
    private _editorView: Opt<EditorView> // we'll see if this becomes useful for marker annotation/create link
    @observable _title: string = ""; // the title of the marker
    @observable _description: string = ""; // the description of the marker contents
    @observable isMarkerActive: boolean = false; // whether the marker is selected (we'll see if we need this)
    @observable associatedDocs: Doc[] = []; // a list of documents with the same/similar geographic coordinates
    @observable activeLinks: Doc[] = []; //TBD: what linking data structure looks like

    /**
     * Methods
     */

    componentDidMount() { }

    componentWillMount() { }

    @computed private get filterAssociatedDocs() {
        return
    }

    addLinkToMarker = () => { }



    @action
    setupAnchorMenu = () => {
        AnchorMenu.Instance.Status = "marquee";
        AnchorMenu.Instance.Highlight = action((color: string, isLinkButton: boolean) => {
            this._editorView?.state && RichTextMenu.Instance.insertHighlight(color, this._editorView.state, this._editorView?.dispatch);
            return undefined;
        });
        /**
         * This function is used by the PDFmenu to create an anchor highlight and a new linked text annotation.  
         * It also initiates a Drag/Drop interaction to place the text annotation.
         */
        AnchorMenu.Instance.StartDrag = action(async (e: PointerEvent, ele: HTMLElement) => {
            e.preventDefault();
            e.stopPropagation();
            const targetCreator = (annotationOn?: Doc) => {
                const target = CurrentUserUtils.GetNewTextDoc("Note linked to " + this.rootDoc.title, 0, 0, 100, 100, undefined, annotationOn);
                FormattedTextBox.SelectOnLoad = target[Id];
                return target;
            };

            // DragManager.StartAnchorAnnoDrag([ele], new DragManager.AnchorAnnoDragData(this.props.docViewPath().lastElement(), this.getAnchor, targetCreator), e.pageX, e.pageY);
        });
        const coordsB = this._editorView!.coordsAtPos(this._editorView!.state.selection.to);
        this.props.isSelected(true) && AnchorMenu.Instance.jumpTo(coordsB.left, coordsB.bottom);
    }

    // will see if end up using this
    dispatchTransaction = (tx: Transaction) => { }


    //will see if needed
    // for inserting timestamps
    insertTime = () => { }

    //for setting the title of the marker
    @action
    private updateTitle = () => { }

    //for updating the description of the marker
    @action
    private updateDescrption = () => { }



}