diff options
Diffstat (limited to 'src/client')
| -rw-r--r-- | src/client/views/Main.tsx | 12 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionFreeFormView.tsx | 15 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionViewBase.tsx | 34 |
3 files changed, 59 insertions, 2 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index e76a5e04b..268f70de1 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -38,6 +38,7 @@ import { faPenNib } from '@fortawesome/free-solid-svg-icons'; import { faFilm } from '@fortawesome/free-solid-svg-icons'; import { faMusic } from '@fortawesome/free-solid-svg-icons'; import Measure from 'react-measure'; +import { DashUserModel } from '../../server/authentication/models/user_model'; @observer export class Main extends React.Component { @@ -49,12 +50,13 @@ export class Main extends React.Component { @observable public pheight: number = 0; private mainDocId: string | undefined; + private currentUser?: DashUserModel; constructor(props: Readonly<{}>) { super(props); // causes errors to be generated when modifying an observable outside of an action configure({ enforceActions: "observed" }); - if (window.location.pathname !== "/home") { + if (window.location.pathname !== RouteStore.home) { let pathname = window.location.pathname.split("/"); this.mainDocId = pathname[pathname.length - 1]; } @@ -75,6 +77,14 @@ export class Main extends React.Component { Documents.initProtos(() => { this.initAuthenticationRouters(); }); + + request.get(this.prepend(RouteStore.getCurrUser), (error, response, body) => { + if (body) { + this.currentUser = body as DashUserModel; + } else { + throw new Error("There should be a user! Why does Dash think there isn't one?") + } + }) } initEventListeners = () => { diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx index bb28dd20a..a3a596c37 100644 --- a/src/client/views/collections/CollectionFreeFormView.tsx +++ b/src/client/views/collections/CollectionFreeFormView.tsx @@ -322,6 +322,7 @@ export class CollectionFreeFormView extends CollectionViewBase { return ( <div className={`collectionfreeformview${this.isAnnotationOverlay ? "-overlay" : "-container"}`} onPointerDown={this.onPointerDown} + onPointerMove={(e) => super.setCursorPosition(this.props.ScreenToLocalTransform().transformPoint(e.screenX, e.screenY))} onWheel={this.onPointerWheel} onDrop={this.onDrop.bind(this)} onDragOver={this.onDragOver} @@ -329,6 +330,20 @@ export class CollectionFreeFormView extends CollectionViewBase { style={{ borderWidth: `${COLLECTION_BORDER_WIDTH}px`, }} tabIndex={0} ref={this.createDropTarget}> + {super.getCursors().map(entry => { + let point = entry.Data[1] + return ( + <div + style={{ + position: 'absolute', + left: point[0], + top: point[1], + borderRadius: "50%", + background: "pink" + }} + /> + ); + })} <div className="collectionfreeformview" style={{ transformOrigin: "left top", transform: `translate(${dx}px, ${dy}px) scale(${this.zoomScaling}, ${this.zoomScaling}) translate(${panx}px, ${pany}px)` }} ref={this._canvasRef}> diff --git a/src/client/views/collections/CollectionViewBase.tsx b/src/client/views/collections/CollectionViewBase.tsx index 4a2761139..81d7f4077 100644 --- a/src/client/views/collections/CollectionViewBase.tsx +++ b/src/client/views/collections/CollectionViewBase.tsx @@ -1,4 +1,4 @@ -import { action, runInAction } from "mobx"; +import { action, runInAction, observable, computed } from "mobx"; import { Document } from "../../../fields/Document"; import { ListField } from "../../../fields/ListField"; import React = require("react"); @@ -12,6 +12,9 @@ import { Key } from "../../../fields/Key"; import { Transform } from "../../util/Transform"; import { CollectionView } from "./CollectionView"; import { RouteStore } from "../../../server/RouteStore"; +import { TupleField } from "../../../fields/TupleField"; +import { Server } from "mongodb"; +import { DashUserModel } from "../../../server/authentication/models/user_model"; export interface CollectionViewProps { fieldKey: Key; @@ -25,13 +28,17 @@ export interface CollectionViewProps { panelHeight: () => number; focus: (doc: Document) => void; } + export interface SubCollectionViewProps extends CollectionViewProps { active: () => boolean; addDocument: (doc: Document) => void; removeDocument: (doc: Document) => boolean; CollectionView: CollectionView; + currentUser?: DashUserModel; } +export type CursorEntry = TupleField<DashUserModel, [number, number]>; + export class CollectionViewBase extends React.Component<SubCollectionViewProps> { private dropDisposer?: DragManager.DragDropDisposer; protected createDropTarget = (ele: HTMLDivElement) => { @@ -43,6 +50,31 @@ export class CollectionViewBase extends React.Component<SubCollectionViewProps> } } + protected setCursorPosition(position: [number, number]) { + let user = this.props.currentUser; + if (user && user.id) { + let ind; + let doc = this.props.Document; + let cursors = doc.GetOrCreate<ListField<CursorEntry>>(KeyStore.Cursors, ListField, false).Data; + let entry = new TupleField<DashUserModel, [number, number]>([user.id, position]); + // if ((ind = cursors.findIndex(entry => entry.Data[0] === user.id)) > -1) { + // cursors[ind] = entry; + // } else { + // cursors.push(entry); + // } + } + } + + protected getCursors(): CursorEntry[] { + let user = this.props.currentUser; + if (user && user.id) { + let doc = this.props.Document; + // return doc.GetList<CursorEntry>(KeyStore.Cursors, []).filter(entry => entry.Data[0] !== user.id); + } + return []; + } + + @undoBatch @action protected drop(e: Event, de: DragManager.DropEvent) { |