jaredandClaude Opus 5.5
20822d000e
Lint / JS (eslint) (push) Successful in 17s
Lint / Python (flake8) (push) Successful in 2m2s
Lint / Notify on failure (push) Skipped
Lint / Deploy (push) Skipped
Lint / Python (flake8) (pull_request) Successful in 1m47s
Lint / JS (eslint) (pull_request) Successful in 7s
Lint / Notify on failure (pull_request) Skipped
Lint / Deploy (pull_request) Skipped
Security / Python Security (bandit) (push) Successful in 1m57s
Security / Python Security (bandit) (pull_request) Successful in 1m54s
Test / Python Tests (pytest) (push) Successful in 2m26s
Test / Python Tests (pytest) (pull_request) Successful in 2m27s
- A bar above the diagram lists what needs attention: devices down, degraded or alerting, cables down or last seen elsewhere, mislabelled ports, cables with errors. Click one to zoom to it; a missing device is one entry, with where it was last seen. All clear says so. - Problem cables glow and are always drawn, whatever the filters; problem cards get a red or amber border. Healthy cables are drawn quietly. - Each server's slower second cable (its 1G management link) is hidden by default while healthy: "Server 1G links" shows them. That was most of the clutter. "10G only" is gone, since this covers it. - Power gear is off by default until the power map (part 2) gives the rail something to show. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
62 lines
3.9 KiB
HTML
62 lines
3.9 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Topology{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="lt-page-header">
|
|
<div>
|
|
<h1 class="lt-page-title">Topology</h1>
|
|
<p class="g-page-sub">Every device and cable as the switches see them right now. Drag to pan, scroll or pinch to zoom. Hover a device to trace its path to the internet; click a cable for its details, or a group of unknown devices to open it.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tp-toolbar no-print" role="toolbar" aria-label="Topology view">
|
|
<div class="tp-filters" role="group" aria-label="Show">
|
|
<label class="tp-filter">Unknown devices
|
|
<select class="lt-select tp-select" data-filter="stubs" aria-label="Unknown devices">
|
|
<option value="grouped">grouped per switch</option>
|
|
<option value="all">one by one</option>
|
|
<option value="none">hidden</option>
|
|
</select></label>
|
|
<label class="tp-filter"><input type="checkbox" data-filter="power"> Power gear</label>
|
|
<label class="tp-filter"><input type="checkbox" data-filter="traffic"> Traffic</label>
|
|
<label class="tp-filter" title="Each server's slower second cable. A problem cable is always shown."><input type="checkbox" data-filter="mgmt"> Server 1G links</label>
|
|
<label class="tp-filter"><input type="checkbox" data-filter="alerts"> Alerts only</label>
|
|
</div>
|
|
<div class="tp-zoom" role="group" aria-label="Zoom">
|
|
<button type="button" class="lt-btn lt-btn-secondary lt-btn-sm" data-zoom="out" aria-label="Zoom out" title="Zoom out (-)">−</button>
|
|
<button type="button" class="lt-btn lt-btn-secondary lt-btn-sm" data-zoom="fit" title="Fit everything (0)">Fit</button>
|
|
<button type="button" class="lt-btn lt-btn-secondary lt-btn-sm" data-zoom="in" aria-label="Zoom in" title="Zoom in (+)">+</button>
|
|
</div>
|
|
<span class="tp-updated" id="tp-updated" aria-live="polite"></span>
|
|
</div>
|
|
|
|
<div class="tp-warnings" id="tp-warnings" role="status" hidden></div>
|
|
<div class="tp-summary" id="tp-summary" aria-live="polite"></div>
|
|
|
|
<div class="tp-canvas" id="tp-canvas" tabindex="0" aria-label="Network topology diagram. Use plus, minus and zero to zoom, and Tab to move between devices and cables.">
|
|
<svg class="tp-svg" id="tp-svg" xmlns="http://www.w3.org/2000/svg" role="group" aria-label="Network topology">
|
|
<g id="tp-world"></g>
|
|
</svg>
|
|
<div class="link-loading tp-loading" id="tp-loading">Loading topology</div>
|
|
<aside class="tp-panel" id="tp-panel" hidden aria-live="polite" aria-label="Cable details"></aside>
|
|
</div>
|
|
|
|
<div class="tp-legend" aria-label="Legend">
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-m-dac" d="M2 6 H38"/></svg>DAC</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-m-fibre" d="M2 6 H38"/></svg>Fibre (multimode)</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-m-wanfibre" d="M2 6 H38"/></svg>Fibre (provider)</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-m-sfp" d="M2 6 H38"/></svg>SFP+ module</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-m-copper" d="M2 6 H38"/></svg>Copper</span>
|
|
<span class="tp-key">Thicker = faster (10G, 1G, 100M)</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-key-down" d="M2 6 H38"/></svg>Down</span>
|
|
<span class="tp-key"><svg viewBox="0 0 40 12" aria-hidden="true"><path class="tp-key-line tp-key-ghost" d="M2 6 H38"/></svg>Last seen</span>
|
|
<span class="tp-key"><span class="tp-key-warn" aria-hidden="true">⚠</span>Port name points at another device</span>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script src="{{ url_for('static', filename='faceplates.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='fronts.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='topology.js') }}"></script>
|
|
{% endblock %}
|