aboutsummaryrefslogtreecommitdiff
path: root/src/mobile
diff options
context:
space:
mode:
Diffstat (limited to 'src/mobile')
-rw-r--r--src/mobile/ImageUpload.tsx2
-rw-r--r--src/mobile/MobileInkOverlay.scss4
-rw-r--r--src/mobile/MobileInkOverlay.tsx35
-rw-r--r--src/mobile/MobileInterface.scss7
-rw-r--r--src/mobile/MobileInterface.tsx42
5 files changed, 48 insertions, 42 deletions
diff --git a/src/mobile/ImageUpload.tsx b/src/mobile/ImageUpload.tsx
index 10bd78075..42dfd4e51 100644
--- a/src/mobile/ImageUpload.tsx
+++ b/src/mobile/ImageUpload.tsx
@@ -106,8 +106,6 @@ class Uploader extends React.Component {
}
-// Scripting.addGlobal(function uploadImageMobile() { return Uploader.onClick(); });
-
// DocServer.init(window.location.protocol, window.location.hostname, 4321, "image upload");
(async () => {
diff --git a/src/mobile/MobileInkOverlay.scss b/src/mobile/MobileInkOverlay.scss
index 2e45d0441..0b4484519 100644
--- a/src/mobile/MobileInkOverlay.scss
+++ b/src/mobile/MobileInkOverlay.scss
@@ -1,10 +1,10 @@
.mobileInkOverlay {
border: 5px dashed red;
+ background-color: rgba(0, 0, 0, .05);
}
.mobileInkOverlay-border {
- background-color: rgba(0, 255, 0, .4);
- position: absolute;
+ // background-color: rgba(0, 255, 0, .4); position: absolute;
pointer-events: auto;
cursor: pointer;
diff --git a/src/mobile/MobileInkOverlay.tsx b/src/mobile/MobileInkOverlay.tsx
index 9f810424a..db6cf21b4 100644
--- a/src/mobile/MobileInkOverlay.tsx
+++ b/src/mobile/MobileInkOverlay.tsx
@@ -20,6 +20,7 @@ export default class MobileInkOverlay extends React.Component {
@observable private _height: number = 0;
@observable private _x: number = -300;
@observable private _y: number = -300;
+ @observable private _text: string = "";
@observable private _offsetX: number = 0;
@observable private _offsetY: number = 0;
@@ -32,21 +33,25 @@ export default class MobileInkOverlay extends React.Component {
}
initialSize(mobileWidth: number, mobileHeight: number) {
- const maxWidth = window.innerWidth - 30; // TODO: may not be window ?? figure out how to not include library ????
+ const maxWidth = window.innerWidth - 30;
const maxHeight = window.innerHeight - 30; // -30 for padding
- const scale = Math.min(maxWidth / mobileWidth, maxHeight / mobileHeight);
- return { width: mobileWidth * scale, height: mobileHeight * scale, scale: scale };
+ if (mobileWidth > maxWidth || mobileHeight > maxHeight) {
+ const scale = Math.min(maxWidth / mobileWidth, maxHeight / mobileHeight);
+ return { width: mobileWidth * scale, height: mobileHeight * scale, scale: scale };
+ }
+ return { width: mobileWidth, height: mobileHeight, scale: 1 };
}
@action
initMobileInkOverlay(content: MobileInkOverlayContent) {
- const { width, height } = content;
+ const { width, height, text } = content;
const scaledSize = this.initialSize(width ? width : 0, height ? height : 0);
this._width = scaledSize.width;
this._height = scaledSize.height;
- this._scale = scaledSize.scale; //scaledSize.scale;
+ this._scale = scaledSize.scale;
this._x = 300; // TODO: center on screen
this._y = 25; // TODO: center on screen
+ this._text = text ? text : "";
}
@action
@@ -73,7 +78,7 @@ export default class MobileInkOverlay extends React.Component {
};
const target = document.elementFromPoint(this._x + 10, this._y + 10);
- target?.dispatchEvent(
+ target ?.dispatchEvent(
new CustomEvent<GestureUtils.GestureEvent>("dashOnGesture",
{
bubbles: true,
@@ -88,25 +93,13 @@ export default class MobileInkOverlay extends React.Component {
}
uploadDocument = async (content: MobileDocumentUploadContent) => {
- const { docId, asCollection } = content;
- console.log("receive upload document id", docId);
+ const { docId } = content;
const doc = await DocServer.GetRefField(docId);
if (doc && doc instanceof Doc) {
- console.log("parsed upload document into doc", StrCast(doc.proto!.title));
-
const target = document.elementFromPoint(this._x + 10, this._y + 10);
- console.log("the target is", target);
-
- let uploadDocs = [doc];
- if (!asCollection) {
- const children = await DocListCastAsync(doc.data);
- console.log("uploading children", children);
- uploadDocs = children ? children : [];
- }
- const dragData = new DragManager.DocumentDragData(uploadDocs);
+ const dragData = new DragManager.DocumentDragData([doc]);
const complete = new DragManager.DragCompleteEvent(false, dragData);
- console.log("the drag data is", dragData);
if (target) {
target.dispatchEvent(
@@ -181,11 +174,11 @@ export default class MobileInkOverlay extends React.Component {
zIndex: 30000,
pointerEvents: "none",
borderStyle: this._isDragging ? "solid" : "dashed",
- backgroundColor: "rgba(255, 0, 0, 0.3)"
}
}
ref={this._mainCont}
>
+ <p>{this._text}</p>
<div className="mobileInkOverlay-border top" onPointerDown={this.dragStart}></div>
<div className="mobileInkOverlay-border bottom" onPointerDown={this.dragStart}></div>
<div className="mobileInkOverlay-border left" onPointerDown={this.dragStart}></div>
diff --git a/src/mobile/MobileInterface.scss b/src/mobile/MobileInterface.scss
index 8b0ebcd53..8083e5760 100644
--- a/src/mobile/MobileInterface.scss
+++ b/src/mobile/MobileInterface.scss
@@ -1,15 +1,18 @@
.mobileInterface-inkInterfaceButtons {
position: absolute;
- top: -50px;
+ top: 0px;
display: flex;
justify-content: space-between;
width: 100%;
z-index: 9999;
height: 50px;
+
+ .mobileInterface-button {
+ height: 100%;
+ }
}
.mobileInterface-container {
height: calc(100% - 50px);
- margin-top: 50px;
position: relative;
} \ No newline at end of file
diff --git a/src/mobile/MobileInterface.tsx b/src/mobile/MobileInterface.tsx
index e21258c62..a3b956a15 100644
--- a/src/mobile/MobileInterface.tsx
+++ b/src/mobile/MobileInterface.tsx
@@ -34,6 +34,7 @@ import MarqueeOptionsMenu from '../client/views/collections/collectionFreeForm/M
import GoogleAuthenticationManager from '../client/apis/GoogleAuthenticationManager';
import { listSpec } from '../new_fields/Schema';
import { Id } from '../new_fields/FieldSymbols';
+import { DocumentManager } from '../client/util/DocumentManager';
library.add(faLongArrowAltLeft);
@@ -73,7 +74,6 @@ export default class MobileInterface extends React.Component {
onSwitch && onSwitch();
this.renderView = renderView;
- console.log("switching current view", renderView);
}
onSwitchInking = () => {
@@ -87,22 +87,37 @@ export default class MobileInterface extends React.Component {
});
}
- onSwitchUpload = () => {
+ onSwitchUpload = async () => {
+ let width = 300;
+ let height = 300;
+
+ // get width and height of the collection doc
+ if (this.mainContainer) {
+ const data = Cast(this.mainContainer.data, listSpec(Doc));
+ if (data) {
+ const collectionDoc = await data[1]; // this should be the collection doc since the positions should be locked
+ const docView = DocumentManager.Instance.getDocumentView(collectionDoc);
+ if (docView) {
+ width = docView.nativeWidth ? docView.nativeWidth : 300;
+ height = docView.nativeHeight ? docView.nativeHeight : 300;
+ }
+ }
+ }
DocServer.Mobile.dispatchOverlayTrigger({
enableOverlay: true,
- width: 100,
- height: 100
+ width: width,
+ height: height,
+ text: "Documents uploaded from mobile will show here",
});
}
renderDefaultContent = () => {
- console.log("rendering default content", this.mainContainer);
if (this.mainContainer) {
return <DocumentView
Document={this.mainContainer}
DataDoc={undefined}
LibraryPath={emptyPath}
- addDocument={(doc: Doc) => { console.log("want to add doc to default content", StrCast(doc.title)); return false; }}
+ addDocument={returnFalse}
addDocTab={returnFalse}
pinToPres={emptyFunction}
removeDocument={undefined}
@@ -142,7 +157,6 @@ export default class MobileInterface extends React.Component {
}
shiftLeft = (e: React.MouseEvent) => {
- console.log("shift left!");
DocServer.Mobile.dispatchOverlayPositionUpdate({
dx: -10
});
@@ -203,17 +217,16 @@ export default class MobileInterface extends React.Component {
}
}
- upload = async (e: React.MouseEvent, asCollection: boolean) => {
+ upload = async (e: React.MouseEvent) => {
if (this.mainContainer) {
const data = Cast(this.mainContainer.data, listSpec(Doc));
if (data) {
- const uploadDoc = await data[1]; // TODO: ensure this is the collection to upload
-
- console.log("UPLOADING DOCUMENT FROM MOBILE", uploadDoc[Id], StrCast(uploadDoc.proto!.title));
+ const collectionDoc = await data[1]; // this should be the collection doc since the positions should be locked
+ const children = Cast(collectionDoc.data, listSpec(Doc), []);
+ const uploadDoc = children.length === 1 ? await children[0] : collectionDoc;
if (uploadDoc) {
DocServer.Mobile.dispatchMobileDocumentUpload({
docId: uploadDoc[Id],
- asCollection: asCollection
});
}
}
@@ -231,15 +244,14 @@ export default class MobileInterface extends React.Component {
<button className="mobileInterface-button cancel" onClick={this.onBack} title="Back">BACK</button>
</div>
<div className="uploadSettings">
- <button className="mobileInterface-button" onClick={e => this.upload(e, false)} title="Upload">UPLOAD</button>
- <button className="mobileInterface-button" onClick={e => this.upload(e, true)} title="Upload">UPLOAD AS COLLECTION</button>
+ <button className="mobileInterface-button" onClick={this.upload} title="Upload">UPLOAD</button>
</div>
</div>
<DocumentView
Document={this.mainContainer}
DataDoc={undefined}
LibraryPath={emptyPath}
- addDocument={(doc: Doc) => { console.log("want to add doc", StrCast(doc.title)); return false; }}
+ addDocument={returnFalse}
addDocTab={returnFalse}
pinToPres={emptyFunction}
removeDocument={undefined}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2026-01-23 14:04:13 +0000