aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/documents/Documents.ts2
-rw-r--r--src/client/views/DocComponent.tsx2
-rw-r--r--src/client/views/collections/CollectionStackingView.tsx5
-rw-r--r--src/client/views/nodes/PDFBox.tsx5
-rw-r--r--src/client/views/nodes/WebBox.scss23
-rw-r--r--src/client/views/nodes/WebBox.tsx195
-rw-r--r--src/client/views/pdf/AnchorMenu.tsx6
-rw-r--r--src/client/views/pdf/PDFViewer.tsx16
8 files changed, 185 insertions, 69 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index e8ecd8362..2ed69a993 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -816,7 +816,7 @@ export namespace Docs {
export function PdfDocument(url: string, options: DocumentOptions = {}) {
const pdfProto = Prototypes.get(DocumentType.PDF);
pdfProto._fitWidth = true; // backward compatibility -- can be removed after db is reset
- return InstanceFromProto(pdfProto, new PdfField(new URL(url)), { _viewType: "stacking", ...options });
+ return InstanceFromProto(pdfProto, new PdfField(new URL(url)), { ...options });
}
export function WebDocument(url: string, options: DocumentOptions = {}) {
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index 589cfafc5..f8aede717 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -201,7 +201,7 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
}
whenActiveChanged = action((isActive: boolean) => this.props.whenActiveChanged(this._isChildActive = isActive));
- active = (outsideReaction?: boolean) => ((CurrentUserUtils.SelectedTool === InkTool.None && !this.props.Document._) &&
+ active = (outsideReaction?: boolean) => (CurrentUserUtils.SelectedTool === InkTool.None &&
(this.props.rootSelected(outsideReaction) || this.props.isSelected(outsideReaction) || this._isChildActive || this.props.renderDepth === 0 || BoolCast((this.layoutDoc as any).forceActive)) ? true : false)
annotationsActive = (outsideReaction?: boolean) => (CurrentUserUtils.SelectedTool !== InkTool.None || (this.props.layerProvider?.(this.props.Document) === false && this.props.active()) ||
(this.props.Document.forceActive || this.props.isSelected(outsideReaction) || this._isChildActive || this.props.renderDepth === 0) ? true : false)
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
index e69dbf3ac..f3c1c4464 100644
--- a/src/client/views/collections/CollectionStackingView.tsx
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -37,6 +37,7 @@ const StackingDocument = makeInterface(collectionSchema, documentSchema);
export type collectionStackingViewProps = {
chromeStatus?: string;
+ viewType?: CollectionViewType;
NativeWidth?: () => number;
NativeHeight?: () => number;
};
@@ -60,7 +61,7 @@ export class CollectionStackingView extends CollectionSubView<StackingDocument,
@computed get xMargin() { return NumCast(this.layoutDoc._xMargin, 2 * Math.min(this.gridGap, .05 * this.props.PanelWidth())); }
@computed get yMargin() { return this.props.yMargin || NumCast(this.layoutDoc._yMargin, 5); } // 2 * this.gridGap)); }
@computed get gridGap() { return NumCast(this.layoutDoc._gridGap, 10); }
- @computed get isStackingView() { return this.layoutDoc._viewType === CollectionViewType.Stacking; }
+ @computed get isStackingView() { return (this.props.viewType ?? this.layoutDoc._viewType) === CollectionViewType.Stacking; }
@computed get numGroupColumns() { return this.isStackingView ? Math.max(1, this.Sections.size + (this.showAddAGroup ? 1 : 0)) : 1; }
@computed get showAddAGroup() { return (this.pivotField && (this.chromeStatus !== 'view-mode' && this.chromeStatus !== 'disabled')); }
@computed get columnWidth() {
@@ -315,7 +316,7 @@ export class CollectionStackingView extends CollectionSubView<StackingDocument,
const pos1 = cd.stackedDocTransform().inverse().transformPoint(cd.width(), cd.height());
if (where[0] > pos[0] && where[0] < pos1[0] && where[1] > pos[1] && (i === this._docXfs.length - 1 || where[1] < pos1[1])) {
dropInd = i;
- const axis = this.Document._viewType === CollectionViewType.Masonry ? 0 : 1;
+ const axis = this.isStackingView ? 1 : 0;
dropAfter = where[axis] > (pos[axis] + pos1[axis]) / 2 ? 1 : 0;
}
});
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 4e4db323c..a474293e6 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -179,6 +179,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
CollectionView={undefined}
ScreenToLocalTransform={this.sidebarTransform}
renderDepth={this.props.renderDepth + 1}
+ viewType={CollectionViewType.Stacking}
fieldKey={this.sidebarKey()}
pointerEvents={"all"}
/>
@@ -216,7 +217,6 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
}
});
- whenActiveChanged = action((isActive: boolean) => this.props.whenActiveChanged(this._isChildActive = isActive));
setPdfViewer = (pdfViewer: PDFViewer) => {
this._pdfViewer = pdfViewer;
if (this.initialScrollTarget) {
@@ -306,7 +306,6 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
</div>
</div>;
}
- isChildActive = (outsideReaction?: boolean) => this._isChildActive;
@computed get renderPdfView() {
TraceMobx();
const pdfUrl = Cast(this.dataDoc[this.props.fieldKey], PdfField);
@@ -316,12 +315,12 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
<PDFViewer {...this.props}
pdf={this._pdf!}
url={pdfUrl!.url.pathname}
+ active={this.active}
anchorMenuClick={this.anchorMenuClick}
loaded={!Doc.NativeAspect(this.dataDoc) ? this.loaded : undefined}
setPdfViewer={this.setPdfViewer}
addDocument={this.addDocument}
whenActiveChanged={this.whenActiveChanged}
- isChildActive={this.isChildActive}
startupLive={true}
ContentScaling={this.props.scaling}
sidebarWidth={this.sidebarWidth}
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index ca6611a6b..198e7ef10 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -6,6 +6,29 @@
position: relative;
display: flex;
+
+
+ .webBox-tagList {
+ display: flex;
+ flex-direction: row;
+ overflow: auto;
+ flex-flow: row;
+ flex-wrap: wrap;
+ .webBox-filterTag, .webBox-filterTag-active {
+ font-weight: bold;
+ padding-left: 6;
+ padding-right: 6;
+ box-shadow: black 1px 1px 4px;
+ border-radius: 5;
+ margin: 2;
+ height: 20;
+ background-color: lightgrey;
+ }
+ .webBox-filterTag-active {
+ background-color: white;
+ }
+ }
+
.pdfViewerDash-dragAnnotationBox {
position: absolute;
background-color: transparent;
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index b15865c1f..ab17703c8 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -4,7 +4,7 @@ import { action, computed, IReactionDisposer, observable, reaction, runInAction
import { observer } from "mobx-react";
import { Dictionary } from "typescript-collections";
import * as WebRequest from 'web-request';
-import { Doc, DocListCast, HeightSym, Opt, WidthSym } from "../../../fields/Doc";
+import { Doc, DocListCast, HeightSym, Opt, WidthSym, StrListCast } from "../../../fields/Doc";
import { documentSchema } from "../../../fields/documentSchemas";
import { Id } from "../../../fields/FieldSymbols";
import { HtmlField } from "../../../fields/HtmlField";
@@ -14,8 +14,8 @@ import { listSpec, makeInterface } from "../../../fields/Schema";
import { Cast, NumCast, StrCast } from "../../../fields/Types";
import { WebField } from "../../../fields/URLField";
import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, OmitKeys, returnOne, smoothScroll, Utils } from "../../../Utils";
-import { Docs } from "../../documents/Documents";
+import { emptyFunction, OmitKeys, returnOne, smoothScroll, Utils, returnZero, returnTrue } from "../../../Utils";
+import { Docs, DocUtils } from "../../documents/Documents";
import { DragManager } from "../../util/DragManager";
import { ImageUtils } from "../../util/Import & Export/ImageUtils";
import { undoBatch } from "../../util/UndoManager";
@@ -32,6 +32,11 @@ import "./WebBox.scss";
import { DocumentType } from '../../documents/DocumentTypes';
import React = require("react");
import { CurrentUserUtils } from "../../util/CurrentUserUtils";
+import { SearchBox } from "../search/SearchBox";
+import { CollectionStackingView } from "../collections/CollectionStackingView";
+import { StyleProp } from "../StyleProvider";
+import { FormattedTextBox } from "./formattedText/FormattedTextBox";
+import { CollectionViewType } from "../collections/CollectionView";
const htmlToText = require("html-to-text");
type WebDocument = makeInterface<[typeof documentSchema]>;
@@ -461,6 +466,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
const funcs: ContextMenuProps[] = [];
funcs.push({ description: (this.layoutDoc.useCors ? "Don't Use" : "Use") + " Cors", event: () => this.layoutDoc.useCors = !this.layoutDoc.useCors, icon: "snowflake" });
funcs.push({ description: (this.layoutDoc[this.fieldKey + "-contentWidth"] ? "Unfreeze" : "Freeze") + " Content Width", event: () => this.layoutDoc[this.fieldKey + "-contentWidth"] = this.layoutDoc[this.fieldKey + "-contentWidth"] ? undefined : Doc.NativeWidth(this.layoutDoc), icon: "snowflake" });
+ funcs.push({ description: "Toggle Annotation View ", event: () => this.Document._showSidebar = !this.Document._showSidebar, icon: "expand-arrows-alt" });
cm.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" });
}
@@ -483,6 +489,83 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
return view;
}
+ anchorMenuClick = (anchor: Doc) => {
+ this.Document._showSidebar = true;
+ const startup = StrListCast(this.rootDoc.docFilters).map(filter => filter.split(":")[0]).join(" ");
+ const target = Docs.Create.TextDocument(startup, {
+ title: "anno",
+ annotationOn: this.rootDoc, _width: 200, _height: 50, _fitWidth: true, _autoHeight: true, _fontSize: StrCast(Doc.UserDoc().fontSize),
+ _fontFamily: StrCast(Doc.UserDoc().fontFamily)
+ });
+ FormattedTextBox.SelectOnLoad = target[Id];
+ FormattedTextBox.DontSelectInitialText = true;
+ this.allTags.map(tag => target[tag] = tag);
+ DocUtils.MakeLink({ doc: anchor }, { doc: target }, "inline markup", "annotation");
+ this.sidebarAddDocument(target);
+ }
+ sidebarKey = () => this.fieldKey + "-sidebar";
+ sidebarFiltersHeight = () => 50;
+ sidebarTransform = () => this.props.ScreenToLocalTransform().translate(Doc.NativeWidth(this.dataDoc), 0).scale(this.props.scaling?.() || 1);
+ sidebarWidth = () => !this.layoutDoc._showSidebar ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
+ sidebarHeight = () => this.props.PanelHeight() - this.sidebarFiltersHeight() - 20;
+ sidebarAddDocument = (doc: Doc | Doc[]) => this.addDocument(doc, this.sidebarKey());
+ sidebarMoveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => this.moveDocument(doc, targetCollection, addDocument, this.sidebarKey());
+ sidebarRemDocument = (doc: Doc | Doc[]) => this.removeDocument(doc, this.sidebarKey());
+ sidebarDocFilters = () => [...StrListCast(this.layoutDoc._docFilters), ...StrListCast(this.layoutDoc[this.sidebarKey() + "-docFilters"])];
+ @computed get allTags() {
+ const keys = new Set<string>();
+ DocListCast(this.rootDoc[this.sidebarKey()]).forEach(doc => SearchBox.documentKeys(doc).forEach(key => keys.add(key)));
+ return Array.from(keys.keys()).filter(key => key[0]).filter(key => !key.startsWith("_") && (key[0] === "#" || key[0] === key[0].toUpperCase())).sort();
+ }
+ renderTag = (tag: string) => {
+ const active = StrListCast(this.rootDoc[this.sidebarKey() + "-docFilters"]).includes(`${tag}:${tag}:check`);
+ return <div className={`webBox-filterTag${active ? "-active" : ""}`}
+ onClick={e => Doc.setDocFilter(this.rootDoc, tag, tag, "check", true, this.sidebarKey())}>
+ {tag}
+ </div>;
+ }
+ @computed get sidebarOverlay() {
+ return !this.layoutDoc._showSidebar ? (null) :
+ <div style={{
+ position: "absolute", pointerEvents: this.active() ? "all" : undefined, top: 0, right: 0,
+ background: this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.WidgetColor),
+ width: `${this.sidebarWidth()}px`,
+ height: "100%"
+ }}>
+ <div style={{ width: "100%", height: this.sidebarHeight(), position: "relative" }}>
+ <CollectionStackingView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
+ NativeWidth={returnZero}
+ NativeHeight={returnZero}
+ PanelHeight={this.sidebarHeight}
+ PanelWidth={this.sidebarWidth}
+ xMargin={0}
+ yMargin={0}
+ docFilters={this.sidebarDocFilters}
+ chromeStatus={"enabled"}
+ scaleField={this.sidebarKey() + "-scale"}
+ isAnnotationOverlay={false}
+ select={emptyFunction}
+ active={this.annotationsActive}
+ scaling={returnOne}
+ whenActiveChanged={this.whenActiveChanged}
+ childHideDecorationTitle={returnTrue}
+ removeDocument={this.sidebarRemDocument}
+ moveDocument={this.sidebarMoveDocument}
+ addDocument={this.sidebarAddDocument}
+ CollectionView={undefined}
+ ScreenToLocalTransform={this.sidebarTransform}
+ renderDepth={this.props.renderDepth + 1}
+ viewType={CollectionViewType.Stacking}
+ fieldKey={this.sidebarKey()}
+ pointerEvents={"all"}
+ />
+ </div>
+ <div className="webBox-tagList" style={{ height: this.sidebarFiltersHeight(), width: this.sidebarWidth() }}>
+ {this.allTags.map(tag => this.renderTag(tag))}
+ </div>
+ </div>;
+ }
+
@computed
get content() {
const frozen = !this.props.isSelected() || DocumentDecorations.Instance?.Interacting;
@@ -521,63 +604,73 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
@action
onMarqueeDown = (e: React.PointerEvent) => {
- if (!e.altKey && e.button === 0 && this.active(true)) this._marqueeing = [e.clientX, e.clientY];
+ if (!e.altKey && e.button === 0 && this.active(true)) {
+ this._marqueeing = [e.clientX, e.clientY];
+ this.props.select(false);
+ }
}
@action
- finishMarquee = () => {
- this._marqueeing = undefined;
- this.props.select(true);
- }
+ finishMarquee = () => this._marqueeing = undefined;
- panelWidth = () => this.props.PanelWidth() / (this.props.scaling?.() || 1); // (this.Document.scrollHeight || Doc.NativeHeight(this.Document) || 0);
+ panelWidth = () => this.props.PanelWidth() / (this.props.scaling?.() || 1) - this.sidebarWidth(); // (this.Document.scrollHeight || Doc.NativeHeight(this.Document) || 0);
panelHeight = () => this.props.PanelHeight() / (this.props.scaling?.() || 1); // () => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : Doc.NativeWidth(this.Document);
scrollXf = () => this.props.ScreenToLocalTransform().translate(0, NumCast(this.layoutDoc._scrollTop));
render() {
const inactiveLayer = this.props.layerProvider?.(this.layoutDoc) === false;
const scale = this.props.scaling?.() || 1;
- return (<div className="webBox" ref={this._mainCont} >
- <div className={`webBox-container`}
- style={{ pointerEvents: inactiveLayer ? "none" : undefined }}
- onWheel={this.onWebWheel}
- onContextMenu={this.specificContextMenu}>
- <base target="_blank" />
- {this.content}
- <div className={"webBox-outerContent"} ref={this._outerRef}
- style={{
- width: `${100 / scale}%`, height: `${100 / scale}%`, transform: `scale(${scale})`,
- pointerEvents: !this.layoutDoc.isAnnotating || inactiveLayer ? "none" : "all"
- }}
- onWheel={this.onWheel}
- onPointerDown={this.onMarqueeDown}
- onScroll={this.onScroll}
- >
- <div className={"webBox-innerContent"} style={{
- height: NumCast(this.scrollHeight, 50),
- pointerEvents: inactiveLayer ? "none" : undefined
- }}>
- <CollectionFreeFormView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
- renderDepth={this.props.renderDepth + 1}
- CollectionView={undefined}
- fieldKey={this.annotationKey}
- isAnnotationOverlay={true}
- scaling={returnOne}
- PanelWidth={this.panelWidth}
- PanelHeight={this.panelHeight}
- ScreenToLocalTransform={this.scrollXf}
- removeDocument={this.removeDocument}
- moveDocument={this.moveDocument}
- addDocument={this.addDocument}
- select={emptyFunction}
- active={this.active}
- whenActiveChanged={this.whenActiveChanged} />
+ return (
+ <div className="webBox" ref={this._mainCont} >
+ <div className={`webBox-container`}
+ style={{ pointerEvents: inactiveLayer ? "none" : undefined }}
+ onWheel={this.onWebWheel}
+ onContextMenu={this.specificContextMenu}>
+ <base target="_blank" />
+ {this.content}
+ <div className={"webBox-outerContent"} ref={this._outerRef}
+ style={{
+ width: `calc(${100 / scale}% - ${this.sidebarWidth()}px)`, height: `${100 / scale}%`, transform: `scale(${scale})`,
+ pointerEvents: !this.layoutDoc.isAnnotating || inactiveLayer ? "none" : "all"
+ }}
+ onWheel={this.onWheel}
+ onPointerDown={this.onMarqueeDown}
+ onScroll={this.onScroll}
+ >
+ <div className={"webBox-innerContent"} style={{
+ height: NumCast(this.scrollHeight, 50),
+ pointerEvents: inactiveLayer ? "none" : undefined
+ }}>
+ <CollectionFreeFormView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
+ renderDepth={this.props.renderDepth + 1}
+ CollectionView={undefined}
+ fieldKey={this.annotationKey}
+ isAnnotationOverlay={true}
+ scaling={returnOne}
+ PanelWidth={this.panelWidth}
+ PanelHeight={this.panelHeight}
+ ScreenToLocalTransform={this.scrollXf}
+ removeDocument={this.removeDocument}
+ moveDocument={this.moveDocument}
+ addDocument={this.addDocument}
+ select={emptyFunction}
+ active={this.active}
+ whenActiveChanged={this.whenActiveChanged} />
+ </div>
</div>
- </div>
- {this.annotationLayer}
- {!this._marqueeing || !this._mainCont.current || !this._annotationLayer.current ? (null) :
- <MarqueeAnnotator rootDoc={this.rootDoc} scrollTop={NumCast(this.rootDoc._scrollTop)} down={this._marqueeing} scaling={this.props.scaling} addDocument={this.addDocument} finishMarquee={this.finishMarquee} savedAnnotations={this._savedAnnotations} annotationLayer={this._annotationLayer.current} mainCont={this._mainCont.current} />}
- </div >
- {this.props.isSelected() ? this.editToggleBtn() : null}
- </div>);
+ {this.annotationLayer}
+ {!this._marqueeing || !this._mainCont.current || !this._annotationLayer.current ? (null) :
+ <MarqueeAnnotator rootDoc={this.rootDoc}
+ anchorMenuClick={this.anchorMenuClick}
+ scrollTop={NumCast(this.rootDoc._scrollTop)}
+ down={this._marqueeing} scaling={this.props.scaling}
+ addDocument={this.addDocument}
+ finishMarquee={this.finishMarquee}
+ savedAnnotations={this._savedAnnotations}
+ annotationLayer={this._annotationLayer.current}
+ mainCont={this._mainCont.current} />}
+ </div >
+ {this.sidebarOverlay}
+ {this.props.isSelected() ? this.editToggleBtn() : null}
+ </div>);
}
} \ No newline at end of file
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 5a3c2103e..0a1e0ba8f 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -15,6 +15,7 @@ import { SelectionManager } from "../../util/SelectionManager";
export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
static Instance: AnchorMenu;
+ private _disposer: IReactionDisposer | undefined;
private _commentCont = React.createRef<HTMLButtonElement>();
private _palette = [
"rgba(208, 2, 27, 0.8)",
@@ -60,12 +61,9 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
AnchorMenu.Instance._canFade = false;
}
- _disposer: IReactionDisposer | undefined;
componentDidMount() {
this._disposer = reaction(() => SelectionManager.Views(),
- selected => {
- AnchorMenu.Instance.fadeOut(true);
- });
+ selected => AnchorMenu.Instance.fadeOut(true));
}
pointerDown = (e: React.PointerEvent) => {
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index c7359f74e..c9bee5101 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -8,14 +8,16 @@ import { documentSchema } from "../../../fields/documentSchemas";
import { Id } from "../../../fields/FieldSymbols";
import { InkTool } from "../../../fields/InkField";
import { createSchema, makeInterface } from "../../../fields/Schema";
-import { Cast, NumCast, StrCast, ScriptCast } from "../../../fields/Types";
+import { Cast, NumCast, ScriptCast, StrCast } from "../../../fields/Types";
import { PdfField } from "../../../fields/URLField";
import { TraceMobx } from "../../../fields/util";
import { addStyleSheet, addStyleSheetRule, clearStyleSheetRules, emptyFunction, OmitKeys, smoothScroll, Utils } from "../../../Utils";
import { DocUtils } from "../../documents/Documents";
import { Networking } from "../../Network";
+import { CurrentUserUtils } from "../../util/CurrentUserUtils";
import { CompiledScript, CompileScript } from "../../util/Scripting";
import { SelectionManager } from "../../util/SelectionManager";
+import { SharingManager } from "../../util/SharingManager";
import { SnappingManager } from "../../util/SnappingManager";
import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
import { ViewBoxAnnotatableComponent } from "../DocComponent";
@@ -27,8 +29,6 @@ import { Annotation } from "./Annotation";
import "./PDFViewer.scss";
const pdfjs = require('pdfjs-dist/es5/build/pdf.js');
import React = require("react");
-import { SharingManager } from "../../util/SharingManager";
-import { CurrentUserUtils } from "../../util/CurrentUserUtils";
const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer");
const pdfjsLib = require("pdfjs-dist");
const _global = (window /* browser */ || global /* node */) as any;
@@ -52,7 +52,6 @@ interface IViewerProps extends FieldViewProps {
url: string;
startupLive: boolean;
loaded?: (nw: number, nh: number, np: number) => void;
- isChildActive: (outsideReaction?: boolean) => boolean;
setPdfViewer: (view: PDFViewer) => void;
ContentScaling?: () => number;
sidebarWidth: () => number;
@@ -69,6 +68,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
@observable private _savedAnnotations: Dictionary<number, HTMLDivElement[]> = new Dictionary<number, HTMLDivElement[]>();
@observable private _script: CompiledScript = CompileScript("return true") as CompiledScript;
@observable private _marqueeing: number[] | undefined;
+ @observable private _textSelecting = true;
@observable private _showWaiting = true;
@observable private _showCover = false;
@observable private _zoomed = 1;
@@ -379,9 +379,11 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
if ((e.button !== 0 || e.altKey) && this.active(true)) {
this._setPreviewCursor?.(e.clientX, e.clientY, true);
}
- if (!e.altKey && e.button === 0 && this.active(true)) {
+ if (!e.altKey && e.button === 0 && this.props.active(true)) {
+ this.props.select(false);
this._marqueeing = [e.clientX, e.clientY];
if (e.target && ((e.target as any).className.includes("endOfContent") || ((e.target as any).parentElement.className !== "textLayer"))) {
+ this._textSelecting = false;
document.addEventListener("pointermove", this.onSelectMove); // need this to prevent document from being dragged if stopPropagation doesn't get called
} else {
// if textLayer is hit, then we select text instead of using a marquee so clear out the marquee.
@@ -400,8 +402,8 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
@action
finishMarquee = () => {
this._marqueeing = undefined;
+ this._textSelecting = true;
document.removeEventListener("pointermove", this.onSelectMove);
- this.props.select(false);
}
onSelectMove = (e: PointerEvent) => e.stopPropagation();
@@ -541,7 +543,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
</div>;
}
@computed get pdfViewerDiv() {
- return <div className={"pdfViewerDash-text" + ((this.props.isSelected() || this.props.isChildActive()) ? "-selected" : "")} ref={this._viewer} />;
+ return <div className={"pdfViewerDash-text" + (this._textSelecting && (this.props.isSelected() || this.props.active()) ? "-selected" : "")} ref={this._viewer} />;
}
@computed get contentScaling() { return this.props.ContentScaling?.() || 1; }
@computed get standinViews() {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-01 13:42:34 +0000