{% extends "webgallery/base/base.html" %}

{% block title %}
OMERO.web Gallery
{% endblock %}

{% block jumbotron %}
<div class="jumbotron">
    <div class="container">
        <h1>Welcome to OMERO Gallery</h1>
        <p>You can browse images below</p>
    </div>
</div>
{% endblock %}

{% block body %}

<div class="row">
    {% for g in groups %}
    <div class="col-md-4">
        <h2>{{ g.name }}</h2>
        <p class="pull-left">
            {% if g.image %}
            <a href="{% url 'webgallery_show_group' g.id %}">
                <img class="img-thumbnail" title="{{ g.image.name }}" style="width:96px; height:96px" 
                src="{% url 'webgateway_render_thumbnail' g.image.id 96 %}"/>
            </a>
            {% endif %}
        </p>
        <div class="pull-left">
            <ul>
                <li>Projects: {{ g.projectCount }}</li>
                <li>Datasets: {{ g.datasetCount }}</li>
                <li>Images: {{ g.imageCount }}</li>
            </ul>
            <div class="clearfix"></div>
            <p style="margin-left:20px">
                <a class="btn btn-default" href="{% url 'webgallery_show_group' g.id %}" role="button">View details &raquo;</a>
            </p>
        </div>
        <div class="clearfix"></div>
    </div>
    {% endfor %}
</div>


{% endblock %}