# User Manual This tool helps you visually map, label, and manage Ethernet connections. It runs entirely in your browser, works offline, and saves everything automatically in your profile. --- ## πŸ“‚ Profiles image Profiles let you keep different layouts (e.g. home, client A, client B). - **Create a new profile** β†’ *Profiles* card β†’ **New** - **Switch profiles** β†’ Use the dropdown at the top of the *Profiles* card - **Rename** β†’ Select a profile, then click **Rename** - **Duplicate** β†’ Clone the current profile with **Duplicate** - **Delete** β†’ Removes the current profile (at least one profile must exist) - **Export** β†’ Save a single profile as a JSON file - **Import** β†’ Load a profile from a JSON file --- ## πŸ–₯️ Adding Devices image Each device is shown as a card with its own ports. Using clear names and distinct colours makes layouts easier to read, especially when you have multiple switches or patch panels. You can also edit or delete devices later if your setup changes β€” everything autosaves. Devices can be linked together through their ports, giving you a live view of how your network fits together. - In the *Add device* card, enter a **name** (e.g. *Core Switch A*) - Choose the **number of ports** (1–512) - Click **Select colour** to assign a colour (helps distinguish devices) - Click **Add device** - Devices can be reordered by dragging them --- ## βš™οΈ Configuring Devices image Configuring the layout makes your map easier to follow, whether you prefer full-width rows, split views, or dual-link ports. These options don’t affect the connections themselves β€” only how the device is displayed for clarity. Click **Layout** on a device to adjust how its ports display: - **Row width**: full-width (12 ports per row) or half-width (6 ports per row) - **13–24 ports**: choose *balanced* (split evenly) or *12 + remainder* - **≀12 ports**: choose single row or split into 2 rows - **Dual link**: each port can be split into 2 sub-ports --- ## πŸ”— Linking Ports image When linking, you’ll be shown a confirmation prompt with both device names and port numbers, so you can double-check before saving the connection. - Click one free port, then another free port β†’ confirm to create a connection - Both ends will be coloured with their peer’s device colour - Linked ports show an arrow ⇄ --- ## 🏷️ Labelling & Reserving Ports - **ALT + Click** a port β†’ add or edit a label (alias) - Example: *WAN*, *Printer*, *AP-1* - **CTRL + Click** a port β†’ mark it as *reserved* (grey background) - Use for ports connected to devices **outside** this layout (e.g. ISP modem, patch panel, office uplink) - so they appear as connected without having to be linked to another port - Combine with ALT-label to describe what’s at the other end - Example: CTRL-reserve port with a label for location, e.g. *Office* β†’ ALT-label to specify what's connected, e.g. *PC-4* --- ## πŸ’Ύ Backup & Restore (all profiles) image Backups are useful if you want to move your layouts to another computer or just keep a copy in case your browser storage is cleared. Restoring will overwrite your current profiles, so it’s best to take a fresh backup first if you want to merge changes later. - **Backup all** β†’ saves every profile (devices + links) into one JSON file - **Restore all** β†’ load a backup and replace everything --- ## πŸ” Finding Connections image This makes it easy to track down a specific cable in larger layouts without scanning visually. You can search by device name, port number, or any custom alias you’ve added. - Use the search box (*Find connection* card) to filter by device, port, or alias - The *Connections* table shows all links, with both devices, ports, and labels - Click a row β†’ highlights both ends of the link --- ## ❌ Managing Connections image From the *Connections* table: - **Unlink** β†’ break a connection between two ports - **Clear** β†’ clear a Reserved port (can also be cleared by **CTRL + clicking** the reserved port again) --- ## πŸ–¨οΈ Printing - Use **Print layout** (top-right) to generate a printable sheet of devices + connections --- ## πŸ“ Tips - Profiles autosave automatically β€” no need to press β€œSave” - Use colours to quickly group devices by type or rack position - Labels + reserved ports are powerful for documenting external links ---