From c4eff83d814b1f9b94b7fc75ca06e8f0474de20d Mon Sep 17 00:00:00 2001
From: bob <bcz@cs.brown.edu>
Date: Fri, 8 Mar 2019 11:44:28 -0500
Subject: working version of pdfs with annotations.

---
 src/client/views/collections/CollectionPDFView.tsx | 74 ++++++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 src/client/views/collections/CollectionPDFView.tsx

(limited to 'src/client/views/collections/CollectionPDFView.tsx')

diff --git a/src/client/views/collections/CollectionPDFView.tsx b/src/client/views/collections/CollectionPDFView.tsx
new file mode 100644
index 000000000..90da43921
--- /dev/null
+++ b/src/client/views/collections/CollectionPDFView.tsx
@@ -0,0 +1,74 @@
+import { action, computed } from "mobx";
+import { observer } from "mobx-react";
+import { Document } from "../../../fields/Document";
+import { ListField } from "../../../fields/ListField";
+import { SelectionManager } from "../../util/SelectionManager";
+import { ContextMenu } from "../ContextMenu";
+import React = require("react");
+import { KeyStore } from "../../../fields/KeyStore";
+import { NumberField } from "../../../fields/NumberField";
+import { CollectionFreeFormView } from "./CollectionFreeFormView";
+import { CollectionDockingView } from "./CollectionDockingView";
+import { CollectionSchemaView } from "./CollectionSchemaView";
+import { CollectionViewProps } from "./CollectionViewBase";
+import { CollectionTreeView } from "./CollectionTreeView";
+import { Field } from "../../../fields/Field";
+import { CollectionViewType, CollectionView } from "./CollectionView";
+import { JSXElement } from "babel-types";
+
+
+@observer
+export class CollectionPDFView extends React.Component<CollectionViewProps> {
+
+    public static LayoutString(fieldKey: string = "DataKey") {
+        return `<${CollectionPDFView.name} Document={Document}
+                    ScreenToLocalTransform={ScreenToLocalTransform} fieldKey={${fieldKey}} panelWidth={PanelWidth} panelHeight={PanelHeight} isSelected={isSelected} select={select} bindings={bindings}
+                    isTopMost={isTopMost} SelectOnLoad={selectOnLoad} BackgroundView={BackgroundView} focus={focus}/>`;
+    }
+
+    @action onPageBack = () => this.curPage > 1 ? this.props.Document.SetNumber(KeyStore.CurPage, this.curPage - 1) : 0;
+    @action onPageForward = () => this.curPage < this.numPages ? this.props.Document.SetNumber(KeyStore.CurPage, this.curPage + 1) : 0;
+
+    @computed private get curPage() { return this.props.Document.GetNumber(KeyStore.CurPage, 0); }
+    @computed private get numPages() { return this.props.Document.GetNumber(KeyStore.NumPages, 0); }
+    @computed private get uIButtons() {
+        return (
+            <div className="pdfBox-buttonTray" key="tray">
+                <button className="pdfButton" onClick={this.onPageBack}>{"<"}</button>
+                <button className="pdfButton" onClick={this.onPageForward}>{">"}</button>
+            </div>);
+    }
+
+    // CollectionView API starts here...
+
+    public active: () => boolean = () => CollectionView.Active(this);
+
+    @action
+    addDocument = (doc: Document): void => {
+        doc.SetNumber(KeyStore.Page, this.curPage);
+        CollectionView.AddDocument(this.props, doc);
+    }
+
+    @action removeDocument = (doc: Document): boolean => {
+        return CollectionView.RemoveDocument(this.props, doc);
+    }
+
+    specificContextMenu = (e: React.MouseEvent): void => {
+        if (!e.isPropagationStopped) { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
+            ContextMenu.Instance.addItem({ description: "PDFOptions", event: () => { } })
+        }
+    }
+
+    get collectionViewType(): CollectionViewType { return CollectionViewType.Freeform; }
+
+
+    @computed
+    get subView(): any { return CollectionView.SubView(this); }
+
+    render() {
+        return (<div className="collectionView-cont" onContextMenu={this.specificContextMenu}>
+            {this.subView}
+            {this.props.isSelected() ? this.uIButtons : (null)}
+        </div>)
+    }
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From d3e66a67406447682c59045a0130d884fe1045a6 Mon Sep 17 00:00:00 2001
From: bob <bcz@cs.brown.edu>
Date: Fri, 8 Mar 2019 13:03:57 -0500
Subject: bug fixes and hack to make context menu appear again

---
 src/client/documents/Documents.ts                  |  2 +-
 src/client/views/collections/CollectionPDFView.tsx | 35 ++++-----------
 src/client/views/collections/CollectionView.tsx    | 52 +++++-----------------
 src/client/views/nodes/PDFBox.tsx                  |  4 +-
 4 files changed, 24 insertions(+), 69 deletions(-)

(limited to 'src/client/views/collections/CollectionPDFView.tsx')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index fb1c3d867..fc210e9a2 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -100,7 +100,7 @@ export namespace Documents {
         if (!pdfProto) {
             pdfProto = setupPrototypeOptions(pdfProtoId, "PDF_PROTO", CollectionPDFView.LayoutString("AnnotationsKey"),
                 { x: 0, y: 0, nativeWidth: 600, width: 300, layoutKeys: [KeyStore.Data, KeyStore.Annotations] });
-            pdfProto.SetNumber(KeyStore.Page, 1);
+            pdfProto.SetNumber(KeyStore.CurPage, 1);
             pdfProto.SetText(KeyStore.BackgroundLayout, PDFBox.LayoutString());
         }
         return pdfProto;
diff --git a/src/client/views/collections/CollectionPDFView.tsx b/src/client/views/collections/CollectionPDFView.tsx
index 90da43921..7fd9f0f11 100644
--- a/src/client/views/collections/CollectionPDFView.tsx
+++ b/src/client/views/collections/CollectionPDFView.tsx
@@ -1,20 +1,11 @@
 import { action, computed } from "mobx";
 import { observer } from "mobx-react";
 import { Document } from "../../../fields/Document";
-import { ListField } from "../../../fields/ListField";
-import { SelectionManager } from "../../util/SelectionManager";
-import { ContextMenu } from "../ContextMenu";
-import React = require("react");
 import { KeyStore } from "../../../fields/KeyStore";
-import { NumberField } from "../../../fields/NumberField";
-import { CollectionFreeFormView } from "./CollectionFreeFormView";
-import { CollectionDockingView } from "./CollectionDockingView";
-import { CollectionSchemaView } from "./CollectionSchemaView";
+import { ContextMenu } from "../ContextMenu";
+import { CollectionView, CollectionViewType } from "./CollectionView";
 import { CollectionViewProps } from "./CollectionViewBase";
-import { CollectionTreeView } from "./CollectionTreeView";
-import { Field } from "../../../fields/Field";
-import { CollectionViewType, CollectionView } from "./CollectionView";
-import { JSXElement } from "babel-types";
+import React = require("react");
 
 
 @observer
@@ -39,30 +30,20 @@ export class CollectionPDFView extends React.Component<CollectionViewProps> {
             </div>);
     }
 
-    // CollectionView API starts here...
+    // "inherited" CollectionView API starts here...
 
     public active: () => boolean = () => CollectionView.Active(this);
 
-    @action
-    addDocument = (doc: Document): void => {
-        doc.SetNumber(KeyStore.Page, this.curPage);
-        CollectionView.AddDocument(this.props, doc);
-    }
-
-    @action removeDocument = (doc: Document): boolean => {
-        return CollectionView.RemoveDocument(this.props, doc);
-    }
+    addDocument = (doc: Document): void => { CollectionView.AddDocument(this.props, doc); }
+    removeDocument = (doc: Document): boolean => { return CollectionView.RemoveDocument(this.props, doc); }
 
     specificContextMenu = (e: React.MouseEvent): void => {
-        if (!e.isPropagationStopped) { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
-            ContextMenu.Instance.addItem({ description: "PDFOptions", event: () => { } })
+        if (!e.isPropagationStopped() && this.props.Document.Id != "mainDoc") { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
+            ContextMenu.Instance.addItem({ description: "PDFOptions", event: () => { } });
         }
     }
 
     get collectionViewType(): CollectionViewType { return CollectionViewType.Freeform; }
-
-
-    @computed
     get subView(): any { return CollectionView.SubView(this); }
 
     render() {
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index 504538e85..49df04163 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -34,6 +34,9 @@ export class CollectionView extends React.Component<CollectionViewProps> {
     }
 
     public active: () => boolean = () => CollectionView.Active(this);
+    addDocument = (doc: Document): void => { CollectionView.AddDocument(this.props, doc); }
+    removeDocument = (doc: Document): boolean => { return CollectionView.RemoveDocument(this.props, doc); }
+    get subView() { return CollectionView.SubView(this); }
 
     public static Active(self: CollectionView): boolean {
         var isSelected = self.props.isSelected();
@@ -42,15 +45,9 @@ export class CollectionView extends React.Component<CollectionViewProps> {
         return isSelected || childSelected || topMost;
     }
 
-    addDocument = (doc: Document): void => {
-        CollectionView.AddDocument(this.props, doc);
-    }
-    removeDocument = (doc: Document): boolean => {
-        return CollectionView.RemoveDocument(this.props, doc);
-    }
-
     @action
     public static AddDocument(props: CollectionViewProps, doc: Document) {
+        doc.SetNumber(KeyStore.Page, props.Document.GetNumber(KeyStore.CurPage, 0));
         if (props.Document.Get(props.fieldKey) instanceof Field) {
             //TODO This won't create the field if it doesn't already exist
             const value = props.Document.GetData(props.fieldKey, ListField, new Array<Document>())
@@ -94,13 +91,8 @@ export class CollectionView extends React.Component<CollectionViewProps> {
         }
     }
 
-    set collectionViewType(type: CollectionViewType) {
-        let Document = this.props.Document;
-        Document.SetData(KeyStore.ViewType, type, NumberField);
-    }
-
     specificContextMenu = (e: React.MouseEvent): void => {
-        if (!e.isPropagationStopped) { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
+        if (!e.isPropagationStopped() && this.props.Document.Id != "mainDoc") { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
             ContextMenu.Instance.addItem({ description: "Freeform", event: () => this.props.Document.SetNumber(KeyStore.ViewType, CollectionViewType.Freeform) })
             ContextMenu.Instance.addItem({ description: "Schema", event: () => this.props.Document.SetNumber(KeyStore.ViewType, CollectionViewType.Schema) })
             ContextMenu.Instance.addItem({ description: "Treeview", event: () => this.props.Document.SetNumber(KeyStore.ViewType, CollectionViewType.Tree) })
@@ -108,35 +100,15 @@ export class CollectionView extends React.Component<CollectionViewProps> {
         }
     }
 
-    @computed
-    get subView() { return CollectionView.SubView(this); }
-
     public static SubView(self: CollectionView) {
-        let viewType = self.collectionViewType;
-        let subView = (null);
-        switch (viewType) {
-            case CollectionViewType.Freeform:
-                subView = (<CollectionFreeFormView {...self.props}
-                    addDocument={self.addDocument} removeDocument={self.removeDocument} active={self.active}
-                    CollectionView={self} />)
-                break;
-            case CollectionViewType.Schema:
-                subView = (<CollectionSchemaView {...self.props}
-                    addDocument={self.addDocument} removeDocument={self.removeDocument} active={self.active}
-                    CollectionView={self} />)
-                break;
-            case CollectionViewType.Docking:
-                subView = (<CollectionDockingView {...self.props}
-                    addDocument={self.addDocument} removeDocument={self.removeDocument} active={self.active}
-                    CollectionView={self} />)
-                break;
-            case CollectionViewType.Tree:
-                subView = (<CollectionTreeView {...self.props}
-                    addDocument={self.addDocument} removeDocument={self.removeDocument} active={self.active}
-                    CollectionView={self} />)
-                break;
+        let subProps = { ...self.props, addDocument: self.addDocument, removeDocument: self.removeDocument, active: self.active, CollectionView: self }
+        switch (self.collectionViewType) {
+            case CollectionViewType.Freeform: return (<CollectionFreeFormView {...subProps} />)
+            case CollectionViewType.Schema: return (<CollectionSchemaView {...subProps} />)
+            case CollectionViewType.Docking: return (<CollectionDockingView {...subProps} />)
+            case CollectionViewType.Tree: return (<CollectionTreeView {...subProps} />)
         }
-        return subView;
+        return (null);
     }
 
     render() {
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index fb3e24659..70a70c7c8 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -432,7 +432,9 @@ export class PDFBox extends React.Component<FieldViewProps> {
 
     @computed
     get pdfContent() {
-        const page = this.curPage;
+        let page = this.curPage;
+        if (page == 0)
+            page = 1;
         const renderHeight = 2400;
         let pdfUrl = this.props.doc.GetT(this.props.fieldKey, PDFField);
         let xf = this.props.doc.GetNumber(KeyStore.NativeHeight, 0) / renderHeight;
-- 
cgit v1.2.3-70-g09d2


From 933cfacdeed99da38070790c5ec17cbdeb755267 Mon Sep 17 00:00:00 2001
From: bob <bcz@cs.brown.edu>
Date: Mon, 11 Mar 2019 12:54:32 -0400
Subject: added marquee selection.

---
 .../views/collections/CollectionFreeFormView.tsx   | 16 +++++++++++---
 src/client/views/collections/CollectionPDFView.tsx |  2 ++
 src/client/views/collections/CollectionView.tsx    |  7 ++++--
 src/client/views/nodes/DocumentView.tsx            | 25 +++++++++++++++++++---
 4 files changed, 42 insertions(+), 8 deletions(-)

(limited to 'src/client/views/collections/CollectionPDFView.tsx')

diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index bc6d02757..37b3d6adb 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -27,6 +27,7 @@ import { CollectionViewBase } from "./CollectionViewBase";
 import React = require("react");
 import { Utils } from "../../../Utils";
 import { SelectionManager } from "../../util/SelectionManager";
+import anymatch = require("anymatch");
 const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this?
 
 @observer
@@ -115,12 +116,22 @@ export class CollectionFreeFormView extends CollectionViewBase {
 
     }
 
+    intersectRect(r1: { left: number, right: number, top: number, bottom: number },
+        r2: { left: number, right: number, top: number, bottom: number }) {
+        return !(r2.left > r1.right ||
+            r2.right < r1.left ||
+            r2.top > r1.bottom ||
+            r2.bottom < r1.top);
+    }
+
     @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);
+        let selRect = { left: p[0], top: p[1], right: p[0] + v[0], bottom: p[1] + v[1] }
 
+        this.props.CollectionView.SelectedDocs.length = 0;
         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) {
@@ -131,9 +142,8 @@ export class CollectionFreeFormView extends CollectionViewBase {
                     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);
-                    }
+                    if (this.intersectRect({ left: x, top: y, right: x + w, bottom: y + h }, selRect))
+                        this.props.CollectionView.SelectedDocs.push(doc.Id)
                 }
             })
         }
diff --git a/src/client/views/collections/CollectionPDFView.tsx b/src/client/views/collections/CollectionPDFView.tsx
index 7fd9f0f11..f22c07060 100644
--- a/src/client/views/collections/CollectionPDFView.tsx
+++ b/src/client/views/collections/CollectionPDFView.tsx
@@ -6,6 +6,7 @@ import { ContextMenu } from "../ContextMenu";
 import { CollectionView, CollectionViewType } from "./CollectionView";
 import { CollectionViewProps } from "./CollectionViewBase";
 import React = require("react");
+import { FieldId } from "../../../fields/Field";
 
 
 @observer
@@ -17,6 +18,7 @@ export class CollectionPDFView extends React.Component<CollectionViewProps> {
                     isTopMost={isTopMost} SelectOnLoad={selectOnLoad} BackgroundView={BackgroundView} focus={focus}/>`;
     }
 
+    public SelectedDocs: FieldId[] = []
     @action onPageBack = () => this.curPage > 1 ? this.props.Document.SetNumber(KeyStore.CurPage, this.curPage - 1) : 0;
     @action onPageForward = () => this.curPage < this.numPages ? this.props.Document.SetNumber(KeyStore.CurPage, this.curPage + 1) : 0;
 
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index f154909bb..548a51bf1 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -1,4 +1,4 @@
-import { action, computed } from "mobx";
+import { action, computed, observable } from "mobx";
 import { observer } from "mobx-react";
 import { Document } from "../../../fields/Document";
 import { ListField } from "../../../fields/ListField";
@@ -12,7 +12,7 @@ import { CollectionDockingView } from "./CollectionDockingView";
 import { CollectionSchemaView } from "./CollectionSchemaView";
 import { CollectionViewProps } from "./CollectionViewBase";
 import { CollectionTreeView } from "./CollectionTreeView";
-import { Field } from "../../../fields/Field";
+import { Field, FieldId } from "../../../fields/Field";
 
 export enum CollectionViewType {
     Invalid,
@@ -27,6 +27,9 @@ export const COLLECTION_BORDER_WIDTH = 2;
 @observer
 export class CollectionView extends React.Component<CollectionViewProps> {
 
+    @observable
+    public SelectedDocs: FieldId[] = [];
+
     public static LayoutString(fieldKey: string = "DataKey") {
         return `<${CollectionView.name} Document={Document}
                     ScreenToLocalTransform={ScreenToLocalTransform} fieldKey={${fieldKey}} panelWidth={PanelWidth} panelHeight={PanelHeight} isSelected={isSelected} select={select} bindings={bindings}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 263bb31d7..7627fbf6c 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -1,4 +1,4 @@
-import { action, computed } from "mobx";
+import { action, computed, IReactionDisposer, reaction } from "mobx";
 import { observer } from "mobx-react";
 import { Document } from "../../../fields/Document";
 import { Field, FieldWaiting, Opt } from "../../../fields/Field";
@@ -16,8 +16,8 @@ import { CollectionPDFView } from "../collections/CollectionPDFView";
 import { ContextMenu } from "../ContextMenu";
 import { FormattedTextBox } from "../nodes/FormattedTextBox";
 import { ImageBox } from "../nodes/ImageBox";
-import { VideoBox } from "../nodes/VideoBox"; 
-import { AudioBox } from "../nodes/AudioBox"; 
+import { VideoBox } from "../nodes/VideoBox";
+import { AudioBox } from "../nodes/AudioBox";
 import { Documents } from "../../documents/Documents"
 import { KeyValueBox } from "./KeyValueBox"
 import { WebBox } from "../nodes/WebBox";
@@ -88,6 +88,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
     private _documentBindings: any = null;
     private _downX: number = 0;
     private _downY: number = 0;
+    private _reactionDisposer: Opt<IReactionDisposer>;
     @computed get active(): boolean { return SelectionManager.IsSelected(this) || !this.props.ContainingCollectionView || this.props.ContainingCollectionView.active(); }
     @computed get topMost(): boolean { return !this.props.ContainingCollectionView || this.props.ContainingCollectionView.collectionViewType == CollectionViewType.Docking; }
     @computed get layout(): string { return this.props.Document.GetText(KeyStore.Layout, "<p>Error loading layout data</p>"); }
@@ -113,6 +114,24 @@ export class DocumentView extends React.Component<DocumentViewProps> {
             }
         }
     }
+
+
+    componentDidMount() {
+        this._reactionDisposer = reaction(
+            () => this.props.ContainingCollectionView && this.props.ContainingCollectionView.SelectedDocs.slice(),
+            () => {
+                if (this.props.ContainingCollectionView && this.props.ContainingCollectionView.SelectedDocs.indexOf(this.props.Document.Id) != -1)
+                    SelectionManager.SelectDoc(this, true);
+            });
+    }
+
+    componentWillUnmount() {
+        if (this._reactionDisposer) {
+            this._reactionDisposer();
+        }
+    }
+
+
     onPointerMove = (e: PointerEvent): void => {
         if (e.cancelBubble) {
             return;
-- 
cgit v1.2.3-70-g09d2

