From 4c4c7d151979d3e7346c8ac32af5173eb1e761b3 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Thu, 26 Sep 2019 23:16:17 -0400 Subject: fixed dragging PDFs (or other canvases) to render properly --- src/client/util/DragManager.ts | 40 ++++++++++++++++++++-------------------- 1 file changed, 20 insertions(+), 20 deletions(-) (limited to 'src') diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts index 56496c99b..00fc752ca 100644 --- a/src/client/util/DragManager.ts +++ b/src/client/util/DragManager.ts @@ -349,8 +349,8 @@ export namespace DragManager { let xs: number[] = []; let ys: number[] = []; - const docs: Doc[] = - dragData instanceof DocumentDragData ? dragData.draggedDocuments : dragData instanceof AnnotationDragData ? [dragData.dragDocument] : []; + const docs = dragData instanceof DocumentDragData ? dragData.draggedDocuments : + dragData instanceof AnnotationDragData ? [dragData.dragDocument] : []; let dragElements = eles.map(ele => { const w = ele.offsetWidth, h = ele.offsetHeight; @@ -379,22 +379,20 @@ export namespace DragManager { dragElement.style.width = `${rect.width / scaleX}px`; dragElement.style.height = `${rect.height / scaleY}px`; - // bcz: if PDFs are rendered with svg's, then this code isn't needed - // bcz: PDFs don't show up if you clone them when rendered using a canvas. - // however, PDF's have a thumbnail field that contains an image of their canvas. - // So we replace the pdf's canvas with the image thumbnail - // if (docs.length) { - // var pdfBox = dragElement.getElementsByClassName("pdfBox-cont")[0] as HTMLElement; - // let thumbnail = docs[0].GetT(KeyStore.Thumbnail, ImageField); - // if (pdfBox && pdfBox.childElementCount && thumbnail) { - // let img = new Image(); - // img.src = thumbnail.toString(); - // img.style.position = "absolute"; - // img.style.width = `${rect.width / scaleX}px`; - // img.style.height = `${rect.height / scaleY}px`; - // pdfBox.replaceChild(img, pdfBox.children[0]) - // } - // } + if (docs.length) { + var pdfBox = dragElement.getElementsByTagName("canvas"); + var pdfBoxSrc = ele.getElementsByTagName("canvas"); + Array.from(pdfBox).map((pb, i) => pb.getContext('2d')!.drawImage(pdfBoxSrc[i], 0, 0)); + var pdfView = dragElement.getElementsByClassName("pdfViewer-viewer"); + var pdfViewSrc = ele.getElementsByClassName("pdfViewer-viewer"); + let tops = Array.from(pdfViewSrc).map(p => p.scrollTop); + let oldopacity = dragElement.style.opacity; + dragElement.style.opacity = "0"; + setTimeout(() => { + dragElement.style.opacity = oldopacity; + Array.from(pdfView).map((v, i) => v.scrollTo({ top: tops[i] })); + }, 0); + } let set = dragElement.getElementsByTagName('*'); if (dragElement.hasAttribute("style")) (dragElement as any).style.pointerEvents = "none"; // tslint:disable-next-line: prefer-for-of @@ -418,8 +416,10 @@ export namespace DragManager { hideSource = options.hideSource(); } } - eles.map(ele => (ele.hidden = hideSource) && - (ele.parentElement && ele.parentElement.className.indexOf("collectionFreeFormDocumentView") !== -1 && (ele.parentElement.hidden = hideSource))); + setTimeout(() => + eles.map(ele => (ele.hidden = hideSource) && + (ele.parentElement && ele.parentElement.className.indexOf("collectionFreeFormDocumentView") !== -1 && (ele.parentElement.hidden = hideSource))), + 0); let lastX = downX; let lastY = downY; -- cgit v1.2.3-70-g09d2 From b4a6d48963e18440e4c7b5f61d1f7204edebe175 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Fri, 27 Sep 2019 00:06:19 -0400 Subject: fixed loading of pdfs to show indicator --- src/client/views/nodes/PDFBox.scss | 2 +- src/client/views/pdf/PDFViewer.tsx | 16 ++++++++++++++-- 2 files changed, 15 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss index 69c4397aa..2917c81cb 100644 --- a/src/client/views/nodes/PDFBox.scss +++ b/src/client/views/nodes/PDFBox.scss @@ -1,6 +1,6 @@ .pdfBox-cont, .pdfBox-cont-interactive { - display: flex; + display: inline-block; flex-direction: row; height: 100%; width:100%; diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 7ffe19ff5..058e94f77 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -68,6 +68,7 @@ export class PDFViewer extends React.Component { @observable private _marqueeWidth: number = 0; @observable private _marqueeHeight: number = 0; @observable private _marqueeing: boolean = false; + @observable private _showWaiting = true; public pdfViewer: any; private _isChildActive = false; @@ -167,11 +168,10 @@ export class PDFViewer extends React.Component { } } - @action setupPdfJsViewer = () => { document.addEventListener("pagesinit", () => this.pdfViewer.currentScaleValue = 1); - // document.addEventListener("pagerendered", () => console.log("rendered")); // bcz: works, but not needed except to debug + document.addEventListener("pagerendered", action(() => this._showWaiting = false)); var pdfLinkService = new PDFJSViewer.PDFLinkService(); let pdfFindController = new PDFJSViewer.PDFFindController({ linkService: pdfLinkService, @@ -622,6 +622,18 @@ export class PDFViewer extends React.Component { ContainingCollectionDoc={this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document} chromeCollapsed={true}> + {this._showWaiting ? : (null)} ); } } -- cgit v1.2.3-70-g09d2 From 547ab3ab12a3818f4a41e3ed5abd9dea45839392 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Fri, 27 Sep 2019 09:35:35 -0400 Subject: lint fixes and start of pdf cover page view --- .../CollectionFreeFormLayoutEngines.tsx | 2 +- .../collectionFreeForm/CollectionFreeFormView.tsx | 5 ++--- src/client/views/nodes/PDFBox.tsx | 6 +++--- src/client/views/pdf/PDFViewer.tsx | 22 ++++++++++++++++++++-- 4 files changed, 26 insertions(+), 9 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx index 6135f3e45..886692172 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx @@ -97,8 +97,8 @@ export function AddCustomFreeFormLayout(doc: Doc, dataKey: string): () => void { let addOverlay = (key: "arrangeScript" | "arrangeInit", options: OverlayElementOptions, params?: Record, requiredType?: string) => { let overlayDisposer: () => void = emptyFunction; // filled in below after we have a reference to the scriptingBox const scriptField = Cast(doc[key], ScriptField); - // tslint:disable-next-line: no-unnecessary-callback-wrapper let scriptingBox = overlayDisposer()} // don't get rid of the function wrapper-- we don't want to use the current value of overlayDiposer, but the one set below onSave={(text, onError) => { const script = CompileScript(text, { params, requiredType, typecheck: false }); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index b90303f8c..37851d924 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -74,10 +74,9 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { private easing = () => this.props.Document.panTransformType === "Ease"; private panX = () => this.fitToContent ? (this.contentBounds.x + this.contentBounds.r) / 2 : this.Document.panX || 0; private panY = () => this.fitToContent ? (this.contentBounds.y + this.contentBounds.b) / 2 : this.Document.panY || 0; - private zoomScaling = () => (this.fitToContent ? + private zoomScaling = () => (1 / this.parentScaling) * (this.fitToContent ? Math.min(this.props.PanelHeight() / (this.contentBounds.b - this.contentBounds.y), this.props.PanelWidth() / (this.contentBounds.r - this.contentBounds.x)) : - this.Document.scale || 1) - / this.parentScaling; + this.Document.scale || 1); private centeringShiftX = () => !this.nativeWidth && !this.isAnnotationOverlay ? this.props.PanelWidth() / 2 / this.parentScaling : 0; // shift so pan position is at center of window for non-overlay collections private centeringShiftY = () => !this.nativeHeight && !this.isAnnotationOverlay ? this.props.PanelHeight() / 2 / this.parentScaling : 0;// shift so pan position is at center of window for non-overlay collections private getTransform = (): Transform => this.props.ScreenToLocalTransform().translate(-this.borderWidth + 1, -this.borderWidth + 1).translate(-this.centeringShiftX(), -this.centeringShiftY()).transform(this.getLocalTransform()); diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 5ac463b32..eb4803cec 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -65,7 +65,7 @@ export class PDFBox extends DocComponent(PdfDocumen public prevAnnotation() { this._pdfViewer && this._pdfViewer.prevAnnotation(); } public nextAnnotation() { this._pdfViewer && this._pdfViewer.nextAnnotation(); } public backPage() { this._pdfViewer!.gotoPage(NumCast(this.props.Document.curPage) - 1); } - public gotoPage = (p: number) => { this._pdfViewer!.gotoPage(p); } + public gotoPage = (p: number) => { this._pdfViewer!.gotoPage(p); }; public forwardPage() { this._pdfViewer!.gotoPage(NumCast(this.props.Document.curPage) + 1); } @undoBatch @@ -89,7 +89,7 @@ export class PDFBox extends DocComponent(PdfDocumen whenActiveChanged = (isActive: boolean) => this.props.whenActiveChanged(this._isChildActive = isActive); active = () => this.props.isSelected() || this._isChildActive || this.props.renderDepth === 0; - setPdfViewer = (pdfViewer: PDFViewer) => { this._pdfViewer = pdfViewer; } + setPdfViewer = (pdfViewer: PDFViewer) => { this._pdfViewer = pdfViewer; }; searchStringChanged = (e: React.ChangeEvent) => this._searchString = e.currentTarget.value; settingsPanel() { @@ -106,7 +106,7 @@ export class PDFBox extends DocComponent(PdfDocumen style={{ left: 80, top: 5, height: "30px", position: "absolute", pointerEvents: "all" }}> - + ; return !this.props.active() ? (null) : (
e.keyCode === KeyCodes.BACKSPACE || e.keyCode === KeyCodes.DELETE ? e.stopPropagation() : true} onPointerDown={e => e.stopPropagation()} style={{ display: this.active() ? "flex" : "none", position: "absolute", width: "100%", height: "100%", zIndex: 1, pointerEvents: "none" }}> diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 058e94f77..d651d0025 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -1,4 +1,4 @@ -import { action, computed, IReactionDisposer, observable, reaction, trace } from "mobx"; +import { action, computed, IReactionDisposer, observable, reaction, trace, runInAction } from "mobx"; import { observer } from "mobx-react"; import * as Pdfjs from "pdfjs-dist"; import "pdfjs-dist/web/pdf_viewer.css"; @@ -9,7 +9,7 @@ import { List } from "../../../new_fields/List"; import { listSpec } from "../../../new_fields/Schema"; import { ScriptField } from "../../../new_fields/ScriptField"; import { Cast, NumCast, StrCast } from "../../../new_fields/Types"; -import { emptyFunction, returnOne } from "../../../Utils"; +import { emptyFunction, returnOne, Utils } from "../../../Utils"; import { DocServer } from "../../DocServer"; import { Docs, DocUtils } from "../../documents/Documents"; import { DragManager } from "../../util/DragManager"; @@ -20,9 +20,11 @@ import Annotation from "./Annotation"; import PDFMenu from "./PDFMenu"; import "./PDFViewer.scss"; import React = require("react"); +import * as rp from "request-promise"; import { CollectionPDFView } from "../collections/CollectionPDFView"; import { CollectionVideoView } from "../collections/CollectionVideoView"; import { CollectionView } from "../collections/CollectionView"; +import { JSXElement } from "babel-types"; const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer"); const pdfjsLib = require("pdfjs-dist"); @@ -96,6 +98,7 @@ export class PDFViewer extends React.Component { } componentDidMount = async () => { + let res = JSON.parse(await rp.get(Utils.prepend(`/thumbnail${this.props.url.substring("files/".length, this.props.url.length - ".pdf".length)}-${2}.PNG`))); this.props.setPdfViewer(this); await this.initialLoad(); @@ -124,6 +127,8 @@ export class PDFViewer extends React.Component { document.removeEventListener("copy", this.copy); document.addEventListener("copy", this.copy); this.setupPdfJsViewer(); + setTimeout(() => this.getCoverImage(res)); + } componentWillUnmount = () => { @@ -587,8 +592,20 @@ export class PDFViewer extends React.Component { active = () => { return this.props.isSelected() || this._isChildActive || this.props.renderDepth === 0; } + + @observable _coverPage: JSX.Element | null = (null); + // change the address to be the file address of the PNG version of each page + // file address of the pdf + @action + getCoverImage = (res: any, page: number = 2) => { + this._coverPage =
; + // ; + } + render() { trace(); + return (
e.stopPropagation()} onClick={this.onClick} ref={this._mainCont}>
{!this._marqueeing ? (null) :
{ ContainingCollectionDoc={this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document} chromeCollapsed={true}> + {this._coverPage ? this._coverPage : (null)} {this._showWaiting ? Date: Fri, 27 Sep 2019 11:37:39 -0400 Subject: pdf loading now works the way it should. --- src/client/views/nodes/DocumentView.tsx | 2 +- src/client/views/pdf/PDFViewer.tsx | 128 +++++++++++++++++--------------- 2 files changed, 71 insertions(+), 59 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 0d11afbe1..366c3142a 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -601,7 +601,7 @@ export class DocumentView extends DocComponent(Docu ruleColor && !colorSet ? ruleColor : StrCast(this.layoutDoc.backgroundColor) || this.props.backgroundColor(this.Document); const nativeWidth = this.nativeWidth > 0 && !this.Document.ignoreAspect ? `${this.nativeWidth}px` : "100%"; - const nativeHeight = this.Document.ignoreAspect ? this.props.PanelHeight() / this.props.ContentScaling() : this.nativeHeight > 0 ? `${this.nativeHeight}px` : "100%"; + const nativeHeight = this.Document.ignoreAspect ? this.props.PanelHeight() / this.props.ContentScaling() : this.nativeHeight > 0 ? `${this.nativeHeight}px` : nativeWidth !== "100%" ? nativeWidth : "100%"; const showOverlays = this.props.showOverlays ? this.props.showOverlays(this.Document) : undefined; const showTitle = showOverlays && "title" in showOverlays ? showOverlays.title : this.getLayoutPropStr("showTitle"); const showCaption = showOverlays && "caption" in showOverlays ? showOverlays.caption : this.getLayoutPropStr("showCaption"); diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index d651d0025..c734f0ede 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; import * as Pdfjs from "pdfjs-dist"; import "pdfjs-dist/web/pdf_viewer.css"; import { Dictionary } from "typescript-collections"; -import { Doc, DocListCast, FieldResult, WidthSym, Opt } from "../../../new_fields/Doc"; +import { Doc, DocListCast, FieldResult, WidthSym, Opt, HeightSym } from "../../../new_fields/Doc"; import { Id } from "../../../new_fields/FieldSymbols"; import { List } from "../../../new_fields/List"; import { listSpec } from "../../../new_fields/Schema"; @@ -24,7 +24,7 @@ import * as rp from "request-promise"; import { CollectionPDFView } from "../collections/CollectionPDFView"; import { CollectionVideoView } from "../collections/CollectionVideoView"; import { CollectionView } from "../collections/CollectionView"; -import { JSXElement } from "babel-types"; +import { SelectionManager } from "../../util/SelectionManager"; const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer"); const pdfjsLib = require("pdfjs-dist"); @@ -71,22 +71,25 @@ export class PDFViewer extends React.Component { @observable private _marqueeHeight: number = 0; @observable private _marqueeing: boolean = false; @observable private _showWaiting = true; + @observable private _showCover = false; public pdfViewer: any; private _isChildActive = false; private _setPreviewCursor: undefined | ((x: number, y: number, drag: boolean) => void); private _annotationLayer: React.RefObject = React.createRef(); private _reactionDisposer?: IReactionDisposer; + private _selectionReactionDisposer?: IReactionDisposer; private _annotationReactionDisposer?: IReactionDisposer; private _filterReactionDisposer?: IReactionDisposer; private _viewer: React.RefObject = React.createRef(); private _mainCont: React.RefObject = React.createRef(); - private _selectionText: string = ""; private _marquee: React.RefObject = React.createRef(); + private _selectionText: string = ""; private _startX: number = 0; private _startY: number = 0; private _downX: number = 0; private _downY: number = 0; + private _coverPath: any; @computed get allAnnotations() { return DocListCast(this.props.fieldExtensionDoc.annotations).filter( @@ -98,43 +101,22 @@ export class PDFViewer extends React.Component { } componentDidMount = async () => { - let res = JSON.parse(await rp.get(Utils.prepend(`/thumbnail${this.props.url.substring("files/".length, this.props.url.length - ".pdf".length)}-${2}.PNG`))); - this.props.setPdfViewer(this); - await this.initialLoad(); - - this._annotationReactionDisposer = reaction( - () => this.props.fieldExtensionDoc && DocListCast(this.props.fieldExtensionDoc.annotations), - annotations => annotations && annotations.length && this.renderAnnotations(annotations, true), - { fireImmediately: true }); - - this._filterReactionDisposer = reaction( - () => ({ scriptField: Cast(this.props.Document.filterScript, ScriptField), annos: this._annotations.slice() }), - action(({ scriptField, annos }: { scriptField: FieldResult, annos: Doc[] }) => { - let oldScript = this._script.originalScript; - this._script = scriptField && scriptField.script.compiled ? scriptField.script : CompileScript("return true") as CompiledScript; - if (this._script.originalScript !== oldScript) { - this.Index = -1; - } - annos.forEach(d => d.opacity = this._script.run({ this: d }, console.log, 1).result ? 1 : 0); - }), - { fireImmediately: true } - ); - this._reactionDisposer = reaction( - () => this.props.Document.panY, - () => this._mainCont.current && this._mainCont.current.scrollTo({ top: NumCast(this.props.Document.panY) || 0, behavior: "auto" }) - ); - - document.removeEventListener("copy", this.copy); - document.addEventListener("copy", this.copy); - this.setupPdfJsViewer(); - setTimeout(() => this.getCoverImage(res)); - + // change the address to be the file address of the PNG version of each page + // file address of the pdf + this._coverPath = JSON.parse(await rp.get(Utils.prepend(`/thumbnail${this.props.url.substring("files/".length, this.props.url.length - ".pdf".length)}-${NumCast(this.props.Document.curPage, 1)}.PNG`))); + runInAction(() => this._showWaiting = this._showCover = true); + this._selectionReactionDisposer = reaction(() => this.props.isSelected(), () => { + this.setupPdfJsViewer(); + this._selectionReactionDisposer && this._selectionReactionDisposer(); + this._selectionReactionDisposer = undefined; + }) } componentWillUnmount = () => { this._reactionDisposer && this._reactionDisposer(); this._annotationReactionDisposer && this._annotationReactionDisposer(); this._filterReactionDisposer && this._filterReactionDisposer(); + this._selectionReactionDisposer && this._selectionReactionDisposer(); document.removeEventListener("copy", this.copy); } @@ -174,9 +156,40 @@ export class PDFViewer extends React.Component { } @action - setupPdfJsViewer = () => { - document.addEventListener("pagesinit", () => this.pdfViewer.currentScaleValue = 1); - document.addEventListener("pagerendered", action(() => this._showWaiting = false)); + setupPdfJsViewer = async () => { + this._showWaiting = true; + this.props.setPdfViewer(this); + await this.initialLoad(); + + this._annotationReactionDisposer = reaction( + () => this.props.fieldExtensionDoc && DocListCast(this.props.fieldExtensionDoc.annotations), + annotations => annotations && annotations.length && this.renderAnnotations(annotations, true), + { fireImmediately: true }); + + this._filterReactionDisposer = reaction( + () => ({ scriptField: Cast(this.props.Document.filterScript, ScriptField), annos: this._annotations.slice() }), + action(({ scriptField, annos }: { scriptField: FieldResult, annos: Doc[] }) => { + let oldScript = this._script.originalScript; + this._script = scriptField && scriptField.script.compiled ? scriptField.script : CompileScript("return true") as CompiledScript; + if (this._script.originalScript !== oldScript) { + this.Index = -1; + } + annos.forEach(d => d.opacity = this._script.run({ this: d }, console.log, 1).result ? 1 : 0); + }), + { fireImmediately: true } + ); + this._reactionDisposer = reaction( + () => this.props.Document.panY, + () => this._mainCont.current && this._mainCont.current.scrollTo({ top: NumCast(this.props.Document.panY) || 0, behavior: "auto" }) + ); + + document.removeEventListener("copy", this.copy); + document.addEventListener("copy", this.copy); + document.addEventListener("pagesinit", () => { + this.pdfViewer.currentScaleValue = 1; + this.gotoPage(NumCast(this.props.Document.curPage, 1)); + }); + document.addEventListener("pagerendered", action(() => this._showCover = this._showWaiting = false)); var pdfLinkService = new PDFJSViewer.PDFLinkService(); let pdfFindController = new PDFJSViewer.PDFFindController({ linkService: pdfLinkService, @@ -271,7 +284,7 @@ export class PDFViewer extends React.Component { @action gotoPage = (p: number) => { - this.pdfViewer.scrollPageIntoView({ pageNumber: Math.min(Math.max(1, p), this._pageSizes.length) }); + this.pdfViewer && this.pdfViewer.scrollPageIntoView({ pageNumber: Math.min(Math.max(1, p), this._pageSizes.length) }); } @action @@ -300,7 +313,7 @@ export class PDFViewer extends React.Component { @action onScroll = (e: React.UIEvent) => { - this.props.Document.curPage = this.pdfViewer.currentPageNumber; + this.pdfViewer && (this.props.Document.curPage = this.pdfViewer.currentPageNumber); } // get the page index that the vertical offset passed in is on @@ -587,20 +600,21 @@ export class PDFViewer extends React.Component { } whenActiveChanged = (isActive: boolean) => { this._isChildActive = isActive; - this.props.whenActiveChanged(isActive); // bcz: is this needed here? + this.props.whenActiveChanged(isActive); } active = () => { return this.props.isSelected() || this._isChildActive || this.props.renderDepth === 0; } - @observable _coverPage: JSX.Element | null = (null); - // change the address to be the file address of the PNG version of each page - // file address of the pdf - @action - getCoverImage = (res: any, page: number = 2) => { - this._coverPage =
; - // ; + getCoverImage = () => { + let nativeWidth = NumCast(this.props.Document.nativeWidth); + if (!this.props.Document[HeightSym]()) { + this.props.Document.height = this.props.Document[WidthSym]() * this._coverPath.height / this._coverPath.width; + this.props.Document.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width + } + let nativeHeight = NumCast(this.props.Document.nativeHeight); + return this._showWaiting = false)} + style={{ position: "absolute", display: "inline-block", top: 0, left: 0, width: `${nativeWidth}px`, height: `${nativeHeight}px` }} />; } render() { @@ -621,8 +635,8 @@ export class PDFViewer extends React.Component {
this._pageSizes.length && this._pageSizes[0] ? this.props.pdf.numPages * this._pageSizes[0].height : 300} - PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : 300} + PanelHeight={() => this._pageSizes.length && this._pageSizes[0] ? this.props.pdf.numPages * this._pageSizes[0].height : NumCast(this.props.Document.nativeHeight)} + PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : NumCast(this.props.Document.nativeWidth)} focus={emptyFunction} isSelected={this.props.isSelected} select={emptyFunction} @@ -639,19 +653,17 @@ export class PDFViewer extends React.Component { ContainingCollectionDoc={this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document} chromeCollapsed={true}> - {this._coverPage ? this._coverPage : (null)} - {this._showWaiting ? : (null)} + }} /> : (null)}
); } } -- cgit v1.2.3-70-g09d2 From ffe8282942e4c29f9b28b6423ca934fd17986270 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 12:12:06 -0400 Subject: fixed freeformview bug. --- .../collections/collectionFreeForm/CollectionFreeFormView.tsx | 3 ++- src/client/views/pdf/PDFMenu.tsx | 7 +++---- src/client/views/pdf/PDFViewer.tsx | 3 ++- 3 files changed, 7 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 37851d924..0822e62da 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -698,7 +698,8 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { // otherwise, they are stored in fieldKey. All annotations to this document are stored in the extension document Doc.UpdateDocumentExtensionForField(this.props.DataDoc || this.props.Document, this.props.fieldKey); return ( -
,
- - + +
, , diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index c734f0ede..c28469fcc 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -152,6 +152,7 @@ export class PDFViewer extends React.Component { i === this.props.pdf.numPages - 1 && this.props.loaded((page.view[page.rotate === 0 || page.rotate === 180 ? 2 : 3] - page.view[page.rotate === 0 || page.rotate === 180 ? 0 : 1]), (page.view[page.rotate === 0 || page.rotate === 180 ? 3 : 2] - page.view[page.rotate === 0 || page.rotate === 180 ? 1 : 0]), i); })))); + Doc.GetProto(this.props.Document).scrollHeight = this._pageSizes.reduce((size, page) => size + page.height, 0); } } @@ -635,7 +636,7 @@ export class PDFViewer extends React.Component {
this._pageSizes.length && this._pageSizes[0] ? this.props.pdf.numPages * this._pageSizes[0].height : NumCast(this.props.Document.nativeHeight)} + PanelHeight={() => NumCast(this.props.Document.scrollHeight, NumCast(this.props.Document.nativeHeight))} PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : NumCast(this.props.Document.nativeWidth)} focus={emptyFunction} isSelected={this.props.isSelected} -- cgit v1.2.3-70-g09d2 From d9f5a6f88d75fe4037a7dacf62188649a5dd7a55 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 12:31:45 -0400 Subject: removed unneeded setTimeout in dragging --- src/client/util/DragManager.ts | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts index 00fc752ca..43c352a90 100644 --- a/src/client/util/DragManager.ts +++ b/src/client/util/DragManager.ts @@ -416,10 +416,9 @@ export namespace DragManager { hideSource = options.hideSource(); } } - setTimeout(() => - eles.map(ele => (ele.hidden = hideSource) && - (ele.parentElement && ele.parentElement.className.indexOf("collectionFreeFormDocumentView") !== -1 && (ele.parentElement.hidden = hideSource))), - 0); + + // we're dragging a documentView, but it may be a child of a CollectionFreeFormDocumentView. If it is, we want to hide that as well -- this should be generalized somehow in case other draggable things might contain a DocumentView. + eles.map(ele => (ele.hidden = hideSource)); let lastX = downX; let lastY = downY; -- cgit v1.2.3-70-g09d2 From f18bff6a3c848e1afcec98bf4fa05b8edfaa9c57 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 13:43:04 -0400 Subject: added initial zooming for PDFS --- needs more work. --- src/client/util/DragManager.ts | 14 ++--- src/client/views/DocumentDecorations.tsx | 2 +- src/client/views/nodes/PDFBox.tsx | 2 +- src/client/views/pdf/PDFViewer.scss | 20 +++++-- src/client/views/pdf/PDFViewer.tsx | 89 +++++++++++++++++++------------- 5 files changed, 76 insertions(+), 51 deletions(-) (limited to 'src') diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts index 43c352a90..ddc8fb62c 100644 --- a/src/client/util/DragManager.ts +++ b/src/client/util/DragManager.ts @@ -417,8 +417,7 @@ export namespace DragManager { } } - // we're dragging a documentView, but it may be a child of a CollectionFreeFormDocumentView. If it is, we want to hide that as well -- this should be generalized somehow in case other draggable things might contain a DocumentView. - eles.map(ele => (ele.hidden = hideSource)); + eles.map(ele => ele.hidden = hideSource); let lastX = downX; let lastY = downY; @@ -446,12 +445,9 @@ export namespace DragManager { ); }; - let hideDragElements = () => { + let hideDragShowOriginalElements = () => { dragElements.map(dragElement => dragElement.parentNode === dragDiv && dragDiv.removeChild(dragElement)); - eles.map(ele => { - ele.hidden = false; - (ele.parentElement && ele.parentElement.className.indexOf("collectionFreeFormDocumentView") !== -1 && (ele.parentElement.hidden = false)); - }); + eles.map(ele => ele.hidden = false); }; let endDrag = () => { document.removeEventListener("pointermove", moveHandler, true); @@ -462,12 +458,12 @@ export namespace DragManager { }; AbortDrag = () => { - hideDragElements(); + hideDragShowOriginalElements(); SelectionManager.SetIsDragging(false); endDrag(); }; const upHandler = (e: PointerEvent) => { - hideDragElements(); + hideDragShowOriginalElements(); dispatchDrag(eles, e, dragData, options, finishDrag); SelectionManager.SetIsDragging(false); endDrag(); diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 7ec316bf9..cacaddcc8 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -617,7 +617,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
(PdfDocumen let classname = "pdfBox-cont" + (InkingControl.Instance.selectedTool || !this.active ? "" : "-interactive"); return (!(pdfUrl instanceof PdfField) || !this._pdf ?
{`pdf, ${this.dataDoc[this.props.fieldKey]}, not found`}
: -
e.stopPropagation()} onPointerDown={(e: React.PointerEvent) => { +
{ let hit = document.elementFromPoint(e.clientX, e.clientY); if (hit && hit.localName === "span" && this.props.isSelected()) { e.button === 0 && e.stopPropagation(); diff --git a/src/client/views/pdf/PDFViewer.scss b/src/client/views/pdf/PDFViewer.scss index 0b74a8ad4..c5a397691 100644 --- a/src/client/views/pdf/PDFViewer.scss +++ b/src/client/views/pdf/PDFViewer.scss @@ -1,9 +1,10 @@ -.pdfViewer-viewer { + +.pdfViewer-viewer, .pdfViewer-viewer-zoomed { pointer-events: inherit; width: 100%; height: 100%; position: absolute; - overflow-y: scroll; + overflow-y: auto; overflow-x: hidden; // .canvasWrapper { @@ -28,6 +29,15 @@ opacity: 0.1; } + .pdfViewer-overlay { + transform: scale(2.14359); + transform-origin: left top; + position: absolute; + top: 0px; + left: 0px; + display: inline-block; + width:100%; + } .pdfViewer-annotationLayer { position: absolute; top: 0; @@ -40,4 +50,8 @@ opacity: 0.1; } } -} \ No newline at end of file +} +.pdfViewer-viewer-zoomed { + overflow-x: scroll; +} + \ No newline at end of file diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index c28469fcc..016445538 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -72,6 +72,7 @@ export class PDFViewer extends React.Component { @observable private _marqueeing: boolean = false; @observable private _showWaiting = true; @observable private _showCover = false; + @observable private _zoomed = 1; public pdfViewer: any; private _isChildActive = false; @@ -186,10 +187,10 @@ export class PDFViewer extends React.Component { document.removeEventListener("copy", this.copy); document.addEventListener("copy", this.copy); - document.addEventListener("pagesinit", () => { - this.pdfViewer.currentScaleValue = 1; + document.addEventListener("pagesinit", action(() => { + this.pdfViewer.currentScaleValue = this._zoomed = 1; this.gotoPage(NumCast(this.props.Document.curPage, 1)); - }); + })); document.addEventListener("pagerendered", action(() => this._showCover = this._showWaiting = false)); var pdfLinkService = new PDFJSViewer.PDFLinkService(); let pdfFindController = new PDFJSViewer.PDFFindController({ @@ -618,10 +619,20 @@ export class PDFViewer extends React.Component { style={{ position: "absolute", display: "inline-block", top: 0, left: 0, width: `${nativeWidth}px`, height: `${nativeHeight}px` }} />; } + + @action + onZoomWheel = (e: React.WheelEvent) => { + e.stopPropagation(); + if (e.ctrlKey) { + let curScale = Number(this.pdfViewer.currentScaleValue); + this.pdfViewer.currentScaleValue = Math.max(1, Math.min(10, curScale + curScale * e.deltaY / 1000)); + this._zoomed = Number(this.pdfViewer.currentScaleValue); + } + } render() { trace(); - return (
e.stopPropagation()} onClick={this.onClick} ref={this._mainCont}> + return (
{!this._marqueeing ? (null) :
{ border: `${this._marqueeWidth === 0 ? "" : "2px dashed black"}` }}>
} -
- {this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map((anno, index) => - )} +
+
+ {this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map((anno, index) => + )} +
+ NumCast(this.props.Document.scrollHeight, NumCast(this.props.Document.nativeHeight))} + PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : NumCast(this.props.Document.nativeWidth)} + focus={emptyFunction} + isSelected={this.props.isSelected} + select={emptyFunction} + active={this.active} + ContentScaling={returnOne} + whenActiveChanged={this.whenActiveChanged} + removeDocument={this.removeDocument} + moveDocument={this.moveDocument} + addDocument={(doc: Doc, allow: boolean | undefined) => { Doc.AddDocToList(this.props.fieldExtensionDoc, this.props.fieldExt, doc); return true; }} + CollectionView={this.props.ContainingCollectionView} + ScreenToLocalTransform={this.scrollXf} + ruleProvider={undefined} + renderDepth={this.props.renderDepth + 1} + ContainingCollectionDoc={this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document} + chromeCollapsed={true}> +
- NumCast(this.props.Document.scrollHeight, NumCast(this.props.Document.nativeHeight))} - PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : NumCast(this.props.Document.nativeWidth)} - focus={emptyFunction} - isSelected={this.props.isSelected} - select={emptyFunction} - active={this.active} - ContentScaling={returnOne} - whenActiveChanged={this.whenActiveChanged} - removeDocument={this.removeDocument} - moveDocument={this.moveDocument} - addDocument={(doc: Doc, allow: boolean | undefined) => { Doc.AddDocToList(this.props.fieldExtensionDoc, this.props.fieldExt, doc); return true; }} - CollectionView={this.props.ContainingCollectionView} - ScreenToLocalTransform={this.scrollXf} - ruleProvider={undefined} - renderDepth={this.props.renderDepth + 1} - ContainingCollectionDoc={this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document} - chromeCollapsed={true}> - {this._showCover ? this.getCoverImage() : (null)} - {this._showWaiting ? : (null)} + { + this._showWaiting ? : (null) + }
); } } -- cgit v1.2.3-70-g09d2 From 9d845e78593b6923c8dc3224bcd89715f39aa070 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 14:59:48 -0400 Subject: fixed borderRounding. fixed pdf marqueeing for efficiency. --- .../views/nodes/CollectionFreeFormDocumentView.tsx | 3 +- src/client/views/pdf/PDFViewer.scss | 9 ++ src/client/views/pdf/PDFViewer.tsx | 99 ++++++++++++++-------- 3 files changed, 76 insertions(+), 35 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index 49b6f22db..c3d2c9e51 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -77,7 +77,8 @@ export class CollectionFreeFormDocumentView extends DocComponent { let ruleRounding = this.props.ruleProvider ? StrCast(this.props.ruleProvider["ruleRounding_" + this.Document.heading]) : undefined; - let br = StrCast(((this.layoutDoc.layout as Doc) || this.Document).borderRounding); + let ld = this.layoutDoc.layout instanceof Doc ? this.layoutDoc.layout as Doc : undefined; + let br = StrCast((ld || this.props.Document).borderRounding); br = !br && ruleRounding ? ruleRounding : br; if (br.endsWith("%")) { let nativeDim = Math.min(NumCast(this.layoutDoc.nativeWidth), NumCast(this.layoutDoc.nativeHeight)); diff --git a/src/client/views/pdf/PDFViewer.scss b/src/client/views/pdf/PDFViewer.scss index c5a397691..8027e93a3 100644 --- a/src/client/views/pdf/PDFViewer.scss +++ b/src/client/views/pdf/PDFViewer.scss @@ -50,6 +50,15 @@ opacity: 0.1; } } + .pdfViewer-waiting { + width: 70%; + height: 70%; + margin : 15%; + transition: 0.4s opacity ease; + opacity: 0.7; + position: absolute; + z-index: 10; + } } .pdfViewer-viewer-zoomed { overflow-x: scroll; diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 016445538..5ad4ffd48 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -392,7 +392,6 @@ export class PDFViewer extends React.Component { PDFMenu.Instance.Status = "pdf"; PDFMenu.Instance.fadeOut(true); if (e.target && (e.target as any).parentElement.className === "textLayer") { - e.stopPropagation(); if (!e.ctrlKey) { this.receiveAnnotations([], -1); } @@ -405,7 +404,11 @@ export class PDFViewer extends React.Component { this._startY = this._marqueeY = (e.clientY - boundingRect.top) * (this._mainCont.current.offsetHeight / boundingRect.height) + this._mainCont.current.scrollTop; } this._marqueeing = true; - this._marquee.current && (this._marquee.current.style.opacity = "0.2"); + let marquees = this._mainCont.current!.getElementsByClassName("pdfViewer-dragAnnotationBox"); + if (marquees && marquees.length) { // make a copy of the marquee + let marquee = marquees[0] as HTMLDivElement; + marquee.style.opacity = "0.2"; + } this.receiveAnnotations([], -1); } document.removeEventListener("pointermove", this.onSelectMove); @@ -472,9 +475,11 @@ export class PDFViewer extends React.Component { onSelectEnd = (e: PointerEvent): void => { if (this._marqueeing) { if (this._marqueeWidth > 10 || this._marqueeHeight > 10) { - if (this._marquee.current) { // make a copy of the marquee + let marquees = this._mainCont.current!.getElementsByClassName("pdfViewer-dragAnnotationBox"); + if (marquees && marquees.length) { // make a copy of the marquee let copy = document.createElement("div"); - let style = this._marquee.current.style; + let marquee = marquees[0] as HTMLDivElement; + let style = marquee.style; copy.style.left = style.left; copy.style.top = style.top; copy.style.width = style.width; @@ -483,7 +488,7 @@ export class PDFViewer extends React.Component { copy.style.opacity = style.opacity; copy.className = "pdfPage-annotationBox"; this.createAnnotation(copy, this.getPageFromScroll(this._marqueeY)); - this._marquee.current.style.opacity = "0"; + marquee.style.opacity = "0"; } if (!e.ctrlKey) { @@ -609,11 +614,13 @@ export class PDFViewer extends React.Component { } getCoverImage = () => { - let nativeWidth = NumCast(this.props.Document.nativeWidth); if (!this.props.Document[HeightSym]()) { - this.props.Document.height = this.props.Document[WidthSym]() * this._coverPath.height / this._coverPath.width; - this.props.Document.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width + setTimeout(() => { + this.props.Document.height = this.props.Document[WidthSym]() * this._coverPath.height / this._coverPath.width; + this.props.Document.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width; + }, 0); } + let nativeWidth = NumCast(this.props.Document.nativeWidth); let nativeHeight = NumCast(this.props.Document.nativeHeight); return this._showWaiting = false)} style={{ position: "absolute", display: "inline-block", top: 0, left: 0, width: `${nativeWidth}px`, height: `${nativeHeight}px` }} />; @@ -629,23 +636,37 @@ export class PDFViewer extends React.Component { this._zoomed = Number(this.pdfViewer.currentScaleValue); } } + + @computed get annotationLayer() { + trace(); + return
+ {this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map((anno, index) => + )} +
; + } + @computed get pdfViewerDiv() { + trace(); + return
; + } + @computed get standinViews() { + trace(); + return <> + {this._showCover ? this.getCoverImage() : (null)} + {this._showWaiting ? : (null)} + ; + } + marqueeWidth = () => this._marqueeWidth; + marqueeHeight = () => this._marqueeHeight; + marqueeX = () => this._marqueeX; + marqueeY = () => this._marqueeY; + marqueeing = () => this._marqueeing; render() { trace(); - return (
-
- {!this._marqueeing ? (null) :
-
} + {this.pdfViewerDiv} +
-
- {this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map((anno, index) => - )} -
+ {this.annotationLayer} NumCast(this.props.Document.scrollHeight, NumCast(this.props.Document.nativeHeight))} @@ -667,21 +688,31 @@ export class PDFViewer extends React.Component { chromeCollapsed={true}>
- {this._showCover ? this.getCoverImage() : (null)} - { - this._showWaiting ? : (null) - } + {this.standinViews}
); } } +interface PdfViewerMarqueeProps { + isMarqueeing: () => boolean; + width: () => number; + height: () => number; + x: () => number; + y: () => number; +} + +@observer +class PdfViewerMarquee extends React.Component { + render() { + return !this.props.isMarqueeing() ? (null) :
+
+ } +} + + export enum AnnotationTypes { Region } -- cgit v1.2.3-70-g09d2 From b16581b509a8b74ebd3b4e9d0a598e305e4249b5 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 15:27:55 -0400 Subject: fixed lockedPosition to allow move events to pass through (ie, for panning). --- .../collections/collectionFreeForm/CollectionFreeFormView.tsx | 1 - src/client/views/nodes/DocumentView.tsx | 8 ++++---- 2 files changed, 4 insertions(+), 5 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 0822e62da..721732774 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -355,7 +355,6 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { let safeScale = Math.min(Math.max(0.15, localTransform.Scale), 40); this.props.Document.scale = Math.abs(safeScale); this.setPan(-localTransform.TranslateX / safeScale, -localTransform.TranslateY / safeScale); - e.preventDefault(); } } diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 366c3142a..6ee88f834 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -254,7 +254,7 @@ export class DocumentView extends DocComponent(Docu this._hitTemplateDrag = true; } } - if (this.active && e.button === 0) e.stopPropagation(); // events stop at the lowest document that is active. if right dragging, we let it go through though to allow for context menu clicks. PointerMove callbacks should remove themselves if the move event gets stopPropagated by a lower-level handler (e.g, marquee drag); + if (this.active && e.button === 0 && !this.Document.lockedPosition) e.stopPropagation(); // events stop at the lowest document that is active. if right dragging, we let it go through though to allow for context menu clicks. PointerMove callbacks should remove themselves if the move event gets stopPropagated by a lower-level handler (e.g, marquee drag); document.removeEventListener("pointermove", this.onPointerMove); document.removeEventListener("pointerup", this.onPointerUp); document.addEventListener("pointermove", this.onPointerMove); @@ -264,9 +264,9 @@ export class DocumentView extends DocComponent(Docu if (e.cancelBubble && this.active) { document.removeEventListener("pointermove", this.onPointerMove); // stop listening to pointerMove if something else has stopPropagated it (e.g., the MarqueeView) } - else if (!e.cancelBubble && (SelectionManager.IsSelected(this) || this.props.parentActive())) { + else if (!e.cancelBubble && (SelectionManager.IsSelected(this) || this.props.parentActive()) && !this.Document.lockedPosition) { if (Math.abs(this._downX - e.clientX) > 3 || Math.abs(this._downY - e.clientY) > 3) { - if (!e.altKey && !this.topMost && e.buttons === 1 && !this.Document.lockedPosition) { + if (!e.altKey && !this.topMost && e.buttons === 1) { document.removeEventListener("pointermove", this.onPointerMove); document.removeEventListener("pointerup", this.onPointerUp); this.startDragging(this._downX, this._downY, e.ctrlKey || e.altKey ? "alias" : undefined, this._hitTemplateDrag); @@ -296,7 +296,7 @@ export class DocumentView extends DocComponent(Docu await swapViews(this.props.Document, "", "layoutNative"); let options = { title: "data", width: (this.Document.width || 0), x: -(this.Document.width || 0) / 2, y: - (this.Document.height || 0) / 2, }; - let fieldTemplate = this.Document.type === DocumentType.TEXT ? Docs.Create.TextDocument(options) : + let fieldTemplate = this.Document.type === DocumentType.TEXT ? Docs.Create.TextDocument(options) : this.Document.type === DocumentType.PDF ? Docs.Create.PdfDocument("http://www.msn.com", options) : this.Document.type === DocumentType.VID ? Docs.Create.VideoDocument("http://www.cs.brown.edu", options) : Docs.Create.ImageDocument("http://www.cs.brown.edu", options); -- cgit v1.2.3-70-g09d2 From a80f0867032a4735b319c87c1c7c045f062a7d4f Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 27 Sep 2019 17:36:22 -0400 Subject: got rid of opacity 0.99 --- src/client/views/InkingCanvas.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/InkingCanvas.scss b/src/client/views/InkingCanvas.scss index 2d1142f38..b3edad459 100644 --- a/src/client/views/InkingCanvas.scss +++ b/src/client/views/InkingCanvas.scss @@ -1,7 +1,7 @@ @import "globalCssVariables"; .inkingCanvas { - opacity: 0.99; + // opacity: 0.99; touch-action: none; .jsx-parser { -- cgit v1.2.3-70-g09d2