diff --git a/src/js/client.js b/src/js/client.js index 37425123b..c003ccf02 100644 --- a/src/js/client.js +++ b/src/js/client.js @@ -165,6 +165,7 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N }; this._installedApps = []; this._installedAppsById = {}; + this._appTags = []; this._clientId = '<%= oauth.clientId %>'; this._clientSecret = '<%= oauth.clientSecret %>'; // window.location fallback for websocket connections which do not have relative uris @@ -281,6 +282,10 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N return this._installedApps; }; + Client.prototype.getAppTags = function () { + return this._appTags; + }; + Client.prototype.getUserInfo = function () { return this._userInfo; }; @@ -1459,6 +1464,16 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N } this._installedAppsById[app.id] = this._installedApps[found]; + + // TODO this not very elegant + // update app tags + tmp = this._installedApps + .map(function (app) { return app.tags || []; }) // return array of arrays + .reduce(function (a, i) { return a.concat(i); }, []) // merge all arrays into one + .filter(function (v, i, self) { return self.indexOf(v) === i; }); // filter duplicates + + // keep tag array references + angular.copy(tmp, this._appTags); }; // this requires app:manage permissions diff --git a/src/theme.scss b/src/theme.scss index 3169c9217..f53a46ebb 100644 --- a/src/theme.scss +++ b/src/theme.scss @@ -255,6 +255,44 @@ h1, h2, h3 { font-size: 24px; } +.tags-sidebar { + position: absolute; + left: 10px; + top: 50px; + + h1 { + font-size: 14px; + } + + .tag { + display: block; + padding: 6px 10px; + margin: 0; + overflow: hidden; + color: black; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 16px; + + &:hover, + &:focus, + &.tag-active { + text-decoration: none; + background-color: white; + color: black; + } + + &.tag-active { + background-color: $navbar-default-link-hover-color; + color: white; + } + + & > i { + width: 30px; + } + } +} + .app-grid { display: flex; flex-wrap: wrap; diff --git a/src/views/apps.html b/src/views/apps.html index 785cf1950..539896aff 100644 --- a/src/views/apps.html +++ b/src/views/apps.html @@ -515,6 +515,11 @@

Your Apps

+
+

Tags

+
{{ tag }}
+
+

{{ domain.domain }}

diff --git a/src/views/apps.js b/src/views/apps.js index 6fecb69a2..f8376a891 100644 --- a/src/views/apps.js +++ b/src/views/apps.js @@ -7,6 +7,8 @@ angular.module('Application').controller('AppsController', ['$scope', '$location $scope.HOST_PORT_MIN = 1024; $scope.HOST_PORT_MAX = 65535; $scope.installedApps = Client.getInstalledApps(); + $scope.tags = Client.getAppTags(); + $scope.selectedTags = []; $scope.config = Client.getConfig(); $scope.user = Client.getUserInfo(); $scope.domains = []; @@ -27,6 +29,12 @@ angular.module('Application').controller('AppsController', ['$scope', '$location }).length > 1; }; + $scope.toggleTag = function (tag) { + var pos = $scope.selectedTags.indexOf(tag); + if (pos !== -1) $scope.selectedTags.splice(pos, 1); + else $scope.selectedTags.push(tag); + }; + $scope.appConfigure = { busy: false, error: {},