"use strict"; (function () { 'use strict'; angular.module('assetModule') .directive('graphicalCi', ['$timeout', '$window', 'browser', 'ciExplorerModel', 'systemAlertService', 'i18nService', '$filter', '$modal', '$state', function ($timeout, $window, browser, ciExplorerModel, systemAlertService, i18nService, $filter, $modal, $state) { return { restrict: 'E', replace: true, scope: { rootCi: '=' }, templateUrl: 'views/asset/graphical-ci.html', link: function (scope, element) { var iconList = [{ "name": "BMC_PROTOCOLENDPOINT", "label": "Protocol Endpoint" }, { "name": "BMC_NTDOMAIN", "label": "NT Domain" }, { "name": "BMC_CONNECTIVITYGROUP", "label": "Connectivity Collection" }, { "name": "BMC_CONNECTIVITYSEGMENT", "label": "Connectivity Segment" }, { "name": "BMC_IPCONNECTIVITYSUBNET", "label": "IP Connectivity Subnet" }, { "name": "BMC_IPXCONNECTIVITYNETWORK", "label": "IPX Connectivity Network" }, { "name": "BMC_LNSGROUP", "label": "LNs Collection" }, { "name": "BMC_NETWORKPORT", "label": "Network Port" }, { "name": "BMC_LAN", "label": "Local Area Network (LAN)" }, { "name": "BMC_WAN", "label": "Wide Area Network (WAN)" }, { "name": "BMC_COMMUNICATIONENDPOINT", "label": "Communication Endpoint" }, { "name": "BMC_IPENDPOINT", "label": "IP Endpoint" }, { "name": "BMC_LANENDPOINT", "label": "LAN Endpoint" }, { "name": "BMC_ADMINDOMAIN", "label": "Admin Domain" }, { "name": "BMC_CLUSTER", "label": "Cluster" }, { "name": "BMC_BUSINESSSERVICE", "label": "Business Service" }, { "name": "BMC_APPLICATION", "label": "Application" }, { "name": "BMC_OPERATINGSYSTEM", "label": "Operating System" }, { "name": "BMC_APPLICATIONINFRASTRUCTURE", "label": "Application Infrastructure" }, { "name": "BMC_DATABASE", "label": "Database" }, { "name": "BMC_DISKPARTITION", "label": "Disk Partition" }, { "name": "BMC_FILESYSTEM", "label": "File System" }, { "name": "BMC_SHARE", "label": "Share" }, { "name": "BMC.CORE:BMC_RASD", "label": "Resource Allocation Setting Data" }, { "name": "BMC.CORE:BMC_VIRTUALSYSTEMSETTINGDATA", "label": "Virtual System Setting Data" }, { "name": "BMC_PATCH", "label": "Patch" }, { "name": "BMC_PRODUCT", "label": "Product" }, { "name": "BMC_APPLICATIONSYSTEM", "label": "Application System" }, { "name": "BMC_APPLICATIONSERVICE", "label": "Application Service" }, { "name": "BMC_BIOS", "label": "BIOS Element" }, { "name": "BMC_SOFTWARESERVER", "label": "Software Server" }, { "name": "BMC_SYSTEMSOFTWARE", "label": "System Software" }, { "name": "BMC_VIRTUALSYSTEMENABLER", "label": "Virtual System Enabler" }, { "name": "BMC_PACKAGE", "label": "Package" }, { "name": "BMC_DATABASESTORAGE", "label": "Database Storage" }, { "name": "BMC_LOCALFILESYSTEM", "label": "Local File System" }, { "name": "BMC_REMOTEFILESYSTEM", "label": "Remote File System" }, { "name": "BMC_CARD", "label": "Card" }, { "name": "BMC_CHASSIS", "label": "Chassis" }, { "name": "BMC_RACK", "label": "Rack" }, { "name": "BMC_HARDWAREPACKAGE", "label": "Hardware Package" }, { "name": "BMC_KEYBOARD", "label": "Keyboard" }, { "name": "BMC_MEDIA", "label": "Media" }, { "name": "BMC_MEMORY", "label": "Memory" }, { "name": "BMC_MONITOR", "label": "Monitor" }, { "name": "BMC_POINTINGDEVICE", "label": "Pointing Device" }, { "name": "BMC_PROCESSOR", "label": "Processor" }, { "name": "BMC_UPS", "label": "UPS" }, { "name": "BMC_SYSTEMRESOURCE", "label": "System Resource" }, { "name": "BMC.CORE:BMC_RESOURCEPOOL", "label": "Resource Pool" }, { "name": "BMC_CDROMDRIVE", "label": "CDROM Drive" }, { "name": "BMC_DISKDRIVE", "label": "Disk Drive" }, { "name": "BMC_FLOPPYDRIVE", "label": "Floppy Drive" }, { "name": "BMC_TAPEDRIVE", "label": "Tape Drive" }, { "name": "BMC_HARDWARESYSTEMCOMPONENT", "label": "Hardware System Component" }, { "name": "BMC.CORE:BMC_BUSINESSPROCESS", "label": "Business Process" }, { "name": "BMC_TRANSACTION", "label": "Transaction" }, { "name": "BMC_DOCUMENT", "label": "Document" }, { "name": "BMC_ACCOUNT", "label": "Account" }, { "name": "BMC_ACTIVITY", "label": "Activity" }, { "name": "BMC_PHYSICALLOCATION", "label": "Physical Location" }, { "name": "BMC_ROLE", "label": "Role" }, { "name": "BMC.CORE:BMC_CONCRETECOLLECTION", "label": "Concrete Collection" }, { "name": "BMC_LOGICALSYSTEMCOMPONENT", "label": "Logical System Component" }, { "name": "BMC_SERVICEOFFERINGINSTANCE", "label": "Service Offering Instance" } ]; var graphPan = element.find('.pan-area'), initialZoom = 1.5, minimumZoom = 0.1, zoomStep = 0.2, tappedBeforeNode = null, selectedNode = null, edgeCache = [], displayCiLimit = 100, removedUpstreamEdges = null, modalInstance; scope.state = {}; scope.model = ciExplorerModel; ciExplorerModel.reset(true); scope.$watch('rootCi', function (rootCi) { if (!rootCi || !getInstanceId(rootCi) || scope.initialized) return; var cy = scope.cy = cytoscape({ container: graphPan[0], style: generateGraphStyles(), elements: { nodes: [buildNode(rootCi)] }, layout: { name: 'dagre', fit: false }, boxSelectionEnabled: false, wheelSensitivity: 0.2, selectionType: 'single', zoom: initialZoom, ready: function () { $timeout(function () { cy.center(); }); } }); scope.initialized = true; cy.on('tap', function (event) { var tappedNowNode = event.target; $timeout(function () { tappedBeforeNode = null; }, 300); if (tappedBeforeNode === tappedNowNode) { tappedNowNode.trigger('doubleTap'); tappedBeforeNode = null; } else { tappedBeforeNode = tappedNowNode; } }); cy.on('doubleTap', function (event) { toggleNode(event.target); }); cy.on('select', 'node', function (event) { var node = event.target; if (!isGroupNode(node) && !isLargeNode(node)) { var icon = node.data('icon'); node.removeClass(icon); node.addClass(getSelectedIcon(icon)); selectedNode = node; } }); cy.on('unselect', 'node', function (event) { var node = event.target; if (!isGroupNode(node) && !isLargeNode(node)) { var icon = node.data('icon'); node.removeClass(getSelectedIcon(icon)); node.addClass(icon); selectedNode = null; } }); cy.on('mouseover', 'node', function (event) { var node = event.target; node.data('hover', true); }); cy.on('mouseout', 'node', function (event) { var node = event.target; node.data('hover', false); }); }); scope.openAsset = function (asset) { $state.go('asset', { assetId: asset.reconciliationId, assetClassId: asset.classId }); }; scope.changeZoomLevel = function (zoomType) { var currentZoom = scope.cy.zoom(); if (zoomType === 'in') { currentZoom += zoomStep; } else if (zoomType === 'out') { currentZoom -= zoomStep; } currentZoom = Math.max(minimumZoom, currentZoom); scope.cy.zoom(currentZoom); scope.cy.center(getVisibleElements()); }; scope.resetCanvas = function () { layout(); }; scope.enableBoxSelection = function () { scope.cy.boxSelectionEnabled(true); }; scope.viewParents = function () { if (!scope.rootCi.parentsLoaded) { loadParents(scope.rootCi); } else if (scope.rootCi.parentsShown) { hideParents(); } else { showParents(); } }; scope.expandAll = function () { var nodes = filterNodes(scope.cy.nodes()); setExpanded(nodes, true); nodes.show(); showParents(); filterGroupNodes(scope.cy.nodes()).hide(); layout(); }; scope.collapseAll = function () { filterNodes(scope.cy.nodes()).hide(); filterGroupNodes(scope.cy.nodes()).show(); getNodeByCi(scope.rootCi).show(); hideParents(); layout(); }; scope.previewSelected = function () { if (!selectedNode) return; modalInstance = $modal.open({ templateUrl: 'views/change/ci-relation-preview.html', windowClass: 'action-blade', size: 'lg', controller: ['$scope', function ($scope) { $scope.assetIdsObject = buildAssetIdObject(selectedNode.data('ci')); }] }); }; scope.$on('$stateChangeStart', function () { if (modalInstance) { modalInstance.dismiss(); } }); scope.$on('$destroy', function () { console.log('graphicalCi: unbind events'); scope.cy.removeListener('tap'); scope.cy.removeListener('doubletap'); scope.cy.removeListener('select'); scope.cy.removeListener('unselect'); scope.cy.removeListener('mouseover'); scope.cy.removeListener('mouseout'); }); scope.hardReset = function () { scope.rootCi.relationsLoaded = false; scope.rootCi.parentsLoaded = false; scope.rootCi.parentsShown = false; ciExplorerModel.reset(); removeAllElements(); addRootNode(); }; scope.reloadAllRelationships = function () { if (!scope.cy) return; var relationsLoaded = scope.rootCi.relationsLoaded, parentsLoaded = scope.rootCi.parentsLoaded, assets = getAssetsByLevel(); scope.hardReset(); scope.rootCi.relationsLoaded = relationsLoaded; if (parentsLoaded) { loadParents(scope.rootCi).then(function () { reloadRelations(assets); }); } else { reloadRelations(assets); } }; function getAssetsByLevel() { var nodesByLevel = getNodesByLevel(), assets = []; _.each(nodesByLevel, function (level) { _.each(level.nodes, function (node) { var asset = node.data('ci'); if (asset) { assets.push(asset); } }); }); return assets; } function reloadRelations(assets) { var asset; while (asset = assets.shift()) { var node = getNodeByCi(asset); if (node.length > 0 && asset.relationsLoaded) { asset.relationsLoaded = false; node.data('ci', asset); loadRelations(asset).then(function () { reloadRelations(assets); }); break; } } } function toggleNode(node) { if (isParentNode(node)) { return; } else if (isGroupNode(node)) { expandGroupNode(node); } else if (isLargeNode(node)) { expandLargeNode(node); } else { var localRootCi = node.data('ci'), visibleOutgoerNodes = filterVisibleOutgoerNodes(node); if (isGroupNode(visibleOutgoerNodes)) { expandGroupNode(visibleOutgoerNodes); localRootCi.expanded = true; } else { if (!localRootCi.relationsLoaded) { loadRelations(localRootCi); return; } if (localRootCi.expanded) { hideRelations(localRootCi); } else { showRelations(localRootCi); } layout(localRootCi); localRootCi.expanded = !localRootCi.expanded; } } } function expandGroupNode(node) { node.hide(); var nodes = node.data('nodes'); setExpanded(nodes, true); nodes.show(); layout(); } function expandLargeNode(node) { var totalCount = node.data('totalCount'); if (totalCount > displayCiLimit) { displayLargeNodeAlert(); } else if (totalCount === 0) { node.remove(); } } function displayLargeNodeAlert() { systemAlertService.modal({ title: i18nService.getLocalizedString('common.notification.asset.explorer.title'), text: i18nService.getLocalizedString('common.notification.asset.explorer.largeNode.message'), buttons: [{ text: i18nService.getLocalizedString('common.labels.ok') }] }); } function addRootNode() { scope.cy.add([buildNode(scope.rootCi)]); layout(scope.rootCi); } function loadRelations(localRootCi) { return ciExplorerModel.displayRelations(localRootCi).then(function (result) { localRootCi.relationsLoaded = true; var displayedCis = _.filter(result.relatedCis, { realObject: { isChild: true } }), totalCount = result.totalCount - (result.relatedCis.length - displayedCis.length); localRootCi.expanded = true; var nodes = [], edges = [], largeNode = getNodeById(getLargeNodeId(localRootCi)), removeLargeNode = largeNode.length === 0 ? true : totalCount !== 0; if (totalCount <= displayCiLimit && removeLargeNode) { largeNode.remove(); _.each(displayedCis, function (ci) { nodes.push(buildNode(ci)); var edge = buildEdgeByCi(localRootCi, ci); if (edge) { edges.push(edge); } if (isParentAndChild(ci)) { edge = buildEdgeByCi(ci, localRootCi, true); if (edge) { edges.push(edge); } } }); } else { if (largeNode.length === 0) { largeNode = scope.cy.add(buildLargeNode(localRootCi, totalCount)); } largeNode.data('label', getGroupNodeTitle(totalCount)); largeNode.data('totalCount', totalCount); var edge = buildEdgeByNode(getNodeByCi(localRootCi), largeNode); if (edge) { edges.push(edge); } } scope.cy.add(nodes); scope.cy.add(edges); updateGroupNodes(); layout(localRootCi); }); } function loadParents(localRootCi) { return ciExplorerModel.displayRelations(localRootCi).then(function (result) { localRootCi.parentsLoaded = true; var parents = _.filter(result.relatedCis, { realObject: { isParent: true } }); var nodes = [], edges = []; _.each(parents, function (parent) { nodes.push(buildParentNode(parent)); var edge = buildEdgeByCi(parent, localRootCi, true); if (edge) { edges.push(edge); } }); scope.cy.add(nodes); scope.cy.add(edges); updateGroupNodes(); parentsShown(true); layout(localRootCi); }); } function hideParents() { filterParentNodes(scope.cy.nodes().roots()).hide(); parentsShown(false); layout(); } function showParents() { filterParentNodes(scope.cy.nodes().roots()).show(); parentsShown(true); layout(); } function parentsShown(value) { if (scope.rootCi.parentsLoaded) { scope.rootCi.parentsShown = value; } } function updateGroupNodes() { var nodesByLevel = getNodesByLevel(); if (nodesByLevel.length <= 1) { return; } var setNodeCount = function (largeNode) { totalNodeCount += largeNode.data('totalCount'); }; for (var level = 1; level < nodesByLevel.length; level++) { var nodes = nodesByLevel[level].nodes; var groupNodes = nodesByLevel[level].groupNodes; if (groupNodes.length === 0) { groupNodes = scope.cy.add(buildGroupNode(level, nodes.length)); groupNodes.hide(); } var largeNodes = filterLargeNodes(nodes), totalNodeCount = nodes.length - largeNodes.length; _.each(largeNodes, setNodeCount); groupNodes.data('label', getGroupNodeTitle(totalNodeCount)); groupNodes.data('nodes', nodes); connectNodes(nodesByLevel[level - 1].allNodes, groupNodes); connectNodes(nodesByLevel[level - 1].groupNodes, nodes); } } function getNodesByLevel() { removeUpstreamEdges(); var i = 1, nodes = [], visitedNodes = {}, currentLevel = getNodeByCi(scope.rootCi); var setNodes = function (node) { var nodeId = node.data('id'); node.data('level', i); if (!visitedNodes[nodeId]) { currentLevelUnvisited[nodeId] = node; visitedNodes[nodeId] = node; } }; var getCurentLevelUnvisitedNodes = function (node) { var nodeId = node.data('id'); return !!currentLevelUnvisited[nodeId]; }; while (currentLevel.length != 0) { var currentLevelUnvisited = {}; _.each(currentLevel, setNodes); currentLevelUnvisited = currentLevel.filterFn(getCurentLevelUnvisitedNodes); if (currentLevelUnvisited.length > 0) { nodes.push({ allNodes: currentLevelUnvisited, nodes: filterNodes(currentLevelUnvisited), groupNodes: filterGroupNodes(currentLevelUnvisited) }); } currentLevel = filterAllNodes(currentLevelUnvisited.outgoers()); i++; } restoreUpstreamEdges(); return nodes; } function getVisibleElements() { return scope.cy.elements().filter(':visible'); } function filterVisibleElements(elements) { return elements.filter(':visible'); } function filterVisibleOutgoerNodes(node) { return filterVisibleElements(node.outgoers().filter('node')); } function filterAllNodes(nodes) { return nodes.filter('node'); } function filterNodes(nodes) { return nodes.filter('node').filterFn(function (ele) { return !isGroupNode(ele); }); } function filterGroupNodes(nodes) { return nodes.filter('node').filterFn(function (ele) { return isGroupNode(ele); }); } function isGroupNode(element) { return element.hasClass("group-node"); } function filterLargeNodes(nodes) { return nodes.filter('node').filterFn(function (ele) { return isLargeNode(ele); }); } function isLargeNode(element) { return element.hasClass("large-node"); } function connectNodes(sourceNodes, targetNodes) { _.each(sourceNodes, function (sourceNode) { _.each(targetNodes, function (targetNode) { var edge = buildEdgeByNode(sourceNode, targetNode); if (edge) { scope.cy.add(edge); } }); }); } function showRelations(localRootCi) { removeUpstreamEdges(); var node = getNodeByCi(localRootCi); filterNodes(node.outgoers()).show(); restoreUpstreamEdges(); } function hideRelations(localRootCi) { removeUpstreamEdges(); var node = getNodeByCi(localRootCi); setExpanded(filterNodes(node.successors()), false); filterAllNodes(node.successors()).hide(); restoreUpstreamEdges(); } function setExpanded(nodes, expanded) { _.each(nodes, function (node) { node.data('ci').expanded = expanded; }); } function removeAllElements() { scope.cy.elements().remove(); edgeCache = []; } function layout(localRootCi) { var visibleElements = getVisibleElements(); var layout = visibleElements.layout({ name: 'dagre', fit: false, ready: function () { $timeout(function () { if (localRootCi) { var centerNode = getNodeByCi(localRootCi); scope.cy.center(centerNode); } else { scope.cy.fit(visibleElements); if (scope.cy.zoom() > initialZoom) { scope.cy.zoom(initialZoom); } scope.cy.center(visibleElements); } }); } }); layout.run(); } function getNodeByCi(ci) { return getNodeById(getInstanceId(ci)); } function getNodeById(nodeId) { return scope.cy.$("#" + nodeId); } function buildNode(ci) { var icon = getIcon(ci); return { group: 'nodes', data: { id: getInstanceId(ci), ci: ci, label: getName(ci), shortLabel: getShortName(ci), icon: icon }, classes: icon }; } function buildParentNode(ci) { var node = buildNode(ci); node.data.isParent = true; return node; } function filterParentNodes(nodes) { return nodes.filter('node').filterFn(function (ele) { return isParentNode(ele); }); } function isParentNode(element) { return element.data("isParent") && element.incomers().length === 0; } function isParentAndChild(asset) { return asset.realObject ? asset.realObject.isParent && asset.realObject.isChild : false; } function buildLargeNode(parentCi, nodeCount) { return { group: 'nodes', data: { id: getLargeNodeId(parentCi), ci: {}, parentCi: parentCi, label: getGroupNodeTitle(nodeCount), totalCount: nodeCount }, classes: 'large-node collapsed-node' }; } function buildGroupNode(level, nodeCount) { return { group: 'nodes', data: { id: getGroupNodeId(level), label: getGroupNodeTitle(nodeCount) }, classes: "group-node collapsed-node" }; } function getGroupNodeId(level) { return "groupNode__" + level; } function getLargeNodeId(ci) { return getInstanceId(ci) + '_large'; } function getGroupNodeTitle(nodeCount) { return $filter('i18n')('asset.explorer.relatives.count', nodeCount); } function buildEdgeById(sourceId, targetId, isUpstream) { var edgeId = sourceId + targetId; if (edgeCache[edgeId]) { return null; } var maxInteger = 2147483647, sourceNode = getNodeById(sourceId), targetNode = getNodeById(targetId), sourceLevel = sourceNode.data('level') || maxInteger, targetLevel = targetNode.data('level') || maxInteger; isUpstream = !!isUpstream; if (sourceLevel > targetLevel) { isUpstream = true; } var edge = { group: "edges", data: { source: sourceId, target: targetId, isUpstream: isUpstream } }; edgeCache[edgeId] = edge; return edge; } function buildEdgeByCi(sourceCi, targetCi, isUpstream) { return buildEdgeById(getInstanceId(sourceCi), getInstanceId(targetCi), isUpstream); } function buildEdgeByNode(sourceNode, targetNode, isUpstream) { return buildEdgeById(sourceNode.data('id'), targetNode.data('id'), isUpstream); } function buildAssetIdObject(ci) { return { assetId: ci.reconciliationId || ci.realObject.reconciliationId, assetClassId: ci.classId || ci.realObject.classId }; } function getInstanceId(ci) { return ci.instanceId || (ci.realObject && ci.realObject.instanceId); } function getIcon(ci) { var subtype = iconSubtype(ci.classId); if (subtype) { return subtype.toLowerCase().replace(' ', ''); } else { var defaultAssetType = "other", type = ci.assetType || (ci.realObject && ci.realObject.assetType) || defaultAssetType; return type.toLowerCase().replace(' ', ''); } } function iconSubtype(type) { for (var i = 0; i < iconList.length; i++) { if (iconList[i].name === type) { return iconList[i].label; } } } function getSelectedIcon(icon) { return icon + "-selected selected"; } function getName(ci) { return scope.model.getAssetName(ci) + getNameSuffix(ci); } function getShortName(ci) { return scope.model.getAssetDisplayName(ci) + getNameSuffix(ci); } function getNameSuffix(ci) { return scope.rootCi === ci ? ' [' + $filter('i18n')('asset.explorer.root') + ']' : ''; } function removeUpstreamEdges() { if (removedUpstreamEdges) return; removedUpstreamEdges = scope.cy.edges('edge[?isUpstream]'); removedUpstreamEdges.remove(); } function restoreUpstreamEdges() { if (!removedUpstreamEdges) return; removedUpstreamEdges.restore(); removedUpstreamEdges = null; } function generateGraphStyles() { var styleChain = cytoscape.stylesheet() .selector('node[?hover]') .css({ 'content': 'data(label)' }) .selector('node[!hover]') .css({ 'content': 'data(shortLabel)' }) .selector('node') .css({ 'background-fit': "cover", 'font-size': 8, 'shape': 'rectangle', 'background-opacity': 0, 'text-valign': 'bottom', 'text-wrap': 'wrap', 'text-max-width': 80 }) .selector('node.selected') .css({ 'background-fit': "cover", 'font-size': 8, 'shape': 'rectangle', 'background-opacity': 0, 'text-valign': 'bottom' }) .selector('.big-node') .css({ width: 35, height: 35 }) .selector('.small-node') .css({ 'height': 20, 'width': 20, 'background-fit': 'cover', 'content': 'data(label)', 'font-size': 5, 'background-opacity': 0, 'text-valign': 'bottom' }) .selector('edge') .css({ 'width': 0.3, 'line-color': '#666666', 'target-arrow-shape': 'triangle', 'curve-style': 'straight' }) .selector('.group-node') .css({ 'shape': 'roundrectangle' }) .selector('.collapsed-node') .css({ 'content': 'data(label)', 'color': '#2bb5dc', 'background-color': '#2bb5dc', 'background-opacity': 0.5, 'background-image': 'none', 'border-width': 0.2, 'font-size': 10, 'text-valign': 'center', 'word-wrap': 'break-word', 'height': 40, 'width': 100 }) .selector('.expanded-node') .css({ 'content': '', 'background-color': '#2bb5dc', 'background-opacity': 0.2, 'background-image': 'none', 'border-width': 0.2 }) .selector('.large-node') .css({ 'shape': 'roundrectangle', 'background-color': '#89c341' }) .selector('.hidden-node') .css({ 'visibility': 'hidden' }) .selector('.expand-button') .css({ 'height': '30px', 'width': '75px' }); if (browser.isIE) { styleChain .selector('node') .css({ 'background-image': 'styles/img/ci-type-icons/generic_ci.png' }) .selector('node.selected') .css({ 'background-image': 'styles/img/ci-type-icons/generic_ci_selected.png' }) .selector('.businessservice') .css({ 'background-image': 'styles/img/ci-type-icons/service.png' }) .selector('.businessservice-selected') .css({ 'background-image': 'styles/img/ci-type-icons/service_selected.png' }) .selector('.collapsed-node') .css({ 'background-image': 'none' }) .selector('.expanded-node') .css({ 'background-image': 'none' }) .selector('.application') .css({ 'background-image': 'styles/img/ci-type-icons/application.png' }) .selector('.application-selected') .css({ 'background-image': 'styles/img/ci-type-icons/application_selected.png' }) .selector('.cluster') .css({ 'background-image': 'styles/img/ci-type-icons/cluster.png' }) .selector('.cluster-selected') .css({ 'background-image': 'styles/img/ci-type-icons/cluster_selected.png' }) .selector('.computersystem') .css({ 'background-image': 'styles/img/ci-type-icons/computer_system.png' }) .selector('.computersystem-selected') .css({ 'background-image': 'styles/img/ci-type-icons/computer_system_selected.png' }) .selector('.database') .css({ 'background-image': 'styles/img/ci-type-icons/database.png' }) .selector('.database-selected') .css({ 'background-image': 'styles/img/ci-type-icons/database_selected.png' }) .selector('.filesystem') .css({ 'background-image': 'styles/img/ci-type-icons/file_system.png' }) .selector('.filesystem-selected') .css({ 'background-image': 'styles/img/ci-type-icons/file_system_selected.png' }) .selector('.group') .css({ 'background-image': 'styles/img/ci-type-icons/group.png' }) .selector('.group-selected') .css({ 'background-image': 'styles/img/ci-type-icons/group_selected.png' }) .selector('.media') .css({ 'background-image': 'styles/img/ci-type-icons/media.png' }) .selector('.media-selected') .css({ 'background-image': 'styles/img/ci-type-icons/media_selected.png' }) .selector('.network') .css({ 'background-image': 'styles/img/ci-type-icons/network.png' }) .selector('.network-selected') .css({ 'background-image': 'styles/img/ci-type-icons/network_selected.png' }) .selector('.people') .css({ 'background-image': 'styles/img/ci-type-icons/people.png' }) .selector('.people-selected') .css({ 'background-image': 'styles/img/ci-type-icons/people_selected.png' }) .selector('.resource') .css({ 'background-image': 'styles/img/ci-type-icons/resource.png' }) .selector('.resource-selected') .css({ 'background-image': 'styles/img/ci-type-icons/resource_selected.png' }) .selector('.service') .css({ 'background-image': 'styles/img/ci-type-icons/service.png' }) .selector('.service-selected') .css({ 'background-image': 'styles/img/ci-type-icons/service_selected.png' }) .selector('.software') .css({ 'background-image': 'styles/img/ci-type-icons/software.png' }) .selector('.software-selected') .css({ 'background-image': 'styles/img/ci-type-icons/software_selected.png' }) .selector('.ups') .css({ 'background-image': 'styles/img/ci-type-icons/ups.png' }) .selector('.ups-selected') .css({ 'background-image': 'styles/img/ci-type-icons/ups_selected.png' }) .selector('.collapsed-node') .css({ 'background-image': 'none' }); } else { styleChain .selector('node') .css({ 'background-image': 'styles/img/ci-type-icons/generic_ci.svg' }) .selector('node.selected') .css({ 'background-image': 'styles/img/ci-type-icons/generic_ci_selected.svg' }) .selector('.businessservice') .css({ 'background-image': 'styles/img/ci-type-icons/service.png' }) .selector('.businessservice-selected') .css({ 'background-image': 'styles/img/ci-type-icons/service_selected.png' }) .selector('.collapsed-node') .css({ 'background-image': 'none' }) .selector('.expanded-node') .css({ 'background-image': 'none' }) .selector('.application') .css({ 'background-image': 'styles/img/ci-type-icons/application.svg' }) .selector('.application-selected') .css({ 'background-image': 'styles/img/ci-type-icons/application_selected.svg' }) .selector('.cluster') .css({ 'background-image': 'styles/img/ci-type-icons/cluster.svg' }) .selector('.cluster-selected') .css({ 'background-image': 'styles/img/ci-type-icons/cluster_selected.svg' }) .selector('.computersystem') .css({ 'background-image': 'styles/img/ci-type-icons/computer_system.svg' }) .selector('.computersystem-selected') .css({ 'background-image': 'styles/img/ci-type-icons/computer_system_selected.svg' }) .selector('.database') .css({ 'background-image': 'styles/img/ci-type-icons/database.svg' }) .selector('.database-selected') .css({ 'background-image': 'styles/img/ci-type-icons/database_selected.svg' }) .selector('.filesystem') .css({ 'background-image': 'styles/img/ci-type-icons/file_system.svg' }) .selector('.filesystem-selected') .css({ 'background-image': 'styles/img/ci-type-icons/file_system_selected.svg' }) .selector('.group') .css({ 'background-image': 'styles/img/ci-type-icons/group.svg' }) .selector('.group-selected') .css({ 'background-image': 'styles/img/ci-type-icons/group_selected.svg' }) .selector('.media') .css({ 'background-image': 'styles/img/ci-type-icons/media.svg' }) .selector('.media-selected') .css({ 'background-image': 'styles/img/ci-type-icons/media_selected.svg' }) .selector('.network') .css({ 'background-image': 'styles/img/ci-type-icons/network.svg' }) .selector('.network-selected') .css({ 'background-image': 'styles/img/ci-type-icons/network_selected.svg' }) .selector('.people') .css({ 'background-image': 'styles/img/ci-type-icons/people.svg' }) .selector('.people-selected') .css({ 'background-image': 'styles/img/ci-type-icons/people_selected.svg' }) .selector('.resource') .css({ 'background-image': 'styles/img/ci-type-icons/resource.svg' }) .selector('.resource-selected') .css({ 'background-image': 'styles/img/ci-type-icons/resource_selected.svg' }) .selector('.service') .css({ 'background-image': 'styles/img/ci-type-icons/service.svg' }) .selector('.service-selected') .css({ 'background-image': 'styles/img/ci-type-icons/service_selected.svg' }) .selector('.software') .css({ 'background-image': 'styles/img/ci-type-icons/software.svg' }) .selector('.software-selected') .css({ 'background-image': 'styles/img/ci-type-icons/software_selected.svg' }) .selector('.ups') .css({ 'background-image': 'styles/img/ci-type-icons/ups.svg' }) .selector('.ups-selected') .css({ 'background-image': 'styles/img/ci-type-icons/ups_selected.svg' }); } return styleChain; } } }; }]); }());