github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/app/templates/components/topo-viz.hbs (about)

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