aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/client/views/MainView.tsx5
-rw-r--r--src/client/views/pdf/Page.tsx96
2 files changed, 74 insertions, 27 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 42d5929bf..0779e1471 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -1,5 +1,5 @@
import { IconName, library } from '@fortawesome/fontawesome-svg-core';
-import { faFilePdf, faFilm, faFont, faGlobeAsia, faImage, faMusic, faObjectGroup, faPenNib, faRedoAlt, faTable, faTree, faUndoAlt, faBell } from '@fortawesome/free-solid-svg-icons';
+import { faFilePdf, faFilm, faFont, faGlobeAsia, faImage, faMusic, faObjectGroup, faPenNib, faRedoAlt, faTable, faTree, faUndoAlt, faBell, faCommentAlt } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { action, computed, configure, observable, runInAction, trace } from 'mobx';
import { observer } from 'mobx-react';
@@ -32,6 +32,7 @@ import { listSpec } from '../../new_fields/Schema';
import { Id } from '../../new_fields/FieldSymbols';
import { HistoryUtil } from '../util/History';
import { CollectionBaseView } from './collections/CollectionBaseView';
+import PDFMenu from './pdf/PDFMenu';
@observer
@@ -88,6 +89,7 @@ export class MainView extends React.Component {
library.add(faFilm);
library.add(faMusic);
library.add(faTree);
+ library.add(faCommentAlt);
this.initEventListeners();
this.initAuthenticationRouters();
}
@@ -315,6 +317,7 @@ export class MainView extends React.Component {
{this.nodesMenu()}
{this.miscButtons}
<InkingControl />
+ <PDFMenu />
<MainOverlayTextBox />
</div>
);
diff --git a/src/client/views/pdf/Page.tsx b/src/client/views/pdf/Page.tsx
index 1c305caa3..2c237740c 100644
--- a/src/client/views/pdf/Page.tsx
+++ b/src/client/views/pdf/Page.tsx
@@ -14,6 +14,7 @@ import { Cast, NumCast, StrCast } from "../../../new_fields/Types";
import { listSpec } from "../../../new_fields/Schema";
import { menuBar } from "prosemirror-menu";
import { AnnotationTypes } from "./PDFViewer";
+import PDFMenu from "./PDFMenu";
interface IPageProps {
pdf: Opt<Pdfjs.PDFDocumentProxy>;
@@ -272,7 +273,7 @@ export default class Page extends React.Component<IPageProps> {
}
@action
- onSelectEnd = (): void => {
+ onSelectEnd = (e: PointerEvent): void => {
if (this._marqueeing) {
this._marqueeing = false;
if (this._marquee.current) {
@@ -303,36 +304,79 @@ export default class Page extends React.Component<IPageProps> {
}
this._marqueeHeight = this._marqueeWidth = 0;
+ PDFMenu.Instance.Left = e.clientX;
+ PDFMenu.Instance.Top = e.clientY;
}
else {
let sel = window.getSelection();
- // if selecting over a range of things
- if (sel && sel.type === "Range") {
- let clientRects = sel.getRangeAt(0).getClientRects();
- if (this._textLayer.current) {
- let boundingRect = this._textLayer.current.getBoundingClientRect();
- for (let i = 0; i < clientRects.length; i++) {
- let rect = clientRects.item(i);
- if (rect) {
- let annoBox = document.createElement("div");
- annoBox.className = "pdfViewer-annotationBox";
- // transforms the positions from screen onto the pdf div
- annoBox.style.top = ((rect.top - boundingRect.top) * (this._textLayer.current.offsetHeight / boundingRect.height)).toString();
- annoBox.style.left = ((rect.left - boundingRect.left) * (this._textLayer.current.offsetWidth / boundingRect.width)).toString();
- annoBox.style.width = (rect.width * this._textLayer.current.offsetWidth / boundingRect.width).toString();
- annoBox.style.height = (rect.height * this._textLayer.current.offsetHeight / boundingRect.height).toString();
- this.props.createAnnotation(annoBox, this.props.page);
- }
- }
- }
- // clear selection
- if (sel.empty) { // Chrome
- sel.empty();
- } else if (sel.removeAllRanges) { // Firefox
- sel.removeAllRanges();
- }
+ if (sel && sel.type === "range") {
+
+ PDFMenu.Instance.Left = e.clientX;
+ PDFMenu.Instance.Top = e.clientY;
}
}
+ // let x = (e.clientX - boundingRect.left) * (current.offsetWidth / boundingRect.width);
+ // let y = (e.clientY - boundingRect.top) * (current.offsetHeight / boundingRect.height);
+ // if (this._marqueeing) {
+ // this._marqueeing = false;
+ // if (this._marquee.current) {
+ // let copy = document.createElement("div");
+ // // make a copy of the marquee
+ // copy.style.left = this._marquee.current.style.left;
+ // copy.style.top = this._marquee.current.style.top;
+ // copy.style.width = this._marquee.current.style.width;
+ // copy.style.height = this._marquee.current.style.height;
+
+ // // apply the appropriate background, opacity, and transform
+ // let { background, opacity, transform } = this.getCurlyTransform();
+ // copy.style.background = background;
+ // // if curly bracing, add a curly brace
+ // if (opacity === "1" && this._curly.current) {
+ // copy.style.opacity = opacity;
+ // let img = this._curly.current.cloneNode();
+ // (img as any).style.opacity = opacity;
+ // (img as any).style.transform = transform;
+ // copy.appendChild(img);
+ // }
+ // else {
+ // copy.style.opacity = this._marquee.current.style.opacity;
+ // }
+ // copy.className = this._marquee.current.className;
+ // this.props.createAnnotation(copy, this.props.page);
+ // this._marquee.current.style.opacity = "0";
+ // }
+
+ // this._marqueeHeight = this._marqueeWidth = 0;
+ // }
+ // else {
+ // let sel = window.getSelection();
+ // // if selecting over a range of things
+ // if (sel && sel.type === "Range") {
+ // let clientRects = sel.getRangeAt(0).getClientRects();
+ // if (this._textLayer.current) {
+ // let boundingRect = this._textLayer.current.getBoundingClientRect();
+ // for (let i = 0; i < clientRects.length; i++) {
+ // let rect = clientRects.item(i);
+ // if (rect) {
+ // let annoBox = document.createElement("div");
+ // annoBox.className = "pdfViewer-annotationBox";
+ // // transforms the positions from screen onto the pdf div
+ // annoBox.style.top = ((rect.top - boundingRect.top) * (this._textLayer.current.offsetHeight / boundingRect.height)).toString();
+ // annoBox.style.left = ((rect.left - boundingRect.left) * (this._textLayer.current.offsetWidth / boundingRect.width)).toString();
+ // annoBox.style.width = (rect.width * this._textLayer.current.offsetWidth / boundingRect.width).toString();
+ // annoBox.style.height = (rect.height * this._textLayer.current.offsetHeight / boundingRect.height).toString();
+ // this.props.createAnnotation(annoBox, this.props.page);
+ // }
+ // }
+ // }
+ // // clear selection
+ // if (sel.empty) { // Chrome
+ // sel.empty();
+ // } else if (sel.removeAllRanges) { // Firefox
+ // sel.removeAllRanges();
+ // }
+ // }
+ // }
document.removeEventListener("pointermove", this.onSelectStart);
document.removeEventListener("pointerup", this.onSelectEnd);
}