jaredandClaude Opus 5.5
415d2222e7
Lint / JS (eslint) (push) Successful in 21s
Lint / Python (flake8) (push) Successful in 2m36s
Lint / Notify on failure (push) Skipped
Lint / Deploy (push) Skipped
Test / Python Tests (pytest) (push) Successful in 2m46s
Lint / JS (eslint) (pull_request) Successful in 15s
Lint / Python (flake8) (pull_request) Successful in 2m14s
Lint / Notify on failure (pull_request) Skipped
Lint / Deploy (pull_request) Skipped
Security / Python Security (bandit) (push) Successful in 1m33s
Security / Python Security (bandit) (pull_request) Successful in 54s
Test / Python Tests (pytest) (pull_request) Successful in 1m3s
- Each PDU, UPS and power strip card lists its outlets that feed something, draw power or are off, with live watts. Each device fed gets a power badge with what it draws. Hovering a power card or a device draws its feeds as dotted lines and keeps both ends lit. - What an outlet feeds: a saved assignment, else the outlet's UniFi name when it names a device (or the modem), else a MAC in its name that belongs to a host NIC (the monitor's host_macs) or UniFi device. - Admins click an outlet to set what it feeds, nothing, or automatic. Saved in a new power_feeds table (created with the cutsheet tables); PUT /api/topology/power/<device>/<outlet>, admin and JSON only, with the device, outlet and target checked. UniFi is never changed. - An outlet that is off but feeds something is listed under "to look at". - Power gear is shown by default again, now that it has something to say. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
64 lines
4.1 KiB
HTML
64 lines
4.1 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 class="tp-pop" id="tp-pop" role="dialog" aria-label="What this outlet feeds" hidden></div>
|
|
</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>const TOPO_CAN_EDIT = {{ 'true' if can_edit else 'false' }};</script>
|
|
<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 %}
|