From f8da2a897de4d737ac3ea697b58d06bba5ce9f66 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Sun, 20 Oct 2019 15:15:15 -0400 Subject: working version of updated template refactoring --- src/client/views/pdf/PDFViewer.tsx | 63 +++++++++++++++++++++----------------- 1 file changed, 35 insertions(+), 28 deletions(-) (limited to 'src/client/views/pdf') diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 51f7829e8..72a08f35c 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -6,7 +6,7 @@ import { Dictionary } from "typescript-collections"; import { Doc, DocListCast, FieldResult, WidthSym, Opt, HeightSym } from "../../../new_fields/Doc"; import { Id } from "../../../new_fields/FieldSymbols"; import { List } from "../../../new_fields/List"; -import { makeInterface } from "../../../new_fields/Schema"; +import { makeInterface, createSchema } from "../../../new_fields/Schema"; import { ScriptField } from "../../../new_fields/ScriptField"; import { Cast, NumCast, StrCast } from "../../../new_fields/Types"; import { smoothScroll, Utils, emptyFunction, returnOne, intersectRect, addStyleSheet, addStyleSheetRule, clearStyleSheetRules } from "../../../Utils"; @@ -29,9 +29,18 @@ import { DocumentType } from "../../documents/DocumentTypes"; const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer"); const pdfjsLib = require("pdfjs-dist"); +export const pageSchema = createSchema({ + curPage: "number", + fitWidth: "boolean", + rotation: "number", + scrollY: "number", + scrollHeight: "number", + search_string: "string" +}); + pdfjsLib.GlobalWorkerOptions.workerSrc = `/assets/pdf.worker.js`; -type PdfDocument = makeInterface<[typeof documentSchema]>; -const PdfDocument = makeInterface(documentSchema); +type PdfDocument = makeInterface<[typeof documentSchema, typeof pageSchema]>; +const PdfDocument = makeInterface(documentSchema, pageSchema); interface IViewerProps { pdf: Pdfjs.PDFDocumentProxy; @@ -113,10 +122,10 @@ export class PDFViewer extends DocAnnotatableComponent { // 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.layoutDoc.curPage, 1)}.PNG`))); + this._coverPath = JSON.parse(await rp.get(Utils.prepend(`/thumbnail${this.props.url.substring("files/".length, this.props.url.length - ".pdf".length)}-${(this.Document.curPage || 1)}.PNG`))); runInAction(() => this._showWaiting = this._showCover = true); this.props.startupLive && this.setupPdfJsViewer(); - this._searchReactionDisposer = reaction(() => StrCast(this.props.Document.search_string), searchString => { + this._searchReactionDisposer = reaction(() => this.Document.search_string, searchString => { if (searchString) { this.search(searchString, true); this._lastSearch = searchString; @@ -131,14 +140,14 @@ export class PDFViewer extends DocAnnotatableComponent (SelectionManager.SelectedDocuments().length === 1) && this.setupPdfJsViewer(), { fireImmediately: true }); this._reactionDisposer = reaction( - () => this.layoutDoc.scrollY, + () => this.Document.scrollY, (scrollY) => { if (scrollY !== undefined) { if (this._showCover || this._showWaiting) { this.setupPdfJsViewer(); } - this._mainCont.current && smoothScroll(1000, this._mainCont.current, NumCast(this.layoutDoc.scrollY) || 0); - this.layoutDoc.scrollY = undefined; + this._mainCont.current && smoothScroll(1000, this._mainCont.current, (this.Document.scrollY || 0)); + this.Document.scrollY = undefined; } }, { fireImmediately: true } @@ -179,7 +188,7 @@ export class PDFViewer extends DocAnnotatableComponent size + page.height, 0) * 96 / 72; + this.Document.scrollHeight = this._pageSizes.reduce((size, page) => size + page.height, 0) * 96 / 72; } } @@ -197,7 +206,7 @@ export class PDFViewer extends DocAnnotatableComponent ({ scriptField: Cast(this.layoutDoc.filterScript, ScriptField), annos: this._annotations.slice() }), + () => ({ scriptField: Cast(this.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; @@ -224,7 +233,7 @@ export class PDFViewer extends DocAnnotatableComponent { this._pdfViewer.currentScaleValue = this._zoomed = 1; - this.gotoPage(NumCast(this.layoutDoc.curPage, 1)); + this.gotoPage(this.Document.curPage || 1); })); document.addEventListener("pagerendered", action(() => this._showCover = this._showWaiting = false)); var pdfLinkService = new PDFJSViewer.PDFLinkService(); @@ -254,7 +263,7 @@ export class PDFViewer extends DocAnnotatableComponent(annoDocs); } - mainAnnoDocProto.title = "Annotation on " + StrCast(this.props.Document.title); + mainAnnoDocProto.title = "Annotation on " + this.Document.title; mainAnnoDocProto.annotationOn = this.props.Document; this._savedAnnotations.clear(); this.Index = -1; @@ -335,7 +344,7 @@ export class PDFViewer extends DocAnnotatableComponent) => { this._scrollTop = this._mainCont.current!.scrollTop; - this._pdfViewer && (this.layoutDoc.curPage = this._pdfViewer.currentPageNumber); + this._pdfViewer && (this.Document.curPage = this._pdfViewer.currentPageNumber); } // get the page index that the vertical offset passed in is on @@ -403,7 +412,7 @@ export class PDFViewer extends DocAnnotatableComponent !(dragData as any).linkedToDoc && - DocUtils.MakeLink({ doc: annotationDoc }, { doc: dragData.dropDocument, ctx: dragData.targetContext }, `Annotation from ${StrCast(this.props.Document.title)}`, "link from PDF") + DocUtils.MakeLink({ doc: annotationDoc }, { doc: dragData.dropDocument, ctx: dragData.targetContext }, `Annotation from ${this.Document.title}`, "link from PDF") }, hideSource: false @@ -568,18 +577,16 @@ export class PDFViewer extends DocAnnotatableComponent { let view = Doc.MakeAlias(this.props.Document); let data = Doc.MakeDelegate(Doc.GetProto(this.props.Document)); data.title = StrCast(data.title) + "_snippet"; view.proto = data; view.nativeHeight = marquee.height; - view.height = (this.layoutDoc[WidthSym]() / NumCast(this.layoutDoc.nativeWidth)) * marquee.height; - view.nativeWidth = this.layoutDoc.nativeWidth; + view.height = (this.Document[WidthSym]() / (this.Document.nativeWidth || 1)) * marquee.height; + view.nativeWidth = this.Document.nativeWidth; view.startY = marquee.top; - view.width = this.layoutDoc[WidthSym](); + view.width = this.Document[WidthSym](); DragManager.StartDocumentDrag([], new DragManager.DocumentDragData([view]), 0, 0); } @@ -600,12 +607,12 @@ export class PDFViewer extends DocAnnotatableComponent { if (!this.props.Document[HeightSym]() || !this.props.Document.nativeHeight) { setTimeout((() => { - this.layoutDoc.height = this.layoutDoc[WidthSym]() * this._coverPath.height / this._coverPath.width; - this.layoutDoc.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width; + this.Document.height = this.Document[WidthSym]() * this._coverPath.height / this._coverPath.width; + this.Document.nativeHeight = nativeWidth * this._coverPath.height / this._coverPath.width; }).bind(this), 0); } - let nativeWidth = NumCast(this.layoutDoc.nativeWidth); - let nativeHeight = NumCast(this.layoutDoc.nativeHeight); + let nativeWidth = (this.Document.nativeWidth || 0); + let nativeHeight = (this.Document.nativeHeight || 0); return 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` }} />; } @@ -621,14 +628,14 @@ export class PDFViewer extends DocAnnotatableComponent + return
{this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map((anno, index) => )}
NumCast(this.layoutDoc.scrollHeight, NumCast(this.layoutDoc.nativeHeight))} - PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : NumCast(this.layoutDoc.nativeWidth)} + PanelHeight={() => (this.Document.scrollHeight || this.Document.nativeHeight || 0)} + PanelWidth={() => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : (this.Document.nativeWidth || 0)} VisibleHeight={this.visibleHeight} focus={this.props.focus} isSelected={this.props.isSelected} -- cgit v1.2.3-70-g09d2