diff --git a/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js b/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js index 42ac6af689e..67a6bb5898b 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js @@ -39,7 +39,8 @@ qx.Class.define("osparc.dashboard.CardBase", { "updateStudy": "qx.event.type.Data", "updateTemplate": "qx.event.type.Data", "updateService": "qx.event.type.Data", - "publishTemplate": "qx.event.type.Data" + "publishTemplate": "qx.event.type.Data", + "tagClicked": "qx.event.type.Data" }, statics: { diff --git a/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js b/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js index 794761f7ef0..d0e170fb49d 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js @@ -208,6 +208,7 @@ qx.Class.define("osparc.dashboard.GridButtonItem", { tagsContainer.removeAll(); tags.forEach(tag => { const tagUI = new osparc.ui.basic.Tag(tag.name, tag.color, "searchBarFilter"); + tagUI.addListener("tap", () => this.fireDataEvent("tagClicked", tag)); tagUI.setFont("text-12"); tagsContainer.add(tagUI); }); diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js b/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js index 9c281c8bb9b..5a1ef082eae 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js @@ -209,6 +209,7 @@ qx.Class.define("osparc.dashboard.ListButtonItem", { alignY: "middle", font: "text-12" }); + tagUI.addListener("tap", () => this.fireDataEvent("tagClicked", tag)); tagsContainer.add(tagUI); }); } diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js index d036379f84f..b42a2d2bcc2 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js @@ -79,6 +79,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { _resourcesList: null, _topBar: null, _secondaryBar: null, + __searchBarFilter: null, __viewMenuButton: null, _resourcesContainer: null, _loadingResourcesBtn: null, @@ -133,6 +134,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { resourcesContainer.addListener("updateTemplate", e => this._updateTemplateData(e.getData())); resourcesContainer.addListener("updateService", e => this._updateServiceData(e.getData())); resourcesContainer.addListener("publishTemplate", e => this.fireDataEvent("publishTemplate", e.getData())); + resourcesContainer.addListener("tagClicked", e => this.__searchBarFilter.addTagActiveFilter(e.getData())); this._add(resourcesContainer); }, @@ -143,7 +145,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { alignY: "middle" }); - const searchBarFilter = new osparc.dashboard.SearchBarFilter(resourceType); + const searchBarFilter = this.__searchBarFilter = new osparc.dashboard.SearchBarFilter(resourceType); const textField = searchBarFilter.getChildControl("text-field"); osparc.utils.Utils.setIdToWidget(textField, resourceType ? "searchBarFilter-textField-"+resourceType : "searchBarFilter-textField"); topBar.add(searchBarFilter, { diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js index eec824982b7..96aca0ab8e8 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js @@ -58,6 +58,7 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { "updateTemplate": "qx.event.type.Data", "updateService": "qx.event.type.Data", "publishTemplate": "qx.event.type.Data", + "tagClicked": "qx.event.type.Data", "changeSelection": "qx.event.type.Data", "changeVisibility": "qx.event.type.Data" }, @@ -204,7 +205,8 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { "updateStudy", "updateTemplate", "updateService", - "publishTemplate" + "publishTemplate", + "tagClicked" ].forEach(ev => card.addListener(ev, e => this.fireDataEvent(ev, e.getData()))); return card; diff --git a/services/static-webserver/client/source/class/osparc/dashboard/SearchBarFilter.js b/services/static-webserver/client/source/class/osparc/dashboard/SearchBarFilter.js index 784c1108e62..5b07ffc3883 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/SearchBarFilter.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/SearchBarFilter.js @@ -160,7 +160,7 @@ qx.Class.define("osparc.dashboard.SearchBarFilter", { const tagButton = new qx.ui.menu.Button(tag.name, "@FontAwesome5Solid/tag/12"); tagButton.getChildControl("icon").setTextColor(tag.color); tagsMenu.add(tagButton); - tagButton.addListener("execute", () => this.__addChip("tag", tag.name, tag.name), this); + tagButton.addListener("execute", () => this.addTagActiveFilter(tag), this); }); menuButton.setMenu(tagsMenu); } @@ -202,6 +202,10 @@ qx.Class.define("osparc.dashboard.SearchBarFilter", { return chipButton; }, + addTagActiveFilter: function(tag) { + this.__addChip("tag", tag.name, tag.name); + }, + __addChip: function(type, id, label) { const activeFilter = this.getChildControl("active-filters"); const chipFound = activeFilter.getChildren().find(chip => chip.type === type && chip.id === id);