This is an automated email from the ASF dual-hosted git repository.

heneveld pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/brooklyn-ui.git

commit 338a97deaa29ef99c8770635890c32057fbda92c
Author: Alex Heneveld <[email protected]>
AuthorDate: Sun Jun 18 23:14:54 2023 +0100

    replace breadcrumbs code, showing root task
---
 .../breadcrumb-navigation.html                     | 20 -------
 .../breadcrumb-navigation/breadcrumb-navigation.js | 70 ----------------------
 .../breadcrumb-navigation.less                     | 45 --------------
 ui-modules/app-inspector/app/index.js              |  3 +-
 ui-modules/app-inspector/app/index.less            |  1 -
 .../inspect/activities/detail/detail.controller.js | 22 +++++++
 .../main/inspect/activities/detail/detail.less     | 19 ++++++
 .../inspect/activities/detail/detail.template.html | 23 ++++---
 8 files changed, 52 insertions(+), 151 deletions(-)

diff --git 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.html
 
b/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.html
deleted file mode 100644
index 5706c04e..00000000
--- 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!--
-  Licensed to the Apache Software Foundation (ASF) under one
-  or more contributor license agreements.  See the NOTICE file
-  distributed with this work for additional information
-  regarding copyright ownership.  The ASF licenses this file
-  to you under the Apache License, Version 2.0 (the
-  "License"); you may not use this file except in compliance
-  with the License.  You may obtain a copy of the License at
-
-      http://www.apache.org/licenses/LICENSE-2.0
-
-  Unless required by applicable law or agreed to in writing,
-  software distributed under the License is distributed on an
-  "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-  KIND, either express or implied.  See the License for the
-  specific language governing permissions and limitations
-  under the License.
--->
-<a class="breadcrumb-item loading" ng-if="breadcrumb.loading"></a>
-<a class="breadcrumb-item ready" ng-if="!breadcrumb.loading" 
ui-sref="main.inspect.activities.detail({entityId: breadcrumb.entityId, 
activityId: breadcrumb.parentId})">{{breadcrumb.parentName}}</a>
diff --git 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.js
 
b/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.js
deleted file mode 100644
index 128f0831..00000000
--- 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.js
+++ /dev/null
@@ -1,70 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import angular from "angular";
-import template from "./breadcrumb-navigation.html";
-
-const MODULE_NAME = 'inspector.breadcrumb';
-
-angular.module(MODULE_NAME, [])
-    .directive('breadcrumbNavigation', ['$compile', 'activityApi', 
breadcrumbNavigation]);
-
-export default MODULE_NAME;
-
-export function breadcrumbNavigation($compile, activityApi) {
-    return {
-        restrict: 'A',
-        template: template,
-        scope: {
-            entityId: "@",
-            parentId: "@",
-            activitiesKnown: "@?"
-        },
-        link: link
-    };
-
-    function link($scope, $element) {
-        if ($scope.parentId) {
-            $scope.breadcrumb = {
-                loading: true,
-                entityId: $scope.entityId,
-                parentId: $scope.parentId
-            };
-
-            function showParent(task) {
-                $scope.breadcrumb.parentName = task.displayName;
-                if (task.submittedByTask) {
-                    $scope.breadcrumb.id = task.submittedByTask.metadata.id;
-                    let el = $compile('<li breadcrumb-navigation 
parent-id="{{breadcrumb.id}}" entity-id="{{breadcrumb.entityId}}" 
activities-known="{{activitiesKnown}}"></li>')($scope);
-                    $element.parent().prepend(el);
-                }
-                $scope.breadcrumb.loading = false;
-            }
-
-            // would be nice to have activities cached so we don't need to 
load; but we don't on the detail view,
-            // and the load of ancestors is pretty fast so this isn't a big 
issue
-            const parentActivity = $scope.activitiesKnown && 
$scope.activitiesKnown[$scope.parentId];
-            if (parentActivity) showParent(parentActivity);
-            // else activityApi.activity($scope.parentId).then((response)=> 
showParent(response.data));
-            else activityApi.activity($scope.parentId).then((response)=> {
-                showParent(response.data);
-            });
-        }
-    }
-}
-
diff --git 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.less
 
b/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.less
deleted file mode 100644
index af7cdc19..00000000
--- 
a/ui-modules/app-inspector/app/components/breadcrumb-navigation/breadcrumb-navigation.less
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-li[breadcrumb-navigation] {
-  .ready {
-    -webkit-animation: fadeIn 1s;
-    animation: fadeIn 1s;
-  }
-  .loading {
-    display: block;
-    background-image: url(../../img/loading-ellipsis.svg);
-    background-repeat: no-repeat;
-    background-position-y: center;
-    background-position-x: center;
-    width: 50px;
-    height: 1em;
-  }
-}
-.revealParentsEllipse {
-  cursor: pointer;
-}
-
-@-webkit-keyframes fadeIn {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@keyframes fadeIn {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
diff --git a/ui-modules/app-inspector/app/index.js 
b/ui-modules/app-inspector/app/index.js
index 9dbfd95f..37e274ec 100755
--- a/ui-modules/app-inspector/app/index.js
+++ b/ui-modules/app-inspector/app/index.js
@@ -45,7 +45,6 @@ import loadingState from 
"components/loading-state/loading-state.directive";
 import configSensorTable from 
"components/config-sensor-table/config-sensor-table.directive";
 import entityEffector from 
"components/entity-effector/entity-effector.directive";
 import entityPolicy from "components/entity-policy/entity-policy.directive";
-import breadcrumbNavigation from 
"components/breadcrumb-navigation/breadcrumb-navigation";
 import taskList from "components/task-list/task-list.directive";
 import taskSunburst from "components/task-sunburst/task-sunburst.directive";
 import stream from "components/stream/stream.directive";
@@ -73,7 +72,7 @@ angular.module('brooklynAppInspector', [ngResource, 
ngCookies, ngSanitize, uiRou
     dropdownNested,
     brServerStatus, brIconGenerator, brInterstitialSpinner, 
brooklynModuleLinks, brSensitiveField, brooklynUserManagement,
     brYamlEditor, brWebNotifications, brExpandablePanel, 'xeditable', 
brLogbook, apiProvider, entityTree, loadingState, serverApi,
-    configSensorTable, entityEffector, entityPolicy, breadcrumbNavigation, 
taskList, taskSunburst, stream, adjunctsList,
+    configSensorTable, entityEffector, entityPolicy, taskList, taskSunburst, 
stream, adjunctsList,
     workflowSteps, workflowStep,
     managementDetail, brandAngularJs])
     .provider('catalogApi', catalogApiProvider)
diff --git a/ui-modules/app-inspector/app/index.less 
b/ui-modules/app-inspector/app/index.less
index 8e446770..f2019c15 100644
--- a/ui-modules/app-inspector/app/index.less
+++ b/ui-modules/app-inspector/app/index.less
@@ -45,7 +45,6 @@
 @import "components/task-list/task-list.less";
 @import "components/task-sunburst/task-sunburst.less";
 @import "components/workflow/workflow-steps.less";
-@import "components/breadcrumb-navigation/breadcrumb-navigation.less";
 @import "components/adjuncts-list/adjuncts-list.less";
 
 .oneline {
diff --git 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.controller.js
 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.controller.js
index d80d1c40..b6c870ee 100644
--- 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.controller.js
+++ 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.controller.js
@@ -270,6 +270,8 @@ function DetailController($scope, $state, $stateParams, 
$location, $log, $uibMod
         activityApi.activity(activityId).then((response)=> {
             vm.model.activity = response.data;
 
+            initializeBreadcrumbs(response.data);
+
             delete $scope.actions['effector'];
             delete $scope.actions['invokeAgain'];
             if ((vm.model.activity.tags || []).find(t => t=="EFFECTOR")) {
@@ -344,6 +346,26 @@ function DetailController($scope, $state, $stateParams, 
$location, $log, $uibMod
             }
         }
 
+        $scope.breadcrumbsLoading = true;
+        $scope.breadcrumbs = [];
+        $scope.breadcrumbsExpanded = false;
+        function initializeBreadcrumbs(activity) {
+            $scope.breadcrumbs.unshift(activity);
+            if (activity.submittedByTask) {
+                
activityApi.activity(activity.submittedByTask.metadata.id).then(response => {
+                    initializeBreadcrumbs(response.data);
+                }).catch(e => {
+                    console.warn("Error loading breadcrumbs", e);
+                    $scope.breadcrumbsLoading = false;
+                });
+            } else {
+                $scope.breadcrumbsLoading = false;
+            }
+        }
+        vm.expandBreadcrumbs = () => {
+            $scope.breadcrumbsExpanded = true;
+        }
+
         activityApi.activityChildren(activityId).then((response)=> {
             vm.model.activityChildren = processActivityChildren(response.data);
             vm.error = undefined;
diff --git 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.less 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.less
index 30ca85f9..81dba08f 100644
--- 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.less
+++ 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.less
@@ -263,3 +263,22 @@
     width: auto;
     max-width: 32em;
 }
+
+
+.tasks-breadcrumbs {
+    > li {
+        padding-right: 0.5ex;  // balance the \A0 included after the / in the 
bootstrap breadcrumb separator
+    }
+}
+.tasks-breadcrumbs-ellipsis {
+    cursor: pointer;
+}
+.tasks-breadcrumbs-loading {
+    display: block;
+    background-image: url(../../../../../img/loading-ellipsis.svg);
+    background-repeat: no-repeat;
+    background-position-y: center;
+    background-position-x: center;
+    width: 50px;
+    height: 1em;
+}
\ No newline at end of file
diff --git 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.template.html
 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.template.html
index c78452d7..8c208045 100644
--- 
a/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.template.html
+++ 
b/ui-modules/app-inspector/app/views/main/inspect/activities/detail/detail.template.html
@@ -20,19 +20,16 @@
     <div>
         <loading-state error="vm.error" trust-error="true" 
ng-if="!vm.model.activity.id || !vm.model.activityChildren"></loading-state>
 
-        <div ng-if="vm.model.activity.id && vm.model.activityChildren">
-            <ol class="breadcrumb" ng-show="showParents">
-                <li breadcrumb-navigation 
parent-id="{{vm.model.activity.submittedByTask.metadata.id}}"
-                    entity-id="{{vm.model.entityId}}"></li>
-                <li class="breadcrumb-item 
active">{{vm.model.activity.displayName}}</li>
-            </ol>
-            <ol class="breadcrumb" ng-show="!showParents && 
vm.model.activity.submittedByTask">
-                <li ng-click="showParents=true" class="revealParentsEllipse"> 
...</li>
-                <li class="breadcrumb-item">
-                    <a class="breadcrumb-item ready"
-                       ui-sref="main.inspect.activities.detail({entityId: 
vm.model.entityId, activityId: 
vm.model.activity.submittedByTask.metadata.id})">{{vm.model.activity.submittedByTask.metadata.taskName}}</a>
-                </li>
-                <li class="breadcrumb-item 
active">{{vm.model.activity.displayName}}</li>
+        <div>
+            <ol class="breadcrumb tasks-breadcrumbs">
+                <li class="breadcrumb-item tasks-breadcrumbs-loading" 
ng-if="breadcrumbsLoading"></li>
+                <li ng-repeat-start="bc in breadcrumbs" 
ng-if="breadcrumbsExpanded || $index<=0 || $index>=breadcrumbs.length-2 || 
breadcrumbs.length<=4" class="breadcrumb-item"><a
+                    class="breadcrumb-item ready"
+                       ui-sref="main.inspect.activities.detail({entityId: 
vm.model.entityId, activityId: vm.model.activity.submittedByTask.metadata.id})"
+                    >{{bc.displayName}}</a></li>
+                <li ng-if="!breadcrumbsExpanded && $index==0 && 
breadcrumbs.length>4" class="breadcrumb-item"><a
+                        ng-click="vm.expandBreadcrumbs()" 
class="tasks-breadcrumbs-ellipsis">...</a></li>
+                <span ng-repeat-end ng-if="false"></span>
             </ol>
         </div>
 

Reply via email to