diff options
Diffstat (limited to 'src/client/views/pdf')
| -rw-r--r-- | src/client/views/pdf/PDFMenu.tsx | 36 | ||||
| -rw-r--r-- | src/client/views/pdf/PDFViewer.tsx | 8 |
2 files changed, 6 insertions, 38 deletions
diff --git a/src/client/views/pdf/PDFMenu.tsx b/src/client/views/pdf/PDFMenu.tsx index 38e10e99a..503696ae9 100644 --- a/src/client/views/pdf/PDFMenu.tsx +++ b/src/client/views/pdf/PDFMenu.tsx @@ -12,19 +12,17 @@ export default class PDFMenu extends AntimodeMenu { static Instance: PDFMenu; private _commentCont = React.createRef<HTMLButtonElement>(); - private _snippetButton: React.RefObject<HTMLButtonElement> = React.createRef(); @observable private _keyValue: string = ""; @observable private _valueValue: string = ""; @observable private _added: boolean = false; @observable public Highlighting: boolean = false; - @observable public Status: "pdf" | "annotation" | "snippet" | "" = ""; + @observable public Status: "pdf" | "annotation" | "" = ""; public StartDrag: (e: PointerEvent, ele: HTMLElement) => void = unimplementedFunction; public Highlight: (color: string) => Opt<Doc> = (color: string) => undefined; public Delete: () => void = unimplementedFunction; - public Snippet: (marquee: { left: number, top: number, width: number, height: number }) => void = unimplementedFunction; public AddTag: (key: string, value: string) => boolean = returnFalse; public PinToPres: () => void = unimplementedFunction; public Marquee: { left: number; top: number; width: number; height: number; } | undefined; @@ -80,34 +78,6 @@ export default class PDFMenu extends AntimodeMenu { this.Delete(); } - snippetStart = (e: React.PointerEvent) => { - document.removeEventListener("pointermove", this.snippetDrag); - document.addEventListener("pointermove", this.snippetDrag); - document.removeEventListener("pointerup", this.snippetEnd); - document.addEventListener("pointerup", this.snippetEnd); - - e.stopPropagation(); - e.preventDefault(); - } - - snippetDrag = (e: PointerEvent) => { - e.stopPropagation(); - e.preventDefault(); - if (!this._dragging) { - this._dragging = true; - - this.Marquee && this.Snippet(this.Marquee); - } - } - - snippetEnd = (e: PointerEvent) => { - this._dragging = false; - document.removeEventListener("pointermove", this.snippetDrag); - document.removeEventListener("pointerup", this.snippetEnd); - e.stopPropagation(); - e.preventDefault(); - } - @action keyChanged = (e: React.ChangeEvent<HTMLInputElement>) => { this._keyValue = e.currentTarget.value; @@ -128,14 +98,12 @@ export default class PDFMenu extends AntimodeMenu { } render() { - const buttons = this.Status === "pdf" || this.Status === "snippet" ? + const buttons = this.Status === "pdf" ? [ <button key="1" className="antimodeMenu-button" title="Click to Highlight" onClick={this.highlightClicked} style={this.Highlighting ? { backgroundColor: "#121212" } : {}}> <FontAwesomeIcon icon="highlighter" size="lg" style={{ transition: "transform 0.1s", transform: this.Highlighting ? "" : "rotate(-45deg)" }} /></button>, <button key="2" className="antimodeMenu-button" title="Drag to Annotate" ref={this._commentCont} onPointerDown={this.pointerDown}> <FontAwesomeIcon icon="comment-alt" size="lg" /></button>, - <button key="3" className="antimodeMenu-button" title="Drag to Snippetize Selection" style={{ display: this.Status === "snippet" ? "" : "none" }} onPointerDown={this.snippetStart} ref={this._snippetButton}> - <FontAwesomeIcon icon="cut" size="lg" /></button>, <button key="4" className="antimodeMenu-button" title="Pin Menu" onClick={this.togglePin} style={this.Pinned ? { backgroundColor: "#121212" } : {}}> <FontAwesomeIcon icon="thumbtack" size="lg" style={{ transition: "transform 0.1s", transform: this.Pinned ? "rotate(45deg)" : "" }} /> </button> ] : [ diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index c85350264..1a09991d2 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -30,6 +30,7 @@ import { DocumentDecorations } from "../DocumentDecorations"; import { InkingControl } from "../InkingControl"; import { InkTool } from "../../../new_fields/InkField"; import { TraceMobx } from "../../../new_fields/util"; +import { PdfField } from "../../../new_fields/URLField"; const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer"); const pdfjsLib = require("pdfjs-dist"); @@ -416,7 +417,6 @@ export class PDFViewer extends DocAnnotatableComponent<IViewerProps, PdfDocument // clear out old marquees and initialize menu for new selection PDFMenu.Instance.StartDrag = this.startDrag; PDFMenu.Instance.Highlight = this.highlight; - PDFMenu.Instance.Snippet = this.createSnippet; PDFMenu.Instance.Status = "pdf"; PDFMenu.Instance.fadeOut(true); this._savedAnnotations.values().forEach(v => v.forEach(a => a.remove())); @@ -514,7 +514,6 @@ export class PDFViewer extends DocAnnotatableComponent<IViewerProps, PdfDocument } if (!e.ctrlKey) { - PDFMenu.Instance.Status = "snippet"; PDFMenu.Instance.Marquee = { left: this._marqueeX, top: this._marqueeY, width: this._marqueeWidth, height: this._marqueeHeight }; } PDFMenu.Instance.jumpTo(e.clientX, e.clientY); @@ -598,12 +597,13 @@ export class PDFViewer extends DocAnnotatableComponent<IViewerProps, PdfDocument if (!this.props.Document[HeightSym]() || !this.props.Document.nativeHeight) { setTimeout((() => { this.Document.height = this.Document[WidthSym]() * this._coverPath.height / this._coverPath.width; - this.Document.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width; + this.Document.nativeHeight = (this.Document.nativeWidth || 0) * this._coverPath.height / this._coverPath.width; }).bind(this), 0); } const nativeWidth = (this.Document.nativeWidth || 0); const nativeHeight = (this.Document.nativeHeight || 0); - return <img key={this._coverPath.path} src={this._coverPath.path} onError={action(() => this._coverPath.path = "http://www.cs.brown.edu/~bcz/face.gif")} onLoad={action(() => this._showWaiting = false)} + const resolved = Utils.prepend(this._coverPath.path); + return <img key={resolved} src={resolved} onError={action(() => this._coverPath.path = "http://www.cs.brown.edu/~bcz/face.gif")} onLoad={action(() => this._showWaiting = false)} style={{ position: "absolute", display: "inline-block", top: 0, left: 0, width: `${nativeWidth}px`, height: `${nativeHeight}px` }} />; } |
