{% block galeria %}
<div id="links-{{galeria.id}}">
	{% for imagen in galeria.imagenes %} 
		{% if( (loop.index - 1)  % galeria.columnas == 0) %}
        {% set abrir = 1 %}
		<div class="item row {% if loop.first %}active{% endif %}">
		{% endif %}
		<div class="col-md-{{ galeria.num_cols }}">
			<div class="thumbnail">
				<div class="caption">
					<h4>{{ imagen.title }}</h4>
                    <p>{{ imagen.description|raw }}</p>
					<p><a href="{{ imagen['slider'] }}" class="label label-danger" rel="tooltip" title="Ampliar Imagen">Ampliar</a></p>
				</div>
				<img src="{{ imagen['listado'] }}" alt="{{ imagen.titulo }}">
			</div>
		</div>
		{% if((loop.index - 1) % galeria.columnas == galeria.limite) %}
			{% set abrir = 0 %}
             </div>
        {% endif %}
		{% if loop.last == true %}
			{% if abrir == 1 %}
			</div>
			{% endif %}
		{% endif %}	
	{% endfor %}
</div>
<div id="blueimp-gallery-{{galeria.id}}" class="blueimp-gallery blueimp-gallery-controls">
    <div class="slides"></div>
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>
</div>

<script src="../common/js/modulos/galerias.js"></script>
<script>
$(document).ready(function(e) {
	settings = {
		div_links:'links-{{galeria.id}}',
		blueimp_container: '#blueimp-gallery-{{galeria.id}}'	
	}
    Galerias.InitPortfolio(settings);
});
</script>

{% endblock %}