aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/newlightbox/NewLightboxView.tsx
diff options
context:
space:
mode:
authorSophie Zhang <sophie_zhang@brown.edu>2023-09-18 17:40:01 -0400
committerSophie Zhang <sophie_zhang@brown.edu>2023-09-18 17:40:01 -0400
commit013f25f01e729feee5db94900c61f4be4dd46869 (patch)
tree765dd5f2e06d6217ca79438e1098cefc8da627bf /src/client/views/newlightbox/NewLightboxView.tsx
parentf5e765adff1e7b32250eb503c9724a4ac99117f3 (diff)
parent84aa8806a62e2e957e8281d7d492139e3d8225f2 (diff)
Merge branch 'master' into sophie-report-manager
Diffstat (limited to 'src/client/views/newlightbox/NewLightboxView.tsx')
-rw-r--r--src/client/views/newlightbox/NewLightboxView.tsx139
1 files changed, 69 insertions, 70 deletions
diff --git a/src/client/views/newlightbox/NewLightboxView.tsx b/src/client/views/newlightbox/NewLightboxView.tsx
index 3acbd1a32..ca90f6a0f 100644
--- a/src/client/views/newlightbox/NewLightboxView.tsx
+++ b/src/client/views/newlightbox/NewLightboxView.tsx
@@ -2,35 +2,32 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { action, computed, observable } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
-import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnTrue } from '../../../Utils';
-import { Doc, DocListCast, Opt, StrListCast } from '../../../fields/Doc';
+import { Doc, DocListCast, Opt } from '../../../fields/Doc';
import { InkTool } from '../../../fields/InkField';
import { Cast, NumCast, StrCast } from '../../../fields/Types';
+import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnTrue } from '../../../Utils';
import { DocUtils } from '../../documents/Documents';
import { DocumentManager } from '../../util/DocumentManager';
import { LinkManager } from '../../util/LinkManager';
import { SelectionManager } from '../../util/SelectionManager';
import { Transform } from '../../util/Transform';
-import { GestureOverlay } from '../GestureOverlay';
-import { MainView } from '../MainView';
-import { DefaultStyleProvider } from '../StyleProvider';
import { CollectionStackedTimeline } from '../collections/CollectionStackedTimeline';
import { TabDocView } from '../collections/TabDocView';
+import { GestureOverlay } from '../GestureOverlay';
+import { LightboxView } from '../LightboxView';
import { DocumentView, OpenWhere } from '../nodes/DocumentView';
+import { DefaultStyleProvider } from '../StyleProvider';
+import { IRecommendation } from './components';
import { ExploreView } from './ExploreView';
-import { IBounds, emptyBounds } from './ExploreView/utils';
+import { emptyBounds, IBounds } from './ExploreView/utils';
import { NewLightboxHeader } from './Header';
import './NewLightboxView.scss';
import { RecommendationList } from './RecommendationList';
-import { IRecommendation } from './components';
-import { fetchKeywords, fetchRecommendations } from './utils';
-import { List } from '../../../fields/List';
-import { LightboxView } from '../LightboxView';
enum LightboxStatus {
- RECOMMENDATIONS = "recommendations",
- ANNOTATIONS = "annotations",
- NONE = "none"
+ RECOMMENDATIONS = 'recommendations',
+ ANNOTATIONS = 'annotations',
+ NONE = 'none',
}
interface LightboxViewProps {
@@ -63,30 +60,30 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
@observable private static _docView: Opt<DocumentView>;
// keywords
- @observable private static _keywords: string[] = []
+ @observable private static _keywords: string[] = [];
@action public static SetKeywords(kw: string[]) {
- this._keywords = kw
+ this._keywords = kw;
}
@computed public static get Keywords() {
- return this._keywords
+ return this._keywords;
}
// query
- @observable private static _query: string = ''
+ @observable private static _query: string = '';
@action public static SetQuery(query: string) {
- this._query = query
+ this._query = query;
}
@computed public static get Query() {
- return this._query
+ return this._query;
}
// keywords
- @observable private static _recs: IRecommendation[] = []
+ @observable private static _recs: IRecommendation[] = [];
@action public static SetRecs(recs: IRecommendation[]) {
- this._recs = recs
+ this._recs = recs;
}
@computed public static get Recs() {
- return this._recs
+ return this._recs;
}
// bounds
@@ -108,7 +105,7 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
}
// newLightbox sidebar status
- @observable private static _sidebarStatus: Opt<string> = "";
+ @observable private static _sidebarStatus: Opt<string> = '';
@action public static SetSidebarStatus(sidebarStatus: Opt<string>) {
this._sidebarStatus = sidebarStatus;
}
@@ -129,7 +126,7 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
this._docFilters && (this._docFilters.length = 0);
this._future = this._history = [];
Doc.ActiveTool = InkTool.None;
- MainView.Instance._exploreMode = false;
+ DocumentView.ExploreMode = false;
} else {
const l = DocUtils.MakeLinkToActiveAudio(() => doc).lastElement();
l && (Cast(l.link_anchor_2, Doc, null).backgroundColor = 'lightgreen');
@@ -289,35 +286,38 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
@computed
get documentView() {
- if (!LightboxView.LightboxDoc) return null
- else return (<GestureOverlay isActive={true}>
- <DocumentView
- ref={action((r: DocumentView | null) => (NewLightboxView._docView = r !== null ? r : undefined))}
- Document={LightboxView.LightboxDoc}
- DataDoc={undefined}
- PanelWidth={this.newLightboxWidth}
- PanelHeight={this.newLightboxHeight}
- LayoutTemplate={NewLightboxView.LightboxDocTemplate}
- isDocumentActive={returnTrue} // without this being true, sidebar annotations need to be activated before text can be selected.
- isContentActive={returnTrue}
- styleProvider={DefaultStyleProvider}
- ScreenToLocalTransform={this.newLightboxScreenToLocal}
- renderDepth={0}
- rootSelected={returnTrue}
- docViewPath={returnEmptyDoclist}
- childFilters={this.docFilters}
- childFiltersByRanges={returnEmptyFilter}
- searchFilterDocs={returnEmptyDoclist}
- addDocument={undefined}
- removeDocument={undefined}
- whenChildContentsActiveChanged={emptyFunction}
- addDocTab={this.addDocTab}
- pinToPres={TabDocView.PinDoc}
- bringToFront={emptyFunction}
- onBrowseClick={MainView.Instance.exploreMode}
- focus={emptyFunction}
- />
- </GestureOverlay>)
+ if (!LightboxView.LightboxDoc) return null;
+ else
+ return (
+ <GestureOverlay isActive={true}>
+ <DocumentView
+ ref={action((r: DocumentView | null) => (NewLightboxView._docView = r !== null ? r : undefined))}
+ Document={LightboxView.LightboxDoc}
+ DataDoc={undefined}
+ PanelWidth={this.newLightboxWidth}
+ PanelHeight={this.newLightboxHeight}
+ LayoutTemplate={NewLightboxView.LightboxDocTemplate}
+ isDocumentActive={returnTrue} // without this being true, sidebar annotations need to be activated before text can be selected.
+ isContentActive={returnTrue}
+ styleProvider={DefaultStyleProvider}
+ ScreenToLocalTransform={this.newLightboxScreenToLocal}
+ renderDepth={0}
+ rootSelected={returnTrue}
+ docViewPath={returnEmptyDoclist}
+ childFilters={this.docFilters}
+ childFiltersByRanges={returnEmptyFilter}
+ searchFilterDocs={returnEmptyDoclist}
+ addDocument={undefined}
+ removeDocument={undefined}
+ whenChildContentsActiveChanged={emptyFunction}
+ addDocTab={this.addDocTab}
+ pinToPres={TabDocView.PinDoc}
+ bringToFront={emptyFunction}
+ onBrowseClick={DocumentView.exploreMode}
+ focus={emptyFunction}
+ />
+ </GestureOverlay>
+ );
}
future = () => NewLightboxView._future;
@@ -337,29 +337,28 @@ export class NewLightboxView extends React.Component<LightboxViewProps> {
NewLightboxView.SetNewLightboxDoc(undefined);
}
}}>
- <div className={`app-document`} style={{gridTemplateColumns: `calc(100% - 400px) 400px`}}>
- <div
- className="newLightboxView-contents"
- style={{
- top: 20,
- left: 20,
- width: this.newLightboxWidth(),
- height: this.newLightboxHeight() - 40,
- }}>
+ <div className={`app-document`} style={{ gridTemplateColumns: `calc(100% - 400px) 400px` }}>
+ <div
+ className="newLightboxView-contents"
+ style={{
+ top: 20,
+ left: 20,
+ width: this.newLightboxWidth(),
+ height: this.newLightboxHeight() - 40,
+ }}>
<NewLightboxHeader height={newLightboxHeaderHeight} width={this.newLightboxWidth()} />
- {!NewLightboxView._explore ?
- <div className="newLightboxView-doc" style={{height: this.newLightboxHeight()}}>
+ {!NewLightboxView._explore ? (
+ <div className="newLightboxView-doc" style={{ height: this.newLightboxHeight() }}>
{this.documentView}
</div>
- :
+ ) : (
<div className={`explore`}>
- <ExploreView recs={NewLightboxView.Recs} bounds={NewLightboxView.Bounds}/>
+ <ExploreView recs={NewLightboxView.Recs} bounds={NewLightboxView.Bounds} />
</div>
- }
- </div>
- <RecommendationList keywords={NewLightboxView.Keywords}/>
+ )}
+ </div>
+ <RecommendationList keywords={NewLightboxView.Keywords} />
</div>
-
</div>
);
}