aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/SettingsManager.tsx4
-rw-r--r--src/client/views/pdf/Annotation.scss9
-rw-r--r--src/client/views/pdf/Annotation.tsx11
-rw-r--r--src/client/views/pdf/PDFViewer.scss11
-rw-r--r--src/client/views/pdf/PDFViewer.tsx19
5 files changed, 34 insertions, 20 deletions
diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx
index 17e93ad17..cd01fea5a 100644
--- a/src/client/util/SettingsManager.tsx
+++ b/src/client/util/SettingsManager.tsx
@@ -4,7 +4,7 @@ import { observer } from "mobx-react";
import * as React from "react";
import { ColorState, SketchPicker } from "react-color";
import { Doc } from "../../fields/Doc";
-import { BoolCast, StrCast } from "../../fields/Types";
+import { BoolCast, StrCast, Cast } from "../../fields/Types";
import { addStyleSheet, addStyleSheetRule, Utils } from "../../Utils";
import { GoogleAuthenticationManager } from "../apis/GoogleAuthenticationManager";
import { DocServer } from "../DocServer";
@@ -205,6 +205,6 @@ export class SettingsManager extends React.Component<{}> {
isDisplayed={this.isOpen}
interactive={true}
closeOnExternalClick={this.close}
- dialogueBoxStyle={{ width: "600px" }} />;
+ dialogueBoxStyle={{ width: "600px", background: Cast(Doc.UserDoc().userColor, "string", null) }} />;
}
} \ No newline at end of file
diff --git a/src/client/views/pdf/Annotation.scss b/src/client/views/pdf/Annotation.scss
index d42a0b478..8b242854d 100644
--- a/src/client/views/pdf/Annotation.scss
+++ b/src/client/views/pdf/Annotation.scss
@@ -4,13 +4,4 @@
position: absolute;
background-color: rgba(146, 245, 95, 0.467);
transition: opacity 0.5s;
- .pdfAnnotation-info {
- top: -17px;
- pointer-events: none;
- width: max-content;
- height: 20px;
- position: relative;
- background: #8080804a;
- border-radius: 5px;
- }
} \ No newline at end of file
diff --git a/src/client/views/pdf/Annotation.tsx b/src/client/views/pdf/Annotation.tsx
index a1b6c0547..b7c7dae38 100644
--- a/src/client/views/pdf/Annotation.tsx
+++ b/src/client/views/pdf/Annotation.tsx
@@ -9,7 +9,6 @@ import { DocumentManager } from "../../util/DocumentManager";
import { PDFMenu } from "./PDFMenu";
import "./Annotation.scss";
import { undoBatch } from "../../util/UndoManager";
-import { useIsFocusVisible } from "@material-ui/core";
interface IAnnotationProps {
anno: Doc;
@@ -18,6 +17,7 @@ interface IAnnotationProps {
focus: (doc: Doc) => void;
dataDoc: Doc;
fieldKey: string;
+ showInfo: (anno: Doc) => void;
}
@observer
@@ -30,6 +30,7 @@ export
}
interface IRegionAnnotationProps {
+ anno: Doc;
x: number;
y: number;
width: number;
@@ -39,6 +40,7 @@ interface IRegionAnnotationProps {
document: Doc;
dataDoc: Doc;
fieldKey: string;
+ showInfo: (anno: Doc) => void;
}
@observer
@@ -131,18 +133,15 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
@observable _showInfo = false;
render() {
- return (<div className="pdfAnnotation" onPointerEnter={action(() => this._showInfo = true)} onPointerLeave={action(() => this._showInfo = false)} 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),
}} >
- {!this._showInfo ? (null) : <div className="pdfAnnotation-info">
- {this.props.anno.author + " " + Field.toString(this.props.anno.creationDate as Field)}
- </div>}
</div>);
}
} \ No newline at end of file
diff --git a/src/client/views/pdf/PDFViewer.scss b/src/client/views/pdf/PDFViewer.scss
index 70b4c417c..8a38c439d 100644
--- a/src/client/views/pdf/PDFViewer.scss
+++ b/src/client/views/pdf/PDFViewer.scss
@@ -63,6 +63,17 @@
.pdfViewerDash-overlay {
pointer-events: none;
}
+
+ .pdfViewerDash-overlayAnno {
+ top: -17px;
+ pointer-events: none;
+ width: max-content;
+ height: 20px;
+ position: absolute;
+ background: #b8b8b8;
+ border-radius: 5px;
+ display: block;
+ }
.pdfViewerDash-annotationLayer {
position: absolute;
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 6784540cd..8da3d2026 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -3,7 +3,7 @@ import { observer } from "mobx-react";
import * as Pdfjs from "pdfjs-dist";
import "pdfjs-dist/web/pdf_viewer.css";
import { Dictionary } from "typescript-collections";
-import { AclAddonly, AclAdmin, AclEdit, DataSym, Doc, DocListCast, HeightSym, Opt, WidthSym } from "../../../fields/Doc";
+import { AclAddonly, AclAdmin, AclEdit, DataSym, Doc, DocListCast, HeightSym, Opt, WidthSym, Field } from "../../../fields/Doc";
import { documentSchema } from "../../../fields/documentSchemas";
import { Id } from "../../../fields/FieldSymbols";
import { InkTool } from "../../../fields/InkField";
@@ -26,7 +26,6 @@ import { undoBatch } from "../../util/UndoManager";
import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
import { CollectionView } from "../collections/CollectionView";
import { ViewBoxAnnotatableComponent } from "../DocComponent";
-import { DocumentDecorations } from "../DocumentDecorations";
import { Annotation } from "./Annotation";
import { PDFMenu } from "./PDFMenu";
import "./PDFViewer.scss";
@@ -35,6 +34,7 @@ import React = require("react");
import { LinkDocPreview } from "../nodes/LinkDocPreview";
import { FormattedTextBoxComment } from "../nodes/formattedText/FormattedTextBoxComment";
import { CurrentUserUtils } from "../../util/CurrentUserUtils";
+import { SharingManager } from "../../util/SharingManager";
const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer");
const pdfjsLib = require("pdfjs-dist");
const _global = (window /* browser */ || global /* node */) as any;
@@ -101,6 +101,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
@observable private _showWaiting = true;
@observable private _showCover = false;
@observable private _zoomed = 1;
+ @observable private _overlayAnnoInfo: Opt<Doc>;
private _pdfViewer: any;
private _styleRule: any; // stylesheet rule for making hyperlinks clickable
@@ -689,10 +690,21 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
TraceMobx();
return <div className="pdfViewerDash-annotationLayer" style={{ height: NumCast(this.Document._nativeHeight), transform: `scale(${this._zoomed})` }} ref={this._annotationLayer}>
{this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map(anno =>
- <Annotation {...this.props} focus={this.props.focus} dataDoc={this.dataDoc} fieldKey={this.props.fieldKey} anno={anno} key={`${anno[Id]}-annotation`} />)
+ <Annotation {...this.props} showInfo={this.showInfo} focus={this.props.focus} dataDoc={this.dataDoc} fieldKey={this.props.fieldKey} anno={anno} key={`${anno[Id]}-annotation`} />)
}
</div>;
}
+
+ @computed get overlayInfo() {
+ return !this._overlayAnnoInfo || this._overlayAnnoInfo.author === Doc.CurrentUserEmail ? (null) :
+ <div className="pdfViewerDash-overlayAnno" style={{ top: NumCast(this._overlayAnnoInfo.y), left: NumCast(this._overlayAnnoInfo.x) }}>
+ <div className="pdfViewerDash-overlayAnno" style={{ right: -50, background: SharingManager.Instance.users.find(users => users.user.email === this._overlayAnnoInfo!.author)?.userColor }}>
+ {this._overlayAnnoInfo.author + " " + Field.toString(this._overlayAnnoInfo.creationDate as Field)}
+ </div>
+ </div>
+ }
+
+ showInfo = action((anno: Doc) => this._overlayAnnoInfo = anno);
overlayTransform = () => this.scrollXf().scale(1 / this._zoomed);
panelWidth = () => (this.Document.scrollHeight || this.Document._nativeHeight || 0);
panelHeight = () => this._pageSizes.length && this._pageSizes[0] ? this._pageSizes[0].width : (this.Document._nativeWidth || 0);
@@ -758,6 +770,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
{this.pdfViewerDiv}
{this.overlayLayer}
{this.annotationLayer}
+ {this.overlayInfo}
{this.standinViews}
<PdfViewerMarquee isMarqueeing={this.marqueeing} width={this.marqueeWidth} height={this.marqueeHeight} x={this.marqueeX} y={this.marqueeY} />
</div >;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-11 12:07:21 +0000