github.com/hernad/nomad@v1.6.112/ui/app/templates/components/topo-viz.hbs (about) 1 {{! 2 Copyright (c) HashiCorp, Inc. 3 SPDX-License-Identifier: MPL-2.0 4 ~}} 5 6 <div 7 data-test-topo-viz 8 class="topo-viz {{if this.isSingleColumn "is-single-column"}}" 9 {{did-insert this.buildTopology}} 10 {{did-update this.buildTopology @nodes}} 11 {{did-insert this.captureElement}} 12 {{window-resize this.determineViewportColumns}}> 13 <FlexMasonry 14 @columns={{if this.isSingleColumn 1 2}} 15 @items={{this.topology.datacenters}} 16 @withSpacing={{true}} as |dc|> 17 <TopoViz::Datacenter 18 @datacenter={{dc}} 19 @isSingleColumn={{this.datacenterIsSingleColumn}} 20 @isDense={{this.isDense}} 21 @heightScale={{this.topology.heightScale}} 22 @onAllocationSelect={{this.associateAllocations}} 23 @onAllocationFocus={{this.showTooltip}} 24 @onAllocationBlur={{this.hideTooltip}} 25 @onNodeSelect={{this.showNodeDetails}} /> 26 </FlexMasonry> 27 28 <div class="chart-tooltip is-absolute {{if this.highlightAllocation "active" "inactive"}}" style={{this.tooltipStyle}}> 29 {{#let this.highlightAllocation as |allocation|}} 30 <ol class="is-static"> 31 <li> 32 <span class="label">Job</span> 33 <span class="value">{{allocation.allocation.job.name}}/{{allocation.allocation.taskGroupName}}</span> 34 </li> 35 {{#if this.system.shouldShowNamespaces}} 36 <li> 37 <span class="label">Namespace</span> 38 <span class="value">{{allocation.allocation.job.namespace.name}}</span> 39 </li> 40 {{/if}} 41 <li> 42 <span class="label">Memory</span> 43 <span class="value">{{format-scheduled-bytes allocation.memory start="MiB"}}</span> 44 </li> 45 <li> 46 <span class="label">CPU</span> 47 <span class="value">{{format-scheduled-hertz allocation.cpu}}</span> 48 </li> 49 </ol> 50 {{/let}} 51 </div> 52 53 {{#if this.activeAllocation}} 54 <svg data-test-allocation-associations class="chart topo-viz-edges" {{window-resize this.resizeEdges}}> 55 <g transform="translate({{this.edgeOffset.x}},{{this.edgeOffset.y}})"> 56 {{#each this.activeEdges as |edge|}} 57 <path data-test-allocation-association class="edge" d={{edge}} /> 58 {{/each}} 59 </g> 60 </svg> 61 {{/if}} 62 </div>