<html>
<head>
    <title>Powermon Home</title>
    <link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
    <h1>Devices</h1>
    {% if devices is defined%}
        {% for device in devices %}
            <h2>Id: {{ device.device_id }}</h2>
            <ul>
                <li>Model: {{ device.model }}</li>
                <li>Manufacturer: {{ device.manufacturer }}</li>
                <li>Port Type: {{ device.port.type }}</li>
                <li>Device Commands:</li>
                    <ul>
                        {% for device_command in device.commands %}
                        <li>{{ device_command }}</li>
                        {% endfor %}
                    </ul>
                <li>Protocol Id: {{ device.port.protocol.protocol_id }}</li>
                    <ul>
                        {% for protocol_command in device.port.protocol.commands %}
                        <li>{{ protocol_command }}: {{device.port.protocol.commands[protocol_command]}}</li>
                        {% endfor %}
                    </ul>
            </ul>
            <p></p>
        {% endfor %}
    {% else %}
    <p>No devices found</p>
    {% endif %}
</body>
</html>