aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/pdf
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/pdf')
-rw-r--r--src/client/views/pdf/Annotation.tsx12
-rw-r--r--src/client/views/pdf/PDFViewer.tsx55
-rw-r--r--src/client/views/pdf/Page.tsx36
3 files changed, 78 insertions, 25 deletions
diff --git a/src/client/views/pdf/Annotation.tsx b/src/client/views/pdf/Annotation.tsx
index ed7081b1d..513f9fed6 100644
--- a/src/client/views/pdf/Annotation.tsx
+++ b/src/client/views/pdf/Annotation.tsx
@@ -9,6 +9,8 @@ import { List } from "../../../new_fields/List";
import PDFMenu from "./PDFMenu";
import { DocumentManager } from "../../util/DocumentManager";
import { PresentationView } from "../presentationview/PresentationView";
+import { LinkManager } from "../../util/LinkManager";
+import { CollectionDockingView } from "../collections/CollectionDockingView";
interface IAnnotationProps {
anno: Doc;
@@ -110,11 +112,15 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
}
@action
- onPointerDown = (e: React.PointerEvent) => {
+ onPointerDown = async (e: React.PointerEvent) => {
if (e.button === 0) {
- let targetDoc = Cast(this.props.document.target, Doc, null);
+ let targetDoc = await Cast(this.props.document.target, Doc);
if (targetDoc) {
- DocumentManager.Instance.jumpToDocument(targetDoc, false);
+ let context = await Cast(targetDoc.targetContext, Doc);
+ if (context) {
+ DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined,
+ ((doc) => this.props.parent.props.parent.props.addDocTab(context!, context!.proto, e.ctrlKey ? "onRight" : "inTab")));
+ }
}
}
if (e.button === 2) {
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index b7ded7e06..5eb02a6da 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -20,6 +20,7 @@ import { ScriptField } from "../../../new_fields/ScriptField";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import Annotation from "./Annotation";
import { KeyCodes } from "../../northstar/utils/KeyCodes";
+import { DocServer } from "../../DocServer";
const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer");
export const scale = 2;
@@ -91,6 +92,7 @@ export class Viewer extends React.Component<IViewerProps> {
// private _textContent: Pdfjs.TextContent[] = [];
private _pdfFindController: any;
private _searchString: string = "";
+ private _selectionText: string = "";
constructor(props: IViewerProps) {
super(props);
@@ -101,6 +103,10 @@ export class Viewer extends React.Component<IViewerProps> {
this._mainCont = React.createRef();
}
+ setSelectionText = (text: string) => {
+ this._selectionText = text;
+ }
+
componentDidUpdate = (prevProps: IViewerProps) => {
if (this.scrollY !== prevProps.scrollY) {
this.renderPages();
@@ -156,6 +162,9 @@ export class Viewer extends React.Component<IViewerProps> {
if (this._mainCont.current) {
this._dropDisposer = this._mainCont.current && DragManager.MakeDropTarget(this._mainCont.current, { handlers: { drop: this.drop.bind(this) } });
}
+
+ document.removeEventListener("copy", this.copy);
+ document.addEventListener("copy", this.copy);
}
componentWillUnmount = () => {
@@ -163,11 +172,47 @@ export class Viewer extends React.Component<IViewerProps> {
this._annotationReactionDisposer && this._annotationReactionDisposer();
this._filterReactionDisposer && this._filterReactionDisposer();
this._dropDisposer && this._dropDisposer();
+ document.removeEventListener("copy", this.copy);
+ }
+
+ private copy = (e: ClipboardEvent) => {
+ if (this.props.parent.props.active()) {
+ let text = this._selectionText;
+ if (e.clipboardData) {
+ e.clipboardData.setData("text/plain", text);
+ e.clipboardData.setData("dash/pdfOrigin", this.props.parent.props.Document[Id]);
+ let annoDoc = this.makeAnnotationDocument(undefined, 0, "#0390fc");
+ e.clipboardData.setData("dash/pdfRegion", annoDoc[Id]);
+ e.preventDefault();
+ }
+ }
+ // let targetAnnotations = DocListCast(this.props.parent.fieldExtensionDoc.annotations);
+ // if (targetAnnotations) {
+ // targetAnnotations.push(destDoc);
+ // }
+ }
+
+ paste = (e: ClipboardEvent) => {
+ if (e.clipboardData) {
+ if (e.clipboardData.getData("dash/pdfOrigin") === this.props.parent.props.Document[Id]) {
+ let linkDocId = e.clipboardData.getData("dash/linkDoc");
+ if (linkDocId) {
+ DocServer.GetRefField(linkDocId).then(async (link) => {
+ if (!(link instanceof Doc)) {
+ return;
+ }
+ let proto = Doc.GetProto(link);
+ let source = await Cast(proto.anchor1, Doc);
+ proto.anchor2 = this.makeAnnotationDocument(source, 0, "#0390fc", false);
+ });
+ }
+ }
+ }
}
scrollTo(y: number) {
if (this.props.mainCont.current) {
- this.props.parent.scrollTo(y - this.props.mainCont.current.clientHeight);
+ this.props.parent.scrollTo(y);
}
}
@@ -213,7 +258,7 @@ export class Viewer extends React.Component<IViewerProps> {
}
@action
- makeAnnotationDocument = (sourceDoc: Doc | undefined, s: number, color: string): Doc => {
+ makeAnnotationDocument = (sourceDoc: Doc | undefined, s: number, color: string, createLink: boolean = true): Doc => {
let annoDocs: Doc[] = [];
let mainAnnoDoc = Docs.Create.InstanceFromProto(new Doc(), "", {});
@@ -242,7 +287,7 @@ export class Viewer extends React.Component<IViewerProps> {
mainAnnoDoc.y = Math.max(minY, 0);
mainAnnoDoc.annotations = new List<Doc>(annoDocs);
- if (sourceDoc) {
+ if (sourceDoc && createLink) {
DocUtils.MakeLink(sourceDoc, mainAnnoDoc, undefined, `Annotation from ${StrCast(this.props.parent.Document.title)}`, "", StrCast(this.props.parent.Document.title));
}
this._savedAnnotations.clear();
@@ -258,7 +303,6 @@ export class Viewer extends React.Component<IViewerProps> {
let targetAnnotations = DocListCast(this.props.parent.fieldExtensionDoc.annotations);
if (targetAnnotations) {
targetAnnotations.push(destDoc);
- this.props.parent.fieldExtensionDoc.annotations = new List<Doc>(targetAnnotations);
}
else {
this.props.parent.fieldExtensionDoc.annotations = new List<Doc>([destDoc]);
@@ -292,6 +336,7 @@ export class Viewer extends React.Component<IViewerProps> {
this._isPage[page] = "page";
this._visibleElements[page] = (
<Page
+ setSelectionText={this.setSelectionText}
size={this._pageSizes[page]}
pdf={this.props.pdf}
page={page}
@@ -611,7 +656,7 @@ export class Viewer extends React.Component<IViewerProps> {
<div className="viewer" style={this._searching ? { position: "absolute", top: 0 } : {}}>
{this._visibleElements}
</div>
- <div className="pdfViewer-text" ref={this._viewer} style={{ transform: "scale(1.5)", transformOrigin: "top left" }} />
+ <div className="pdfViewer-text" ref={this._viewer} onCopy={() => console.log("gello world")} style={{ transform: "scale(1.5)", transformOrigin: "top left" }} />
<div className="pdfViewer-annotationLayer"
style={{
height: this.props.parent.Document.nativeHeight, width: `100%`,
diff --git a/src/client/views/pdf/Page.tsx b/src/client/views/pdf/Page.tsx
index c9d442fe5..c5b2a1dda 100644
--- a/src/client/views/pdf/Page.tsx
+++ b/src/client/views/pdf/Page.tsx
@@ -1,22 +1,18 @@
+import { action, IReactionDisposer, observable } from "mobx";
import { observer } from "mobx-react";
-import React = require("react");
-import { observable, action, runInAction, IReactionDisposer, reaction } from "mobx";
import * as Pdfjs from "pdfjs-dist";
-import { Opt, Doc, FieldResult, Field, DocListCast, WidthSym, HeightSym, DocListCastAsync } from "../../../new_fields/Doc";
-import "./PDFViewer.scss";
import "pdfjs-dist/web/pdf_viewer.css";
-import { PDFBox } from "../nodes/PDFBox";
-import { DragManager } from "../../util/DragManager";
-import { Docs, DocUtils } from "../../documents/Documents";
+import { Doc, DocListCastAsync, Opt, WidthSym } from "../../../new_fields/Doc";
import { List } from "../../../new_fields/List";
-import { emptyFunction } from "../../../Utils";
-import { Cast, NumCast, StrCast, BoolCast } from "../../../new_fields/Types";
import { listSpec } from "../../../new_fields/Schema";
-import { menuBar } from "prosemirror-menu";
-import { AnnotationTypes, PDFViewer, scale } from "./PDFViewer";
+import { Cast, NumCast, StrCast } from "../../../new_fields/Types";
+import { Docs, DocUtils } from "../../documents/Documents";
+import { DragManager } from "../../util/DragManager";
+import { PDFBox } from "../nodes/PDFBox";
import PDFMenu from "./PDFMenu";
-import { UndoManager } from "../../util/UndoManager";
-import { copy } from "typescript-collections/dist/lib/arrays";
+import { scale } from "./PDFViewer";
+import "./PDFViewer.scss";
+import React = require("react");
interface IPageProps {
@@ -33,6 +29,7 @@ interface IPageProps {
createAnnotation: (div: HTMLDivElement, page: number) => void;
makeAnnotationDocuments: (doc: Doc | undefined, scale: number, color: string, linkTo: boolean) => Doc;
getScrollFromPage: (page: number) => number;
+ setSelectionText: (text: string) => void;
}
@observer
@@ -178,7 +175,7 @@ export default class Page extends React.Component<IPageProps> {
}
let pdfDoc = await Cast(annotationDoc.pdfDoc, Doc);
if (pdfDoc) {
- DocUtils.MakeLink(annotationDoc, targetDoc, undefined, `Annotation from ${StrCast(pdfDoc.title)}`, "", StrCast(pdfDoc.title));
+ DocUtils.MakeLink(annotationDoc, targetDoc, dragData.targetContext, `Annotation from ${StrCast(pdfDoc.title)}`, "", StrCast(pdfDoc.title));
}
}
}
@@ -357,7 +354,8 @@ export default class Page extends React.Component<IPageProps> {
else {
let sel = window.getSelection();
if (sel && sel.type === "Range") {
- this.createTextAnnotation(sel);
+ let selRange = sel.getRangeAt(0);
+ this.createTextAnnotation(sel, selRange);
PDFMenu.Instance.jumpTo(e.clientX, e.clientY);
}
}
@@ -375,8 +373,8 @@ export default class Page extends React.Component<IPageProps> {
}
@action
- createTextAnnotation = (sel: Selection) => {
- let clientRects = sel.getRangeAt(0).getClientRects();
+ createTextAnnotation = (sel: Selection, selRange: Range) => {
+ let clientRects = selRange.getClientRects();
if (this._textLayer.current) {
let boundingRect = this._textLayer.current.getBoundingClientRect();
for (let i = 0; i < clientRects.length; i++) {
@@ -393,6 +391,10 @@ export default class Page extends React.Component<IPageProps> {
}
}
}
+ let text = selRange.extractContents().textContent;
+ if (text) {
+ this.props.setSelectionText(text);
+ }
// clear selection
if (sel.empty) { // Chrome
sel.empty();