aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/SidebarAnnos.scss20
-rw-r--r--src/client/views/SidebarAnnos.tsx104
-rw-r--r--src/client/views/nodes/PDFBox.scss21
-rw-r--r--src/client/views/nodes/PDFBox.tsx101
-rw-r--r--src/client/views/nodes/WebBox.scss20
-rw-r--r--src/client/views/nodes/WebBox.tsx80
6 files changed, 163 insertions, 183 deletions
diff --git a/src/client/views/SidebarAnnos.scss b/src/client/views/SidebarAnnos.scss
new file mode 100644
index 000000000..9eea83d59
--- /dev/null
+++ b/src/client/views/SidebarAnnos.scss
@@ -0,0 +1,20 @@
+.sidebarAnnos-tagList {
+ display: flex;
+ flex-direction: row;
+ overflow: auto;
+ flex-flow: row;
+ flex-wrap: wrap;
+ .sidebarAnnos-filterTag, .sidebarAnnos-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;
+ }
+ .sidebarAnnos-filterTag-active {
+ background-color: white;
+ }
+} \ No newline at end of file
diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
new file mode 100644
index 000000000..026942999
--- /dev/null
+++ b/src/client/views/SidebarAnnos.tsx
@@ -0,0 +1,104 @@
+import { computed } from 'mobx';
+import { observer } from "mobx-react";
+import { Doc, DocListCast, StrListCast } from "../../fields/Doc";
+import { List } from '../../fields/List';
+import { NumCast } from '../../fields/Types';
+import { emptyFunction, OmitKeys, returnOne, returnTrue, returnZero } from '../../Utils';
+import { Transform } from '../util/Transform';
+import { CollectionStackingView } from './collections/CollectionStackingView';
+import { CollectionViewType } from './collections/CollectionView';
+import { FieldViewProps } from './nodes/FieldView';
+import { SearchBox } from './search/SearchBox';
+import "./SidebarAnnos.scss";
+import { StyleProp } from './StyleProvider';
+import React = require("react");
+
+interface extraProps {
+ fieldKey: string;
+ layoutDoc: Doc;
+ rootDoc: Doc;
+ dataDoc: Doc;
+ annotationsActive: (outsideReaction: boolean) => boolean;
+ whenActiveChanged: (isActive: boolean) => void;
+ ScreenToLocalTransform: () => Transform;
+ addDocument: (doc: (Doc | Doc[]), suffix: string) => boolean;
+ removeDocument: (doc: (Doc | Doc[]), suffix: string) => boolean;
+ moveDocument: (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean, annotationKey?: string) => boolean;
+}
+@observer
+export class SidebarAnnos extends React.Component<FieldViewProps & extraProps> {
+ @computed get allHashtags() {
+ const keys = new Set<string>();
+ DocListCast(this.props.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();
+ }
+ get filtersKey() { return "_" + this.sidebarKey() + "-docFilters"; }
+
+ makeDocUnfiltered = (doc: Doc) => {
+ if (DocListCast(this.props.rootDoc[this.sidebarKey()]).includes(doc)) {
+ if (this.props.layoutDoc[this.filtersKey]) {
+ this.props.layoutDoc[this.filtersKey] = new List<string>();
+ return true;
+ }
+ }
+ return false;
+ }
+ sidebarKey = () => this.props.fieldKey + "-sidebar";
+ filtersHeight = () => 50;
+ screenToLocalTransform = () => this.props.ScreenToLocalTransform().translate(Doc.NativeWidth(this.props.dataDoc), 0).scale(this.props.scaling?.() || 1);
+ panelWidth = () => !this.props.layoutDoc._showSidebar ? 0 : (NumCast(this.props.layoutDoc.nativeWidth) - Doc.NativeWidth(this.props.dataDoc)) * this.props.PanelWidth() / NumCast(this.props.layoutDoc.nativeWidth);
+ panelHeight = () => this.props.PanelHeight() - this.filtersHeight() - 20;
+ addDocument = (doc: Doc | Doc[]) => this.props.addDocument(doc, this.sidebarKey());
+ moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => this.props.moveDocument(doc, targetCollection, addDocument, this.sidebarKey());
+ removeDocument = (doc: Doc | Doc[]) => this.props.removeDocument(doc, this.sidebarKey());
+ docFilters = () => [...StrListCast(this.props.layoutDoc._docFilters), ...StrListCast(this.props.layoutDoc[this.filtersKey])];
+
+ render() {
+ const renderTag = (tag: string) => {
+ const active = StrListCast(this.props.rootDoc[this.filtersKey]).includes(`${tag}:${tag}:check`);
+ return <div key={tag} className={`sidebarAnnos-filterTag${active ? "-active" : ""}`}
+ onClick={e => Doc.setDocFilter(this.props.rootDoc, tag, tag, "check", true, this.sidebarKey(), e.shiftKey)}>
+ {tag}
+ </div>;
+ }
+ return !this.props.layoutDoc._showSidebar ? (null) :
+ <div style={{
+ position: "absolute", pointerEvents: this.props.active() ? "all" : undefined, top: 0, right: 0,
+ background: this.props.styleProvider?.(this.props.rootDoc, this.props, StyleProp.WidgetColor),
+ width: `${this.panelWidth()}px`,
+ height: "100%"
+ }}>
+ <div style={{ width: "100%", height: this.panelHeight(), position: "relative" }}>
+ <CollectionStackingView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
+ NativeWidth={returnZero}
+ NativeHeight={returnZero}
+ PanelHeight={this.panelHeight}
+ PanelWidth={this.panelWidth}
+ xMargin={0}
+ yMargin={0}
+ docFilters={this.docFilters}
+ chromeStatus={"enabled"}
+ scaleField={this.sidebarKey() + "-scale"}
+ isAnnotationOverlay={false}
+ select={emptyFunction}
+ active={this.props.annotationsActive}
+ scaling={returnOne}
+ whenActiveChanged={this.props.whenActiveChanged}
+ childHideDecorationTitle={returnTrue}
+ removeDocument={this.removeDocument}
+ moveDocument={this.moveDocument}
+ addDocument={this.addDocument}
+ CollectionView={undefined}
+ ScreenToLocalTransform={this.screenToLocalTransform}
+ renderDepth={this.props.renderDepth + 1}
+ viewType={CollectionViewType.Stacking}
+ fieldKey={this.sidebarKey()}
+ pointerEvents={"all"}
+ />
+ </div>
+ <div className="sidebarAnnos-tagList" style={{ height: this.filtersHeight(), width: this.panelWidth() }}>
+ {this.allHashtags.map(renderTag)}
+ </div>
+ </div>;
+ }
+} \ No newline at end of file
diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss
index 564873cf5..d1dca5c68 100644
--- a/src/client/views/nodes/PDFBox.scss
+++ b/src/client/views/nodes/PDFBox.scss
@@ -189,26 +189,7 @@
}
}
- .pdfBox-tagList {
- display: flex;
- flex-direction: row;
- overflow: auto;
- flex-flow: row;
- flex-wrap: wrap;
- .pdfBox-filterTag, .pdfBox-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;
- }
- .pdfBox-filterTag-active {
- background-color: white;
- }
- }
+
.pdfBox-title-outer {
width: 100%;
height: 100%;
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 37341253d..81ef2472a 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -6,30 +6,27 @@ import "pdfjs-dist/web/pdf_viewer.css";
import { Doc, DocListCast, Opt, StrListCast, WidthSym } from "../../../fields/Doc";
import { documentSchema } from '../../../fields/documentSchemas';
import { Id } from '../../../fields/FieldSymbols';
+import { List } from '../../../fields/List';
import { makeInterface } from "../../../fields/Schema";
import { Cast, NumCast, StrCast } from '../../../fields/Types';
import { PdfField } from "../../../fields/URLField";
import { TraceMobx } from '../../../fields/util';
-import { emptyFunction, OmitKeys, returnOne, returnTrue, returnZero, Utils } from '../../../Utils';
+import { Utils } from '../../../Utils';
import { Docs, DocUtils } from '../../documents/Documents';
import { KeyCodes } from '../../util/KeyCodes';
import { undoBatch } from '../../util/UndoManager';
import { panZoomSchema } from '../collections/collectionFreeForm/CollectionFreeFormView';
-import { CollectionStackingView } from '../collections/CollectionStackingView';
import { CollectionViewType } from '../collections/CollectionView';
import { ContextMenu } from '../ContextMenu';
import { ContextMenuProps } from '../ContextMenuItem';
import { ViewBoxAnnotatableComponent } from "../DocComponent";
import { PDFViewer } from "../pdf/PDFViewer";
-import { SearchBox } from '../search/SearchBox';
-import { StyleProp } from '../StyleProvider';
+import { SidebarAnnos } from '../SidebarAnnos';
import { FieldView, FieldViewProps } from './FieldView';
import { FormattedTextBox } from './formattedText/FormattedTextBox';
import { pageSchema } from "./ImageBox";
import "./PDFBox.scss";
import React = require("react");
-import { DocFocusOptions } from './DocumentView';
-import { List } from '../../../fields/List';
type PdfDocument = makeInterface<[typeof documentSchema, typeof panZoomSchema, typeof pageSchema]>;
const PdfDocument = makeInterface(documentSchema, panZoomSchema, pageSchema);
@@ -43,6 +40,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
private _pdfViewer: PDFViewer | undefined;
private _searchRef = React.createRef<HTMLInputElement>();
private _selectReactionDisposer: IReactionDisposer | undefined;
+ private _sidebarRef = React.createRef<SidebarAnnos>();
@observable private _searching: boolean = false;
@observable private _pdf: Opt<Pdfjs.PDFDocumentProxy>;
@@ -97,12 +95,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
}
scrollFocus = (doc: Doc, smooth: boolean) => {
- if (DocListCast(this.rootDoc[this.sidebarKey()]).includes(doc)) {
- if (this.layoutDoc["_" + this.sidebarKey() + "-docFilters"]) {
- this.layoutDoc["_" + this.sidebarKey() + "-docFilters"] = new List<string>();
- return 1;
- }
- }
+ if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
this._initialScrollTarget = doc;
return this._pdfViewer?.scrollFocus(doc, smooth);
}
@@ -125,69 +118,6 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
!this.Document._fitWidth && (this.Document._height = this.Document[WidthSym]() * (nh / nw));
}
- 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 sidebarAllTags() {
- 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();
- }
- @computed get sidebarOverlay() {
- const renderTag = (tag: string) => {
- const active = StrListCast(this.rootDoc[this.sidebarKey() + "-docFilters"]).includes(`${tag}:${tag}:check`);
- return <div key={tag} className={`pdfbox-filterTag${active ? "-active" : ""}`}
- onClick={e => Doc.setDocFilter(this.rootDoc, tag, tag, "check", true, this.sidebarKey(), e.shiftKey)}>
- {tag}
- </div>;
- }
- 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="pdfBox-tagList" style={{ height: this.sidebarFiltersHeight(), width: this.sidebarWidth() }}>
- {this.sidebarAllTags.map(renderTag)}
- </div>
- </div>;
- }
-
public search = (string: string, fwd: boolean) => { this._pdfViewer?.search(string, fwd); };
public prevAnnotation = () => { this._pdfViewer?.prevAnnotation(); };
public nextAnnotation = () => { this._pdfViewer?.nextAnnotation(); };
@@ -281,6 +211,8 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
</button>
</div>);
}
+ sidebarWidth = () => !this.layoutDoc._showSidebar ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
+
specificContextMenu = (e: React.MouseEvent): void => {
const pdfUrl = Cast(this.dataDoc[this.props.fieldKey], PdfField);
@@ -294,7 +226,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
}
anchorMenuClick = (anchor: Doc) => {
- this.Document._showSidebar = true;
+ this.props.Document._showSidebar = true;
const startup = StrListCast(this.rootDoc.docFilters).map(filter => filter.split(":")[0]).join(" ");
const target = Docs.Create.TextDocument(startup, {
title: "anno",
@@ -303,9 +235,9 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
});
FormattedTextBox.SelectOnLoad = target[Id];
FormattedTextBox.DontSelectInitialText = true;
- this.sidebarAllTags.map(tag => target[tag] = tag);
+ //this.sidebarAllTags.map(tag => target[tag] = tag);
DocUtils.MakeLink({ doc: anchor }, { doc: target }, "inline markup", "annotation");
- this.sidebarAddDocument(target);
+ this._sidebarRef.current?.addDocument(target);
}
@computed get renderTitleBox() {
@@ -316,6 +248,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
</div>
</div>;
}
+
@computed get renderPdfView() {
TraceMobx();
const pdfUrl = Cast(this.dataDoc[this.props.fieldKey], PdfField);
@@ -335,7 +268,17 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps, PdfDocum
ContentScaling={this.props.scaling}
sidebarWidth={this.sidebarWidth}
/>
- {this.sidebarOverlay}
+ <SidebarAnnos ref={this._sidebarRef}
+ {...this.props}
+ annotationsActive={this.annotationsActive}
+ rootDoc={this.rootDoc}
+ layoutDoc={this.layoutDoc}
+ dataDoc={this.dataDoc}
+ addDocument={this.addDocument}
+ moveDocument={this.moveDocument}
+ removeDocument={this.removeDocument}
+ active={this.active}
+ />
{this.settingsPanel()}
</div>;
}
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index cdff4aa74..ca82c049c 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -18,26 +18,6 @@
border-radius: 3px;
pointer-events: all;
}
- .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;
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index df50f7b90..2a0fc47b4 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -36,6 +36,7 @@ import { FormattedTextBox } from "./formattedText/FormattedTextBox";
import { LinkDocPreview } from "./LinkDocPreview";
import "./WebBox.scss";
import React = require("react");
+import { SidebarAnnos } from "../SidebarAnnos";
const htmlToText = require("html-to-text");
type WebDocument = makeInterface<[typeof documentSchema]>;
@@ -51,6 +52,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
private _annotationLayer: React.RefObject<HTMLDivElement> = React.createRef();
private _keyInput = React.createRef<HTMLInputElement>();
private _initialScroll: Opt<number>;
+ private _sidebarRef = React.createRef<SidebarAnnos>();
@observable private _scrollTimer: any;
@observable private _overlayAnnoInfo: Opt<Doc>;
@observable private _marqueeing: number[] | undefined;
@@ -159,6 +161,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
menuControls = () => this.urlEditor; // controls to be added to the top bar when a document of this type is selected
scrollFocus = (doc: Doc, smooth: boolean) => {
+ if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
if (doc !== this.rootDoc && this._outerRef.current) {
const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), this.props.PanelHeight() / (this.props.scaling?.() || 1));
if (scrollTo !== undefined) {
@@ -431,9 +434,9 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
});
FormattedTextBox.SelectOnLoad = target[Id];
FormattedTextBox.DontSelectInitialText = true;
- this.sidebarAllTags.map(tag => target[tag] = tag);
+ //this.sidebarAllTags.map(tag => target[tag] = tag);
DocUtils.MakeLink({ doc: anchor }, { doc: target }, "inline markup", "annotation");
- this.sidebarAddDocument(target);
+ this._sidebarRef.current?.addDocument(target);
}
toggleSidebar = () => {
if (this.layoutDoc.nativeWidth === this.layoutDoc[this.fieldKey + "-nativeWidth"]) {
@@ -443,68 +446,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
}
this.layoutDoc._width = NumCast(this.layoutDoc._nativeWidth) * (NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]) / NumCast(this.layoutDoc[this.fieldKey + "-nativeHeight"]));
}
- 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 sidebarAllTags() {
- 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();
- }
- @computed get sidebarOverlay() {
- const 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(), e.shiftKey)}>
- {tag}
- </div>;
- }
- 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.sidebarAllTags.map(renderTag)}
- </div>
- </div>;
- }
@computed get content() {
return <div className={"webBox-cont" + (this.active() && CurrentUserUtils.SelectedTool === InkTool.None && !DocumentDecorations.Instance?.Interacting ? "-interactive" : "")}
@@ -592,7 +534,17 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
onPointerDown={e => e.stopPropagation()} onClick={e => this.toggleSidebar()} >
<FontAwesomeIcon style={{ color: "white" }} icon={"chevron-left"} size="sm" />
</button>
- {this.sidebarOverlay}
+ <SidebarAnnos ref={this._sidebarRef}
+ {...this.props}
+ annotationsActive={this.annotationsActive}
+ rootDoc={this.rootDoc}
+ layoutDoc={this.layoutDoc}
+ dataDoc={this.dataDoc}
+ addDocument={this.addDocument}
+ moveDocument={this.moveDocument}
+ removeDocument={this.removeDocument}
+ active={this.active}
+ />
</div>);
}
} \ No newline at end of file
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 01:18:10 +0000