aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/Main.tsx5
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx63
-rw-r--r--src/client/views/nodes/PDFBox.scss3
-rw-r--r--src/client/views/nodes/PDFBox.tsx59
-rw-r--r--src/client/views/pdf/PDFViewer.tsx2
-rw-r--r--src/client/views/pdf/Page.tsx29
6 files changed, 75 insertions, 86 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 1cf13aa74..5fd42c0df 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -39,5 +39,10 @@ let swapDocs = async () => {
(await Cast(CurrentUserUtils.UserDocument.sidebar, Doc))!.chromeStatus = "disabled";
CurrentUserUtils.UserDocument.chromeStatus = "disabled";
await swapDocs();
+ document.getElementById('root')!.addEventListener('wheel', event => {
+ if (event.ctrlKey) {
+ event.preventDefault()
+ }
+ }, true);
ReactDOM.render(<MainView />, document.getElementById('root'));
})(); \ No newline at end of file
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index a08a12426..d347e02b6 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -352,12 +352,11 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
@action
onPointerWheel = (e: React.WheelEvent): void => {
if (BoolCast(this.props.Document.lockedPosition)) return;
- // if (!this.props.active()) {
- // return;
- // }
- if (this.props.Document.type === "pdf") {
+ if (!e.ctrlKey && this.props.Document.scrollY !== undefined) {
+ e.stopPropagation();
return;
}
+
let childSelected = this.childDocs.some(doc => {
var dv = DocumentManager.Instance.getDocumentView(doc);
return dv && SelectionManager.IsSelected(dv) ? true : false;
@@ -366,21 +365,20 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
return;
}
e.stopPropagation();
- const coefficient = 1000;
-
- if (e.ctrlKey) {
- let deltaScale = (1 - (e.deltaY / coefficient));
- let nw = this.nativeWidth * deltaScale;
- let nh = this.nativeHeight * deltaScale;
- if (nw && nh) {
- this.props.Document.nativeWidth = nw;
- this.props.Document.nativeHeight = nh;
- }
- e.stopPropagation();
- e.preventDefault();
- } else {
- // if (modes[e.deltaMode] === 'pixels') coefficient = 50;
- // else if (modes[e.deltaMode] === 'lines') coefficient = 1000; // This should correspond to line-height??
+
+ // bcz: this changes the nativewidth/height, but ImageBox will just revert it back to its defaults. need more logic to fix.
+ // if (e.ctrlKey && this.props.Document.scrollY === undefined) {
+ // let deltaScale = (1 - (e.deltaY / coefficient));
+ // let nw = this.nativeWidth * deltaScale;
+ // let nh = this.nativeHeight * deltaScale;
+ // if (nw && nh) {
+ // this.props.Document.nativeWidth = nw;
+ // this.props.Document.nativeHeight = nh;
+ // }
+ // e.preventDefault();
+ // }
+ // else
+ {
let deltaScale = e.deltaY > 0 ? (1 / 1.1) : 1.1;
if (deltaScale * this.zoomScaling() < 1 && this.isAnnotationOverlay) {
deltaScale = 1 / this.zoomScaling();
@@ -392,21 +390,21 @@ 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.stopPropagation();
+ e.preventDefault();
}
}
@action
setPan(panX: number, panY: number) {
- if (BoolCast(this.props.Document.lockedPosition)) return;
- this.props.Document.panTransformType = "None";
- var scale = this.getLocalTransform().inverse().Scale;
- const newPanX = Math.min((1 - 1 / scale) * this.nativeWidth, Math.max(0, panX));
- const newPanY = Math.min((1 - 1 / scale) * this.nativeHeight, Math.max(0, panY));
- this.props.Document.panX = this.isAnnotationOverlay ? newPanX : panX;
- this.props.Document.panY = this.isAnnotationOverlay && StrCast(this.props.Document.backgroundLayout).indexOf("PDFBox") === -1 ? newPanY : panY;
- if (this.props.Document.scrollY) {
- this.props.Document.scrollY = panY - scale * this.props.Document[HeightSym]();
+ if (!BoolCast(this.props.Document.lockedPosition)) {
+ this.props.Document.panTransformType = "None";
+ var scale = this.getLocalTransform().inverse().Scale;
+ const newPanX = Math.min((1 - 1 / scale) * this.nativeWidth, Math.max(0, panX));
+ const newPanY = Math.min((this.props.Document.scrollHeight !== undefined ? NumCast(this.props.Document.scrollHeight) : (1 - 1 / scale) * this.nativeHeight), Math.max(0, panY));
+ this.props.Document.panX = this.isAnnotationOverlay ? newPanX : panX;
+ this.props.Document.panY = this.isAnnotationOverlay ? newPanY : panY;
+ if (this.props.Document.scrollHeight !== undefined) this.props.Document.scrollY = this.isAnnotationOverlay ? newPanY : panY;
+ else this.props.Document.panY = this.isAnnotationOverlay ? newPanY : panY;
}
}
@@ -490,12 +488,7 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
this.Document.scale = scale;
}
- getScale = () => {
- if (this.Document.scale) {
- return this.Document.scale;
- }
- return 1;
- }
+ getScale = () => this.Document.scale ? this.Document.scale : 1;
getChildDocumentViewProps(childDocLayout: Doc): DocumentViewProps {
diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss
index a1bab0409..c88a94c28 100644
--- a/src/client/views/nodes/PDFBox.scss
+++ b/src/client/views/nodes/PDFBox.scss
@@ -5,6 +5,9 @@
height: 100%;
overflow-y: scroll;
overflow-x: hidden;
+ .pdfBox-scrollHack {
+ pointer-events: none;
+ }
}
.pdfBox-cont {
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 56e720bf7..2759b46d4 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -30,10 +30,11 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
@observable private _flyout: boolean = false;
@observable private _alt = false;
- @observable private _scrollY: number = 0;
@observable private _pdf: Opt<Pdfjs.PDFDocumentProxy>;
+
@computed get containingCollectionDocument() { return this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document; }
@computed get dataDoc() { return BoolCast(this.props.Document.isTemplate) && this.props.DataDoc ? this.props.DataDoc : this.props.Document; }
+ @computed get fieldExtensionDoc() { return Doc.resolvedFieldDataDoc(this.props.DataDoc ? this.props.DataDoc : this.props.Document, this.props.fieldKey, "true"); }
private _mainCont: React.RefObject<HTMLDivElement> = React.createRef();
private _reactionDisposer?: IReactionDisposer;
@@ -62,16 +63,16 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
}
public GetPage() {
- return Math.floor(NumCast(this.props.Document.scrollY) / NumCast(this.dataDoc.pdfHeight)) + 1;
+ return Math.floor(NumCast(this.props.Document.scrollY) / NumCast(this.dataDoc.nativeHeight)) + 1;
}
@action
public BackPage() {
- let cp = Math.ceil(NumCast(this.props.Document.scrollY) / NumCast(this.dataDoc.pdfHeight)) + 1;
+ let cp = Math.ceil(NumCast(this.props.Document.scrollY) / NumCast(this.dataDoc.nativeHeight)) + 1;
cp = cp - 1;
if (cp > 0) {
this.props.Document.curPage = cp;
- this.props.Document.scrollY = (cp - 1) * NumCast(this.dataDoc.pdfHeight);
+ this.props.Document.scrollY = (cp - 1) * NumCast(this.dataDoc.nativeHeight);
}
}
@@ -79,7 +80,7 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
public GotoPage(p: number) {
if (p > 0 && p <= NumCast(this.props.Document.numPages)) {
this.props.Document.curPage = p;
- this.props.Document.scrollY = (p - 1) * NumCast(this.dataDoc.pdfHeight);
+ this.props.Document.scrollY = (p - 1) * NumCast(this.dataDoc.nativeHeight);
}
}
@@ -88,31 +89,16 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
let cp = this.GetPage() + 1;
if (cp <= NumCast(this.props.Document.numPages)) {
this.props.Document.curPage = cp;
- this.props.Document.scrollY = (cp - 1) * NumCast(this.dataDoc.pdfHeight);
+ this.props.Document.scrollY = (cp - 1) * NumCast(this.dataDoc.nativeHeight);
}
}
- scrollTo = (y: number) => {
- this._mainCont.current && this._mainCont.current.scrollTo({ top: Math.max(y - (this._mainCont.current.offsetHeight / 2), 0), behavior: "auto" });
- }
-
@action
setPanY = (y: number) => {
this.containingCollectionDocument && (this.containingCollectionDocument.panY = y);
}
- private newKeyChange = (e: React.ChangeEvent<HTMLInputElement>) => {
- this._keyValue = e.currentTarget.value;
- }
-
- private newValueChange = (e: React.ChangeEvent<HTMLInputElement>) => {
- this._valueValue = e.currentTarget.value;
- }
-
- private newScriptChange = (e: React.ChangeEvent<HTMLInputElement>) => {
- this._scriptValue = e.currentTarget.value;
- }
-
+ @action
private applyFilter = () => {
let scriptText = this._scriptValue.length > 0 ? this._scriptValue :
this._keyValue.length > 0 && this._valueValue.length > 0 ?
@@ -121,7 +107,10 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
script.compiled && (this.props.Document.filterScript = new ScriptField(script));
}
- @action
+ scrollTo = (y: number) => {
+ this._mainCont.current && this._mainCont.current.scrollTo({ top: Math.max(y - (this._mainCont.current.offsetHeight / 2), 0), behavior: "auto" });
+ }
+
private resetFilters = () => {
this._keyValue = this._valueValue = "";
this._scriptValue = "return true";
@@ -130,6 +119,9 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
this._scriptRef.current && (this._scriptRef.current.value = "");
this.applyFilter();
}
+ private newKeyChange = (e: React.ChangeEvent<HTMLInputElement>) => this._keyValue = e.currentTarget.value;
+ private newValueChange = (e: React.ChangeEvent<HTMLInputElement>) => this._valueValue = e.currentTarget.value;
+ private newScriptChange = (e: React.ChangeEvent<HTMLInputElement>) => this._scriptValue = e.currentTarget.value;
settingsPanel() {
return !this.props.active() ? (null) :
@@ -176,12 +168,12 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
loaded = (nw: number, nh: number, np: number) => {
this.dataDoc.numPages = np;
- if (!this.dataDoc.nativeWidth || !this.dataDoc.nativeHeight) {
+ if (!this.dataDoc.nativeWidth || !this.dataDoc.nativeHeight || !this.dataDoc.scrollHeight) {
let oldaspect = NumCast(this.dataDoc.nativeHeight) / NumCast(this.dataDoc.nativeWidth, 1);
this.dataDoc.nativeWidth = nw;
this.dataDoc.nativeHeight = this.dataDoc.nativeHeight ? nw * oldaspect : nh;
- this.containingCollectionDocument && (this.containingCollectionDocument.pdfHeight = nh);
- this.dataDoc.height = nh * (this.dataDoc[WidthSym]() / nw);
+ this.dataDoc.height = this.dataDoc[WidthSym]() * (nh / nw);
+ this.dataDoc.scrollHeight = np * this.dataDoc.nativeHeight;
}
}
@@ -189,14 +181,10 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
onScroll = (e: React.UIEvent<HTMLDivElement>) => {
if (e.currentTarget && this.containingCollectionDocument) {
this.containingCollectionDocument.panTransformType = "None";
- this.containingCollectionDocument.scrollY = this._scrollY = e.currentTarget.scrollTop;
+ this.containingCollectionDocument.scrollY = e.currentTarget.scrollTop;
}
}
- @computed get fieldExtensionDoc() {
- return Doc.resolvedFieldDataDoc(this.props.DataDoc ? this.props.DataDoc : this.props.Document, this.props.fieldKey, "true");
- }
-
render() {
const pdfUrl = Cast(this.props.Document.data, PdfField);
let classname = "pdfBox-cont" + (this.props.active() && !InkingControl.Instance.selectedTool && !this._alt ? "-interactive" : "");
@@ -205,14 +193,13 @@ export class PDFBox extends DocComponent<FieldViewProps, PdfDocument>(PdfDocumen
<div className={classname}
onScroll={this.onScroll}
style={{ marginTop: `${this.containingCollectionDocument ? NumCast(this.containingCollectionDocument.panY) : 0}px` }}
- ref={this._mainCont}
- onWheel={(e: React.WheelEvent) => { e.stopPropagation(); }}>
- <PDFViewer pdf={this._pdf} url={pdfUrl.url.pathname} active={this.props.active} scrollTo={this.scrollTo} loaded={this.loaded} scrollY={this._scrollY}
+ ref={this._mainCont}>
+ <div className="pdfBox-scrollHack" style={{ height: NumCast(this.props.Document.scrollHeight) + (NumCast(this.props.Document.nativeHeight) - NumCast(this.props.Document.nativeHeight) / NumCast(this.props.Document.scale)), width: "100%" }} />
+ <PDFViewer pdf={this._pdf} url={pdfUrl.url.pathname} active={this.props.active} scrollTo={this.scrollTo} loaded={this.loaded} scrollY={NumCast(this.props.Document.scrollY)}
Document={this.props.Document} DataDoc={this.props.DataDoc}
addDocTab={this.props.addDocTab} setPanY={this.setPanY}
fieldKey={this.props.fieldKey} fieldExtensionDoc={this.fieldExtensionDoc} />
{this.settingsPanel()}
- </div>
- );
+ </div>);
}
} \ No newline at end of file
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 7c445c373..021c04723 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -160,7 +160,7 @@ export class PDFViewer extends React.Component<IViewerProps> {
}))));
this.props.loaded(Math.max(...this._pageSizes.map(i => i.width)), this._pageSizes[0].height, this.props.pdf.numPages);
- let startY = NumCast(this.props.Document.startY);
+ let startY = NumCast(this.props.Document.startY, NumCast(this.props.Document.scrollY));
this.props.setPanY && this.props.setPanY(startY);
this.props.Document.scrollY = startY + 1;
}
diff --git a/src/client/views/pdf/Page.tsx b/src/client/views/pdf/Page.tsx
index a15bed255..6de2db427 100644
--- a/src/client/views/pdf/Page.tsx
+++ b/src/client/views/pdf/Page.tsx
@@ -143,6 +143,7 @@ export default class Page extends React.Component<IPageProps> {
@action
onPointerDown = (e: React.PointerEvent): void => {
// if alt+left click, drag and annotate
+ if (this.props.Document.scale !== 1) return;
if (e.altKey && e.button === 0) {
e.stopPropagation();
}
@@ -197,21 +198,21 @@ export default class Page extends React.Component<IPageProps> {
onSelectEnd = (e: PointerEvent): void => {
if (this._marqueeing) {
this._marqueeing = false;
- if (this._marquee.current) { // make a copy of the marquee
- let copy = document.createElement("div");
- let style = this._marquee.current.style;
- copy.style.left = style.left;
- copy.style.top = style.top;
- copy.style.width = style.width;
- copy.style.height = style.height;
- copy.style.border = style.border;
- copy.style.opacity = style.opacity;
- copy.className = "pdfPage-annotationBox";
- this.props.createAnnotation(copy, this.props.page);
- this._marquee.current.style.opacity = "0";
- }
-
if (this._marqueeWidth > 10 || this._marqueeHeight > 10) {
+ if (this._marquee.current) { // make a copy of the marquee
+ let copy = document.createElement("div");
+ let style = this._marquee.current.style;
+ copy.style.left = style.left;
+ copy.style.top = style.top;
+ copy.style.width = style.width;
+ copy.style.height = style.height;
+ copy.style.border = style.border;
+ copy.style.opacity = style.opacity;
+ copy.className = "pdfPage-annotationBox";
+ this.props.createAnnotation(copy, this.props.page);
+ this._marquee.current.style.opacity = "0";
+ }
+
if (!e.ctrlKey) {
PDFMenu.Instance.Status = "snippet";
PDFMenu.Instance.Marquee = { left: this._marqueeX, top: this._marqueeY, width: this._marqueeWidth, height: this._marqueeHeight };
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 17:18:40 +0000