From ff229819aa111c828a9134c5db12cc74ae410bce Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 11 Sep 2020 20:15:05 -0400 Subject: added lightbox button to topbar. fixed treeview editableTitle crash --- src/client/views/collections/CollectionMenu.tsx | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) (limited to 'src/client/views/collections/CollectionMenu.tsx') diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index f3ed89c78..5c0a3777f 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -240,11 +240,6 @@ export class CollectionViewBaseChrome extends React.Component this._currentKey = e.target.selectedOptions[0].value); } - @action - toggleViewSpecs = (e: React.SyntheticEvent) => { - this.document._facetWidth = this.document._facetWidth ? 0 : 200; - e.stopPropagation(); - } @action closeViewSpecs = () => { this.document._facetWidth = 0; @@ -441,6 +436,15 @@ export class CollectionViewBaseChrome extends React.Component; } + @computed get lightboxButton() { + const targetDoc = this.selectedDoc; + return !targetDoc ? (null) : {"Show Lightbox of Images"}} placement="top"> + + ; + } + @computed get pinWithViewButton() { const targetDoc = this.selectedDoc; @@ -477,14 +481,7 @@ export class CollectionViewBaseChrome extends React.Component {this.notACollection || this.props.type === CollectionViewType.Invalid ? (null) : this.viewModes} {!this._buttonizableCommands ? (null) : this.templateChrome} - {Doc.UserDoc().noviceMode ? (null) : - filter documents to show} placement="bottom"> -
- -
-
} + {this.props.docView.props.ContainingCollectionDoc?._viewType !== CollectionViewType.Freeform ? (null) : Toggle Overlay Layer} placement="bottom"> @@ -494,6 +491,7 @@ export class CollectionViewBaseChrome extends React.Component } + {this.notACollection ? (null) : this.lightboxButton} {this.aliasButton} {this.pinButton} {this.pinWithViewButton} -- cgit v1.2.3-70-g09d2 From 5b4a692b0c87a58e17c0ae799f935e22a326b856 Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 11 Sep 2020 23:42:55 -0400 Subject: moved minimap button to bottom-right of tab panes --- src/client/views/collections/CollectionMenu.tsx | 12 --- src/client/views/collections/TabDocView.scss | 18 +++++ src/client/views/collections/TabDocView.tsx | 100 ++++++++++++------------ 3 files changed, 70 insertions(+), 60 deletions(-) (limited to 'src/client/views/collections/CollectionMenu.tsx') diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index 5c0a3777f..a58edc604 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -561,11 +561,6 @@ export class CollectionFreeFormViewChrome extends React.Component { - this.document.hideMinimap = !this.document.hideMinimap; - } private _palette = ["#D0021B", "#F5A623", "#F8E71C", "#8B572A", "#7ED321", "#417505", "#9013FE", "#4A90E2", "#50E3C2", "#B8E986", "#000000", "#4A4A4A", "#9B9B9B", "#FFFFFF", ""]; private _width = ["1", "5", "10", "100"]; @@ -849,13 +844,6 @@ export class CollectionFreeFormViewChrome extends React.Component - {this.props.docView.props.renderDepth !== 0 || this.isText || this.props.isDoc ? (null) : - Toggle Mini Map} placement="bottom"> -
- -
-
- } {!this.isText && !this.props.isDoc ? Back Frame} placement="bottom">
diff --git a/src/client/views/collections/TabDocView.scss b/src/client/views/collections/TabDocView.scss index fdb801e03..b808f3ae4 100644 --- a/src/client/views/collections/TabDocView.scss +++ b/src/client/views/collections/TabDocView.scss @@ -1,6 +1,7 @@ input.lm_title:focus { max-width: max-content !important; } +.miniMap-hidden, .miniMap { position: absolute; overflow: hidden; @@ -8,6 +9,9 @@ input.lm_title:focus { bottom: 10; border: solid 1px; box-shadow: black 0.4vw 0.4vw 0.8vw; + width: 100%; + height: 100%; + transition: all 0.5s; .miniOverlay { width: 100%; @@ -19,4 +23,18 @@ input.lm_title:focus { position: absolute; } } +} +.miniMap-hidden { + position: absolute; + bottom: 0; + right: 0; + width: 40px; + height: 40px; + background: transparent; + transform: translate(20px, 20px) rotate(45deg); + border-radius: 30px; + > svg { + margin-top: 3px; + transform: translate(0px, 7px); + } } \ No newline at end of file diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx index aa1852250..f4fda67cd 100644 --- a/src/client/views/collections/TabDocView.tsx +++ b/src/client/views/collections/TabDocView.tsx @@ -27,6 +27,7 @@ import { CollectionDockingViewMenu } from './CollectionDockingViewMenu'; import { CollectionFreeFormView } from './collectionFreeForm/CollectionFreeFormView'; import { CollectionViewType } from './CollectionView'; import React = require("react"); +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; const _global = (window /* browser */ || global /* node */) as any; interface TabDocViewProps { @@ -282,54 +283,57 @@ export class TabDocView extends React.Component { } renderMiniMap() { - return
- -
-
+ return <> + {this._document?.hideMinimap ? (null) : +
+ +
+
+
+
} +
e.stopPropagation()} onClick={action(e => { e.stopPropagation(); this._document!.hideMinimap = !this._document!.hideMinimap; })} > +
-
; + ; } focusFunc = (doc: Doc, willZoom: boolean, scale?: number, afterFocus?: () => void) => afterFocus?.(); setView = action((view: DocumentView) => this._view = view); @@ -363,7 +367,7 @@ export class TabDocView extends React.Component { searchFilterDocs={CollectionDockingView.Instance.searchFilterDocs} ContainingCollectionView={undefined} ContainingCollectionDoc={undefined} /> - {this._document._viewType === CollectionViewType.Freeform && !this._document?.hideMinimap ? this.renderMiniMap() : (null)} + {this._document!._viewType !== CollectionViewType.Freeform ? (null) : this.renderMiniMap()} ; } -- cgit v1.2.3-70-g09d2