aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/documents/Documents.ts11
-rw-r--r--src/client/views/collections/CollectionFreeFormView.scss7
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx68
-rw-r--r--src/client/views/collections/CollectionSchemaView.tsx4
-rw-r--r--src/client/views/nodes/FormattedTextBox.tsx6
5 files changed, 79 insertions, 17 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index a91834cca..b78762018 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -22,6 +22,7 @@ import { AudioBox } from "../views/nodes/AudioBox";
import { PDFField } from "../../fields/PDFField";
import { PDFBox } from "../views/nodes/PDFBox";
import { CollectionPDFView } from "../views/collections/CollectionPDFView";
+import { RichTextField } from "../../fields/RichTextField";
export interface DocumentOptions {
x?: number;
@@ -45,8 +46,8 @@ export namespace Documents {
let webProto: Document;
let collProto: Document;
let kvpProto: Document;
- let videoProto: Document;
- let audioProto: Document;
+ let videoProto: Document;
+ let audioProto: Document;
let pdfProto: Document;
const textProtoId = "textProto";
const pdfProtoId = "pdfProto";
@@ -150,7 +151,7 @@ export namespace Documents {
doc.SetText(KeyStore.OverlayLayout, FixedCaption());
return doc;
}
- export function VideoDocument(url: string, options: DocumentOptions = {}){
+ export function VideoDocument(url: string, options: DocumentOptions = {}) {
let doc = SetInstanceOptions(GetVideoPrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] },
new URL(url), VideoField);
doc.SetText(KeyStore.Caption, "my caption...");
@@ -158,7 +159,7 @@ export namespace Documents {
doc.SetText(KeyStore.OverlayLayout, FixedCaption());
return doc;
}
- export function AudioDocument(url: string, options: DocumentOptions = {}){
+ export function AudioDocument(url: string, options: DocumentOptions = {}) {
let doc = SetInstanceOptions(GetAudioPrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] },
new URL(url), AudioField);
doc.SetText(KeyStore.Caption, "my caption...");
@@ -167,7 +168,7 @@ export namespace Documents {
return doc;
}
export function TextDocument(options: DocumentOptions = {}) {
- return SetInstanceOptions(GetTextPrototype(), options, "", TextField);
+ return SetInstanceOptions(GetTextPrototype(), options, "", RichTextField);
}
export function PdfDocument(url: string, options: DocumentOptions = {}) {
return SetInstanceOptions(GetPdfPrototype(), options, new URL(url), PDFField);
diff --git a/src/client/views/collections/CollectionFreeFormView.scss b/src/client/views/collections/CollectionFreeFormView.scss
index b059163ed..d487cd7ce 100644
--- a/src/client/views/collections/CollectionFreeFormView.scss
+++ b/src/client/views/collections/CollectionFreeFormView.scss
@@ -22,6 +22,13 @@
height: 100%;
}
}
+.collectionfreeformview-marquee{
+ border-style: dashed;
+ box-sizing: border-box;
+ position: absolute;
+ border-width: 1px;
+ border-color: black;
+}
.collectionfreeformview-overlay {
.collectionfreeformview > .jsx-parser{
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 16002ad9f..bc6d02757 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -25,13 +25,16 @@ import "./CollectionFreeFormView.scss";
import { COLLECTION_BORDER_WIDTH } from "./CollectionView";
import { CollectionViewBase } from "./CollectionViewBase";
import React = require("react");
-import { render } from "pug";
+import { Utils } from "../../../Utils";
+import { SelectionManager } from "../../util/SelectionManager";
const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this?
@observer
export class CollectionFreeFormView extends CollectionViewBase {
private _canvasRef = React.createRef<HTMLDivElement>();
+ @observable
private _lastX: number = 0;
+ @observable
private _lastY: number = 0;
private _selectOnLoaded: string = ""; // id of document that should be selected once it's loaded (used for click-to-type)
@@ -68,10 +71,13 @@ export class CollectionFreeFormView extends CollectionViewBase {
this.bringToFront(doc);
}
+ @observable
+ _marquee = false;
+
@action
onPointerDown = (e: React.PointerEvent): void => {
- if (((e.button === 2 && this.props.active()) ||
- !e.defaultPrevented) && (!this.isAnnotationOverlay || this.zoomScaling != 1 || e.button == 0)) {
+ if (((e.button === 2 && this.props.active()) || !e.defaultPrevented) &&
+ (!this.isAnnotationOverlay || this.zoomScaling != 1 || e.button == 0)) {
document.removeEventListener("pointermove", this.onPointerMove);
document.addEventListener("pointermove", this.onPointerMove);
document.removeEventListener("pointerup", this.onPointerUp);
@@ -80,6 +86,11 @@ export class CollectionFreeFormView extends CollectionViewBase {
this._lastY = e.pageY;
this._downX = e.pageX;
this._downY = e.pageY;
+ this._marquee = e.shiftKey;
+ if (this._marquee) {
+ e.stopPropagation();
+ e.preventDefault();
+ }
}
}
@@ -88,7 +99,12 @@ export class CollectionFreeFormView extends CollectionViewBase {
document.removeEventListener("pointermove", this.onPointerMove);
document.removeEventListener("pointerup", this.onPointerUp);
e.stopPropagation();
- if (Math.abs(this._downX - e.clientX) < 3 && Math.abs(this._downY - e.clientY) < 3) {
+
+ if (this._marquee) {
+ this.marqueeSelect();
+ this._marquee = false;
+ }
+ else if (!this._marquee && Math.abs(this._downX - e.clientX) < 3 && Math.abs(this._downY - e.clientY) < 3) {
//show preview text cursor on tap
this._previewCursorVisible = true;
//select is not already selected
@@ -100,15 +116,42 @@ export class CollectionFreeFormView extends CollectionViewBase {
}
@action
+ marqueeSelect() {
+ var curPage = this.props.Document.GetNumber(KeyStore.CurPage, 1);
+ let p = this.getTransform().transformPoint(this._downX, this._downY);
+ let v = this.getTransform().transformDirection(this._lastX - this._downX, this._lastY - this._downY);
+
+ var curPage = this.props.Document.GetNumber(KeyStore.CurPage, 1);
+ const lvalue = this.props.Document.GetT<ListField<Document>>(this.props.fieldKey, ListField);
+ if (lvalue && lvalue != FieldWaiting) {
+ lvalue.Data.map(doc => {
+ var page = doc.GetNumber(KeyStore.Page, 0);
+ if (page == curPage || page == 0) {
+ var x = doc.GetNumber(KeyStore.X, 0);
+ var y = doc.GetNumber(KeyStore.Y, 0);
+ var w = doc.GetNumber(KeyStore.Width, 0);
+ var h = doc.GetNumber(KeyStore.Height, 0);
+ if (x > p[0] && x < p[0] + v[0] && y > p[1] && y < p[1] + v[1]) {
+ // SelectionManager.SelectDoc(doc as any as DocumentView, true);
+ }
+ }
+ })
+ }
+ }
+
+ @action
onPointerMove = (e: PointerEvent): void => {
if (!e.cancelBubble && this.props.active()) {
e.stopPropagation();
e.preventDefault();
- let x = this.props.Document.GetNumber(KeyStore.PanX, 0);
- let y = this.props.Document.GetNumber(KeyStore.PanY, 0);
- let [dx, dy] = this.getTransform().transformDirection(e.clientX - this._lastX, e.clientY - this._lastY);
- this._previewCursorVisible = false;
- this.SetPan(x - dx, y - dy);
+
+ if (!this._marquee) {
+ let x = this.props.Document.GetNumber(KeyStore.PanX, 0);
+ let y = this.props.Document.GetNumber(KeyStore.PanY, 0);
+ let [dx, dy] = this.getTransform().transformDirection(e.clientX - this._lastX, e.clientY - this._lastY);
+ this._previewCursorVisible = false;
+ this.SetPan(x - dx, y - dy);
+ }
}
this._lastX = e.pageX;
this._lastY = e.pageY;
@@ -291,6 +334,10 @@ export class CollectionFreeFormView extends CollectionViewBase {
cursor = <div id="prevCursor" onKeyPress={this.onKeyDown} style={{ color: "black", position: "absolute", transformOrigin: "left top", transform: `translate(${x}px, ${y}px)` }}>I</div>
}
+ let p = this.getTransform().transformPoint(this._downX, this._downY);
+ let v = this.getTransform().transformDirection(this._lastX - this._downX, this._lastY - this._downY);
+ var marquee = this._marquee ? <div className="collectionfreeformview-marquee" style={{ transform: `translate(${p[0]}px, ${p[1]}px)`, width: `${v[0]}`, height: `${v[1]}` }}></div> : (null);
+
let [dx, dy] = [this.centeringShiftX, this.centeringShiftY];
const panx: number = -this.props.Document.GetNumber(KeyStore.PanX, 0);
@@ -313,7 +360,8 @@ export class CollectionFreeFormView extends CollectionViewBase {
{this.backgroundView}
<InkingCanvas getScreenTransform={this.getTransform} Document={this.props.Document} />
{cursor}
- {this.views}
+ {React.Children.map(this.views, (child) => child)}
+ {marquee}
</div>
{this.overlayView}
</div>
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index 49f95c014..04f017378 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -203,6 +203,8 @@ export class CollectionSchemaView extends CollectionViewBase {
)
let previewHandle = !this.props.active() ? (null) : (
<div className="collectionSchemaView-previewHandle" onPointerDown={this.onExpanderDown} />);
+ let dividerDragger = this._splitPercentage == 100 ? (null) :
+ <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} style={{ width: `${this.DIVIDER_WIDTH}px` }} />
return (
<div className="collectionSchemaView-container" onPointerDown={this.onPointerDown} ref={this._mainCont} style={{ borderWidth: `${COLLECTION_BORDER_WIDTH}px` }} >
<div className="collectionSchemaView-dropTarget" onDrop={(e: React.DragEvent) => this.onDrop(e, {})} ref={this.createDropTarget}>
@@ -232,7 +234,7 @@ export class CollectionSchemaView extends CollectionViewBase {
</div>
}
</Measure>
- <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} style={{ width: `${this.DIVIDER_WIDTH}px` }} />
+ {dividerDragger}
<div className="collectionSchemaView-previewRegion" style={{ width: `calc(${100 - this._splitPercentage}% - ${this.DIVIDER_WIDTH}px)` }}>
{content}
</div>
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index a6cee9957..ad7ddf37a 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -69,7 +69,7 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
};
let field = this.props.doc.GetT(this.props.fieldKey, RichTextField);
- if (field && field != FieldWaiting) {
+ if (field && field != FieldWaiting && field.Data) {
state = EditorState.fromJSON(config, JSON.parse(field.Data));
} else {
state = EditorState.create(config);
@@ -151,8 +151,12 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
})
}
+ onKeyPress(e: React.KeyboardEvent) {
+ e.stopPropagation();
+ }
render() {
return (<div className="formattedTextBox-cont"
+ onKeyPress={this.onKeyPress}
onPointerDown={this.onPointerDown}
onContextMenu={this.specificContextMenu}
onWheel={this.onPointerWheel}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-09 13:17:49 +0000