aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/pdf/Annotation.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2022-07-08 00:17:26 -0400
committerbobzel <zzzman@gmail.com>2022-07-08 00:17:26 -0400
commit146f8622d5bac2edc6b09f57c173bd057dfbcfad (patch)
treef871089c438a476543ca96bac163c0532b9557c7 /src/client/views/pdf/Annotation.tsx
parentb7e66da6b23cdb41c127000dfe13843d35f7d0cc (diff)
restructured currentUserUtils to avoid having import cycles.
Diffstat (limited to 'src/client/views/pdf/Annotation.tsx')
-rw-r--r--src/client/views/pdf/Annotation.tsx108
1 files changed, 56 insertions, 52 deletions
diff --git a/src/client/views/pdf/Annotation.tsx b/src/client/views/pdf/Annotation.tsx
index 5bdce273d..44f815336 100644
--- a/src/client/views/pdf/Annotation.tsx
+++ b/src/client/views/pdf/Annotation.tsx
@@ -1,15 +1,15 @@
-import React = require("react");
-import { action, computed, IReactionDisposer, observable, reaction, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { Doc, DocListCast, Opt } from "../../../fields/Doc";
-import { Id } from "../../../fields/FieldSymbols";
-import { List } from "../../../fields/List";
-import { BoolCast, Cast, NumCast, StrCast } from "../../../fields/Types";
-import { LinkManager } from "../../util/LinkManager";
-import { undoBatch } from "../../util/UndoManager";
-import { FieldViewProps } from "../nodes/FieldView";
-import { AnchorMenu } from "./AnchorMenu";
-import "./Annotation.scss";
+import React = require('react');
+import { action, computed, IReactionDisposer, observable, reaction, runInAction } from 'mobx';
+import { observer } from 'mobx-react';
+import { Doc, DocListCast, Opt } from '../../../fields/Doc';
+import { Id } from '../../../fields/FieldSymbols';
+import { List } from '../../../fields/List';
+import { BoolCast, Cast, NumCast, StrCast } from '../../../fields/Types';
+import { LinkFollower } from '../../util/LinkFollower';
+import { undoBatch } from '../../util/UndoManager';
+import { FieldViewProps } from '../nodes/FieldView';
+import { AnchorMenu } from './AnchorMenu';
+import './Annotation.scss';
interface IAnnotationProps extends FieldViewProps {
anno: Doc;
@@ -19,14 +19,15 @@ interface IAnnotationProps extends FieldViewProps {
pointerEvents?: () => Opt<string>;
}
@observer
-export
- class Annotation extends React.Component<IAnnotationProps> {
+export class Annotation extends React.Component<IAnnotationProps> {
render() {
- return <div>
- {DocListCast(this.props.anno.textInlineAnnotations).map(a =>
- <RegionAnnotation pointerEvents={this.props.pointerEvents} {...this.props} document={a} key={a[Id]} />
- )}
- </div>;
+ return (
+ <div>
+ {DocListCast(this.props.anno.textInlineAnnotations).map(a => (
+ <RegionAnnotation pointerEvents={this.props.pointerEvents} {...this.props} document={a} key={a[Id]} />
+ ))}
+ </div>
+ );
}
}
@@ -38,7 +39,9 @@ interface IRegionAnnotationProps extends IAnnotationProps {
class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
private _mainCont: React.RefObject<HTMLDivElement> = React.createRef();
- @computed get annoTextRegion() { return Cast(this.props.document.annoTextRegion, Doc, null) || this.props.document; }
+ @computed get annoTextRegion() {
+ return Cast(this.props.document.annoTextRegion, Doc, null) || this.props.document;
+ }
@undoBatch
deleteAnnotation = () => {
@@ -46,20 +49,20 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
this.props.dataDoc[this.props.fieldKey] = new List<Doc>(docAnnotations.filter(a => a !== this.annoTextRegion));
AnchorMenu.Instance.fadeOut(true);
this.props.select(false);
- }
+ };
@undoBatch
- pinToPres = () => this.props.pinToPres(this.annoTextRegion)
+ pinToPres = () => this.props.pinToPres(this.annoTextRegion);
@undoBatch
- makePushpin = () => this.annoTextRegion.isPushpin = !this.annoTextRegion.isPushpin
+ makePushpin = () => (this.annoTextRegion.isPushpin = !this.annoTextRegion.isPushpin);
isPushpin = () => BoolCast(this.annoTextRegion.isPushpin);
@action
onPointerDown = (e: React.PointerEvent) => {
if (e.button === 2 || e.ctrlKey) {
- AnchorMenu.Instance.Status = "annotation";
+ AnchorMenu.Instance.Status = 'annotation';
AnchorMenu.Instance.Delete = this.deleteAnnotation.bind(this);
AnchorMenu.Instance.Pinned = false;
AnchorMenu.Instance.AddTag = this.addTag.bind(this);
@@ -68,42 +71,43 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
AnchorMenu.Instance.IsPushpin = this.isPushpin;
AnchorMenu.Instance.jumpTo(e.clientX, e.clientY, true);
e.stopPropagation();
- }
- else if (e.button === 0) {
+ } else if (e.button === 0) {
e.stopPropagation();
- LinkManager.FollowLink(undefined, this.annoTextRegion, this.props, false);
+ LinkFollower.FollowLink(undefined, this.annoTextRegion, this.props, false);
}
- }
+ };
addTag = (key: string, value: string): boolean => {
const valNum = parseInt(value);
this.annoTextRegion[key] = isNaN(valNum) ? value : valNum;
return true;
- }
+ };
render() {
const brushed = this.annoTextRegion && Doc.isBrushedHighlightedDegree(this.annoTextRegion);
- return (<div className="htmlAnnotation" ref={this._mainCont}
- onPointerEnter={action(() => {
- Doc.BrushDoc(this.props.anno);
- this.props.showInfo(this.props.anno);
- })}
- onPointerLeave={action(() => {
- Doc.UnBrushDoc(this.props.anno);
- this.props.showInfo(undefined);
- })}
- onPointerDown={this.onPointerDown}
- style={{
- left: NumCast(this.props.document.x),
- top: NumCast(this.props.document.y),
- width: NumCast(this.props.document._width),
- height: NumCast(this.props.document._height),
- opacity: brushed === Doc.DocBrushStatus.highlighted ? 0.5 : undefined,
- pointerEvents: this.props.pointerEvents?.() as any,
- outline: brushed === Doc.DocBrushStatus.linkHighlighted ? "solid 1px lightBlue" : undefined,
- backgroundColor: brushed === Doc.DocBrushStatus.highlighted ? "orange" :
- StrCast(this.props.document.backgroundColor),
- }} >
- </div>);
+ return (
+ <div
+ className="htmlAnnotation"
+ ref={this._mainCont}
+ onPointerEnter={action(() => {
+ Doc.BrushDoc(this.props.anno);
+ this.props.showInfo(this.props.anno);
+ })}
+ onPointerLeave={action(() => {
+ Doc.UnBrushDoc(this.props.anno);
+ this.props.showInfo(undefined);
+ })}
+ onPointerDown={this.onPointerDown}
+ style={{
+ left: NumCast(this.props.document.x),
+ top: NumCast(this.props.document.y),
+ width: NumCast(this.props.document._width),
+ height: NumCast(this.props.document._height),
+ opacity: brushed === Doc.DocBrushStatus.highlighted ? 0.5 : undefined,
+ pointerEvents: this.props.pointerEvents?.() as any,
+ outline: brushed === Doc.DocBrushStatus.linkHighlighted ? 'solid 1px lightBlue' : undefined,
+ backgroundColor: brushed === Doc.DocBrushStatus.highlighted ? 'orange' : StrCast(this.props.document.backgroundColor),
+ }}></div>
+ );
}
-} \ No newline at end of file
+}