diff options
| author | usodhi <61431818+usodhi@users.noreply.github.com> | 2020-09-30 14:07:31 +0530 |
|---|---|---|
| committer | usodhi <61431818+usodhi@users.noreply.github.com> | 2020-09-30 14:07:31 +0530 |
| commit | 5befdda055c9f22b8c8f12184d8db6424d130669 (patch) | |
| tree | f324cb85090d4ad6eac4a6bc0e1efff4e37a5371 /src/client/views/pdf/Annotation.tsx | |
| parent | 04a2b4ff8ef0a1c77391f017693e19da03896c7b (diff) | |
| parent | cb18f848b44705a25f786f9a0e678095101f9e01 (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.tsx | 16 |
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 |
