{% extends "apps/base.html" %}
{% load staticfiles %}

{% block extra_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static "css/abyss.widget.css" %}">
<link rel="stylesheet" href="{% static "css/detail.css" %}">
<link rel="stylesheet" href="{% static "css/metrics/components/metrics.css" %}">
{% endblock %}

{% block app-content %}
<div class="row">
	<div class="col-md-12">
		<div id="resources"></div>
	</div>
</div>
{% if app.service_instances %}
<div class="row">
	<div class="col-md-12">
		<h3>Services</h3>
		<div class="content">
			<table class="table containers-app">
				<thead>
					<tr>
						<th>service</th>
						<th>name</th>
					</tr>
				</thead>
				<tbody>
					{% for instance in app.service_instances %}
					<tr>
						<td>{{ instance.servicename }}</td>
						<td><a href="{% url 'service-detail' instance.servicename instance.name %}"> {{ instance.name }} </a></td>
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</div>
</div>
{% endif %}
</div>
{% endblock %}

{% block extra_js %}
<script src="{% static "js/vendor/jquery.flot.min.js" %}"></script>
<script src="{% static "js/vendor/jquery.flot.time.min.js" %}"></script>
<script src="{% static "js/vendor/jquery.flot.tooltip.min.js" %}"></script>
<script src="{% static "js/pages/resources.js" %}"></script>
{% endblock %}
