You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2020/03/16 21:11:43 UTC
[incubator-streampipes] branch dev updated: Improve iconbar
behaviour
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
The following commit(s) were added to refs/heads/dev by this push:
new 6edf151 Improve iconbar behaviour
6edf151 is described below
commit 6edf1510ec492181316a22116539459eef1517d5
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Mon Mar 16 22:11:28 2020 +0100
Improve iconbar behaviour
---
ui/deployment/toolbar.controller.mst | 10 ++++++----
ui/src/assets/templates/iconbar.html | 14 ++++++++------
ui/src/assets/templates/navbar.html | 2 +-
3 files changed, 15 insertions(+), 11 deletions(-)
diff --git a/ui/deployment/toolbar.controller.mst b/ui/deployment/toolbar.controller.mst
index ac5d9fe..b0612cc 100644
--- a/ui/deployment/toolbar.controller.mst
+++ b/ui/deployment/toolbar.controller.mst
@@ -33,6 +33,7 @@ export class ToolbarController {
admin: any;
toggleLeft: any;
activePage: any;
+ activePageName: any;
feedbackOpen: boolean = false;
accountMenuOpen: boolean = false;
@@ -105,7 +106,8 @@ export class ToolbarController {
$onInit() {
this.toggleLeft = this.buildToggler('left');
- this.activePage = this.getPageTitle(this.$state.current.name);
+ this.activePage = this.$state.current.name;
+ this.activePageName = this.getPageTitle(this.activePage);
this.updateUnreadNotifications();
this.connectToBroker();
}
@@ -128,16 +130,16 @@ export class ToolbarController {
});
};
-// TODO: Function overloading?
go(path, payload?) {
if (payload === undefined) {
this.$state.go(path);
- this.activePage = this.getPageTitle(path);
+ this.activePage = path;
this.$mdSidenav('left').close();
} else {
this.$state.go(path, payload);
- this.activePage = this.getPageTitle(path);
+ this.activePage = path;
}
+ this.activePageName = this.getPageTitle(this.activePage);
};
logout() {
diff --git a/ui/src/assets/templates/iconbar.html b/ui/src/assets/templates/iconbar.html
index 29e2d50..f96673e 100644
--- a/ui/src/assets/templates/iconbar.html
+++ b/ui/src/assets/templates/iconbar.html
@@ -17,22 +17,23 @@
-->
<md-list style="padding-top:0px;">
- <md-list-item class="md-1-line" ng-class="toolbarCtrl.getListItemClassName(item.link)"
+ <md-list-item class="md-1-line"
+ ng-class="{'sp-navbar-item-selected' : item.link === toolbarCtrl.activePage, 'sp-navbar-item': item.link !== toolbarCtrl.activePage}"
ng-repeat="item in toolbarCtrl.menu" role="link" style="min-width:0px;padding:0px;">
<md-button class="md-icon-button button-margin-iconbar" ng-click="toolbarCtrl.go(item.link)">
<md-icon md-svg-icon="{{item.icon}}" aria-label="{{item.title}}"
- ng-class="toolbarCtrl.getIconClassName(item.link)"></md-icon>
+ ng-class="{'sp-navbar-icon-selected' : item.link === toolbarCtrl.activePage, 'sp-navbar-icon': item.link !== toolbarCtrl.activePage}"></md-icon>
<md-tooltip md-direction="right">
{{item.title}}
</md-tooltip>
</md-button>
</md-list-item>
<md-list-item class="md-1-line" role="link"
- ng-class="toolbarCtrl.getListItemClassName(item.link)">
+ ng-class="{'sp-navbar-item-selected' : 'streampipes.notifications' === toolbarCtrl.activePage, 'sp-navbar-item': 'streampipes.notifications' !== toolbarCtrl.activePage}">
<notification-icon count='toolbarCtrl.notificationCount'>
<md-button class="md-icon-button button-margin-iconbar" ng-click="toolbarCtrl.go('streampipes.notifications')">
<md-icon md-svg-icon="communication:ic_chat_24px" aria-label="Notifications"
- ng-class="toolbarCtrl.getIconClassName(item.link)"></md-icon>
+ ng-class="{'sp-navbar-icon-selected' : 'streampipes.notifications' === toolbarCtrl.activePage, 'sp-navbar-icon': 'streampipes.notifications' !== toolbarCtrl.activePage}"></md-icon>
<md-tooltip md-direction="right">
Notifications
</md-tooltip>
@@ -40,11 +41,12 @@
</notification-icon>
</md-list-item>
<md-divider style="border-top-color:white;"></md-divider>
- <md-list-item class="md-1-line" ng-class="toolbarCtrl.getListItemClassName(item.link)"
+ <md-list-item class="md-1-line"
+ ng-class="{'sp-navbar-item-selected' : item.link === toolbarCtrl.activePage, 'sp-navbar-item': item.link !== toolbarCtrl.activePage}"
ng-repeat="item in toolbarCtrl.admin" role="link">
<md-button class="md-icon-button button-margin-iconbar" ng-click="toolbarCtrl.go(item.link)">
<md-icon md-svg-icon="{{item.icon}}" aria-label="{{item.title}}"
- ng-class="toolbarCtrl.getIconClassName(item.link)"></md-icon>
+ ng-class="{'sp-navbar-icon-selected' : item.link === toolbarCtrl.activePage, 'sp-navbar-icon': item.link !== toolbarCtrl.activePage}"></md-icon>
<md-tooltip md-direction="right">
{{item.title}}
</md-tooltip>
diff --git a/ui/src/assets/templates/navbar.html b/ui/src/assets/templates/navbar.html
index 1cb6231..101c4f4 100644
--- a/ui/src/assets/templates/navbar.html
+++ b/ui/src/assets/templates/navbar.html
@@ -30,7 +30,7 @@
alt="icon" src="assets/img/sp/sp-logo-right-white.png" style="height:28px;">
</div>
<div style="color:white;padding: 5px 5px;font-size:15px;margin-left:10px;">
- <h4 style="margin-top:18px;font-size:12pt;font-weight:bold;">{{toolbarCtrl.getActivePage()}}</h4>
+ <h4 style="margin-top:18px;font-size:12pt;font-weight:bold;">{{toolbarCtrl.activePageName}}</h4>
</div>
</h1>
</div>