<table class="{{ tclass }}-studios">
    <thead>
    <tr>
        <th>{{ l.fleet_studio_panel_th_name }}</th>
        <th class="tac">{{ l.fleet_studio_panel_th_host }}</th>
        <th class="tac">{{ l.fleet_studio_panel_th_port }}</th>
        <th class="tac">{{ l.fleet_studio_panel_th_enabled }}</th>
        <th class="tac">{{ l.fleet_studio_panel_th_activity }}</th>
    </tr>
    </thead>
    <tbody>
    <tr class="empty-tr {% if studios|length != 0 %}hidden{% endif %}">
        <td colspan="4">
            {{ l.fleet_studio_panel_empty|replace(
                '%link%',
                ('<a href="javascript:void(0);" class="item-add studio-add">'~l.fleet_studio_button_add~'</a>')|safe
            ) }}
        </td>
    </tr>
    {% for studio in studios %}
        <tr class="studio-item" data-level="{{ studio.id }}" data-entity="{{ studio.to_json() }}">
            <td class="infos">
                <div class="inner">
                    <a href="javascript:void(0);" class="item-sort studio-sort">
                        <i class="fa fa-sort icon-left"></i>
                    </a>

                    <div class="badge"><i class="fa fa-key icon-left"></i> {{ studio.id }}</div>

                    <i class="fa fa-server icon-left"></i>
                    {{ studio.name }}
                </div>
            </td>
            <td class="tac">
                {{ studio.host }}
            </td>
            <td class="tac">
                {{ studio.port }}
            </td>
            <td class="tac">
                <label class="pure-material-switch">
                    <input type="checkbox" {% if studio.enabled %}checked="checked"{% endif %}><span></span>
                </label>
            </td>
            <td class="actions tac">
                <a href="javascript:void(0);" class="item-edit studio-edit">
                    <i class="fa fa-pencil"></i>
                </a>
                <a href="http://{{ studio.host }}:{{ studio.port }}" class="item-download studio-download" target="_blank">
                    <i class="fa fa-eye"></i>
                </a>
                <a href="javascript:void(0);" class="item-delete studio-delete">
                    <i class="fa fa-trash"></i>
                </a>
            </td>
        </tr>
    {% endfor %}
    </tbody>
</table>