aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/DocServer.ts22
-rw-r--r--src/client/views/GestureOverlay.tsx21
-rw-r--r--src/client/views/MainView.tsx13
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx3
-rw-r--r--src/mobile/MobileInterface.tsx25
-rw-r--r--src/server/Message.ts13
-rw-r--r--src/server/Websocket/Websocket.ts12
7 files changed, 94 insertions, 15 deletions
diff --git a/src/client/DocServer.ts b/src/client/DocServer.ts
index ed7fbd7ba..cfd9612ed 100644
--- a/src/client/DocServer.ts
+++ b/src/client/DocServer.ts
@@ -1,10 +1,11 @@
import * as OpenSocket from 'socket.io-client';
-import { MessageStore, YoutubeQueryTypes } from "./../server/Message";
+import { MessageStore, YoutubeQueryTypes, GestureContent } from "./../server/Message";
import { Opt, Doc } from '../new_fields/Doc';
import { Utils, emptyFunction } from '../Utils';
import { SerializationHelper } from './util/SerializationHelper';
import { RefField } from '../new_fields/RefField';
import { Id, HandleUpdate } from '../new_fields/FieldSymbols';
+import GestureOverlay from './views/GestureOverlay';
/**
* This class encapsulates the transfer and cross-client synchronization of
@@ -64,6 +65,19 @@ export namespace DocServer {
}
}
+ export namespace Mobile {
+
+ export function dispatchGesturePoints(content: GestureContent) {
+ Utils.Emit(_socket, MessageStore.GesturePoints, content);
+ }
+
+ export function dispatchBoxTrigger(enableBox: boolean) {
+ // _socket.emit("dispatchBoxTrigger");
+ Utils.Emit(_socket, MessageStore.MobileInkBoxTrigger, enableBox);
+ }
+
+ }
+
export function init(protocol: string, hostname: string, port: number, identifier: string) {
_cache = {};
GUID = identifier;
@@ -85,6 +99,12 @@ export namespace DocServer {
Utils.AddServerHandler(_socket, MessageStore.ConnectionTerminated, () => {
alert("Your connection to the server has been terminated.");
});
+ _socket.addEventListener("receiveGesturePoints", (content: GestureContent) => {
+ GestureOverlay.Instance.manualDispatch(content);
+ });
+ _socket.addEventListener("receiveBoxTrigger", (enableBox: boolean) => {
+ GestureOverlay.Instance.showBox(enableBox);
+ });
}
function errorFunc(): never {
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 4d487c032..4b8dfa119 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -16,6 +16,10 @@ import { Scripting } from "../util/Scripting";
import { FieldValue, Cast } from "../../new_fields/Types";
import { CurrentUserUtils } from "../../server/authentication/models/current_user_utils";
import Palette from "./Palette";
+import MobileInterface from "../../mobile/MobileInterface";
+import { MainView } from "./MainView";
+import { DocServer } from "../DocServer";
+import { GestureContent } from "../../server/Message";
@observer
export default class GestureOverlay extends Touchable {
@@ -35,6 +39,14 @@ export default class GestureOverlay extends Touchable {
GestureOverlay.Instance = this;
}
+ manualDispatch = (content: GestureContent) => {
+ console.log(content);
+ }
+
+ showBox = (enableBox: boolean) => {
+ console.log("enable box?", enableBox);
+ }
+
@action
handleHandDown = (e: React.TouchEvent) => {
const fingers = InteractionUtils.GetMyTargetTouches(e, this.prevPoints, true);
@@ -139,6 +151,15 @@ export default class GestureOverlay extends Touchable {
const B = this.svgBounds;
const points = this._points.map(p => ({ X: p.X - B.left, Y: p.Y - B.top }));
+ if (MobileInterface.Instance.drawingInk) {
+ const { selectedColor, selectedWidth } = InkingControl.Instance;
+ DocServer.Mobile.dispatchGesturePoints({
+ points: this._points,
+ color: selectedColor,
+ width: selectedWidth
+ });
+ }
+
const result = GestureUtils.GestureRecognizer.Recognize(new Array(points));
let actionPerformed = false;
if (result && result.Score > 0.7) {
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 93fb0a07c..f1f7c37a3 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -49,6 +49,7 @@ export class MainView extends React.Component {
private _flyoutSizeOnDown = 0;
private _urlState: HistoryUtil.DocUrl;
private _docBtnRef = React.createRef<HTMLDivElement>();
+ private _mainViewRef = React.createRef<HTMLDivElement>();
@observable private _panelWidth: number = 0;
@observable private _panelHeight: number = 0;
@@ -507,8 +508,16 @@ export class MainView extends React.Component {
return (null);
}
+ get mainViewElement() {
+ return document.getElementById("mainView-container");
+ }
+
+ get mainViewRef() {
+ return this._mainViewRef;
+ }
+
render() {
- return (<div id="mainView-container">
+ return (<div id="mainView-container" ref={this._mainViewRef}>
<DictationOverlay />
<SharingManager />
<GoogleAuthenticationManager />
@@ -518,7 +527,7 @@ export class MainView extends React.Component {
</GestureOverlay>
<PreviewCursor />
<ContextMenu />
- <RadialMenu/>
+ <RadialMenu />
<PDFMenu />
<MarqueeOptionsMenu />
<OverlayView />
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 8d376fb57..bbfd22f50 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -114,7 +114,6 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
}
private addDocument = (newBox: Doc) => {
const added = this.props.addDocument(newBox);
- console.log("adding doc from freeform", added);
added && this.bringToFront(newBox);
added && this.updateCluster(newBox);
return added;
@@ -362,7 +361,6 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
const points = ge.points;
const B = this.getTransform().transformBounds(ge.bounds.left, ge.bounds.top, ge.bounds.width, ge.bounds.height);
const inkDoc = Docs.Create.InkDocument(InkingControl.Instance.selectedColor, InkingControl.Instance.selectedTool, parseInt(InkingControl.Instance.selectedWidth), points, { x: B.x, y: B.y, width: B.width, height: B.height });
- console.log("make stroke", inkDoc);
this.addDocument(inkDoc);
e.stopPropagation();
break;
@@ -991,7 +989,6 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
// otherwise, they are stored in fieldKey. All annotations to this document are stored in the extension document
if (!this.extensionDoc) return (null);
// let lodarea = this.Document[WidthSym]() * this.Document[HeightSym]() / this.props.ScreenToLocalTransform().Scale / this.props.ScreenToLocalTransform().Scale;
- console.log("height freeform", this.isAnnotationOverlay, this.Document.scrollHeight, this.props.PanelHeight());
return <div className={"collectionfreeformview-container"} ref={this.createDropAndGestureTarget} onWheel={this.onPointerWheel}//pointerEvents: SelectionManager.GetIsDragging() ? "all" : undefined,
style={{ pointerEvents: SelectionManager.GetIsDragging() ? "all" : undefined, height: this.isAnnotationOverlay ? (this.props.Document.scrollHeight ? this.Document.scrollHeight : "100%") : this.props.PanelHeight() }}
onPointerDown={this.onPointerDown} onPointerMove={this.onCursorMove} onDrop={this.onDrop.bind(this)} onContextMenu={this.onContextMenu} onTouchStart={this.onTouchStart}>
diff --git a/src/mobile/MobileInterface.tsx b/src/mobile/MobileInterface.tsx
index 3cb08afa7..1429226b4 100644
--- a/src/mobile/MobileInterface.tsx
+++ b/src/mobile/MobileInterface.tsx
@@ -2,7 +2,7 @@ import React = require('react');
import { observer } from 'mobx-react';
import { computed, action, observable } from 'mobx';
import { CurrentUserUtils } from '../server/authentication/models/current_user_utils';
-import { FieldValue, Cast } from '../new_fields/Types';
+import { FieldValue, Cast, StrCast } from '../new_fields/Types';
import { Doc } from '../new_fields/Doc';
import { Docs } from '../client/documents/Documents';
import { CollectionView } from '../client/views/collections/CollectionView';
@@ -18,6 +18,10 @@ import { InkingControl } from '../client/views/InkingControl';
import { InkTool } from '../new_fields/InkField';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import "./MobileInterface.scss";
+import { SelectionManager } from '../client/util/SelectionManager';
+import { DateField } from '../new_fields/DateField';
+import { GestureUtils } from '../pen-gestures/GestureUtils';
+import { DocServer } from '../client/DocServer';
library.add(faTrash, faCheck);
@@ -30,6 +34,7 @@ export default class MobileInterface extends React.Component {
private mainDoc = CurrentUserUtils.setupMobileDoc(this.userDoc);
private inkDoc?: Doc;
+ public drawingInk: boolean = false;
constructor(props: Readonly<{}>) {
super(props);
@@ -61,6 +66,10 @@ export default class MobileInterface extends React.Component {
this.inkDoc = CurrentUserUtils.setupMobileInkingDoc(this.userDoc);
this.userDoc.activeMobile = this.inkDoc;
InkingControl.Instance.switchTool(InkTool.Pen);
+ this.drawingInk = true;
+
+ DocServer.Mobile.dispatchBoxTrigger(true);
+
break;
}
}
@@ -100,17 +109,17 @@ export default class MobileInterface extends React.Component {
}
onClick = (e: React.MouseEvent) => {
- // insert ink as collection into active displayed doc view
- // reset ink collection
- this.inkDoc = undefined;
- console.log("clicked");
this.switchCurrentView("main");
InkingControl.Instance.switchTool(InkTool.None); // TODO: switch to previous tool
+
+ DocServer.Mobile.dispatchBoxTrigger(false);
+
+ this.inkDoc = undefined;
+ this.drawingInk = false;
}
@computed
get inkContent() {
- // TODO: get props from active collection and pass to the new freeform
if (this.mainContainer) {
return (
<GestureOverlay>
@@ -128,9 +137,9 @@ export default class MobileInterface extends React.Component {
PanelHeight={() => window.innerHeight}
PanelWidth={() => window.innerWidth}
focus={emptyFunction}
- isSelected={returnTrue}
+ isSelected={returnFalse}
select={emptyFunction}
- active={returnTrue}
+ active={returnFalse}
ContentScaling={returnOne}
whenActiveChanged={returnFalse}
ScreenToLocalTransform={Transform.Identity}
diff --git a/src/server/Message.ts b/src/server/Message.ts
index 621abfd1e..fe74dafa5 100644
--- a/src/server/Message.ts
+++ b/src/server/Message.ts
@@ -1,4 +1,5 @@
import { Utils } from "../Utils";
+import { Point } from "../pen-gestures/ndollar";
export class Message<T> {
private _name: string;
@@ -42,6 +43,16 @@ export interface Diff extends Reference {
readonly diff: any;
}
+export interface GestureContent {
+ readonly points: Array<Point>;
+ readonly width?: string;
+ readonly color?: string;
+}
+
+export interface MobileInkBoxTriggerContent {
+ readonly enableBox: boolean;
+}
+
export namespace MessageStore {
export const Foo = new Message<string>("Foo");
export const Bar = new Message<string>("Bar");
@@ -51,6 +62,8 @@ export namespace MessageStore {
export const GetDocument = new Message<string>("Get Document");
export const DeleteAll = new Message<any>("Delete All");
export const ConnectionTerminated = new Message<string>("Connection Terminated");
+ export const GesturePoints = new Message<GestureContent>("Gesture Points");
+ export const MobileInkBoxTrigger = new Message<boolean>("Trigger Mobile Ink Box");
export const GetRefField = new Message<string>("Get Ref Field");
export const GetRefFields = new Message<string[]>("Get Ref Fields");
diff --git a/src/server/Websocket/Websocket.ts b/src/server/Websocket/Websocket.ts
index 578147d60..67777f023 100644
--- a/src/server/Websocket/Websocket.ts
+++ b/src/server/Websocket/Websocket.ts
@@ -1,5 +1,5 @@
import { Utils } from "../../Utils";
-import { MessageStore, Transferable, Types, Diff, YoutubeQueryInput, YoutubeQueryTypes } from "../Message";
+import { MessageStore, Transferable, Types, Diff, YoutubeQueryInput, YoutubeQueryTypes, GestureContent } from "../Message";
import { Client } from "../Client";
import { Socket } from "socket.io";
import { Database } from "../database";
@@ -54,6 +54,8 @@ export namespace WebSocket {
Utils.AddServerHandler(socket, MessageStore.UpdateField, diff => UpdateField(socket, diff));
Utils.AddServerHandler(socket, MessageStore.DeleteField, id => DeleteField(socket, id));
Utils.AddServerHandler(socket, MessageStore.DeleteFields, ids => DeleteFields(socket, ids));
+ Utils.AddServerHandler(socket, MessageStore.GesturePoints, content => processGesturePoints(socket, content));
+ Utils.AddServerHandler(socket, MessageStore.MobileInkBoxTrigger, enableBox => processBoxTrigger(socket, enableBox));
Utils.AddServerHandlerCallback(socket, MessageStore.GetRefField, GetRefField);
Utils.AddServerHandlerCallback(socket, MessageStore.GetRefFields, GetRefFields);
@@ -68,6 +70,14 @@ export namespace WebSocket {
logPort("websocket", socketPort);
}
+ function processGesturePoints(socket: Socket, content: GestureContent) {
+ socket.broadcast.emit("receiveGesturePoints", content);
+ }
+
+ function processBoxTrigger(socket: Socket, enableBox: boolean) {
+ socket.broadcast.emit("receiveBoxTrigger", enableBox);
+ }
+
function HandleYoutubeQuery([query, callback]: [YoutubeQueryInput, (result?: any[]) => void]) {
const { ProjectCredentials } = GoogleCredentialsLoader;
switch (query.type) {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-17 21:18:24 +0000