From e1b67e20ec66b0d295fe567d21baeb68ad23c72a Mon Sep 17 00:00:00 2001 From: dymani Date: Tue, 30 May 2023 02:24:56 +0800 Subject: [PATCH] Add buttons to move split panes --- src/public/app/layouts/desktop_layout.js | 3 + .../app/widgets/buttons/move_pane_button.js | 55 +++++++++++++++++++ .../containers/split_note_container.js | 38 +++++++++++++ 3 files changed, 96 insertions(+) create mode 100644 src/public/app/widgets/buttons/move_pane_button.js diff --git a/src/public/app/layouts/desktop_layout.js b/src/public/app/layouts/desktop_layout.js index 17dcc99a7..62e6b3ed1 100644 --- a/src/public/app/layouts/desktop_layout.js +++ b/src/public/app/layouts/desktop_layout.js @@ -75,6 +75,7 @@ import CodeButtonsWidget from "../widgets/floating_buttons/code_buttons.js"; import ApiLogWidget from "../widgets/api_log.js"; import HideFloatingButtonsButton from "../widgets/floating_buttons/hide_floating_buttons_button.js"; import ScriptExecutorWidget from "../widgets/ribbon_widgets/script_executor.js"; +import MovePaneButton from "../widgets/buttons/move_pane_button.js"; export default class DesktopLayout { constructor(customWidgets) { @@ -123,6 +124,8 @@ export default class DesktopLayout { .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()) ) diff --git a/src/public/app/widgets/buttons/move_pane_button.js b/src/public/app/widgets/buttons/move_pane_button.js new file mode 100644 index 000000000..9ea4dbe61 --- /dev/null +++ b/src/public/app/widgets/buttons/move_pane_button.js @@ -0,0 +1,55 @@ +import OnClickButtonWidget from "./onclick_button.js"; +import appContext from "../../components/app_context.js"; + +export default class MovePaneButton extends OnClickButtonWidget { + isEnabled() { + if (!super.isEnabled()) + return false; + + if (this.isMovingLeft) { + // movable if the current context is not a main context, i.e. non-null mainNtxId + return !!this.noteContext?.mainNtxId; + } else { + const currentIndex = appContext.tabManager.noteContexts.findIndex(c => c.ntxId === this.ntxId); + const nextContext = appContext.tabManager.noteContexts[currentIndex + 1]; + // movable if the next context is not null and not a main context, i.e. non-null mainNtxId + return !!nextContext?.mainNtxId; + } + } + + initialRenderCompleteEvent() { + this.refresh(); + super.initialRenderCompleteEvent(); + } + + async noteContextRemovedEvent({ntxIds}) { + this.refresh(); + } + + async newNoteContextCreatedEvent({noteContext}) { + this.refresh(); + } + + async noteContextSwitchEvent() { + this.refresh(); + } + + async noteContextReorderEvent({ntxIdsInOrder}) { + this.refresh(); + } + + constructor(isMovingLeft) { + super(); + + this.isMovingLeft = isMovingLeft; + + this.icon(isMovingLeft ? "bx-chevron-left" : "bx-chevron-right") + .title(isMovingLeft ? "Move left" : "Move right") + .titlePlacement("bottom") + .onClick(async (widget, e) => { + e.stopPropagation(); + widget.triggerCommand("moveThisNoteSplit", {ntxId: widget.getClosestNtxId(), isMovingLeft: this.isMovingLeft}); + }) + .class("icon-action"); + } +} diff --git a/src/public/app/widgets/containers/split_note_container.js b/src/public/app/widgets/containers/split_note_container.js index 66356164d..854ccfd23 100644 --- a/src/public/app/widgets/containers/split_note_container.js +++ b/src/public/app/widgets/containers/split_note_container.js @@ -1,5 +1,6 @@ import FlexContainer from "./flex_container.js"; import appContext from "../../components/app_context.js"; +import NoteContext from "../../components/note_context.js"; export default class SplitNoteContainer extends FlexContainer { constructor(widgetFactory) { @@ -74,6 +75,43 @@ export default class SplitNoteContainer extends FlexContainer { appContext.tabManager.removeNoteContext(ntxId); } + async moveThisNoteSplitCommand({ntxId, isMovingLeft}) { + if (!ntxId) { + logError("empty ntxId!"); + return; + } + + const contexts = appContext.tabManager.noteContexts; + + const currentIndex = contexts.findIndex(c => c.ntxId === ntxId); + const otherIndex = currentIndex + (isMovingLeft ? -1 : 1); + + if (currentIndex === -1 || otherIndex < 0 || otherIndex >= contexts.length) { + logError("invalid context!"); + return; + } + + if (contexts[currentIndex].isEmpty() && contexts[otherIndex].isEmpty()) + // no op + return; + + const currentId = contexts[currentIndex].ntxId; + const currentPath = contexts[currentIndex].notePath; + + const otherId = contexts[otherIndex].ntxId; + const otherPath = contexts[otherIndex].notePath; + + if (!!currentPath) + await appContext.tabManager.switchToNoteContext(otherId, currentPath); + if (!!otherPath) + await appContext.tabManager.switchToNoteContext(currentId, otherPath); + + // activate context that now contains the original note + await appContext.tabManager.activateNoteContext(otherId); + + this.triggerEvent('noteContextSwitch'); + } + activeContextChangedEvent() { this.refresh(); }