{% extends "base.html" %}
{% block content %}
<div class="breadcrumb"><a href="/samples">&lt; all samples</a></div>
<div class="card">
    <div class="actions">
        <a class="button primary" href="/samples/{{ sample.id }}/edit">Edit</a>
    </div>
    <dl>
        <dt>Name</dt><dd>{{ sample.name }}</dd>
        <dt>ID</dt><dd>{{ sample.id }}</dd>
        <dt>Description</dt><dd>{{ sample.description or "unset" }}</dd>
        <dt>Metadata</dt>
        <dd>
            {% if metadata %}
            <ul>
                {% for key, value in metadata.items() %}
                <li><strong>{{ key }}:</strong> {{ value }}</li>
                {% endfor %}
            </ul>
            {% else %}
            <span class="muted">No metadata.</span>
            {% endif %}
        </dd>
    </dl>
</div>

<h2>Representations</h2>
<div class="actions">
    <a class="button primary" href="/samples/{{ sample.id }}/representations/new">+ New representation</a>
</div>
{% if representations %}
<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Path</th>
            <th>Depends on</th>
        </tr>
    </thead>
    <tbody>
        {% for representation in representations %}
        <tr class="clickable-row"
            onclick="window.location='/samples/{{ sample.id }}/representations/{{ representation.id }}'">
            <td>{{ representation.name }}</td>
            <td>{{ representation.path }}</td>
            <td>{{ representation.depends_on_names }}</td>
        </tr>
        {% endfor %}
    </tbody>
</table>
{% else %}
<p class="muted">No representations yet.</p>
{% endif %}
{% endblock %}