mirror of
https://github.com/TriliumNext/Notes.git
synced 2025-08-10 10:22:29 +08:00
feat(client): implement top launcher pane
This commit is contained in:
Elian Doran
parent
8300acd30b
commit
efc84722a9
@ -93,113 +93,117 @@ export default class DesktopLayout {
|
||||
appContext.noteTreeWidget = new NoteTreeWidget();
|
||||
|
||||
const launcherPaneIsHorizontal = true;
|
||||
const launcherPane = new FlexContainer("column")
|
||||
const launcherPane = new FlexContainer(launcherPaneIsHorizontal ? "row" : "column")
|
||||
.id("launcher-pane")
|
||||
.css("width", "53px")
|
||||
.css(launcherPaneIsHorizontal ? "height" : "width", "53px")
|
||||
.child(new GlobalMenuWidget())
|
||||
.child(new LauncherContainer())
|
||||
.child(new LauncherContainer(launcherPaneIsHorizontal))
|
||||
.child(new LeftPaneToggleWidget());
|
||||
|
||||
return new RootContainer()
|
||||
.setParent(appContext)
|
||||
.optChild(!launcherPaneIsHorizontal, launcherPane)
|
||||
.child(new LeftPaneContainer()
|
||||
.child(new QuickSearchWidget())
|
||||
.child(appContext.noteTreeWidget)
|
||||
.child(...this.customWidgets.get('left-pane'))
|
||||
)
|
||||
.child(new FlexContainer('column')
|
||||
.id('rest-pane')
|
||||
.optChild(launcherPaneIsHorizontal, launcherPane)
|
||||
.child(new FlexContainer('row')
|
||||
.css("flex-grow", "1")
|
||||
.child(new FlexContainer('row')
|
||||
.child(new TabRowWidget())
|
||||
.child(new TitleBarButtonsWidget())
|
||||
.css('height', '40px')
|
||||
.optChild(!launcherPaneIsHorizontal, launcherPane)
|
||||
.child(new LeftPaneContainer()
|
||||
.child(new QuickSearchWidget())
|
||||
.child(appContext.noteTreeWidget)
|
||||
.child(...this.customWidgets.get('left-pane'))
|
||||
)
|
||||
.child(new FlexContainer('row')
|
||||
.filling()
|
||||
.collapsible()
|
||||
.child(new FlexContainer('column')
|
||||
.child(new FlexContainer('column')
|
||||
.id('rest-pane')
|
||||
.css("flex-grow", "1")
|
||||
.child(new FlexContainer('row')
|
||||
.child(new TabRowWidget())
|
||||
.child(new TitleBarButtonsWidget())
|
||||
.css('height', '40px')
|
||||
)
|
||||
.child(new FlexContainer('row')
|
||||
.filling()
|
||||
.collapsible()
|
||||
.id('center-pane')
|
||||
.child(new SplitNoteContainer(() =>
|
||||
new NoteWrapperWidget()
|
||||
.child(new FlexContainer('row').class('title-row')
|
||||
.css("height", "50px")
|
||||
.css("min-height", "50px")
|
||||
.css('align-items', "center")
|
||||
.cssBlock('.title-row > * { margin: 5px; }')
|
||||
.child(new NoteIconWidget())
|
||||
.child(new NoteTitleWidget())
|
||||
.child(new SpacerWidget(0, 1))
|
||||
.child(new MovePaneButton(true))
|
||||
.child(new MovePaneButton(false))
|
||||
.child(new ClosePaneButton())
|
||||
.child(new CreatePaneButton())
|
||||
)
|
||||
.child(
|
||||
new RibbonContainer()
|
||||
// the order of the widgets matter. Some of these want to "activate" themselves
|
||||
// when visible. When this happens to multiple of them, the first one "wins".
|
||||
// promoted attributes should always win.
|
||||
.ribbon(new ClassicEditorToolbar())
|
||||
.ribbon(new PromotedAttributesWidget())
|
||||
.ribbon(new ScriptExecutorWidget())
|
||||
.ribbon(new SearchDefinitionWidget())
|
||||
.ribbon(new EditedNotesWidget())
|
||||
.ribbon(new BookPropertiesWidget())
|
||||
.ribbon(new NotePropertiesWidget())
|
||||
.ribbon(new FilePropertiesWidget())
|
||||
.ribbon(new ImagePropertiesWidget())
|
||||
.ribbon(new BasicPropertiesWidget())
|
||||
.ribbon(new OwnedAttributeListWidget())
|
||||
.ribbon(new InheritedAttributesWidget())
|
||||
.ribbon(new NotePathsWidget())
|
||||
.ribbon(new NoteMapRibbonWidget())
|
||||
.ribbon(new SimilarNotesWidget())
|
||||
.ribbon(new NoteInfoWidget())
|
||||
.button(new RevisionsButton())
|
||||
.button(new NoteActionsWidget())
|
||||
)
|
||||
.child(new SharedInfoWidget())
|
||||
.child(new WatchedFileUpdateStatusWidget())
|
||||
.child(new FloatingButtons()
|
||||
.child(new EditButton())
|
||||
.child(new ShowTocWidgetButton())
|
||||
.child(new ShowHighlightsListWidgetButton())
|
||||
.child(new CodeButtonsWidget())
|
||||
.child(new RelationMapButtons())
|
||||
.child(new CopyImageReferenceButton())
|
||||
.child(new SvgExportButton())
|
||||
.child(new BacklinksWidget())
|
||||
.child(new HideFloatingButtonsButton())
|
||||
)
|
||||
.child(new MermaidWidget())
|
||||
.child(
|
||||
new ScrollingContainer()
|
||||
.filling()
|
||||
.child(new SqlTableSchemasWidget())
|
||||
.child(new NoteDetailWidget())
|
||||
.child(new NoteListWidget())
|
||||
.child(new SearchResultWidget())
|
||||
.child(new SqlResultWidget())
|
||||
.child(new ScrollPaddingWidget())
|
||||
)
|
||||
.child(new ApiLogWidget())
|
||||
.child(new FindWidget())
|
||||
.child(
|
||||
...this.customWidgets.get('node-detail-pane'), // typo, let's keep it for a while as BC
|
||||
...this.customWidgets.get('note-detail-pane')
|
||||
)
|
||||
.child(new FlexContainer('column')
|
||||
.filling()
|
||||
.collapsible()
|
||||
.id('center-pane')
|
||||
.child(new SplitNoteContainer(() =>
|
||||
new NoteWrapperWidget()
|
||||
.child(new FlexContainer('row').class('title-row')
|
||||
.css("height", "50px")
|
||||
.css("min-height", "50px")
|
||||
.css('align-items', "center")
|
||||
.cssBlock('.title-row > * { margin: 5px; }')
|
||||
.child(new NoteIconWidget())
|
||||
.child(new NoteTitleWidget())
|
||||
.child(new SpacerWidget(0, 1))
|
||||
.child(new MovePaneButton(true))
|
||||
.child(new MovePaneButton(false))
|
||||
.child(new ClosePaneButton())
|
||||
.child(new CreatePaneButton())
|
||||
)
|
||||
.child(
|
||||
new RibbonContainer()
|
||||
// the order of the widgets matter. Some of these want to "activate" themselves
|
||||
// when visible. When this happens to multiple of them, the first one "wins".
|
||||
// promoted attributes should always win.
|
||||
.ribbon(new ClassicEditorToolbar())
|
||||
.ribbon(new PromotedAttributesWidget())
|
||||
.ribbon(new ScriptExecutorWidget())
|
||||
.ribbon(new SearchDefinitionWidget())
|
||||
.ribbon(new EditedNotesWidget())
|
||||
.ribbon(new BookPropertiesWidget())
|
||||
.ribbon(new NotePropertiesWidget())
|
||||
.ribbon(new FilePropertiesWidget())
|
||||
.ribbon(new ImagePropertiesWidget())
|
||||
.ribbon(new BasicPropertiesWidget())
|
||||
.ribbon(new OwnedAttributeListWidget())
|
||||
.ribbon(new InheritedAttributesWidget())
|
||||
.ribbon(new NotePathsWidget())
|
||||
.ribbon(new NoteMapRibbonWidget())
|
||||
.ribbon(new SimilarNotesWidget())
|
||||
.ribbon(new NoteInfoWidget())
|
||||
.button(new RevisionsButton())
|
||||
.button(new NoteActionsWidget())
|
||||
)
|
||||
.child(new SharedInfoWidget())
|
||||
.child(new WatchedFileUpdateStatusWidget())
|
||||
.child(new FloatingButtons()
|
||||
.child(new EditButton())
|
||||
.child(new ShowTocWidgetButton())
|
||||
.child(new ShowHighlightsListWidgetButton())
|
||||
.child(new CodeButtonsWidget())
|
||||
.child(new RelationMapButtons())
|
||||
.child(new CopyImageReferenceButton())
|
||||
.child(new SvgExportButton())
|
||||
.child(new BacklinksWidget())
|
||||
.child(new HideFloatingButtonsButton())
|
||||
)
|
||||
.child(new MermaidWidget())
|
||||
.child(
|
||||
new ScrollingContainer()
|
||||
.filling()
|
||||
.child(new SqlTableSchemasWidget())
|
||||
.child(new NoteDetailWidget())
|
||||
.child(new NoteListWidget())
|
||||
.child(new SearchResultWidget())
|
||||
.child(new SqlResultWidget())
|
||||
.child(new ScrollPaddingWidget())
|
||||
)
|
||||
.child(new ApiLogWidget())
|
||||
.child(new FindWidget())
|
||||
.child(
|
||||
...this.customWidgets.get('node-detail-pane'), // typo, let's keep it for a while as BC
|
||||
...this.customWidgets.get('note-detail-pane')
|
||||
)
|
||||
)
|
||||
)
|
||||
.child(...this.customWidgets.get('center-pane'))
|
||||
)
|
||||
.child(new RightPaneContainer()
|
||||
.child(new TocWidget())
|
||||
.child(new HighlightsListWidget())
|
||||
.child(...this.customWidgets.get('right-pane'))
|
||||
)
|
||||
.child(...this.customWidgets.get('center-pane'))
|
||||
)
|
||||
.child(new RightPaneContainer()
|
||||
.child(new TocWidget())
|
||||
.child(new HighlightsListWidget())
|
||||
.child(...this.customWidgets.get('right-pane'))
|
||||
)
|
||||
)
|
||||
)
|
||||
|
||||
@ -4,11 +4,11 @@ import appContext from "../../components/app_context.js";
|
||||
import LauncherWidget from "./launcher.js";
|
||||
|
||||
export default class LauncherContainer extends FlexContainer {
|
||||
constructor() {
|
||||
super('column');
|
||||
constructor(horizontal) {
|
||||
super(horizontal ? "row" : "column");
|
||||
|
||||
this.id('launcher-container');
|
||||
this.css('height', '100%');
|
||||
this.css(horizontal ? "width" : 'height', '100%');
|
||||
this.filling();
|
||||
|
||||
this.load();
|
||||
|
||||
@ -2,7 +2,7 @@ import FlexContainer from "./flex_container.js";
|
||||
|
||||
export default class RootContainer extends FlexContainer {
|
||||
constructor() {
|
||||
super('row');
|
||||
super('column');
|
||||
|
||||
this.id('root-widget');
|
||||
this.css('height', '100%');
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user