ui-modules/app-inspector/app/components/entity-tree/entity-tree.directive.js - brooklyn-ui - Git at Google

 /*
  * 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 brooklynStatus from 'brooklyn-ui-utils/status/status';
 import brWebNotifications from 'brooklyn-ui-utils/web-notifications/web-notifications';

 import entityTreeTemplate from './entity-tree.html';
 import entityNodeTemplate from './entity-node.html';
 import {inspectState} from '../../views/main/inspect/inspect.controller';
 import {summaryState} from '../../views/main/inspect/summary/summary.controller';
 import {activitiesState} from '../../views/main/inspect/activities/activities.controller';
 import {detailState} from '../../views/main/inspect/activities/detail/detail.controller';
 import {managementState} from '../../views/main/inspect/management/management.controller';
 import {detailState as managementDetailState} from '../../views/main/inspect/management/detail/detail.controller';
 import {HIDE_INTERSTITIAL_SPINNER_EVENT} from 'brooklyn-ui-utils/interstitial-spinner/interstitial-spinner';
 import {RELATIONSHIP_VIEW_DELIMITER, VIEW_PARENT_CHILD} from '../../views/main/main.controller';

 const MODULE_NAME = 'inspector.entity.tree';

 angular.module(MODULE_NAME, [brooklynStatus, brWebNotifications])
     .directive('entityTree', entityTreeDirective)
     .directive('entityNode', entityNodeDirective);

 export default MODULE_NAME;

 export function entityTreeDirective() {
     return {
         restrict: 'E',
         template: entityTreeTemplate,
         scope: {
             sortReverse: '=',
             viewModes: '=',
             viewMode: '<'
         },
         controller: ['$scope', '$state', 'applicationApi', 'entityApi', 'iconService', 'brWebNotifications', controller],
         controllerAs: 'vm'
     };

     function controller($scope, $state, applicationApi, entityApi, iconService, brWebNotifications) {
         $scope.$emit(HIDE_INTERSTITIAL_SPINNER_EVENT);

         let vm = this;

         let observers = [];

         applicationApi.applicationsTree({
             sensors: 'deployment.metadata'
         }).then((response)=> {
             vm.applications = response.data;
             analyzeRelationships(vm.applications);

             observers.push(response.subscribe((response)=> {
                 response.data
                     .filter(x => vm.applications.map(y => y.id).indexOf(x.id) === -1)
                     .forEach((app) => {
                         spawnNotification(app, {
                             body: 'New application deployment. Current status: ' + app.serviceState,
                             data: $state.href('main.inspect.summary', {applicationId: app.id, entityId: app.id})
                         });
                     });
                 vm.applications
                     .filter(x => response.data.map(y => y.id).indexOf(x.id) === -1)
                     .forEach((app) => {
                         spawnNotification(app, {
                             body: 'Application permanently un-deployed',
                             data: $state.href('main')
                         });
                     });

                 vm.applications = response.data;
                 analyzeRelationships(vm.applications);

                 function spawnNotification(app, opts) {
                     iconService.get(app).then((icon)=> {
                         let options = Object.assign({
                             icon: app.iconUrl || icon,
                         }, opts);

                         brWebNotifications.send('Brooklyn: ' + app.name, options);
                     });
                 }
             }));

             /**
              * Analyzes relationships of the entity tree and prepares mode views, e.g. 'parent/child'.
              *
              * @param {Array.<Object>} entityTree The entity tree to process and prepare view modes for.
              */
             function analyzeRelationships(entityTree) {
                 let entities = entityTreeToArray(entityTree);
                 let relationships = findAllRelationships(entities);

                 // Initialize entity tree with 'parent/child' view first (default view).
                 initParentChildView(entities);

                 // Identify new view modes based on relationships. This adds a drop-down menu with new views if found any.
                 updateViewModes(relationships);

                 // Re-arrange entity tree for other views if present.
                 addOtherViews(entities, relationships);
             }

             /**
              * Converts entity tree to array of entities.
              *
              * @param {Array.<Object>} entities The entity tree to convert.
              * @returns {Array.<Object>} The array of all entities found in the tree.
              */
             function entityTreeToArray(entities) {
                 let nodes = [];
                 if (!Array.isArray(entities) || entities.length === 0) {
                     return nodes;
                 }
                 entities.forEach(entity => {
                     nodes = nodes.concat(entityTreeToArray(entity.children));
                     nodes = nodes.concat(entityTreeToArray(entity.members));
                 });
                 return entities.concat(nodes);
             }

             /**
              * Extends entity tree with other view modes. Moves entities (creates copies) if their host is
              * not a parent and labels them to display under other view modes only.
              *
              * @param {Array.<Object>} entities The entity tree converted to array.
              * @param {Array.<Object>} relationships The relationships of entities.
              */
             function addOtherViews(entities, relationships) {
                 let otherViews = Array.from($scope.viewModes).filter(r => r !== VIEW_PARENT_CHILD);
                 otherViews.forEach(view => {

                     // Get 'OTHER_PARENT' and 'OTHER_CHILD' identifiers.
                     const {OTHER_PARENT, OTHER_CHILD} = getRelationshipViewIdentifiers(view);

                     // Phase 1. Look through all entities found in the entity tree: process entity with 'OTHER_PARENT'
                     //          roles and entities without roles.
                     entities.forEach(entity => {

                         // Get relationship roles for an entity.
                         const {parentRole, childRole} = getRelationshipRoles(relationships, entity.id, OTHER_PARENT, OTHER_CHILD);

                         if (parentRole) {

                             // Label every 'OTHER_PARENT' entity to display and highlight in 'OTHER_PARENT/OTHER_CHILD'
                             // view mode, only if it does not play the role of 'OTHER_CHILD' at the same time.
                             if (!childRole) {
                                 displayEntityInView(entity, view);
                                 highlightEntityInView(entity, view);
                             }

                             // Look for 'OTHER_CHILD' entities under 'OTHER_PARENT', flip or move them and label to display in
                             // 'OTHER_PARENT/OTHER_CHILD' view mode respectively.
                             parentRole.targets.forEach(target => {
                                 let relatedEntity = findEntity(entities, target);
                                 if (relatedEntity) {
                                     highlightEntityInView(relatedEntity, view);
                                     displayParentsInView(entities, relatedEntity.parentId, view);

                                     // Re-arrange the tree if related 'OTHER_CHILD' entity is not a child of 'OTHER_PARENT'.
                                     if (relatedEntity.parentId !== entity.id) {

                                         if (relatedEntity.id === entity.parentId) {
                                             // 4.1. Flip 'OTHER_CHILD' parent with a 'OTHER_PARENT' child.
                                             flipParentAndChild(relatedEntity, entity, entities, view);
                                         } else {
                                             // 4.2. Move 'OTHER_CHILD' entity to a new 'OTHER_PARENT' parent.
                                             moveEntityToParent(relatedEntity, entity, entities, view);
                                         }
                                     }
                                 }
                             });
                         } else if (!parentRole && !childRole) {

                             // Display original position for any other entity under 'OTHER_PARENT/OTHER_CHILD' view. Do
                             // no highlight entities that are required to be displayed but do not belong to this view.
                             displayEntityInView(entity, view);
                         }
                     });

                     // Phase 2. Look through all entities found again and process entities that play both roles:
                     //          'OTHER_PARENT' and 'OTHER_CHILD'.
                     entities.forEach(entity => {

                         // Get relationship roles for an entity.
                         const {parentRole, childRole} = getRelationshipRoles(relationships, entity.id, OTHER_PARENT, OTHER_CHILD);

                         if (childRole) {

                             if (parentRole) {
                                 // Find new position where entity is an 'OTHER_CHILD' already, but to become 'OTHER_PARENT' as well.
                                 let newParentPosition = findEntityInOtherNodes(entities, entity.id);

                                 // Move 'OTHER_CHILD' entities added in Phase 1 to a new parent.
                                 if (entity.otherNodes && newParentPosition) {
                                     entity.otherNodes.forEach(entityToMove => {
                                         moveEntityToParent(entityToMove, newParentPosition, entities, view, false);
                                     });
                                 }
                             }

                             adjustVisibilityOfMovedEntity(entity, view);
                         }
                     });
                 });
             }

             /**
              * @returns {{OTHER_PARENT, OTHER_CHILD}} tuple with relationship view identifiers.
              */
             function getRelationshipViewIdentifiers(view) {
                 const otherParentChildIdentifiers = view.split(RELATIONSHIP_VIEW_DELIMITER);
                 let OTHER_PARENT = otherParentChildIdentifiers[0];
                 let OTHER_CHILD = otherParentChildIdentifiers[1];
                 return {OTHER_PARENT, OTHER_CHILD};
             }

             /**
              * @returns {{parentRole, childRole}} relationships tuple with parent and child roles.
              */
             function getRelationshipRoles(relationships, entityId, parentViewIdentifier, childViewIdentifier) {
                 const relationshipsFound = relationships.filter(r => r.id === entityId);
                 const parentRole = relationshipsFound.find(r => r.name === parentViewIdentifier);
                 const childRole = relationshipsFound.find(r => r.name === childViewIdentifier);
                 return {parentRole, childRole};
             }

             /**
              * Flips parent entity with its child.
              *
              * @param {Object} parent The parent entity to flip with its child.
              * @param {Object} child The child entity to flip with its parent.
              * @param {Array.<Object>} entities The entity tree converted to array.
              * @param {string} viewMode The view mode to display copy of the entity in only.
              */
             function flipParentAndChild(parent, child, entities, viewMode) {
                 let parentOfTheParent = findEntity(entities, parent.parentId);
                 if (parentOfTheParent) {
                     hideEntityInView(child, viewMode);
                     let childCopy = moveEntityToParent(child, parentOfTheParent, entities, viewMode);
                     moveEntityToParent(parent, childCopy, entities, viewMode);
                 }
             }

             /**
              * Moves entity to a new parent, creates copy of the entity under parent.otherNodes.
              *
              * @param {Object} entity The entity to move.
              * @param {Object} parent The parent to move entity to.
              * @param {Array.<Object>} entities The entity tree converted to array.
              * @param {string} viewMode The view mode to display copy of the entity in only.
              * @param {boolean} decorateName Indicates whether to decorate name or not, true by default.
              * @returns {Object} The copy of the entity under parent.otherNodes.
              */
             function moveEntityToParent(entity, parent, entities, viewMode, decorateName = true) {
                 // 1. Create a copy.
                 let entityCopy = Object.assign({}, entity);

                 // 2. Include the name of the original parent.
                 let parentOfEntity = findEntity(entities, entityCopy.parentId);
                 if (parentOfEntity && decorateName) {
                     entityCopy.name += ' (' + parentOfEntity.name + ')';
                 }

                 // 3. Label it to display in a view mode specified only.
                 entityCopy.viewModes = null;
                 displayEntityInView(entityCopy, viewMode);

                 // 4. Mark original entity as been "moved" in this view.
                 if (!entity.movedInView) {
                     entity.movedInView = new Set([viewMode]);
                 } else {
                     entity.movedInView.add(viewMode);
                 }

                 // 5. Add copy under otherNodes.
                 if (!parent.otherNodes) {
                     parent.otherNodes = [entityCopy];
                 } else {
                     parent.otherNodes.push(entityCopy);
                 }

                 return entityCopy;
             }

             /**
              * Labels all parents to display for a particular view mode starting from a specified ID, traverses the node
              * tree recursively, bottom-up.
              *
              * @param {Array.<Object>} entities The array of entities to search parents to label.
              * @param {string} id The ID of a parent entity to start labelling.
              * @param {string} viewMode The view mode to display parent in.
              */
             function displayParentsInView(entities, id, viewMode) {
                 let entity = findEntity(entities, id);
                 if (entity) {
                     displayEntityInView(entity, viewMode);
                     displayParentsInView(entities, entity.parentId, viewMode);
                 }
             }

             /**
              * Attempts to find entity with ID specified in array of entities.
              *
              * @param {Array.<Object>} entities The array of entities to search for a particular entity in.
              * @param {string} id The ID of entity to look for.
              * @returns {Object} The entity with ID requested, and undefined otherwise.
              */
             function findEntity(entities, id) {
                 return entities.find(entity => entity.id === id) || null;
             }

             /**
              * Attempts to find entity with ID specified in array of entities under 'otherNodes'.
              *
              * @param {Array.<Object>} entities The array of entities to search for a particular entity in.
              * @param {string} id The ID of entity to look for under 'otherNodes'.
              * @returns {Object} The entity with ID requested, and undefined otherwise.
              */
             function findEntityInOtherNodes(entities, id) {
                 for (const entity of entities) {
                     if (entity.otherNodes) {
                         let found = entity.otherNodes.find(e => e.id === id);
                         if (found) {
                             return found;
                         }
                     }
                 }
                 return null;
             }

             /**
              * Labels entity to not display in particular view mode.
              *
              * @param {Object} entity The entity to label.
              * @param {string} viewMode The view mode to not display entity in.
              */
             function hideEntityInView(entity, viewMode) {
                 if (entity.viewModes) {
                     entity.viewModes.delete(viewMode);
                 }
             }

             /**
              * Labels entity to display in particular view mode.
              *
              * @param {Object} entity The entity to label.
              * @param {string} viewMode The view mode to display entity in.
              */
             function displayEntityInView(entity, viewMode) {
                 if (!entity.viewModes) {
                     entity.viewModes = new Set([viewMode]);
                 } else {
                     entity.viewModes.add(viewMode);
                 }
             }

             /**
              * Hides entity if marked as moved in a particular view, and displays it otherwise.
              *
              * @param {Object} entity The entity to adjust visibility for.
              * @param {string} viewMode The view mode to check visibility of a moved entity
              */
             function adjustVisibilityOfMovedEntity(entity, viewMode) {
                 if (entity.movedInView && entity.movedInView.has(viewMode)) {
                     hideEntityInView(entity, viewMode);
                 } else {
                     displayEntityInView(entity, viewMode);
                 }
             }

             /**
              * Labels entity to highlight in particular view mode.
              *
              * @param {Object} entity The entity to label.
              * @param {string} viewMode The view mode to highlight entity in.
              */
             function highlightEntityInView(entity, viewMode) {
                 if (!entity.viewModesHighlight) {
                     entity.viewModesHighlight = new Set([viewMode]);
                 } else {
                     entity.viewModesHighlight.add(viewMode);
                 }
             }

             /**
              * Initializes entity tree with 'parent/child' view mode. This is a default view mode.
              *
              * @param {Array.<Object>} entities The entity tree to initialize with 'parent/child' view mode.
              */
             function initParentChildView(entities) {
                 entities.forEach(entity => {
                     displayEntityInView(entity, VIEW_PARENT_CHILD);
                 });
             }

             /**
              * Identifies new view modes based on relationships between entities. Updates {@link $scope.viewModes} set.
              *
              * @param {Array.<Object>} relationships The relationships of entities.
              */
             function updateViewModes(relationships) {
                 let viewModesDiscovered = new Set([VIEW_PARENT_CHILD]); // 'parent/child' view mode is a minimum required

                 relationships.forEach(relationship => {
                     relationship.targets.forEach(id => {
                         let target = relationships.find(item => item.id === id);
                         if (target && relationship.name !== target.name) {
                             let uniqueRelationshipName = [relationship.name, target.name].sort().join(RELATIONSHIP_VIEW_DELIMITER);
                             viewModesDiscovered.add(uniqueRelationshipName);
                         }
                     })
                 });

                 $scope.viewModes = viewModesDiscovered; // Refresh view modes
             }

             /**
              * Finds relationships in array of entities.
              *
              * @param {Array.<Object>} entities The array of entities to search relationships in.
              * @returns {Array.<Object>} Relationships found in entities.
              */
             function findAllRelationships(entities) {
                 let relationships = [];

                 if (!Array.isArray(entities) || entities.length === 0) {
                     return relationships;
                 }

                 entities.forEach(entity => {
                     if (Array.isArray(entity.relations)) {
                         entity.relations.forEach(r => {
                             let relationship = {
                                 id: entity.id,
                                 name: r.type.name.split('/')[0], // read name up until '/'
                                 targets: Array.isArray(r.targets) ? r.targets : []
                             }
                             relationships.push(relationship)
                         });
                     }
                 });

                 return relationships;
             }
         });

         $scope.$on('$destroy', ()=> {
             observers.forEach((observer)=> {
                 observer.unsubscribe();
             });
         });
     }
 }

 export function entityNodeDirective() {
     return {
         restrict: 'E',
         template: entityNodeTemplate,
         scope: {
             entity: '<',
             applicationId: '<',
             viewMode: '<'
         },
         link: link,
         controller: ['$scope', '$state', '$stateParams', 'iconService', controller]
     };

     function link($scope) {
         $scope.$on('notifyEntity', function (ev, data) {
             if ($scope.entity.id) {
                 if (data.id !== $scope.entity.id) {
                     switch (data.message) {
                         case 'expandChildren':
                             $scope.isOpen = data.open;
                             $scope.isChildrenOpen = data.open;
                             break;
                         case 'openChildren' :
                             $scope.isOpen = data.open;
                     }
                 }
             }
         });
     }

     function controller ($scope, $state, $stateParams, iconService) {
         $scope.isOpen = true;
         if ($scope.entity.type) {
             iconService.get($scope.entity, true).then(value => $scope.iconUrl = value);
         } else {
             // it's a member of a group; we could look up the target and take that icon, but for now, no icon
         }

         if ($stateParams.entityId === $scope.entity.id) {
             $scope.$emit('notifyEntity', {
                 message: 'expandChildren',
                 id: $scope.entity.id,
                 open: true
             });
         }

         $scope.isSelected = function() {
             return $stateParams.entityId === $scope.entity.id;
         };

         $scope.getHref = function() {
             if ($state.current.name.startsWith(detailState.name)) {
                 return $state.href(activitiesState.name, {
                     applicationId: $scope.applicationId,
                     entityId: $scope.entity.id
                 });
             }
             if ($state.current.name.startsWith(managementDetailState.name)) {
                 return $state.href(managementState.name, {
                     applicationId: $scope.applicationId,
                     entityId: $scope.entity.id
                 });
             }
             if ($state.current.name.startsWith(inspectState.name)) {
                 return $state.href($state.current.name, {
                     applicationId: $scope.applicationId,
                     entityId: $scope.entity.id
                 });
             }
             return $state.href(summaryState.name, {
                 applicationId: $scope.applicationId,
                 entityId: $scope.entity.id
             });
         };

         $scope.onToggle = function ($event) {
             if ($event.shiftKey && $event.metaKey) {
                 $scope.isChildrenOpen = !$scope.isChildrenOpen;
                 $scope.$broadcast('notifyEntity', {
                     'message': 'expandChildren',
                     'id': $scope.entity.id,
                     'open': $scope.isChildrenOpen
                 });
             } else {
                 $scope.isOpen = true;
                 $scope.isChildrenOpen = !$scope.isChildrenOpen;
                 $scope.$broadcast('notifyEntity', {
                     'message': 'openChildren',
                     'id': $scope.entityId,
                     'open': $scope.isOpen
                 });
             }
         };

         /**
          * @returns {boolean} True if to highlight entity in a current view, false otherwise.
          */
         $scope.isHighlight = function() {
             return $scope.entity.viewModesHighlight && $scope.entity.viewModesHighlight.has($scope.viewMode);
         };

         /**
          * Counts amount of entity nodes that are expected to be displayed in the current view.
          *
          * @returns {number} Amount of entity nodes in the current view.
          */
         $scope.nodesInCurrentView = () => {
             let amount = 0;
             if ($scope.entity.children) {
                 amount += $scope.entity.children.filter(entity => entity.viewModes.has($scope.viewMode)).length;
             }
             if ($scope.entity.members) {
                 amount += $scope.entity.members.filter(entity => entity.viewModes.has($scope.viewMode)).length;
             }
             if ($scope.entity.otherNodes) {
                 amount += $scope.entity.otherNodes.filter(entity => entity.viewModes.has($scope.viewMode)).length;
             }
             return amount;
         }
     }
 }
	/*
	* 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 brooklynStatus from 'brooklyn-ui-utils/status/status';
	import brWebNotifications from 'brooklyn-ui-utils/web-notifications/web-notifications';

	import entityTreeTemplate from './entity-tree.html';
	import entityNodeTemplate from './entity-node.html';
	import {inspectState} from '../../views/main/inspect/inspect.controller';
	import {summaryState} from '../../views/main/inspect/summary/summary.controller';
	import {activitiesState} from '../../views/main/inspect/activities/activities.controller';
	import {detailState} from '../../views/main/inspect/activities/detail/detail.controller';
	import {managementState} from '../../views/main/inspect/management/management.controller';
	import {detailState as managementDetailState} from '../../views/main/inspect/management/detail/detail.controller';
	import {HIDE_INTERSTITIAL_SPINNER_EVENT} from 'brooklyn-ui-utils/interstitial-spinner/interstitial-spinner';
	import {RELATIONSHIP_VIEW_DELIMITER, VIEW_PARENT_CHILD} from '../../views/main/main.controller';

	const MODULE_NAME = 'inspector.entity.tree';

	angular.module(MODULE_NAME, [brooklynStatus, brWebNotifications])
	.directive('entityTree', entityTreeDirective)
	.directive('entityNode', entityNodeDirective);

	export default MODULE_NAME;

	export function entityTreeDirective() {
	return {
	restrict: 'E',
	template: entityTreeTemplate,
	scope: {
	sortReverse: '=',
	viewModes: '=',
	viewMode: '<'
	},
	controller: ['$scope', '$state', 'applicationApi', 'entityApi', 'iconService', 'brWebNotifications', controller],
	controllerAs: 'vm'
	};

	function controller($scope, $state, applicationApi, entityApi, iconService, brWebNotifications) {
	$scope.$emit(HIDE_INTERSTITIAL_SPINNER_EVENT);

	let vm = this;

	let observers = [];

	applicationApi.applicationsTree({
	sensors: 'deployment.metadata'
	}).then((response)=> {
	vm.applications = response.data;
	analyzeRelationships(vm.applications);

	observers.push(response.subscribe((response)=> {
	response.data
	.filter(x => vm.applications.map(y => y.id).indexOf(x.id) === -1)
	.forEach((app) => {
	spawnNotification(app, {
	body: 'New application deployment. Current status: ' + app.serviceState,
	data: $state.href('main.inspect.summary', {applicationId: app.id, entityId: app.id})
	});
	});
	vm.applications
	.filter(x => response.data.map(y => y.id).indexOf(x.id) === -1)
	.forEach((app) => {
	spawnNotification(app, {
	body: 'Application permanently un-deployed',
	data: $state.href('main')
	});
	});

	vm.applications = response.data;
	analyzeRelationships(vm.applications);

	function spawnNotification(app, opts) {
	iconService.get(app).then((icon)=> {
	let options = Object.assign({
	icon: app.iconUrl \|\| icon,
	}, opts);

	brWebNotifications.send('Brooklyn: ' + app.name, options);
	});
	}
	}));

	/**
	* Analyzes relationships of the entity tree and prepares mode views, e.g. 'parent/child'.
	*
	* @param {Array.<Object>} entityTree The entity tree to process and prepare view modes for.
	*/
	function analyzeRelationships(entityTree) {
	let entities = entityTreeToArray(entityTree);
	let relationships = findAllRelationships(entities);

	// Initialize entity tree with 'parent/child' view first (default view).
	initParentChildView(entities);

	// Identify new view modes based on relationships. This adds a drop-down menu with new views if found any.
	updateViewModes(relationships);

	// Re-arrange entity tree for other views if present.
	addOtherViews(entities, relationships);
	}

	/**
	* Converts entity tree to array of entities.
	*
	* @param {Array.<Object>} entities The entity tree to convert.
	* @returns {Array.<Object>} The array of all entities found in the tree.
	*/
	function entityTreeToArray(entities) {
	let nodes = [];
	if (!Array.isArray(entities) \|\| entities.length === 0) {
	return nodes;
	}
	entities.forEach(entity => {
	nodes = nodes.concat(entityTreeToArray(entity.children));
	nodes = nodes.concat(entityTreeToArray(entity.members));
	});
	return entities.concat(nodes);
	}

	/**
	* Extends entity tree with other view modes. Moves entities (creates copies) if their host is
	* not a parent and labels them to display under other view modes only.
	*
	* @param {Array.<Object>} entities The entity tree converted to array.
	* @param {Array.<Object>} relationships The relationships of entities.
	*/
	function addOtherViews(entities, relationships) {
	let otherViews = Array.from($scope.viewModes).filter(r => r !== VIEW_PARENT_CHILD);
	otherViews.forEach(view => {

	// Get 'OTHER_PARENT' and 'OTHER_CHILD' identifiers.
	const {OTHER_PARENT, OTHER_CHILD} = getRelationshipViewIdentifiers(view);

	// Phase 1. Look through all entities found in the entity tree: process entity with 'OTHER_PARENT'
	// roles and entities without roles.
	entities.forEach(entity => {

	// Get relationship roles for an entity.
	const {parentRole, childRole} = getRelationshipRoles(relationships, entity.id, OTHER_PARENT, OTHER_CHILD);

	if (parentRole) {

	// Label every 'OTHER_PARENT' entity to display and highlight in 'OTHER_PARENT/OTHER_CHILD'
	// view mode, only if it does not play the role of 'OTHER_CHILD' at the same time.
	if (!childRole) {
	displayEntityInView(entity, view);
	highlightEntityInView(entity, view);
	}

	// Look for 'OTHER_CHILD' entities under 'OTHER_PARENT', flip or move them and label to display in
	// 'OTHER_PARENT/OTHER_CHILD' view mode respectively.
	parentRole.targets.forEach(target => {
	let relatedEntity = findEntity(entities, target);
	if (relatedEntity) {
	highlightEntityInView(relatedEntity, view);
	displayParentsInView(entities, relatedEntity.parentId, view);

	// Re-arrange the tree if related 'OTHER_CHILD' entity is not a child of 'OTHER_PARENT'.
	if (relatedEntity.parentId !== entity.id) {

	if (relatedEntity.id === entity.parentId) {
	// 4.1. Flip 'OTHER_CHILD' parent with a 'OTHER_PARENT' child.
	flipParentAndChild(relatedEntity, entity, entities, view);
	} else {
	// 4.2. Move 'OTHER_CHILD' entity to a new 'OTHER_PARENT' parent.
	moveEntityToParent(relatedEntity, entity, entities, view);
	}
	}
	}
	});
	} else if (!parentRole && !childRole) {

	// Display original position for any other entity under 'OTHER_PARENT/OTHER_CHILD' view. Do
	// no highlight entities that are required to be displayed but do not belong to this view.
	displayEntityInView(entity, view);
	}
	});

	// Phase 2. Look through all entities found again and process entities that play both roles:
	// 'OTHER_PARENT' and 'OTHER_CHILD'.
	entities.forEach(entity => {

	// Get relationship roles for an entity.
	const {parentRole, childRole} = getRelationshipRoles(relationships, entity.id, OTHER_PARENT, OTHER_CHILD);

	if (childRole) {

	if (parentRole) {
	// Find new position where entity is an 'OTHER_CHILD' already, but to become 'OTHER_PARENT' as well.
	let newParentPosition = findEntityInOtherNodes(entities, entity.id);

	// Move 'OTHER_CHILD' entities added in Phase 1 to a new parent.
	if (entity.otherNodes && newParentPosition) {
	entity.otherNodes.forEach(entityToMove => {
	moveEntityToParent(entityToMove, newParentPosition, entities, view, false);
	});
	}
	}

	adjustVisibilityOfMovedEntity(entity, view);
	}
	});
	});
	}

	/**
	* @returns {{OTHER_PARENT, OTHER_CHILD}} tuple with relationship view identifiers.
	*/
	function getRelationshipViewIdentifiers(view) {
	const otherParentChildIdentifiers = view.split(RELATIONSHIP_VIEW_DELIMITER);
	let OTHER_PARENT = otherParentChildIdentifiers[0];
	let OTHER_CHILD = otherParentChildIdentifiers[1];
	return {OTHER_PARENT, OTHER_CHILD};
	}

	/**
	* @returns {{parentRole, childRole}} relationships tuple with parent and child roles.
	*/
	function getRelationshipRoles(relationships, entityId, parentViewIdentifier, childViewIdentifier) {
	const relationshipsFound = relationships.filter(r => r.id === entityId);
	const parentRole = relationshipsFound.find(r => r.name === parentViewIdentifier);
	const childRole = relationshipsFound.find(r => r.name === childViewIdentifier);
	return {parentRole, childRole};
	}

	/**
	* Flips parent entity with its child.
	*
	* @param {Object} parent The parent entity to flip with its child.
	* @param {Object} child The child entity to flip with its parent.
	* @param {Array.<Object>} entities The entity tree converted to array.
	* @param {string} viewMode The view mode to display copy of the entity in only.
	*/
	function flipParentAndChild(parent, child, entities, viewMode) {
	let parentOfTheParent = findEntity(entities, parent.parentId);
	if (parentOfTheParent) {
	hideEntityInView(child, viewMode);
	let childCopy = moveEntityToParent(child, parentOfTheParent, entities, viewMode);
	moveEntityToParent(parent, childCopy, entities, viewMode);
	}
	}

	/**
	* Moves entity to a new parent, creates copy of the entity under parent.otherNodes.
	*
	* @param {Object} entity The entity to move.
	* @param {Object} parent The parent to move entity to.
	* @param {Array.<Object>} entities The entity tree converted to array.
	* @param {string} viewMode The view mode to display copy of the entity in only.
	* @param {boolean} decorateName Indicates whether to decorate name or not, true by default.
	* @returns {Object} The copy of the entity under parent.otherNodes.
	*/
	function moveEntityToParent(entity, parent, entities, viewMode, decorateName = true) {
	// 1. Create a copy.
	let entityCopy = Object.assign({}, entity);

	// 2. Include the name of the original parent.
	let parentOfEntity = findEntity(entities, entityCopy.parentId);
	if (parentOfEntity && decorateName) {
	entityCopy.name += ' (' + parentOfEntity.name + ')';
	}

	// 3. Label it to display in a view mode specified only.
	entityCopy.viewModes = null;
	displayEntityInView(entityCopy, viewMode);

	// 4. Mark original entity as been "moved" in this view.
	if (!entity.movedInView) {
	entity.movedInView = new Set([viewMode]);
	} else {
	entity.movedInView.add(viewMode);
	}

	// 5. Add copy under otherNodes.
	if (!parent.otherNodes) {
	parent.otherNodes = [entityCopy];
	} else {
	parent.otherNodes.push(entityCopy);
	}

	return entityCopy;
	}

	/**
	* Labels all parents to display for a particular view mode starting from a specified ID, traverses the node
	* tree recursively, bottom-up.
	*
	* @param {Array.<Object>} entities The array of entities to search parents to label.
	* @param {string} id The ID of a parent entity to start labelling.
	* @param {string} viewMode The view mode to display parent in.
	*/
	function displayParentsInView(entities, id, viewMode) {
	let entity = findEntity(entities, id);
	if (entity) {
	displayEntityInView(entity, viewMode);
	displayParentsInView(entities, entity.parentId, viewMode);
	}
	}

	/**
	* Attempts to find entity with ID specified in array of entities.
	*
	* @param {Array.<Object>} entities The array of entities to search for a particular entity in.
	* @param {string} id The ID of entity to look for.
	* @returns {Object} The entity with ID requested, and undefined otherwise.
	*/
	function findEntity(entities, id) {
	return entities.find(entity => entity.id === id) \|\| null;
	}

	/**
	* Attempts to find entity with ID specified in array of entities under 'otherNodes'.
	*
	* @param {Array.<Object>} entities The array of entities to search for a particular entity in.
	* @param {string} id The ID of entity to look for under 'otherNodes'.
	* @returns {Object} The entity with ID requested, and undefined otherwise.
	*/
	function findEntityInOtherNodes(entities, id) {
	for (const entity of entities) {
	if (entity.otherNodes) {
	let found = entity.otherNodes.find(e => e.id === id);
	if (found) {
	return found;
	}
	}
	}
	return null;
	}

	/**
	* Labels entity to not display in particular view mode.
	*
	* @param {Object} entity The entity to label.
	* @param {string} viewMode The view mode to not display entity in.
	*/
	function hideEntityInView(entity, viewMode) {
	if (entity.viewModes) {
	entity.viewModes.delete(viewMode);
	}
	}

	/**
	* Labels entity to display in particular view mode.
	*
	* @param {Object} entity The entity to label.
	* @param {string} viewMode The view mode to display entity in.
	*/
	function displayEntityInView(entity, viewMode) {
	if (!entity.viewModes) {
	entity.viewModes = new Set([viewMode]);
	} else {
	entity.viewModes.add(viewMode);
	}
	}

	/**
	* Hides entity if marked as moved in a particular view, and displays it otherwise.
	*
	* @param {Object} entity The entity to adjust visibility for.
	* @param {string} viewMode The view mode to check visibility of a moved entity
	*/
	function adjustVisibilityOfMovedEntity(entity, viewMode) {
	if (entity.movedInView && entity.movedInView.has(viewMode)) {
	hideEntityInView(entity, viewMode);
	} else {
	displayEntityInView(entity, viewMode);
	}
	}

	/**
	* Labels entity to highlight in particular view mode.
	*
	* @param {Object} entity The entity to label.
	* @param {string} viewMode The view mode to highlight entity in.
	*/
	function highlightEntityInView(entity, viewMode) {
	if (!entity.viewModesHighlight) {
	entity.viewModesHighlight = new Set([viewMode]);
	} else {
	entity.viewModesHighlight.add(viewMode);
	}
	}

	/**
	* Initializes entity tree with 'parent/child' view mode. This is a default view mode.
	*
	* @param {Array.<Object>} entities The entity tree to initialize with 'parent/child' view mode.
	*/
	function initParentChildView(entities) {
	entities.forEach(entity => {
	displayEntityInView(entity, VIEW_PARENT_CHILD);
	});
	}

	/**
	* Identifies new view modes based on relationships between entities. Updates {@link $scope.viewModes} set.
	*
	* @param {Array.<Object>} relationships The relationships of entities.
	*/
	function updateViewModes(relationships) {
	let viewModesDiscovered = new Set([VIEW_PARENT_CHILD]); // 'parent/child' view mode is a minimum required

	relationships.forEach(relationship => {
	relationship.targets.forEach(id => {
	let target = relationships.find(item => item.id === id);
	if (target && relationship.name !== target.name) {
	let uniqueRelationshipName = [relationship.name, target.name].sort().join(RELATIONSHIP_VIEW_DELIMITER);
	viewModesDiscovered.add(uniqueRelationshipName);
	}
	})
	});

	$scope.viewModes = viewModesDiscovered; // Refresh view modes
	}

	/**
	* Finds relationships in array of entities.
	*
	* @param {Array.<Object>} entities The array of entities to search relationships in.
	* @returns {Array.<Object>} Relationships found in entities.
	*/
	function findAllRelationships(entities) {
	let relationships = [];

	if (!Array.isArray(entities) \|\| entities.length === 0) {
	return relationships;
	}

	entities.forEach(entity => {
	if (Array.isArray(entity.relations)) {
	entity.relations.forEach(r => {
	let relationship = {
	id: entity.id,
	name: r.type.name.split('/')[0], // read name up until '/'
	targets: Array.isArray(r.targets) ? r.targets : []
	}
	relationships.push(relationship)
	});
	}
	});

	return relationships;
	}
	});

	$scope.$on('$destroy', ()=> {
	observers.forEach((observer)=> {
	observer.unsubscribe();
	});
	});
	}
	}

	export function entityNodeDirective() {
	return {
	restrict: 'E',
	template: entityNodeTemplate,
	scope: {
	entity: '<',
	applicationId: '<',
	viewMode: '<'
	},
	link: link,
	controller: ['$scope', '$state', '$stateParams', 'iconService', controller]
	};

	function link($scope) {
	$scope.$on('notifyEntity', function (ev, data) {
	if ($scope.entity.id) {
	if (data.id !== $scope.entity.id) {
	switch (data.message) {
	case 'expandChildren':
	$scope.isOpen = data.open;
	$scope.isChildrenOpen = data.open;
	break;
	case 'openChildren' :
	$scope.isOpen = data.open;
	}
	}
	}
	});
	}

	function controller ($scope, $state, $stateParams, iconService) {
	$scope.isOpen = true;
	if ($scope.entity.type) {
	iconService.get($scope.entity, true).then(value => $scope.iconUrl = value);
	} else {
	// it's a member of a group; we could look up the target and take that icon, but for now, no icon
	}

	if ($stateParams.entityId === $scope.entity.id) {
	$scope.$emit('notifyEntity', {
	message: 'expandChildren',
	id: $scope.entity.id,
	open: true
	});
	}

	$scope.isSelected = function() {
	return $stateParams.entityId === $scope.entity.id;
	};

	$scope.getHref = function() {
	if ($state.current.name.startsWith(detailState.name)) {
	return $state.href(activitiesState.name, {
	applicationId: $scope.applicationId,
	entityId: $scope.entity.id
	});
	}
	if ($state.current.name.startsWith(managementDetailState.name)) {
	return $state.href(managementState.name, {
	applicationId: $scope.applicationId,
	entityId: $scope.entity.id
	});
	}
	if ($state.current.name.startsWith(inspectState.name)) {
	return $state.href($state.current.name, {
	applicationId: $scope.applicationId,
	entityId: $scope.entity.id
	});
	}
	return $state.href(summaryState.name, {
	applicationId: $scope.applicationId,
	entityId: $scope.entity.id
	});
	};

	$scope.onToggle = function ($event) {
	if ($event.shiftKey && $event.metaKey) {
	$scope.isChildrenOpen = !$scope.isChildrenOpen;
	$scope.$broadcast('notifyEntity', {
	'message': 'expandChildren',
	'id': $scope.entity.id,
	'open': $scope.isChildrenOpen
	});
	} else {
	$scope.isOpen = true;
	$scope.isChildrenOpen = !$scope.isChildrenOpen;
	$scope.$broadcast('notifyEntity', {
	'message': 'openChildren',
	'id': $scope.entityId,
	'open': $scope.isOpen
	});
	}
	};

	/**
	* @returns {boolean} True if to highlight entity in a current view, false otherwise.
	*/
	$scope.isHighlight = function() {
	return $scope.entity.viewModesHighlight && $scope.entity.viewModesHighlight.has($scope.viewMode);
	};

	/**
	* Counts amount of entity nodes that are expected to be displayed in the current view.
	*
	* @returns {number} Amount of entity nodes in the current view.
	*/
	$scope.nodesInCurrentView = () => {
	let amount = 0;
	if ($scope.entity.children) {
	amount += $scope.entity.children.filter(entity => entity.viewModes.has($scope.viewMode)).length;
	}
	if ($scope.entity.members) {
	amount += $scope.entity.members.filter(entity => entity.viewModes.has($scope.viewMode)).length;
	}
	if ($scope.entity.otherNodes) {
	amount += $scope.entity.otherNodes.filter(entity => entity.viewModes.has($scope.viewMode)).length;
	}
	return amount;
	}
	}
	}