{% include "header.html" %}

<div class="container">

    <br/>
    <div class="text-center"><h2>Simple TensorFlow Serving</h2></div>
    <br/>


    <br/>
    <h4>Server Status</h4>

    <div class="row">
        <div class="col-md-4">
            <p><font color="#32cd32">Running</font></p>
        </div>

        <div class="col-md-8">
            <div class="progress">
                <div class="progress-bar progress-bar-striped progress-bar-animated"
                     role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                     style="width: 100%"></div>
            </div>
        </div>
    </div>


    <br/>
    <h4>Server Models</h4>

    <div class="row">
        <table class="table table-hover">

            <thead>
            <tr class="table-active">
                <th class="text-center">Name</th>
                <th class="text-center">Version</th>
                <th class="text-center">Platform</th>
                <th class="text-center">Status</th>
            </tr>
            </thead>

            <tbody>


            {% for model_name, inference_service in model_name_service_map.iteritems() %}
                {% for model_version in inference_service.model_version_list %}
                    <tr>
                        <td class="text-center">{{ model_name }}</td>
                        <td class="text-center">{{ model_version }}</td>
                        <td class="text-center">{{ inference_service.platform }}</td>
                        <td class="text-center">Online</td>
                    </tr>
                {% endfor %}
            {% endfor %}


            <!--
            {% for model_version in model_versions %}
            <tr>
                <td class="text-center">TODO: model name</td>
                <td class="text-center">{{ model_version }}</td>
                <td class="text-center">Online</td>
            </tr>
            {% endfor %}
            -->

            </tbody>

        </table>
    </div>


    <br/>
    <h4>Graph Signature</h4>

    <ul class="nav nav-pills mb-3">
        {% for model_name, inference_service in model_name_service_map.iteritems() %}

            <!-- Make the first item active -->
            {% if loop.index0 == 0 %}
                <li class="nav-item"><a class="nav-link active" href="#{{ model_name }}" data-toggle="tab">{{ model_name }}</a></li>
            {% else %}
                <li class="nav-item"><a class="nav-link" href="#{{ model_name }}" data-toggle="tab">{{ model_name }}</a></li>
            {% endif %}


        {% endfor %}

    </ul>

    <div class="tab-content ">
        {% for model_name, inference_service in model_name_service_map.iteritems() %}

            <!-- Make the first item active -->
            {% if loop.index0 == 0 %}
                <div class="tab-pane active" id="{{ model_name }}">
                    <textarea class="form-control" rows="15">{{ inference_service.model_graph_signature }}</textarea>
                </div>
            {% else %}
                <div class="tab-pane fade" id="{{ model_name }}">
                    <textarea class="form-control" rows="15">{{ inference_service.model_graph_signature }}</textarea>
                </div>
            {% endif %}


        {% endfor %}
    </div>

    <!--
    <div class="row">
        <textarea class="form-control" rows="15">{{ model_graph_signature }}</textarea>
    </div>
    -->


{% include "footer.html" %}