From 227f99c84addddf54ce5a06484c509bffb7ee064 Mon Sep 17 00:00:00 2001
From: Eugen Ciur <eugen@papermerge.com>
Date: Sat, 4 Dec 2021 07:27:39 +0100
Subject: [PATCH] very cool ember based dual panel !
---
.babelrc.json | 3 +-
app/components/commander/action_modes.hbs | 2 +-
app/components/commander/index.hbs | 3 +-
app/components/dual_link_to/index.js | 12 ++++---
app/components/viewer/action_modes.hbs | 2 +-
app/components/viewer/index.hbs | 3 +-
app/controllers/authenticated/document.js | 34 ++++++++++---------
.../authenticated/dualpanel_base.js | 21 +++---------
app/controllers/authenticated/nodes.js | 32 +++++++++++++++++
app/routes/authenticated/document.js | 12 +++----
app/routes/authenticated/nodes.js | 12 +++----
11 files changed, 82 insertions(+), 54 deletions(-)
diff --git a/.babelrc.json b/.babelrc.json
index 9d8d625..98f9058 100644
--- a/.babelrc.json
+++ b/.babelrc.json
@@ -1,3 +1,4 @@
[
- "@babel/plugin-proposal-private-property-in-object", { "loose": true }
+ "@babel/plugin-proposal-private-property-in-object", { "loose": true },
+ "@babel/plugin-proposal-private-methods", { "loose": true }
]
\ No newline at end of file
diff --git a/app/components/commander/action_modes.hbs b/app/components/commander/action_modes.hbs
index e192709..9525a7c 100644
--- a/app/components/commander/action_modes.hbs
+++ b/app/components/commander/action_modes.hbs
@@ -3,7 +3,7 @@
@onViewModeChange={{@onViewModeChange}} />
<div class="panel-mode">
<button type="button" class="btn btn-light mx-1"
- {{on "click" (fn @onPanelToggle "nodes") }}>
+ {{on "click" (fn @onPanelToggle @hint) }}>
{{#if @dualPanelMode}}
<i class="bi-x"></i>
{{else}}
diff --git a/app/components/commander/index.hbs b/app/components/commander/index.hbs
index 8dddf46..b61da1d 100644
--- a/app/components/commander/index.hbs
+++ b/app/components/commander/index.hbs
@@ -11,7 +11,8 @@
<Commander::ActionModes
@onPanelToggle={{@onPanelToggle}}
@dualPanelMode={{@dualPanelMode}}
- @onViewModeChange={{this.onViewModeChange}} />
+ @onViewModeChange={{this.onViewModeChange}}
+ @hint={{@hint}} />
</div>
<Modal::NewFolder
diff --git a/app/components/dual_link_to/index.js b/app/components/dual_link_to/index.js
index 356052c..f5b1718 100644
--- a/app/components/dual_link_to/index.js
+++ b/app/components/dual_link_to/index.js
@@ -129,11 +129,13 @@ export default class DualLinkToComponent extends Component {
if ((hint === 'left') && extranode) {
if (extranode.get('nodeType') === 'document') {
return {
- 'extradoc_id': extranode.get('id')
+ 'extra_id': extranode.get('id'),
+ 'extra_type': 'doc'
};
} else if (extranode.get('nodeType') === 'folder') {
return {
- 'extranode_id': extranode.get('id')
+ 'extra_id': extranode.get('id'),
+ 'extra_type': 'folder'
};
}
}
@@ -141,11 +143,13 @@ export default class DualLinkToComponent extends Component {
if (hint === 'right' && node) {
if (node.get('nodeType') === 'document') {
return {
- 'extradoc_id': node.get('id')
+ 'extra_id': node.get('id'),
+ 'extra_type': 'doc'
}
} else if (node.get('nodeType') === 'folder' ) {
return {
- 'extranode_id': node.get('id')
+ 'extra_id': node.get('id'),
+ 'extra_type': 'folder'
}
}
}
diff --git a/app/components/viewer/action_modes.hbs b/app/components/viewer/action_modes.hbs
index 4a54b63..cd50f34 100644
--- a/app/components/viewer/action_modes.hbs
+++ b/app/components/viewer/action_modes.hbs
@@ -1,7 +1,7 @@
<div class="d-flex">
<div class="panel-mode">
<button type="button" class="btn btn-light mx-1"
- {{on "click" (fn @onPanelToggle "document")}}>
+ {{on "click" (fn @onPanelToggle @hint)}}>
{{#if @dualPanelMode}}
<i class="bi-x"></i>
{{else}}
diff --git a/app/components/viewer/index.hbs b/app/components/viewer/index.hbs
index 48fc964..879576f 100644
--- a/app/components/viewer/index.hbs
+++ b/app/components/viewer/index.hbs
@@ -8,7 +8,8 @@
<Viewer::ActionModes
@onPanelToggle={{@onPanelToggle}}
- @dualPanelMode={{@dualPanelMode}} />
+ @dualPanelMode={{@dualPanelMode}}
+ @hint={{@hint}} />
</div>
<Breadcrumb
diff --git a/app/controllers/authenticated/document.js b/app/controllers/authenticated/document.js
index 221d101..4a7d91e 100644
--- a/app/controllers/authenticated/document.js
+++ b/app/controllers/authenticated/document.js
@@ -5,32 +5,34 @@ import DualPanelBaseController from "./dualpanel_base";
export default class DocumentController extends DualPanelBaseController {
@action
- async onPanelToggle(origin) {
+ async onPanelToggle(hint) {
/*
- origin is either "document" or "nodes" depending where
+ hint is either "left" or "right" depending where
the onPanelToggle originated from.
*/
let home_folder;
- if (this.extranode_id) {
- /*
- Here we have document viewer as main panel (left) and nodes panel as
- extra (on the right).
- */
- if (origin === "document") {
- // user decided to close document panel
- this.replaceRoute('authenticated.nodes', this.extranode_id);
- this.extranode_id = null;
- } else if (origin === "nodes") {
- // User decided to close nodes extra panel.
- // He/She decided to view only the document
- this.extranode_id = null;
+ if (this.extra_id) {
+ if (hint === "left") {
+ // user decided to close left panel
+ if (this.extra_type === 'folder') {
+ this.replaceRoute('authenticated.nodes', this.extra_id);
+ } else {
+ this.replaceRoute('authenticated.document', this.extra_id);
+ }
+ this.extra_id = null;
+ this.extra_type = null;
+ } else if (hint === "right") {
+ console.log('Closing right panel');
+ this.extra_id = null;
+ this.extra_type = null;
} else {
throw `Unknown value for origin argument: ${origin}`;
}
} else {
home_folder = await this.currentUser.user.home_folder;
- this.extranode_id = home_folder.get('id');
+ this.extra_id = home_folder.get('id');
+ this.extra_type = 'folder';
}
}
diff --git a/app/controllers/authenticated/dualpanel_base.js b/app/controllers/authenticated/dualpanel_base.js
index 7aab372..3d64b94 100644
--- a/app/controllers/authenticated/dualpanel_base.js
+++ b/app/controllers/authenticated/dualpanel_base.js
@@ -1,5 +1,4 @@
import Controller from '@ember/controller';
-import { action } from '@ember/object';
import { tracked } from "@glimmer/tracking";
import { inject as service } from '@ember/service';
@@ -8,24 +7,12 @@ export default class DualPanelBaseController extends Controller {
@service currentUser;
- @tracked extranode_id = null;
- @tracked extradoc_id = null;
+ @tracked extra_id = null;
+ @tracked extra_type = null; // can be either 'doc' or 'node'
- queryParams = ['extranode_id', 'extradoc_id']
-
- @action
- async onPanelToggle() {
- let home_folder;
-
- if (this.extranode_id) {
- this.extranode_id = null;
- } else {
- home_folder = await this.currentUser.user.home_folder;
- this.extranode_id = home_folder.get('id');
- }
- }
+ queryParams = ['extra_id', 'extra_type']
get dualpanel_mode() {
- return this.extranode_id || this.extradoc_id;
+ return this.extra_id;
}
}
diff --git a/app/controllers/authenticated/nodes.js b/app/controllers/authenticated/nodes.js
index 75a8302..811a7f1 100644
--- a/app/controllers/authenticated/nodes.js
+++ b/app/controllers/authenticated/nodes.js
@@ -1,6 +1,38 @@
+import { action } from '@ember/object';
import DualPanelBaseController from "./dualpanel_base";
export default class NodesController extends DualPanelBaseController {
+ @action
+ async onPanelToggle(hint) {
+ /*
+ hint is either "left" or "right" depending where
+ the onPanelToggle originated from.
+ */
+ let home_folder;
+
+ if (this.extra_id) {
+ if (hint === "left") {
+ // user decided to close left panel
+ if (this.extra_type === 'folder') {
+ this.replaceRoute('authenticated.nodes', this.extra_id);
+ } else {
+ this.replaceRoute('authenticated.document', this.extra_id);
+ }
+ this.extra_id = null;
+ this.extra_type = null;
+ } else if (hint === "right") {
+ this.extra_id = null;
+ this.extra_type = null;
+ } else {
+ throw `Unknown value for origin argument: ${origin}`;
+ }
+ } else {
+ home_folder = await this.currentUser.user.home_folder;
+ this.extra_id = home_folder.get('id');
+ this.extra_type = 'folder';
+ }
+ }
+
}
diff --git a/app/routes/authenticated/document.js b/app/routes/authenticated/document.js
index 5701156..d164077 100644
--- a/app/routes/authenticated/document.js
+++ b/app/routes/authenticated/document.js
@@ -8,10 +8,10 @@ export default class DocumentRoute extends Route {
@service store;
queryParams = {
- extranode_id: {
+ extra_id: {
refreshModel: true
},
- extradoc_id: {
+ extra_type: {
refreshModel: true
}
};
@@ -39,10 +39,10 @@ export default class DocumentRoute extends Route {
pages_with_url = await page_adapter.loadImages(last_version.pages, 'image/svg+xml');
- if (params.extradoc_id) {
+ if (params.extra_id && params.extra_type === 'doc') {
extra_doc = await this.store.findRecord(
'document',
- params.extradoc_id,
+ params.extra_id,
{ reload: true }
);
extra_last_version = extra_doc.last_version
@@ -64,11 +64,11 @@ export default class DocumentRoute extends Route {
};
}
- if (params.extranode_id) {
+ if (params.extra_id && params.extra_type === 'folder') {
extranode = await getPanelInfo({
store: this.store,
- node_id: params.extranode_id,
+ node_id: params.extra_id,
page: 1
});
diff --git a/app/routes/authenticated/nodes.js b/app/routes/authenticated/nodes.js
index 268ace6..6643227 100644
--- a/app/routes/authenticated/nodes.js
+++ b/app/routes/authenticated/nodes.js
@@ -10,10 +10,10 @@ export default class FolderRoute extends Route {
@service currentUser;
queryParams = {
- extranode_id: {
+ extra_id: {
refreshModel: true
},
- extradoc_id: {
+ extra_type: {
refreshModel: true
},
page: {
@@ -43,8 +43,8 @@ export default class FolderRoute extends Route {
});
- if (params.extradoc_id) {
- document_version = await doc_adapter.getDocumentVersion(params.extradoc_id);
+ if (params.extra_id && params.extra_type === 'doc') {
+ document_version = await doc_adapter.getDocumentVersion(params.extra_id);
pages = await document_version.pages;
pages_with_url = await page_adapter.loadBinaryImages(pages);
this.dualpanel_mode = true;
@@ -57,10 +57,10 @@ export default class FolderRoute extends Route {
});
}
- if (params.extranode_id) {
+ if (params.extra_id && params.extra_type === 'folder') {
context['extranode'] = await getPanelInfo({
store: this.store,
- node_id: params.extranode_id,
+ node_id: params.extra_id,
page: 1
});
this.dualpanel_mode = true;
--
GitLab