aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/.DS_Storebin0 -> 6148 bytes
-rw-r--r--src/client/documents/Documents.ts37
-rw-r--r--src/client/views/Main.tsx6
-rw-r--r--src/client/views/nodes/DocumentView.tsx7
-rw-r--r--src/client/views/nodes/FieldView.tsx5
-rw-r--r--src/client/views/nodes/WebBox.scss13
-rw-r--r--src/client/views/nodes/WebBox.tsx73
-rw-r--r--src/fields/BasicField 2.ts38
-rw-r--r--src/fields/WebField.ts21
9 files changed, 197 insertions, 3 deletions
diff --git a/src/.DS_Store b/src/.DS_Store
new file mode 100644
index 000000000..4d6acb95a
--- /dev/null
+++ b/src/.DS_Store
Binary files differ
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 72fa608ad..605a99bef 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -9,6 +9,8 @@ import { CollectionDockingView } from "../views/collections/CollectionDockingVie
import { CollectionSchemaView } from "../views/collections/CollectionSchemaView";
import { ImageField } from "../../fields/ImageField";
import { ImageBox } from "../views/nodes/ImageBox";
+import { WebField } from "../../fields/WebField";
+import { WebBox } from "../views/nodes/WebBox";
import { CollectionFreeFormView } from "../views/collections/CollectionFreeFormView";
import { FieldId } from "../../fields/Field";
@@ -67,7 +69,7 @@ export namespace Documents {
export function TextDocument(options: DocumentOptions = {}): Document {
let doc = GetTextPrototype().MakeDelegate();
setupOptions(doc, options);
- // doc.SetField(KeyStore.Data, new RichTextField());
+ // doc.Set(KeyStore.Data, new RichTextField());
return doc;
}
@@ -129,7 +131,7 @@ export namespace Documents {
imageProto.Set(KeyStore.Height, new NumberField(300));
imageProto.Set(KeyStore.Layout, new TextField(CollectionFreeFormView.LayoutString("AnnotationsKey")));
imageProto.Set(KeyStore.BackgroundLayout, new TextField(ImageBox.LayoutString()));
- // imageProto.SetField(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />'));
+ // imageProto.Set(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />'));
imageProto.Set(KeyStore.LayoutKeys, new ListField([KeyStore.Data, KeyStore.Annotations]));
Server.AddDocument(imageProto);
return imageProto;
@@ -150,6 +152,37 @@ export namespace Documents {
return sdoc;
}
+ let webProtoId: FieldId;
+ function GetWebPrototype(): Document {
+ if (webProtoId === undefined) {
+ let webProto = new Document();
+ webProtoId = webProto.Id;
+ webProto.Set(KeyStore.Title, new TextField("WEB PROTO"));
+ webProto.Set(KeyStore.X, new NumberField(0));
+ webProto.Set(KeyStore.Y, new NumberField(0));
+ webProto.Set(KeyStore.NativeWidth, new NumberField(300));
+ webProto.Set(KeyStore.NativeHeight, new NumberField(300));
+ webProto.Set(KeyStore.Width, new NumberField(300));
+ webProto.Set(KeyStore.Height, new NumberField(300));
+ webProto.Set(KeyStore.Layout, new TextField(CollectionFreeFormView.LayoutString("AnnotationsKey")));
+ webProto.Set(KeyStore.BackgroundLayout, new TextField(WebBox.LayoutString()));
+ webProto.Set(KeyStore.LayoutKeys, new ListField([KeyStore.Data, KeyStore.Annotations]));
+ Server.AddDocument(webProto);
+ return webProto;
+ }
+ return Server.GetField(webProtoId) as Document;
+ }
+
+ export function WebDocument(url: string, options: DocumentOptions = {}): Document {
+ let doc = GetWebPrototype().MakeDelegate();
+ setupOptions(doc, options);
+ doc.Set(KeyStore.Data, new WebField(new URL(url)));
+ Server.AddDocument(doc);
+ var sdoc = Server.GetField(doc.Id) as Document;
+ console.log(sdoc);
+ return sdoc;
+ }
+
let collectionProto: Document;
function GetCollectionPrototype(): Document {
if (!collectionProto) {
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index aec9618ae..457bed72c 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -79,6 +79,12 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
// mainNodes.Data.push(doc1);
// mainNodes.Data.push(doc2);
mainNodes.Data.push(doc6);
+
+ let doc9 = Documents.WebDocument("https://crossorigin.me/https://google.com", {
+ x: 450, y: 100, title: "cat 1", width: 606, height: 386, nativeWidth: 606, nativeHeight: 386
+ });
+ mainNodes.Data.push(doc9);
+
mainContainer.Set(KeyStore.Data, mainNodes);
}
//}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index c5270e0cd..d06423755 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -11,7 +11,12 @@ import { CollectionSchemaView } from "../collections/CollectionSchemaView";
import { CollectionViewBase, COLLECTION_BORDER_WIDTH } from "../collections/CollectionViewBase";
import { FormattedTextBox } from "../nodes/FormattedTextBox";
import { ImageBox } from "../nodes/ImageBox";
+<<<<<<< HEAD
+import { WebBox } from "../nodes/WebBox";
+import "./NodeView.scss";
+=======
import "./DocumentView.scss";
+>>>>>>> 3f98d6ec6050e7faa15179871f0d9669c1188a78
import React = require("react");
import { Transform } from "../../util/Transform";
const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this?
@@ -181,7 +186,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
transform: `scale(${this.props.ParentScaling},${this.props.ParentScaling})`
}}>
<JsxParser
- components={{ FormattedTextBox: FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
+ components={{ FormattedTextBox: FormattedTextBox, ImageBox, WebBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
bindings={bindings}
jsx={this.layout}
showWarnings={true}
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index 12371eb2e..df6a409ec 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -7,9 +7,11 @@ import { TextField } from "../../../fields/TextField";
import { NumberField } from "../../../fields/NumberField";
import { RichTextField } from "../../../fields/RichTextField";
import { ImageField } from "../../../fields/ImageField";
+import { WebField } from "../../../fields/WebField";
import { Key } from "../../../fields/Key";
import { FormattedTextBox } from "./FormattedTextBox";
import { ImageBox } from "./ImageBox";
+import { WebBox } from "./WebBox";
import { DocumentView } from "./DocumentView";
//
@@ -45,6 +47,9 @@ export class FieldView extends React.Component<FieldViewProps> {
else if (field instanceof ImageField) {
return <ImageBox {...this.props} />
}
+ else if (field instanceof WebField) {
+ return <WebBox {...this.props} />
+ }
else if (field instanceof NumberField) {
return <p>{field.Data}</p>
} else if (field != FieldWaiting) {
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
new file mode 100644
index 000000000..9df984d68
--- /dev/null
+++ b/src/client/views/nodes/WebBox.scss
@@ -0,0 +1,13 @@
+
+.webBox-cont {
+ padding: 0vw;
+ position: absolute;
+ width: 100%
+}
+
+.webBox-button {
+ padding : 0vw;
+ border: none;
+ width : 100%;
+ height: 100%;
+} \ No newline at end of file
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
new file mode 100644
index 000000000..b9d0853b9
--- /dev/null
+++ b/src/client/views/nodes/WebBox.tsx
@@ -0,0 +1,73 @@
+
+import Lightbox from 'react-image-lightbox';
+import { SelectionManager } from "../../util/SelectionManager";
+import "./WebBox.scss";
+import React = require("react")
+import { WebField } from '../../../fields/WebField';
+import { FieldViewProps, FieldView } from './FieldView';
+import { CollectionFreeFormDocumentView } from './CollectionFreeFormDocumentView';
+import { FieldWaiting } from '../../../fields/Field';
+import { observer } from "mobx-react"
+import { observable, action, spy } from 'mobx';
+import { KeyStore } from '../../../fields/Key';
+
+@observer
+export class WebBox extends React.Component<FieldViewProps> {
+
+ public static LayoutString() { return FieldView.LayoutString("WebBox"); }
+ private _ref: React.RefObject<HTMLDivElement>;
+ private _downX: number = 0;
+ private _downY: number = 0;
+ private _lastTap: number = 0;
+ @observable private _isOpen: boolean = false;
+
+ constructor(props: FieldViewProps) {
+ super(props);
+
+ this._ref = React.createRef();
+ this.state = {
+ isOpen: false,
+ };
+ }
+
+ componentDidMount() {
+ }
+
+ componentWillUnmount() {
+ }
+
+ onPointerDown = (e: React.PointerEvent): void => {
+ if (Date.now() - this._lastTap < 300) {
+ if (e.buttons === 1 && this.props.DocumentViewForField instanceof CollectionFreeFormDocumentView &&
+ SelectionManager.IsSelected(this.props.DocumentViewForField)) {
+ e.stopPropagation();
+ this._downX = e.clientX;
+ this._downY = e.clientY;
+ document.removeEventListener("pointerup", this.onPointerUp);
+ document.addEventListener("pointerup", this.onPointerUp);
+ }
+ } else {
+ this._lastTap = Date.now();
+ }
+ }
+ @action
+ onPointerUp = (e: PointerEvent): void => {
+ document.removeEventListener("pointerup", this.onPointerUp);
+ if (Math.abs(e.clientX - this._downX) < 2 && Math.abs(e.clientY - this._downY) < 2) {
+ this._isOpen = true;
+ }
+ e.stopPropagation();
+ }
+
+ render() {
+ let field = this.props.doc.Get(this.props.fieldKey);
+ let path = field == FieldWaiting ? "https://image.flaticon.com/icons/svg/66/66163.svg" :
+ field instanceof WebField ? field.Data.href : "https://crossorigin.me/" + "https://cs.brown.edu";
+ let nativeWidth = this.props.doc.GetNumber(KeyStore.NativeWidth, 1);
+
+ return (
+ <div className="webBox-cont" onPointerDown={this.onPointerDown} ref={this._ref} >
+ <iframe src={path} width={nativeWidth}></iframe>
+ </div>)
+ }
+} \ No newline at end of file
diff --git a/src/fields/BasicField 2.ts b/src/fields/BasicField 2.ts
new file mode 100644
index 000000000..437024d07
--- /dev/null
+++ b/src/fields/BasicField 2.ts
@@ -0,0 +1,38 @@
+import { Field } from "./Field"
+import { observable, computed, action } from "mobx";
+
+export abstract class BasicField<T> extends Field {
+ constructor(data: T) {
+ super();
+
+ this.data = data;
+ }
+
+ @observable
+ private data:T;
+
+ @computed
+ get Data(): T {
+ return this.data;
+ }
+
+ set Data(value: T) {
+ if(this.data === value) {
+ return;
+ }
+ this.data = value;
+ }
+
+ @action
+ TrySetValue(value: any): boolean {
+ if (typeof value == typeof this.data) {
+ this.Data = value;
+ return true;
+ }
+ return false;
+ }
+
+ GetValue(): any {
+ return this.Data;
+ }
+}
diff --git a/src/fields/WebField.ts b/src/fields/WebField.ts
new file mode 100644
index 000000000..cd3519128
--- /dev/null
+++ b/src/fields/WebField.ts
@@ -0,0 +1,21 @@
+import { BasicField } from "./BasicField";
+import { Field } from "./Field";
+
+export class WebField extends BasicField<URL> {
+ constructor(data: URL | undefined = undefined) {
+ super(data == undefined ? new URL("https://crossorigin.me/" + "https://cs.brown.edu/") : data);
+ }
+
+ toString(): string {
+ return this.Data.href;
+ }
+
+ ToScriptString(): string {
+ return `new WebField("${this.Data}")`;
+ }
+
+ Copy(): Field {
+ return new WebField(this.Data);
+ }
+
+} \ No newline at end of file
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-10 20:54:05 +0000