diff --git a/app/components/commander/action_modes.hbs b/app/components/commander/action_modes.hbs
index 72e1277cea25a4e1820ec08eaa33ba4cbc33e66c..fccb80dd96be29f1942e6b4de0a7c27cc0829c0e 100644
--- a/app/components/commander/action_modes.hbs
+++ b/app/components/commander/action_modes.hbs
@@ -11,14 +11,18 @@
@onDuplicatePanel={{@onDuplicatePanel}} />
<div class="panel-mode">
- <button type="button" class="btn btn-light mx-1"
- {{on "click" (fn @onPanelToggle @hint) }}>
- {{#if @dualPanelMode}}
- <i class="bi-x"></i>
- {{else}}
+ {{#if @dualPanelMode}}
+ <button type="button" class="btn btn-light mx-1"
+ {{tooltip title='Close panel' placement='bottom'}}
+ {{on "click" (fn @onPanelToggle @hint) }}>
+ <i class="bi-x"></i>
+ </button>
+ {{else}}
+ <button type="button" class="btn btn-light mx-1"
+ {{tooltip title='Split panel' placement='bottom'}}
+ {{on "click" (fn @onPanelToggle @hint) }}>
<i class="bi-layout-split"></i>
- {{/if}}
- </button>
+ </button>
+ {{/if}}
</div>
-
</div>
diff --git a/app/components/commander/empty_folder.hbs b/app/components/commander/empty_folder.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..0e626eaf44bccd9e1c197d9503148fe2a017dfe6
--- /dev/null
+++ b/app/components/commander/empty_folder.hbs
@@ -0,0 +1,6 @@
+<div class='empty_folder text-muted'>
+ <div class="d-flex flex-column align-items-center">
+ <h1><i class="bi bi-folder"></i></h1>
+ <div>Folder is Empty</div>
+ </div>
+</div>
diff --git a/app/components/commander/index.hbs b/app/components/commander/index.hbs
index 5466867d533c031bcebe7db1ee60addcb310aebb..4cd64dacc840b92e8c021ac4d6943e4b306db2b7 100644
--- a/app/components/commander/index.hbs
+++ b/app/components/commander/index.hbs
@@ -74,28 +74,32 @@
@onNodeClicked={{this.onNodeClicked}}
@hint={{@hint}} />
- <div class="view-mode-{{this.view_mode}}">
-
- {{#each this.children as |node|}}
- {{#let (component node.nodeType) as |NodeType|}}
- {{! NodeType is either <Folder /> or <Document />}}
- <NodeType
- @model={{node}}
- @selectedNodes={{this.selected_nodes}}
- @onCheckboxChange={{this.onCheckboxChange}}
- @onDragendSuccess={{this.onDragendSuccess}}
- @onDragendCancel={{this.onDragendCancel}}>
- <DualLinkTo
- @node={{node}}
- @extranode={{@extranode}}
- @extradoc={{@extradoc}}
- @hint={{@hint}}
- {{on "click" this.onNodeClicked}} />
- </NodeType>
- {{/let}}
- {{/each}}
-
- </div>
+ {{#if this.is_empty_folder }}
+ <div class="view-mode-list">
+ <Commander::EmptyFolder />
+ </div>
+ {{else}}
+ <div class="view-mode-{{this.view_mode}}">
+ {{#each this.children as |node|}}
+ {{#let (component node.nodeType) as |NodeType|}}
+ {{! NodeType is either <Folder /> or <Document />}}
+ <NodeType
+ @model={{node}}
+ @selectedNodes={{this.selected_nodes}}
+ @onCheckboxChange={{this.onCheckboxChange}}
+ @onDragendSuccess={{this.onDragendSuccess}}
+ @onDragendCancel={{this.onDragendCancel}}>
+ <DualLinkTo
+ @node={{node}}
+ @extranode={{@extranode}}
+ @extradoc={{@extradoc}}
+ @hint={{@hint}}
+ {{on "click" this.onNodeClicked}} />
+ </NodeType>
+ {{/let}}
+ {{/each}}
+ </div>
+ {{/if}}
<!--
{{#if @pagination }}
diff --git a/app/components/commander/index.js b/app/components/commander/index.js
index 426176741e5310cd37c10d7424c41cba7ed64afb..40b05e4435b9933fc2cf77a216089e6734bd7157 100644
--- a/app/components/commander/index.js
+++ b/app/components/commander/index.js
@@ -431,4 +431,8 @@ export default class CommanderComponent extends Component {
}
return children_copy;
}
+
+ get is_empty_folder() {
+ return this.children.length === 0;
+ }
}
diff --git a/app/components/panel_modes/index.hbs b/app/components/panel_modes/index.hbs
index 896a212e4cccbfce7b5f044d8d14de10d35c77ad..44e6e6fe4596ccc2a4ce65bc8a051cf09d01c372 100644
--- a/app/components/panel_modes/index.hbs
+++ b/app/components/panel_modes/index.hbs
@@ -3,7 +3,8 @@
<button
type="button"
class="btn btn-light mx-1"
- {{on 'click' @onDuplicatePanel}}>
+ {{tooltip title='Duplicate panel' placement='bottom'}}
+ {{on 'click' (fn @onDuplicatePanel @hint)}}>
{{#if (is_equal @hint "left")}}
<i class="bi-arrow-bar-right"></i>
{{else}}
@@ -13,6 +14,7 @@
<button type="button"
class="btn btn-light mx-1"
+ {{tooltip title='Swap panels' placement='bottom'}}
{{on 'click' @onSwapPanels}}>
<i class="bi-arrow-left-right"></i>
</button>
diff --git a/app/controllers/authenticated/document.js b/app/controllers/authenticated/document.js
index 162cb64d29e72bf6c223b156d475812cff4ba293..88e0602fa52c0c138f01bd321b855f11876cf477 100644
--- a/app/controllers/authenticated/document.js
+++ b/app/controllers/authenticated/document.js
@@ -87,22 +87,45 @@ export default class DocumentController extends DualPanelBaseController {
}
@action
- onDuplicatePanel() {
+ onDuplicatePanel(hint) {
let document_id = this.router.currentRoute.params['document_id'],
query_params;
- query_params = {
- 'queryParams': {
- 'extra_id': document_id,
- 'extra_type': 'doc'
+ if (hint === 'left') {
+ query_params = {
+ 'queryParams': {
+ 'extra_id': document_id,
+ 'extra_type': 'doc'
+ }
}
- }
- if (this.extra_id) {
- this.router.transitionTo(
- 'authenticated.document',
- document_id,
- query_params
- );
+ if (this.extra_id) {
+ this.router.transitionTo(
+ 'authenticated.document',
+ document_id,
+ query_params
+ );
+ }
+ } else { // hint == 'right'
+ query_params = {
+ 'queryParams': {
+ 'extra_id': this.extra_id,
+ 'extra_type': this.extra_type
+ }
+ }
+
+ if (this.extra_type == 'folder') {
+ this.router.transitionTo(
+ 'authenticated.nodes',
+ this.extra_id,
+ query_params
+ );
+ } else {
+ this.router.transitionTo(
+ 'authenticated.document',
+ this.extra_id,
+ query_params
+ );
+ } // this.extra_type
}
}
}
diff --git a/app/controllers/authenticated/nodes.js b/app/controllers/authenticated/nodes.js
index 4cd2e4b4c74d93a4a95afeb3a32caaaebe4125ee..1b06014c2eb05ba267902d5f2c0c2abf45613369 100644
--- a/app/controllers/authenticated/nodes.js
+++ b/app/controllers/authenticated/nodes.js
@@ -67,23 +67,47 @@ export default class NodesController extends DualPanelBaseController {
}
@action
- onDuplicatePanel() {
+ onDuplicatePanel(hint) {
let node_id = this.router.currentRoute.params['node_id'],
query_params;
- query_params = {
- 'queryParams': {
- 'extra_id': node_id,
- 'extra_type': 'folder'
+
+ if (hint === 'left') {
+ query_params = {
+ 'queryParams': {
+ 'extra_id': node_id,
+ 'extra_type': 'folder'
+ }
}
- }
- if (this.extra_id) {
+ if (this.extra_id) {
this.router.transitionTo(
'authenticated.nodes',
node_id,
query_params
);
+ }
+ } else { // hint == 'right'
+ query_params = {
+ 'queryParams': {
+ 'extra_id': this.extra_id,
+ 'extra_type': this.extra_type
+ }
+ }
+
+ if (this.extra_type == 'folder') {
+ this.router.transitionTo(
+ 'authenticated.nodes',
+ this.extra_id,
+ query_params
+ );
+ } else {
+ this.router.transitionTo(
+ 'authenticated.document',
+ this.extra_id,
+ query_params
+ );
+ } // this.extra_type
}
}
}
diff --git a/app/modifiers/tooltip.js b/app/modifiers/tooltip.js
index 64bf372abc43a23c6ab9c6e60df693bb4a20052f..9c2ff94a058d50ae9028a01b76ec2bfc5d85dd36 100644
--- a/app/modifiers/tooltip.js
+++ b/app/modifiers/tooltip.js
@@ -5,15 +5,23 @@ import bootstrap from 'bootstrap';
export default class TooltipModifier extends Modifier {
didReceiveArguments() {
- let { title } = this.args.named;
+ let { title, placement } = this.args.named;
- return new bootstrap.Tooltip(
+ if (!placement) {
+ placement = 'right';
+ }
+
+ this.tooltip = new bootstrap.Tooltip(
this.element,
{
'title': title,
- 'placement': 'right',
+ 'placement': placement,
'trigger': 'hover'
}
);
}
+
+ willDestroy() {
+ this.tooltip.hide();
+ }
}
diff --git a/app/styles/app.scss b/app/styles/app.scss
index 3db9bc54c73bc97b2d63a858a81c9566ac3ab824..62e279daba65ce75b68079c2ac613aacd6eec65b 100644
--- a/app/styles/app.scss
+++ b/app/styles/app.scss
@@ -60,6 +60,10 @@ main {
.commander {
background-color: white;
+
+ .empty_folder {
+ margin: 2rem;
+ }
}
.viewer {
diff --git a/app/styles/document_version.scss b/app/styles/document_version.scss
index db9a087b20c626fff82703c81513c63be2a7397b..d1baf3eff65c06ce5927f36dbb548f0eb7455342 100644
--- a/app/styles/document_version.scss
+++ b/app/styles/document_version.scss
@@ -6,6 +6,11 @@
.thumbnail {
margin: 0.25rem;
+
+ svg {
+ border: 1px solid #ccc;
+ }
+
img {
width: 6rem;
}
diff --git a/changelog.md b/changelog.md
new file mode 100644
index 0000000000000000000000000000000000000000..aeaf3e87812b802786d822ca20d568aefd921e9e
--- /dev/null
+++ b/changelog.md
@@ -0,0 +1,18 @@
+# Changelog
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+
+
+## [2.1.0-alpha-11] - work in progress
+
+### Added
+
+ - In commander, when empty folder is opened show 'Folder is Empty' placeholder instead of blank area
+ - Introduce tooltips for panel mode buttons (swap, duplicate, close)
+
+### Changed
+ - Bugfix: clicking 'duplicate' panel mode button duplicates wrong panel
+ - Bugfix: Blank pages without border in thumbnails panel of the document viewer (papermerge/papermerge.js#2)
\ No newline at end of file