Skip to content

Commit 672f2e8

Browse files
odeimaizodeimaiz
authored
🐛🎨 [Frontend] Workspaces & Folders: Improve context syncing (ITISFoundation#6482)
1 parent 7f3c145 commit 672f2e8

File tree

7 files changed

+120
-100
lines changed

7 files changed

+120
-100
lines changed

‎services/static-webserver/client/source/class/osparc/dashboard/ContextBreadcrumbs.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,10 @@ qx.Class.define("osparc.dashboard.ContextBreadcrumbs", {
2626
}));
2727
},
2828

29+
events: {
30+
"contextChanged": "qx.event.type.Data",
31+
},
32+
2933
properties: {
3034
currentWorkspaceId: {
3135
check: "Number",
@@ -86,6 +90,10 @@ qx.Class.define("osparc.dashboard.ContextBreadcrumbs", {
8690
currentWorkspaceId: workspaceId,
8791
currentFolderId: folderId,
8892
});
93+
this.fireDataEvent("contextChanged", {
94+
workspaceId,
95+
folderId,
96+
});
8997
},
9098

9199
__createRootButton: function() {

‎services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js‎

Lines changed: 0 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -269,12 +269,10 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
269269
resourcesContainer.addListener("folderSelected", e => {
270270
const folderId = e.getData();
271271
this._folderSelected(folderId);
272-
this._resourceFilter.folderSelected(folderId);
273272
}, this);
274273
resourcesContainer.addListener("workspaceSelected", e => {
275274
const workspaceId = e.getData();
276275
this._workspaceSelected(workspaceId);
277-
this._resourceFilter.workspaceSelected(workspaceId);
278276
}, this);
279277
resourcesContainer.addListener("workspaceUpdated", e => this._workspaceUpdated(e.getData()));
280278
resourcesContainer.addListener("deleteWorkspaceRequested", e => this._deleteWorkspaceRequested(e.getData()));
@@ -369,36 +367,10 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
369367
});
370368

371369
resourceFilter.addListener("changeSharedWith", e => {
372-
if (this._resourceType === "study") {
373-
this.setCurrentWorkspaceId(null);
374-
}
375370
const sharedWith = e.getData();
376371
this._searchBarFilter.setSharedWithActiveFilter(sharedWith.id, sharedWith.label);
377372
}, this);
378373

379-
if (this._resourceType === "study" && osparc.utils.DisabledPlugins.isFoldersEnabled()) {
380-
const workspacesAndFoldersTree = resourceFilter.getWorkspacesAndFoldersTree();
381-
workspacesAndFoldersTree.getSelection().addListener("change", () => {
382-
const selection = workspacesAndFoldersTree.getSelection();
383-
if (selection.getLength() > 0) {
384-
const item = selection.getItem(0);
385-
const workspaceId = item.getWorkspaceId();
386-
const folderId = item.getFolderId();
387-
this._changeContext(workspaceId, folderId);
388-
}
389-
}, this);
390-
this.bind("currentWorkspaceId", workspacesAndFoldersTree, "currentWorkspaceId");
391-
this.bind("currentFolderId", workspacesAndFoldersTree, "currentFolderId");
392-
}
393-
394-
resourceFilter.addListener("changeWorkspace", e => {
395-
const workspaceId = e.getData();
396-
this.setCurrentWorkspaceId(workspaceId);
397-
if (this._resourceType === "study") {
398-
this._searchBarFilter.resetSharedWithActiveFilter();
399-
}
400-
}, this);
401-
402374
resourceFilter.addListener("changeSelectedTags", e => {
403375
const selectedTagIds = e.getData();
404376
this._searchBarFilter.setTagsActiveFilter(selectedTagIds);
@@ -489,10 +461,6 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
489461
throw new Error("Abstract method called!");
490462
},
491463

492-
_changeContext: function(workspaceId, folderId) {
493-
throw new Error("Abstract method called!");
494-
},
495-
496464
_folderSelected: function(folderId) {
497465
throw new Error("Abstract method called!");
498466
},

‎services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js‎

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -284,11 +284,30 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", {
284284
this._removeAll();
285285
},
286286

287+
__addFoldersContainer: function() {
288+
// add foldersContainer dynamically
289+
[
290+
"addChildWidget",
291+
"removeChildWidget"
292+
].forEach(ev => {
293+
this.__foldersContainer.addListener(ev, () => {
294+
const children = this.__foldersContainer.getChildren();
295+
if (children.length && !children.includes(this.__foldersContainer)) {
296+
this._addAt(this.__foldersContainer, 0);
297+
return;
298+
}
299+
if (children.length === 0 && children.includes(this.__foldersContainer)) {
300+
this._remove(this.__foldersContainer);
301+
return;
302+
}
303+
})
304+
});
305+
},
306+
287307
reloadCards: function(resourceType) {
288308
this.__cleanAll();
289-
if (resourceType === "studies") {
290-
this._add(this.__containerHeader);
291-
this._add(this.__foldersContainer);
309+
if (osparc.utils.DisabledPlugins.isFoldersEnabled()) {
310+
this.__addFoldersContainer();
292311
}
293312
if (this.getGroupBy()) {
294313
const noGroupContainer = this.__createGroupContainer("no-group", "No Group", "transparent");

‎services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js‎

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -83,31 +83,6 @@ qx.Class.define("osparc.dashboard.ResourceFilter", {
8383
getWorkspacesAndFoldersTree: function() {
8484
return this.__workspacesAndFoldersTree;
8585
},
86-
87-
contextChanged: function(workspaceId, folderId) {
88-
this.__workspacesAndFoldersTree.set({
89-
currentWorkspaceId: workspaceId,
90-
currentFolderId: folderId,
91-
});
92-
this.__workspacesAndFoldersTree.contextChanged();
93-
},
94-
95-
workspaceSelected: function(workspaceId) {
96-
this.__workspacesAndFoldersTree.set({
97-
currentWorkspaceId: workspaceId,
98-
currentFolderId: null,
99-
});
100-
this.__workspacesAndFoldersTree.contextChanged();
101-
},
102-
103-
folderSelected: function(folderId) {
104-
const workspaceId = this.__workspacesAndFoldersTree.getCurrentWorkspaceId();
105-
this.__workspacesAndFoldersTree.set({
106-
currentWorkspaceId: workspaceId,
107-
currentFolderId: folderId,
108-
});
109-
this.__workspacesAndFoldersTree.contextChanged();
110-
},
11186
/* /WORKSPACES AND FOLDERS */
11287

11388
/* SHARED WITH */

‎services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js‎

Lines changed: 65 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
101101

102102
members: {
103103
__dontShowTutorial: null,
104+
__workspaceHeader: null,
104105
__workspacesList: null,
105106
__foldersList: null,
106107

@@ -431,8 +432,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
431432
},
432433

433434
_workspaceSelected: function(workspaceId) {
434-
this.setCurrentWorkspaceId(workspaceId);
435-
this._changeContext(this.getCurrentWorkspaceId(), null);
435+
this.__changeContext(workspaceId, null);
436436
},
437437

438438
_workspaceUpdated: function() {
@@ -451,25 +451,6 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
451451
},
452452
// /WORKSPACES
453453

454-
_changeContext: function(workspaceId, folderId) {
455-
if (osparc.utils.DisabledPlugins.isFoldersEnabled()) {
456-
this.resetSelection();
457-
this.setMultiSelection(false);
458-
this.set({
459-
currentWorkspaceId: workspaceId,
460-
currentFolderId: folderId,
461-
});
462-
this.invalidateStudies();
463-
this._resourcesContainer.setResourcesToList([]);
464-
465-
if (workspaceId === -1) {
466-
this.__reloadWorkspaces();
467-
} else {
468-
this.__reloadFoldersAndStudies();
469-
}
470-
}
471-
},
472-
473454
// FOLDERS
474455
__reloadFolderCards: function() {
475456
this._resourcesContainer.setFoldersToList(this.__foldersList);
@@ -507,8 +488,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
507488
},
508489

509490
_folderSelected: function(folderId) {
510-
this.setCurrentFolderId(folderId);
511-
this._changeContext(this.getCurrentWorkspaceId(), folderId);
491+
this.__changeContext(this.getCurrentWorkspaceId(), folderId);
512492
},
513493

514494
_folderUpdated: function() {
@@ -882,21 +862,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
882862
this._createSearchBar();
883863

884864
if (osparc.utils.DisabledPlugins.isFoldersEnabled()) {
885-
const workspaceHeader = new osparc.dashboard.WorkspaceHeader();
886-
this.bind("currentWorkspaceId", workspaceHeader, "currentWorkspaceId");
887-
this.bind("currentFolderId", workspaceHeader, "currentFolderId");
888-
[
889-
"changeCurrentWorkspaceId",
890-
"changeCurrentFolderId",
891-
].forEach(ev => {
892-
workspaceHeader.addListener(ev, () => {
893-
const workspaceId = workspaceHeader.getCurrentWorkspaceId();
894-
const folderId = workspaceHeader.getCurrentFolderId();
895-
this._changeContext(workspaceId, folderId);
896-
this._resourceFilter.contextChanged(workspaceId, folderId);
897-
}, this);
898-
});
899-
865+
const workspaceHeader = this.__workspaceHeader = new osparc.dashboard.WorkspaceHeader();
900866
this._addToLayout(workspaceHeader);
901867
}
902868

@@ -930,6 +896,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
930896

931897
this._addResourceFilter();
932898

899+
this.__connectContexts();
900+
933901
this.__addNewStudyButtons();
934902

935903
const loadMoreBtn = this.__createLoadMoreButton();
@@ -965,6 +933,65 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
965933
return this._resourcesContainer;
966934
},
967935

936+
__connectContexts: function() {
937+
const workspaceHeader = this.__workspaceHeader;
938+
workspaceHeader.addListener("contextChanged", () => {
939+
const workspaceId = workspaceHeader.getCurrentWorkspaceId();
940+
const folderId = workspaceHeader.getCurrentFolderId();
941+
this.__changeContext(workspaceId, folderId);
942+
}, this);
943+
944+
const workspacesAndFoldersTree = this._resourceFilter.getWorkspacesAndFoldersTree();
945+
workspacesAndFoldersTree.addListener("contextChanged", e => {
946+
const context = e.getData();
947+
const workspaceId = context["workspaceId"];
948+
const folderId = context["folderId"];
949+
this.__changeContext(workspaceId, folderId);
950+
}, this);
951+
},
952+
953+
__changeContext: function(workspaceId, folderId) {
954+
if (osparc.utils.DisabledPlugins.isFoldersEnabled()) {
955+
if (
956+
this.getCurrentWorkspaceId() === workspaceId &&
957+
this.getCurrentFolderId() === folderId
958+
) {
959+
// didn't really change
960+
return;
961+
}
962+
963+
this.resetSelection();
964+
this.setMultiSelection(false);
965+
this.set({
966+
currentWorkspaceId: workspaceId,
967+
currentFolderId: folderId,
968+
});
969+
this.invalidateStudies();
970+
this._resourcesContainer.setResourcesToList([]);
971+
972+
if (workspaceId === -1) {
973+
this.__reloadWorkspaces();
974+
} else {
975+
this.__reloadFoldersAndStudies();
976+
}
977+
978+
// notify workspaceHeader
979+
const workspaceHeader = this.__workspaceHeader;
980+
workspaceHeader.set({
981+
currentWorkspaceId: workspaceId,
982+
currentFolderId: folderId,
983+
});
984+
985+
// notify workspacesAndFoldersTree
986+
const workspacesAndFoldersTree = this._resourceFilter.getWorkspacesAndFoldersTree();
987+
workspacesAndFoldersTree.set({
988+
currentWorkspaceId: workspaceId,
989+
currentFolderId: folderId,
990+
});
991+
workspacesAndFoldersTree.contextChanged(workspaceId, folderId);
992+
}
993+
},
994+
968995
__addSortByButton: function() {
969996
const sortByButton = new osparc.dashboard.SortedByMenuButton();
970997
sortByButton.set({

‎services/static-webserver/client/source/class/osparc/dashboard/WorkspaceHeader.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,13 @@ qx.Class.define("osparc.dashboard.WorkspaceHeader", {
3636
});
3737

3838
this.__spacers = [];
39+
40+
this.initCurrentWorkspaceId();
41+
this.initCurrentFolderId();
3942
},
4043

4144
events: {
45+
"contextChanged": "qx.event.type.Data",
4246
"workspaceUpdated": "qx.event.type.Data",
4347
"deleteWorkspaceRequested": "qx.event.type.Data"
4448
},
@@ -109,6 +113,9 @@ qx.Class.define("osparc.dashboard.WorkspaceHeader", {
109113
this.bind("currentFolderId", control, "currentFolderId");
110114
control.bind("currentWorkspaceId", this, "currentWorkspaceId");
111115
control.bind("currentFolderId", this, "currentFolderId");
116+
control.addListener("contextChanged", e => {
117+
this.fireDataEvent("contextChanged", e.getData())
118+
});
112119
this._add(control);
113120
break;
114121
case "edit-button":
@@ -177,6 +184,10 @@ qx.Class.define("osparc.dashboard.WorkspaceHeader", {
177184
title.addListener("tap", () => {
178185
const folderId = null;
179186
this.setCurrentFolderId(folderId);
187+
this.fireDataEvent("contextChanged", {
188+
workspaceId,
189+
folderId,
190+
});
180191
});
181192

182193
this.getChildControl("breadcrumbs");

‎services/static-webserver/client/source/class/osparc/dashboard/WorkspacesAndFoldersTree.js‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,25 +76,37 @@ qx.Class.define("osparc.dashboard.WorkspacesAndFoldersTree", {
7676
const workspace = e.getData();
7777
this.__removeWorkspace(workspace);
7878
}, this);
79+
80+
this.getSelection().addListener("change", () => {
81+
const selection = this.getSelection();
82+
if (selection.getLength() > 0) {
83+
const item = selection.getItem(0);
84+
const workspaceId = item.getWorkspaceId();
85+
const folderId = item.getFolderId();
86+
this.fireDataEvent("contextChanged", {
87+
workspaceId,
88+
folderId,
89+
});
90+
}
91+
}, this);
7992
},
8093

8194
events: {
8295
"openChanged": "qx.event.type.Event",
96+
"contextChanged": "qx.event.type.Data",
8397
},
8498

8599
properties: {
86100
currentWorkspaceId: {
87101
check: "Number",
88102
nullable: true,
89103
init: null,
90-
event: "changeCurrentWorkspaceId",
91104
},
92105

93106
currentFolderId: {
94107
check: "Number",
95108
nullable: true,
96109
init: null,
97-
event: "changeCurrentFolderId",
98110
},
99111
},
100112

0 commit comments

Comments
 (0)