aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/pdf/Annotation.tsx
diff options
context:
space:
mode:
authorusodhi <61431818+usodhi@users.noreply.github.com>2020-09-30 14:07:31 +0530
committerusodhi <61431818+usodhi@users.noreply.github.com>2020-09-30 14:07:31 +0530
commit5befdda055c9f22b8c8f12184d8db6424d130669 (patch)
treef324cb85090d4ad6eac4a6bc0e1efff4e37a5371 /src/client/views/pdf/Annotation.tsx
parent04a2b4ff8ef0a1c77391f017693e19da03896c7b (diff)
parentcb18f848b44705a25f786f9a0e678095101f9e01 (diff)
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into acls_uv
Diffstat (limited to 'src/client/views/pdf/Annotation.tsx')
-rw-r--r--src/client/views/pdf/Annotation.tsx16
1 files changed, 10 insertions, 6 deletions
diff --git a/src/client/views/pdf/Annotation.tsx b/src/client/views/pdf/Annotation.tsx
index f680a00df..84b14cd61 100644
--- a/src/client/views/pdf/Annotation.tsx
+++ b/src/client/views/pdf/Annotation.tsx
@@ -1,7 +1,7 @@
import React = require("react");
import { action, IReactionDisposer, observable, reaction, runInAction } from "mobx";
import { observer } from "mobx-react";
-import { Doc, DocListCast, HeightSym, WidthSym } from "../../../fields/Doc";
+import { Doc, DocListCast, HeightSym, WidthSym, Field, Opt } from "../../../fields/Doc";
import { Id } from "../../../fields/FieldSymbols";
import { List } from "../../../fields/List";
import { Cast, FieldValue, BoolCast, NumCast, StrCast, PromiseValue } from "../../../fields/Types";
@@ -17,6 +17,7 @@ interface IAnnotationProps {
focus: (doc: Doc) => void;
dataDoc: Doc;
fieldKey: string;
+ showInfo: (anno: Opt<Doc>) => void;
}
@observer
@@ -24,11 +25,12 @@ export
class Annotation extends React.Component<IAnnotationProps> {
render() {
return DocListCast(this.props.anno.annotations).map(a =>
- <RegionAnnotation {...this.props} pinToPres={this.props.pinToPres} document={a} x={NumCast(a.x)} y={NumCast(a.y)} width={a[WidthSym]()} height={a[HeightSym]()} key={a[Id]} />);
+ <RegionAnnotation {...this.props} showInfo={this.props.showInfo} pinToPres={this.props.pinToPres} document={a} x={NumCast(a.x)} y={NumCast(a.y)} width={a[WidthSym]()} height={a[HeightSym]()} key={a[Id]} />);
}
}
interface IRegionAnnotationProps {
+ anno: Doc;
x: number;
y: number;
width: number;
@@ -38,6 +40,7 @@ interface IRegionAnnotationProps {
document: Doc;
dataDoc: Doc;
fieldKey: string;
+ showInfo: (anno: Opt<Doc>) => void;
}
@observer
@@ -128,16 +131,17 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
return false;
}
+ @observable _showInfo = false;
render() {
- return (<div className="pdfAnnotation" onPointerDown={this.onPointerDown} ref={this._mainCont}
+ return (<div className="pdfAnnotation" onPointerEnter={action(() => this.props.showInfo(this.props.anno))} onPointerLeave={action(() => this.props.showInfo(undefined))} onPointerDown={this.onPointerDown} ref={this._mainCont}
style={{
top: this.props.y,
left: this.props.x,
width: this.props.width,
height: this.props.height,
- opacity: this._brushed ? 0.5 : undefined,
+ opacity: !this._showInfo && this._brushed ? 0.5 : undefined,
backgroundColor: this._brushed ? "orange" : StrCast(this.props.document.backgroundColor),
- transition: "opacity 0.5s",
- }} />);
+ }} >
+ </div>);
}
} \ No newline at end of file