aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/GestureOverlay.tsx2
-rw-r--r--src/client/views/collections/CollectionSubView.tsx2
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx8
-rw-r--r--src/mobile/MobileInterface.scss7
-rw-r--r--src/mobile/MobileInterface.tsx62
-rw-r--r--src/server/authentication/models/current_user_utils.ts2
6 files changed, 53 insertions, 30 deletions
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 632f2f0d6..4d487c032 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -231,9 +231,9 @@ export default class GestureOverlay extends Touchable {
render() {
return (
<div className="gestureOverlay-cont" onPointerDown={this.onPointerDown} onTouchStart={this.onTouchStart}>
+ {this.currentStroke}
{this.props.children}
{this._palette}
- {this.currentStroke}
</div>);
}
}
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index d8b575092..e94f24f2c 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -53,9 +53,7 @@ export function CollectionSubView<T>(schemaCtor: (doc: Doc) => T) {
protected createDropAndGestureTarget = (ele: HTMLDivElement) => { //used for stacking and masonry view
this.dropDisposer && this.dropDisposer();
this.gestureDisposer && this.gestureDisposer();
- console.log("create drop", ele);
if (ele) {
- console.log("create drop 2", ele);
this.dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this));
this.gestureDisposer = GestureUtils.MakeGestureTarget(ele, this.onGesture.bind(this));
}
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index c3e131184..8d376fb57 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -114,6 +114,7 @@ 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;
@@ -356,12 +357,12 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
@undoBatch
onGesture = (e: Event, ge: GestureUtils.GestureEvent) => {
- console.log("on gesture");
switch (ge.gesture) {
case GestureUtils.Gestures.Stroke:
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;
@@ -403,14 +404,14 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
@action
pan = (e: PointerEvent | React.Touch | { clientX: number, clientY: number }): void => {
// I think it makes sense for the marquee menu to go away when panned. -syip2
- MarqueeOptionsMenu.Instance.fadeOut(true);
+ MarqueeOptionsMenu.Instance && MarqueeOptionsMenu.Instance.fadeOut(true);
let x = this.Document.panX || 0;
let y = this.Document.panY || 0;
const docs = this.childLayoutPairs.map(pair => pair.layout);
const [dx, dy] = this.getTransform().transformDirection(e.clientX - this._lastX, e.clientY - this._lastY);
if (!this.isAnnotationOverlay) {
- PDFMenu.Instance.fadeOut(true);
+ PDFMenu.Instance && PDFMenu.Instance.fadeOut(true);
const minx = docs.length ? NumCast(docs[0].x) : 0;
const maxx = docs.length ? NumCast(docs[0].width) + minx : minx;
const miny = docs.length ? NumCast(docs[0].y) : 0;
@@ -990,6 +991,7 @@ 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.scss b/src/mobile/MobileInterface.scss
new file mode 100644
index 000000000..e4cc919a5
--- /dev/null
+++ b/src/mobile/MobileInterface.scss
@@ -0,0 +1,7 @@
+.mobileInterface-topButtons {
+ position: absolute;
+ display: flex;
+ justify-content: space-between;
+ width: 100%;
+ z-index: 9999;
+} \ No newline at end of file
diff --git a/src/mobile/MobileInterface.tsx b/src/mobile/MobileInterface.tsx
index 8d342d749..3cb08afa7 100644
--- a/src/mobile/MobileInterface.tsx
+++ b/src/mobile/MobileInterface.tsx
@@ -10,10 +10,16 @@ import { DocumentView } from '../client/views/nodes/DocumentView';
import { emptyPath, emptyFunction, returnFalse, returnOne, returnEmptyString, returnTrue } from '../Utils';
import { Transform } from '../client/util/Transform';
import { library } from '@fortawesome/fontawesome-svg-core';
-import { faPenNib, faHighlighter, faEraser, faMousePointer, faBreadSlice } from '@fortawesome/free-solid-svg-icons';
+import { faPenNib, faHighlighter, faEraser, faMousePointer, faBreadSlice, faTrash, faCheck } from '@fortawesome/free-solid-svg-icons';
import { Scripting } from '../client/util/Scripting';
import { CollectionFreeFormView } from '../client/views/collections/collectionFreeForm/CollectionFreeFormView';
import GestureOverlay from '../client/views/GestureOverlay';
+import { InkingControl } from '../client/views/InkingControl';
+import { InkTool } from '../new_fields/InkField';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import "./MobileInterface.scss";
+
+library.add(faTrash, faCheck);
@observer
export default class MobileInterface extends React.Component {
@@ -22,6 +28,9 @@ export default class MobileInterface extends React.Component {
@computed private get mainContainer() { return this.userDoc ? FieldValue(Cast(this.userDoc.activeMobile, Doc)) : CurrentUserUtils.GuestMobile; }
@observable private currentView: "main" | "ink" | "library" = "main";
+ private mainDoc = CurrentUserUtils.setupMobileDoc(this.userDoc);
+ private inkDoc?: Doc;
+
constructor(props: Readonly<{}>) {
super(props);
MobileInterface.Instance = this;
@@ -32,8 +41,8 @@ export default class MobileInterface extends React.Component {
library.add(...[faPenNib, faHighlighter, faEraser, faMousePointer]);
if (this.userDoc && !this.mainContainer) {
- const doc = CurrentUserUtils.setupMobileDoc(this.userDoc);
- this.userDoc.activeMobile = doc;
+ // const doc = CurrentUserUtils.setupMobileDoc(this.userDoc);
+ this.userDoc.activeMobile = this.mainDoc;
}
}
@@ -44,13 +53,14 @@ export default class MobileInterface extends React.Component {
if (this.userDoc) {
switch (view) {
case "main": {
- const doc = CurrentUserUtils.setupMobileDoc(this.userDoc);
- this.userDoc.activeMobile = doc;
+ // const doc = CurrentUserUtils.setupMobileDoc(this.userDoc);
+ this.userDoc.activeMobile = this.mainDoc;
break;
}
case "ink": {
- const doc = CurrentUserUtils.setupMobileInkingDoc(this.userDoc);
- this.userDoc.activeMobile = doc;
+ this.inkDoc = CurrentUserUtils.setupMobileInkingDoc(this.userDoc);
+ this.userDoc.activeMobile = this.inkDoc;
+ InkingControl.Instance.switchTool(InkTool.Pen);
break;
}
}
@@ -64,7 +74,7 @@ export default class MobileInterface extends React.Component {
Document={this.mainContainer}
DataDoc={undefined}
LibraryPath={emptyPath}
- addDocument={undefined}
+ addDocument={returnFalse}
addDocTab={returnFalse}
pinToPres={emptyFunction}
removeDocument={undefined}
@@ -89,40 +99,46 @@ export default class MobileInterface extends React.Component {
return "hello";
}
+ 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
+ }
+
@computed
get inkContent() {
- // return <div>INK</div>;
+ // TODO: get props from active collection and pass to the new freeform
if (this.mainContainer) {
return (
<GestureOverlay>
- <CollectionFreeFormView
+ <div className="mobileInterface-topButtons">
+ <button className="mobileInterface-button cancel" onClick={this.onClick} title="Cancel drawing"><FontAwesomeIcon icon="trash" /></button>
+ <button className="mobileInterface-button cancel" onClick={this.onClick} title="Insert drawing"><FontAwesomeIcon icon="check" /></button>
+ </div>
+ <CollectionView
Document={this.mainContainer}
DataDoc={undefined}
LibraryPath={emptyPath}
fieldKey={""}
- addDocument={returnFalse}
- removeDocument={returnFalse}
- moveDocument={returnFalse}
addDocTab={returnFalse}
pinToPres={emptyFunction}
- PanelHeight={() => window.screen.height}
- PanelWidth={() => window.screen.width}
- annotationsKey={""}
- isAnnotationOverlay={false}
+ PanelHeight={() => window.innerHeight}
+ PanelWidth={() => window.innerWidth}
focus={emptyFunction}
- isSelected={returnTrue} //
+ isSelected={returnTrue}
select={emptyFunction}
- active={returnTrue} //
+ active={returnTrue}
ContentScaling={returnOne}
whenActiveChanged={returnFalse}
- CollectionView={undefined}
ScreenToLocalTransform={Transform.Identity}
ruleProvider={undefined}
renderDepth={0}
ContainingCollectionView={undefined}
- ContainingCollectionDoc={undefined}
- chromeCollapsed={true}>
- </CollectionFreeFormView>
+ ContainingCollectionDoc={undefined}>
+ </CollectionView>
</GestureOverlay>
);
}
diff --git a/src/server/authentication/models/current_user_utils.ts b/src/server/authentication/models/current_user_utils.ts
index b40179fbc..98092ddfe 100644
--- a/src/server/authentication/models/current_user_utils.ts
+++ b/src/server/authentication/models/current_user_utils.ts
@@ -141,7 +141,7 @@ export class CurrentUserUtils {
}
static setupMobileInkingDoc(userDoc: Doc) {
- return Docs.Create.FreeformDocument([], { x: 0, y: 0, width: 10, height: 20, title: "Mobile Inking", backgroundColor: "red" });
+ return Docs.Create.FreeformDocument([], { title: "Mobile Inking", backgroundColor: "white" });
}
// setup the Creator button which will display the creator panel. This panel will include the drag creators and the color picker. when clicked, this panel will be displayed in the target container (ie, sidebarContainer)
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 21:30:25 +0000