diff options
Diffstat (limited to 'src/client/views/MainView.tsx')
| -rw-r--r-- | src/client/views/MainView.tsx | 118 |
1 files changed, 115 insertions, 3 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index ca5154ef7..03f624038 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -60,6 +60,7 @@ import { OverlayView } from './OverlayView'; import PDFMenu from './pdf/PDFMenu'; import { PreviewCursor } from './PreviewCursor'; import { undoBatch } from '../util/UndoManager'; +import { SearchBox } from './search/SearchBox'; @observer export class MainView extends React.Component { @@ -79,6 +80,9 @@ export class MainView extends React.Component { @computed private get userDoc() { return Doc.UserDoc(); } @computed private get mainContainer() { return this.userDoc ? FieldValue(Cast(this.userDoc.activeWorkspace, Doc)) : CurrentUserUtils.GuestWorkspace; } @computed public get mainFreeform(): Opt<Doc> { return (docs => (docs && docs.length > 1) ? docs[1] : undefined)(DocListCast(this.mainContainer!.data)); } + @computed public get sidebarButtonsDoc() { return Cast(this.userDoc["tabs-buttons"], Doc) as Doc; } + @computed public get searchDoc() { return Cast(this.userDoc["search-panel"], Doc) as Doc; } + @observable public sidebarContent: any = this.userDoc?.["sidebar"]; @observable public panelContent: string = "none"; @@ -184,10 +188,24 @@ export class MainView extends React.Component { const targets = document.elementsFromPoint(e.x, e.y); if (targets && targets.length && targets[0].className.toString().indexOf("contextMenu") === -1) { ContextMenu.Instance.closeMenu(); + //SearchBox.Instance.closeSearch(); } if (targets && (targets.length && targets[0].className.toString() !== "timeline-menu-desc" && targets[0].className.toString() !== "timeline-menu-item" && targets[0].className.toString() !== "timeline-menu-input")) { TimelineMenu.Instance.closeMenu(); } + if (targets && targets.length && SearchBox.Instance._searchbarOpen) { + let check = false; + targets.forEach((thing) => { + if (thing.className.toString() === "collectionSchemaView-table" || thing.className.toString() === "beta" || thing.className.toString() === "collectionSchemaView-menuOptions-wrapper") { + check = true; + } + }); + if (check === false) { + SearchBox.Instance.closeSearch(); + } + } + + }); globalPointerUp = () => this.isPointerDown = false; @@ -337,6 +355,39 @@ export class MainView extends React.Component { } } } + + // @computed get search() { + // return <DocumentView Document={this.searchDoc!} + // DataDoc={undefined} + // LibraryPath={emptyPath} + // addDocument={undefined} + // addDocTab={this.addDocTabFunc} + // pinToPres={emptyFunction} + // rootSelected={returnTrue} + // onClick={undefined} + // backgroundColor={this.defaultBackgroundColors} + // removeDocument={undefined} + // ScreenToLocalTransform={Transform.Identity} + // ContentScaling={returnOne} + // NativeHeight={returnZero} + // NativeWidth={returnZero} + // PanelWidth={this.getPWidth} + // PanelHeight={this.getPHeight} + // renderDepth={0} + // focus={emptyFunction} + // parentActive={returnTrue} + // whenActiveChanged={emptyFunction} + // bringToFront={emptyFunction} + // docFilters={returnEmptyFilter} + // ContainingCollectionView={undefined} + // ContainingCollectionDoc={undefined} + // />; + // } + + + + + @computed get mainDocView() { return <DocumentView Document={this.mainContainer!} @@ -365,6 +416,7 @@ export class MainView extends React.Component { renderDepth={-1} />; } + @computed get dockingContent() { TraceMobx(); const mainContainer = this.mainContainer; @@ -591,6 +643,42 @@ export class MainView extends React.Component { //const n = (RichTextMenu.Instance?.Pinned ? 1 : 0) + (CollectionMenu.Instance?.Pinned ? 1 : 0); const n = (CollectionMenu.Instance?.Pinned ? 1 : 0); const height = `calc(100% - ${n * Number(ANTIMODEMENU_HEIGHT.replace("px", ""))}px)`; + // return !this.userDoc || !(sidebar instanceof Doc) ? (null) : ( + // <div> + // <div style={{ height: "32px", width: "100%", backgroundColor: "black" }}> + // {this.search} + // </div> + // <div className="mainView-mainContent" style={{ + // color: this.darkScheme ? "rgb(205,205,205)" : "black", + // //change to times 2 for both pinned + // height, + // width: (FormatShapePane.Instance?.Pinned) ? `calc(100% - 200px)` : "100%" + // }} > + // <div style={{ display: "contents", flexDirection: "row", position: "relative" }}> + // <div className="mainView-flyoutContainer" onPointerLeave={this.pointerLeaveDragger} style={{ width: this.flyoutWidth }}> + // <div className="mainView-libraryHandle" onPointerDown={this.onPointerDown} + // style={{ backgroundColor: this.defaultBackgroundColors(sidebar) }}> + // <span title="library View Dragger" style={{ + // width: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "100%" : "3vw", + // //height: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "100%" : "100vh", + // position: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "absolute" : "fixed", + // top: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "" : "0" + // }} /> + // </div> + // <div className="mainView-libraryFlyout" style={{ + // //transformOrigin: this._flyoutTranslate ? "" : "left center", + // transition: this._flyoutTranslate ? "" : "width .5s", + // //transform: `scale(${this._flyoutTranslate ? 1 : 0.8})`, + // boxShadow: this._flyoutTranslate ? "" : "rgb(156, 147, 150) 0.2vw 0.2vw 0.8vw" + // }}> + // {this.flyout} + // {this.expandButton} + // </div> + // </div> + // {this.dockingContent} + // </div> + // </div> + // </div>); const pinned = FormatShapePane.Instance?.Pinned; const innerContent = this.mainInnerContent; return !this.userDoc ? (null) : ( @@ -712,8 +800,32 @@ export class MainView extends React.Component { @computed get search() { return <div className="mainView-searchPanel"> - <div style={{ float: "left", marginLeft: "10px" }}>{Doc.CurrentUserEmail}</div> - <div>SEARCH GOES HERE</div> + {/* <div style={{ float: "left", marginLeft: "10px" }}>{Doc.CurrentUserEmail}</div> */} + <div><DocumentView Document={this.searchDoc!} + DataDoc={undefined} + LibraryPath={emptyPath} + addDocument={undefined} + addDocTab={this.addDocTabFunc} + pinToPres={emptyFunction} + rootSelected={returnTrue} + onClick={undefined} + backgroundColor={this.defaultBackgroundColors} + removeDocument={undefined} + ScreenToLocalTransform={Transform.Identity} + ContentScaling={returnOne} + NativeHeight={returnZero} + NativeWidth={returnZero} + PanelWidth={this.getPWidth} + PanelHeight={this.getPHeight} + renderDepth={0} + focus={emptyFunction} + parentActive={returnTrue} + whenActiveChanged={emptyFunction} + bringToFront={emptyFunction} + docFilters={returnEmptyFilter} + ContainingCollectionView={undefined} + ContainingCollectionDoc={undefined} + /></div> </div>; } @@ -728,7 +840,7 @@ export class MainView extends React.Component { <GoogleAuthenticationManager /> <HypothesisAuthenticationManager /> <DocumentDecorations /> - {/* {this.search} */} + {this.search} <CollectionMenu /> <FormatShapePane /> <div style={{ display: "none" }}><RichTextMenu key="rich" /></div> |